How to Add Cufon to Prestashop E-commerce

For a long time, the sites were filled with standard fonts and they became very boring. Then most recently from Simo Kinnunen came cufón, which we will explain how to add cufon to your Prestashop ecommerce shop sites. It’s easy, lightweight and fast. We also used cufon in our site and in some of our designs. Let’s start how to use cufon script in prestashop.

You need to download the javascript file which will render your custom font inside your HTML. Go to the http://cufon.shoqolate.com/generate/ and click to “Download” then save file as “cufon-yui.js” in your computer or just right click over “Download” tab and click to “Save Link As…”.

Now it is time to generate our font. To generate cufon font click on the “Regular typeface” filed and browse your desired font type . You may also browse bold typeface, italic and bold italic typeface font files. Then check off the EULAs and the Terms of Agreement. After doing that, you have to check off  required glyps. Check off glyps which are important to you otherwise file size will be high and this time your site download speed will decrease. We will generate “Rockwell true type” font.

Firstly, upload both of  ”cufon-yui.js” and “Rockwell_400.font.js” under “[root]/themes/prestashop/js/”.  Secondly, you have to edit header.tpl to add some javascript code to activate cufon. Also make sure that cufon-yui.js is called before the font.js file.

To begin the replacement process – create a custom script like below:

You may target to specific CSS classes and Ids.

That is all about cufon. By using cufon your shop will be attractive. You may get more information and find out more about the specific of Cufon styling  from here.

View the original article here