{"id":45710,"date":"2015-04-06T00:34:02","date_gmt":"2015-04-06T04:34:02","guid":{"rendered":"http:\/\/www.templatemonster.com\/help\/?p=45710"},"modified":"2016-02-17T08:35:46","modified_gmt":"2016-02-17T13:35:46","slug":"opencart-2-x-how-to-change-phone-number-and-icon-in-header","status":"publish","type":"post","link":"https:\/\/www.templatemonster.com\/help\/opencart-2-x-how-to-change-phone-number-and-icon-in-header.html","title":{"rendered":"OpenCart 2.x. How to change phone number and icon in header"},"content":{"rendered":"


\r\nOpenCart 2.x. How to change phone number and icon in header<\/a><\/p>\r\n

This tutorial will show you how to edit phone icon and phone number in header of Opencart template:<\/p>\r\n

\"OpenCart.<\/a><\/p>\r\n

    \r\n
  1. \r\n

    Let’s change phone number first. Go to System -> Settings -> Edit -> ‘General’<\/strong> tab and edit Telephone<\/strong> field:<\/p>\r\n

    \"OpenCart.<\/a>\r\n<\/li>\r\n

  2. \r\n

    Now let’s change the phone icon. Inspect the icon using the Firebug developer tool and check its class, you’ll need to change it in template files. In our case the icon class is ‘fa fa-phone’. You can find information on how to use Firebug plugin here: Firebug. Mozilla Firefox plugin<\/a>:<\/p>\r\n

    \"OpenCart.<\/a>\r\n<\/li>\r\n

  3. \r\n

    Now go to the installation root of your site and opencatalog\/view\/theme\/themeXXX\/template\/common\/header.tpl<\/strong> file:<\/p>\r\n

    \"OpenCart.<\/a>\r\n<\/li>\r\n

  4. \r\n

    Copy the class name and look for this code using CTRL+F<\/strong> combination:<\/p>\r\n

    \"OpenCart.<\/a>\r\n<\/li>\r\n

  5. \r\n

    Open the Font-Awesome-icons<\/a> page, there you will see a list of icons. Click on any of them and to see its class name:<\/p>\r\n

    \"OpenCart.<\/a>\r\n<\/li>\r\n

  6. \r\n

    Just copy the class name and replace the original class name with it.<\/p>\r\n<\/li>\r\n<\/ol>\r\n

    This is the end of the tutorial. Now you know how to change phone number and icon in header.<\/p>\r\n

    Feel free to check the detailed video tutorial below:<\/p>\r\n

    OpenCart 2.x. How to change phone number and icon in header<\/a>
    \r\n<\/p>","protected":false},"excerpt":{"rendered":"

    This tutorial will show you how to edit phone icon and phone number in header of Opencart template.<\/p>\n","protected":false},"author":61,"featured_media":45808,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[1156],"tags":[627,674,668,1157,1207],"_links":{"self":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/45710"}],"collection":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/users\/61"}],"replies":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/comments?post=45710"}],"version-history":[{"count":0,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/45710\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/media\/45808"}],"wp:attachment":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/media?parent=45710"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/categories?post=45710"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/tags?post=45710"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}