Tuesday, December 24, 2013

How to manage social icons module in ZenCart

In this tutorial you will learn the way to manage social icons display on products page: images, links, display.


When you open product page you are able to see similar icons – we will edit it.


zen-cart_how_to_manage_social_icons-1


You can locate social icons module in your zen-cart admin. Open your admin panel, and go to Configuration >> Social Media Icons


zen-cart_how_to_manage_social_icons-2


You will get the following control panel:


zen-cart_how_to_manage_social_icons-3


It allows you to turn “on”/”off” every separate icon or all buttons at once.


In case you need to edit link or image, you need to use FTP


    1. Open your FTP manager, then locate and open folder “includes/functions/extra_functions”

    2. You will be able to see several files – the one you need is “social_media.php”

    3. You will see lots of scripting but it is really easy to edit as it is separated into logical blocks, each block is a separate icon, e.g. (facebook icon):

      if (FACEBOOK_STATUS == 1) $fb_image = zen_image(DIR_WS_IMAGES . 'facebook.png', '', '24', '24', 'class="socialImage"');

      $media_icons .= '<a href="http://www.facebook.com/sharer.php?u='.urlencode(zen_href_link(zen_get_info_page($products_id),'cPath='.(int)$_GET['cPath'].'&products_id=' . $products_id)).'&t='.$products_name.'" rel="external nofollow" target="_blank" title="Share this on Facebook"/>'.$fb_image.'</a>'.'&nbsp';


       




    4. Editing image is really easy – you just need to understand the top part of icon block:


      ?




      1

      $fb_image = zen_image(DIR_WS_IMAGES . 'facebook.png', '', '24', '24', 'class="socialImage"');

       



      The actual image link is: DIR_WS_IMAGES . ‘facebook.png’


      The first part means your zen-cart image folder located at your store root


      And the next part is your icon file title – full path will be images/facebook.png


    5. Editing link is same easy as image – just locate proper script to replace with new link. The actual links starts right after: href=” and ends before ” relThe default link looks really huge as it works automatically but you may need to change it to static one. Just replace it with a static link and see the way it works.

    6. Now the last part to edit is rollover text

      zen-cart_how_to_manage_social_icons-4


      Just edit same file (“/includes/functions/extra_functions/social_media.php”)


      You can locate each rollover text at the end of proper blocks, e.g. (facebook block):



       if (FACEBOOK_STATUS == 1) {

      $fb_image = zen_image(DIR_WS_IMAGES . 'facebook.png', '', '24', '24', 'class="socialImage"');

      $media_icons .= '<a href="http://www.facebook.com/sharer.php?u='.urlencode(zen_href_link(zen_get_info_page($products_id),'cPath='.(int)$_GET['cPath'].'&products_id=' . $products_id)).'&t='.$products_name.'" rel="external nofollow" target="_blank" title="Share this on Facebook"/>'.$fb_image.'</a>'.'&nbsp';

       



      At the end you are able to locate appropriate text and replace it easily – “Share this on Facebook”


Thank you for paying attention to our video tutorials. Please contact us if you have any issues in editing the template. Good Luck!!!



How to manage social icons module in ZenCart

No comments:

Post a Comment