If this tutorial is not what you were looking for, you still have any questions, suggestions or concerns - feel free to let us know. Please help us to serve you better!

Your Name

Your Email

Your Message (required)


Featured templates

Magento. How to change Flaticons

This tutorial shows how to change Flaticons in Magento themes.

First of all, we need to find the file which calls out the icon and then change the icon.

  1. Right click the icon you would like to change and use the Inspect Element browser tool to find icon class or Unicode.

    Magento. How to change FlatIcons-1

    As you can see, an icon code is called out from the header.css file in our case.

  2. Connect to server via FTP or open cPanel File manager in order to open and edit this file.

  3. Use the skin/frontend/tm_themes/themeXXX/css/fl-outicons.css file to find all the icons codes. Please, note, XXX stands for your theme number. Copy the new icon’s Unicode.

    Magento. How to change FlatIcons-2

  4. You can preview icons and select news ones at the FlatIcons official website http://www.flaticon.com/packs/outicons.

  5. Next, open the skin/frontend/tm_themes/themeXXX/css/layout/header.css file in order to replace icon with the new one.

  6. Save changes. Refresh site frontend with Cmd/Ctrl+F5 hotkeys to preview changes on the site.

Feel free to check the detailed video tutorial below:

Magento. How to change Flaticons