Symfony World blog is not maintained anymore. Check new sys.exit() programming blog.

symfony sfAdminDashPlugin icons

sfAdminDashPlugin is one of the most useful symfony plugins (it's the 8th most popular plugin at the moment). I want to show few ways how to easily extend your backend application with custom icons: where to get them from and how to make your project use them. It seems not very complicated - and it's not :)! But the way your website looks like is still very important.



sfAdminDashPlugin built-in login screen

sfAdminDashPlugin is provided with some standard icons, but probably you'll need more of them. Especially that it's really easy to add new ones - just follow these steps:

  • find icon(s) that have the folowing sizes: 16x16 and 48x48, should be in .png format and be transparent in the background
  • copy those files to the plugin directories: PROJECT/plugins/sfAdminDashPlugin/web/images/icons - for the 48x48 file and PROJECT/plugins/sfAdminDashPlugin/web/images/icons/small for the 16x16 file
  • use new icon(s) in your config/app.yml configuration file:
    items:
      Articles:
        url:          article
        image:        CustomIcon.png
    



set of icons provided with sfAdminDashPlugin

desktop environment

The easiest place to look for your icons is your desktop environment resources directory. For example, I use KDE which stores its icons in

/usr/share/icons/
/usr/share/icons/default.kde4/16x16
/usr/share/icons/default.kde4/48x48


external resources

KDE has lots of icons added by users, which you can find here. I have downloaded several packages and whenever I need a specific icon, I look through them. Good thing about icon themes is that large amount of icons are created in the same style, which would make your backend look even better!



nuvola KDE icon theme

Of course, you may also find nice icons at special websites, such as

and many more (these two I use the most - to see the rest, ask google)...



icon usage example


drop-down menu example


icon usage example


drop-down menu example


icon usage example