php - How to customise the icon of an areablock in Pimcore

142

The company I work for uses Pimcore 6 to make websites. In the adminpanel while editing a page you can addareablocks to your content. When you click on the plus sign, you can add a newareablock, I have noticed that theareablocks have a random icon next to their name. I thought that this was because the person who created them was too lazy to create or add the right ones.

After looking at the official DEMO on the Pimcore website. I noticed that theirareablocks also have random icons.

I was wondering if it is possible to customise these?

After doing some research it seems that this is possible by adding aicon.png into your areablock's folder.

That's what I have tried. But the random icon is still displaying. My custom icon is getting ignored. Anyone any idea what I'm doing wrong?

579

Answer

Solution:

Pasting the icon into the view is not helpful (or was some wrong information). When you are registering a brick and check the methods ofAbstractTemplateAreabrick you will notice that it has some classgetIcon(). And this is the method you have to override in case you want to set custom icons.

TheAreabrickInterface defines the method like this:

/**
 * Icon as absolute path, e.g. /bundles/websitedemo/img/areas/foo/icon.png
 *
 * @return string|null
 */
public function getIcon();

An absolute image URL is needed. In my case I just do it with base64 .svgs - here is a working example:

class Accordion extends AbstractAreabrick
{
    /**
     * {@inheritdoc}
     */
    public function getName()
    {
        return $this->translator->trans('Accordion');
    }

    /**
     * {@inheritdoc}
     */
    public function getDescription()
    {
        return $this->translator->trans('for collapsed contents');
    }

    public function getIcon() {
        return "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMyIDMyIiBoZWlnaHQ9IjMycHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzMiAzMiIgd2lkdGg9IjMycHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxnIGlkPSJQaWN0dXJlIj48cGF0aCBkPSJNMjguNzEzLDIuNDIySDMuMjg3Yy0wLjU3LDAtMS4wMzcsMC40NjgtMS4wMzcsMS4wMzh2MjUuMDc5YzAsMC41NywwLjQ2NywxLjAzOCwxLjAzNywxLjAzOGgyNS40MjYgICBjMC41NywwLDEuMDM3LTAuNDY4LDEuMDM3LTEuMDM4VjMuNDZDMjkuNzUsMi44OSwyOS4yODMsMi40MjIsMjguNzEzLDIuNDIyeiBNMjYuODIyLDIyLjk3MUg0Ljg3NVY1LjIyMWgyMS45NDdWMjIuOTcxeiIgZmlsbD0iIzUxNTE1MSIvPjxjaXJjbGUgY3g9IjkuMTA0IiBjeT0iOS43NSIgZmlsbD0iIzUxNTE1MSIgcj0iMy4wNDgiLz48cGF0aCBkPSJNMjAuMDAyLDExLjMwMWMtMC41MzYtMC45Ni0xLjQ1My0wLjk4My0yLjAzNy0wLjA1bC0yLjg3MSw0LjU4N2MtMC41ODQsMC45MzMtMS43NDcsMS4yMjktMi41ODUsMC42NTggICBjLTAuODM5LTAuNTcxLTIuMTA2LTAuMzUyLTIuODE4LDAuNDg2bC0yLjg2LDMuMzcxYy0wLjcxMiwwLjg0LTAuMzk0LDEuNTI1LDAuNzA2LDEuNTI1aDE2LjM3OGMxLjEsMCwxLjU2MS0wLjc4NSwxLjAyNC0xLjc0NiAgIEwyMC4wMDIsMTEuMzAxeiIgZmlsbD0iIzUxNTE1MSIvPjwvZz48L3N2Zz4=";
    }
}

People are also looking for solutions to the problem: ffmpeg - How to install and run phpize

Source

Didn't find the answer?

Our community is visited by hundreds of web development professionals every day. Ask your question and get a quick answer for free.

Ask a Question