Displaying Free Shipping Label on Product Details Page
We no longer maintain the Knowledge Base since version 4.3.x. All the latest user and developer documentation for 4.3.x and newer versions is now available at docs.cs-cart.com.
To display an appropriate label on a product details page when it has the Free shipping option enabled:
- Put the file containing your free shipping label into the skins/[CUSTOMER_ACTIVE_SKIN]/customer/images directory of your CS-Cart installation, where [CUSTOMER_ACTIVE_SKIN] is an active skin of your storefront.
- In the root directory of your CS-Cart installation, create the following directories path:
skins/[CUSTOMER_ACTIVE_SKIN]/customer/addons/my_changes/hooks/products, where [CUSTOMER_ACTIVE_SKIN] is an active skin of your storefront. - Download the view_main_info.override.tpl file and upload it to the created CS-Cart directory on your server.
NOTE: In this file you need to replace this YOUR_IMAGE_FILE_NAME phrase with the name of your image file including its extension.
If the applied changes are not displayed, try clearing the template cache. To do it, open in your web browser http://www.your_domain.com/admin.php?cc, where www.your_domain.com is the address of your store and admin.php is a script file for the administration panel of your store which was renamed for security reasons.
To display an appropriate label on a product details page when it has the Free shipping option enabled:
- Put the file containing your free shipping label into the skins/[CUSTOMER_ACTIVE_SKIN]/customer/images directory of your CS-Cart installation, where [CUSTOMER_ACTIVE_SKIN] is an active skin of your storefront.
- In the root directory of your CS-Cart installation, create the following directories path:
skins/[CUSTOMER_ACTIVE_SKIN]/customer/addons/my_changes/hooks/products, where [CUSTOMER_ACTIVE_SKIN] is an active skin of your storefront. - Download the view_main_info.override.tpl file and upload it to the created CS-Cart directory on your server.
NOTE: In this file you need to replace this YOUR_IMAGE_FILE_NAME phrase with the name of your image file including its extension.
If the applied changes are not displayed, try clearing the template cache. To do it, open in your web browser http://www.your_domain.com/admin.php?cc, where www.your_domain.com is the address of your store and admin.php is a script file for the administration panel of your store which was renamed for security reasons.
To display an appropriate label on a product details page when it has the Free shipping option enabled:
- In the root directory of your CS-Cart installation, create the following directories path:
skins/[CUSTOMER_ACTIVE_SKIN]/customer/addons/my_changes/hooks/products, where [CUSTOMER_ACTIVE_SKIN] is an active skin of your storefront. - In the created CS-Cart directory, create the view_main_info.post.tpl with the following content:
- If you want to display a text label, use this code:
{if $product.free_shipping == 'Y'} <script type="text/javascript"> $('<div class="free-shipping-label">Free shipping</div>').insertAfter('.price-wrap'); </script> {/if} - If you want to display an image, use this one instead:
In this case, the image file name should be free_shipping_label.png. Upload the image to the skins/[CUSTOMER_ACTIVE_SKIN]/customer/images directory of your CS-Cart installation, where [CUSTOMER_ACTIVE_SKIN] is an active skin of your storefront.{if $product.free_shipping == 'Y'} <script type="text/javascript"> $('<div class="free-shipping-label"><img src="{$config.skin_path}/images/free_shipping_label.png"/></div>').insertAfter('.price-wrap'); </script> {/if}
If the applied changes are not displayed, try clearing the template cache. To do it, open in your web browser http://www.your_domain.com/admin.php?cc, where www.your_domain.com is the address of your store and admin.php is a script file for the administration panel of your store which was renamed for security reasons.
- If you want to display a text label, use this code:
To display an appropriate image on a product details page when it has the Free shipping option enabled:
- Put your free shipping image file into the skins/[CUSTOMER_ACTIVE_SKIN]/customer/images directory of your CS-Cart installation, where [CUSTOMER_ACTIVE_SKIN] is an active skin of your storefront.
- Open the product_details.tpl file located in the skins/[CUSTOMER_ACTIVE_SKIN]/customer/products_pages directory of your CS-Cart installation.
- Add the following part of code:
{if $product.free_shipping == 'Y'} <img class="valign" src="{$images_dir}/YOUR_IMAGE_FILE_NAME" width="90px" border="0" alt="" style="padding-right: 3px;"/> {/if}
above this part of code:
{if $wholesale_prices} {include file="addons/wholesale_trade/customer_product_details.tpl"} {/if}
where YOUR_IMAGE_FILE_NAME is the name of your image file including its extension. - Save the file.
To display an appropriate label on a product details page when it has the Free shipping option enabled:
- In the root directory of your CS-Cart installation, create the following directories path:
design/themes/[CUSTOMER_ACTIVE_THEME]/templates/addons/my_changes/hooks/products, where [CUSTOMER_ACTIVE_THEME] is an active theme of your storefront. - In the created CS-Cart directory, create the view_main_info.post.tpl with the following content:
- If you want to display a text label, use this code:
{if $product.free_shipping == 'Y'} <script type="text/javascript"> $('<div class="free-shipping-label">Free shipping</div>').insertAfter('.price-wrap'); </script> {/if} - If you want to display an image, use this one instead:
In this case, the image file name should be free_shipping_label.png. Upload the image to the design/themes/[CUSTOMER_ACTIVE_THEME]/media/images/addons/my_changes directory of your CS-Cart installation, where [CUSTOMER_ACTIVE_THEME] is an active theme of your storefront.{if $product.free_shipping == 'Y'} <script type="text/javascript"> $('<div class="free-shipping-label"><img src="{$images_dir}/addons/my_changes/free_shipping_label.png"/></div>').insertAfter('.price-wrap'); </script> {/if}
If the applied changes are not displayed, try clearing the template cache. To do it, in the administration panel of your store go to Administration > Storage > Clear cache.
- If you want to display a text label, use this code:
To display an appropriate label on a product details page when it has the Free shipping option enabled:
- In the root directory of your CS-Cart installation, create the following directories path:
design/themes/[CUSTOMER_ACTIVE_THEME]/templates/addons/my_changes/hooks/products, where [CUSTOMER_ACTIVE_THEME] is an active theme of your storefront. - In the created CS-Cart directory, create the view_main_info.post.tpl with the following content:
- If you want to display a text label, use this code:
{if $product.free_shipping == 'Y'} <script type="text/javascript"> $('<div class="free-shipping-label">Free shipping</div>').insertAfter('.price-wrap'); </script> {/if} - If you want to display an image, use this one instead:
In this case, the image file name should be free_shipping_label.png. Upload the image to the design/themes/[CUSTOMER_ACTIVE_THEME]/media/images/addons/my_changes directory of your CS-Cart installation, where [CUSTOMER_ACTIVE_THEME] is an active theme of your storefront.{if $product.free_shipping == 'Y'} <script type="text/javascript"> $('<div class="free-shipping-label"><img src="{$images_dir}/addons/my_changes/free_shipping_label.png"/></div>').insertAfter('.price-wrap'); </script> {/if}
If the applied changes are not displayed, try clearing the template cache. To do it, in the administration panel of your store go to Administration > Storage > Clear cache.
- If you want to display a text label, use this code:
To display an appropriate label on a product details page when it has the Free shipping option enabled:
- In the root directory of your CS-Cart installation, create the following directories path:
design/themes/[CUSTOMER_ACTIVE_THEME]/templates/addons/my_changes/hooks/products, where [CUSTOMER_ACTIVE_THEME] is an active theme of your storefront. - In the created CS-Cart directory, create the view_main_info.post.tpl with the following content:
- If you want to display a text label, use this code:
{if $product.free_shipping == 'Y'} <script type="text/javascript"> $('<div class="free-shipping-label">Free shipping</div>').insertAfter('.price-wrap'); </script> {/if} - If you want to display an image, use this one instead:
In this case, the image file name should be free_shipping_label.png. Upload the image to the design/themes/[CUSTOMER_ACTIVE_THEME]/media/images/addons/my_changes directory of your CS-Cart installation, where [CUSTOMER_ACTIVE_THEME] is an active theme of your storefront.{if $product.free_shipping == 'Y'} <script type="text/javascript"> $('<div class="free-shipping-label"><img src="{$images_dir}/addons/my_changes/free_shipping_label.png"/></div>').insertAfter('.price-wrap'); </script> {/if}
If the applied changes are not displayed, try clearing the template cache. To do it, in the administration panel of your store go to Administration > Storage > Clear cache.
- If you want to display a text label, use this code:
To display an appropriate label on a product details page when it has the Free shipping option enabled:
- In the root directory of your CS-Cart installation, create the following directories path:
design/themes/[CUSTOMER_ACTIVE_THEME]/templates/addons/my_changes/hooks/products, where [CUSTOMER_ACTIVE_THEME] is an active theme of your storefront. - In the created CS-Cart directory, create the view_main_info.post.tpl with the following content:
- If you want to display a text label, use this code:
{if $product.free_shipping == 'Y'} <script type="text/javascript"> $('<div class="free-shipping-label">Free shipping</div>').insertAfter('.price-wrap'); </script> {/if} - If you want to display an image, use this one instead:
In this case, the image file name should be free_shipping_label.png. Upload the image to the design/themes/[CUSTOMER_ACTIVE_THEME]/media/images/addons/my_changes directory of your CS-Cart installation, where [CUSTOMER_ACTIVE_THEME] is an active theme of your storefront.{if $product.free_shipping == 'Y'} <script type="text/javascript"> $('<div class="free-shipping-label"><img src="{$images_dir}/addons/my_changes/free_shipping_label.png"/></div>').insertAfter('.price-wrap'); </script> {/if}
If the applied changes are not displayed, try clearing the template cache. To do it, in the administration panel of your store go to Administration > Storage > Clear cache.
- If you want to display a text label, use this code: