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)

captcha

Featured templates

PrestaShop 1.6.x. How to change default social networks icons

This tutorial will guide you on how to change default social networks’ icons in your PrestaShop store.

PrestaShop_1.6.x._How_to_change_deafult_social_networks_icons_1

  1. Right click the mouse and use ‘Inspect element’ tool to locate the CSS class of the existing icon to edit and copy the CSS class of the button.

    PrestaShop_1.6.x._How_to_change_deafult_social_networks_icons_2

  2. Open the .css file with the inspected rule on the server or computer using a code editor and look for the class code in it. We have to open themes/theme1210/css/global.css in this case.

    PrestaShop_1.6.x._How_to_change_deafult_social_networks_icons_3

  3. The icon is set with content: “\f09a”; code. You can use this Font Awesome icons reference in order to pick another icon and find its respective code value. Also, you can use search engines in order to find it.

  4. We will replace the current icon with the flickr one. After clicking the icon, we need to copy its Unicode.

    PrestaShop_1.6.x._How_to_change_deafult_social_networks_icons_4

  5. Paste the Unicode, copied from the FontAwesome site into your css rule content part in themes/theme1210/css/global.css so it looks like this:

    .footer-container #footer #social_block ul li.facebook a:before {
    content: "\f16e"; }
  6. Save the changes and refresh the site.

    PrestaShop_1.6.x._How_to_change_deafult_social_networks_icons_5

Feel free to check the detailed video tutorial below:

PrestaShop 1.6.x. How to change default social networks icons