Tue. Apr 22nd, 2025

2. Magento. How to change Flaticons

1 min read


Untitled Document

 

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.

 

April 2025
M T W T F S S
« Jun    
 123456
78910111213
14151617181920
21222324252627
282930