{"id":47619,"date":"2015-04-22T07:12:32","date_gmt":"2015-04-22T11:12:32","guid":{"rendered":"http:\/\/www.templatemonster.com\/help\/?p=47619"},"modified":"2017-09-14T06:48:51","modified_gmt":"2017-09-14T10:48:51","slug":"wordpress-how-to-replace-images-icons-implemented-with-shortcodes","status":"publish","type":"post","link":"https:\/\/www.templatemonster.com\/help\/wordpress-how-to-replace-images-icons-implemented-with-shortcodes.html","title":{"rendered":"WordPress Cherry 3.x. How to replace images icons implemented with shortcodes"},"content":{"rendered":"

<\/a><\/p>\r\n

The tutorial will show how to add more icons implemented with shortcodes in WordPress<\/strong>:<\/p>\r\n

\"Wordpress.How<\/a><\/p>\r\n

\r\n\r\n\r\n<\/a>\r\n<\/div>\r\n
    \r\n
  1. \r\n

    Image icons are added into shortcode with IDs. Basically, icons count in shortcode is limited to 10 items. To add more icons, you can copy and paste shortcode into the page and replace the icon id like “icon10”<\/strong> with next index number “icon11”:<\/strong>:<\/p>\r\n

    [service_box title=\"title\" icon=\"icon11\" text=\"text\" btn_text=\"text\" btn_link=\"link\" target=\"_self\"]<\/pre>\r\n<\/li>\r\n
  2. \r\n
    The next step is to upload a new icon image on server. Icons are located in the wp-content\/themes\/themeXXXXX\/images<\/strong> folder on server. Connect to server via FTP<\/a> or open File manager in cPanel<\/a> and upload new images. Make sure that new icons have the same format, resolution and appropriate index number. For example, there are 10 icons in the template, the new icon should be called icon11<\/strong> accordingly: <\/p>\r\n
    \"Wordpress.How<\/a>\r\n\t<\/li>\r\n
  3. \r\n
    Now you need to add a new icon into shortcode. Shortcode is inserted into page\/post with the Cherry Shortcodes button<\/strong> which can be found at the top of page\/post editor in WordPress admin panel. To make new icons appear in the shortcode layout, you should add them into the shortcode script. In most cases the icons are added with services_box<\/strong> shortcode. Open the wp-content\/plugins\/cherry-plugin\/admin\/shortcodes\/shortcodes<\/strong> folder on server. Find and open the my_service_box.js<\/strong> file. Copy the code from the file.<\/p>\r\n<\/li>\r\n
  4. \r\n
    Paste the code into wp-content\/themes\/themeXXXXX\/js\/my_script.js<\/strong> file on server. Insert it at the bottom of the file.<\/p>\r\n<\/li>\r\n
  5. \r\n
    With that done, add icons numbers into the code:<\/p>\r\n
    selectValues:['no', 'icon1', 'icon2', 'icon3', 'icon4', 'icon5', 'icon6', 'icon7', 'icon8', 'icon9', 'icon10', 'icon11', 'icon12'],<\/pre>\r\n<\/li>\r\n
  6. \r\n
    Save changes in the file and check shortcode layout in WordPress admin panel:<\/p>\r\n
    \"Wordpress.How<\/a>\r\n\t<\/li>\r\n
  7. \r\n
    Refresh your homepage with Ctrl\/Cmd+F5<\/strong> to see the changes at the front-end:<\/p>\r\n
    \"Wordpress.How<\/a>\r\n\t<\/li>\r\n<\/ol>\r\n
    Feel free to check the detailed video tutorial below:<\/p>\r\n
    <\/a><\/p>","protected":false},"excerpt":{"rendered":"
    The tutorial will show how add more image icons implemented with shortcodes in WordPress.<\/p>\n","protected":false},"author":65,"featured_media":47629,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[728],"tags":[674,1415,2405],"_links":{"self":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/47619"}],"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\/65"}],"replies":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/comments?post=47619"}],"version-history":[{"count":1,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/47619\/revisions"}],"predecessor-version":[{"id":83156,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/47619\/revisions\/83156"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/media\/47629"}],"wp:attachment":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/media?parent=47619"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/categories?post=47619"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/tags?post=47619"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}