How to use curvycorners in Magento themes
Rounded edges or curvy corners are always a trendy style in web designing. Early stages we used images to make the edges rounded, later it replace with css or javascript alternatives. Among all the easiest method is curvycorners.js. Just include this javascript file and some 4-5 lines of code, your job is done. You can find examples and usage guide in curvycorners.net.
I am not going to explain much about curvy corners here, you just go to the above mentioned website and explore yourself more on that. Here i am going to explain how to use this with a magento theme. If you are new to use a custom javascript with magento theme this post will benefit for you too.
For adding curvycorners.js, download the file ,extract it and copy curvycorners.js(curvycorners.src.js) to
<magento install dir>/js/lib
After this go to your theme directory and edit the page.xml file. You can find your page.xml in
<magento install dir>/app/design/frontend/defaul/<yourtheme>/layout/page.xml
Here we add the code for calling the javascript. You can see a lot of js calls already on the page.xml, dont bother if there is none (You might be from scratch,lol). Add these line to your page.xml file
<action method=”addJs”><script>lib/curvycorners.js</script></action>
So the new javascript will be called on next execution. There is few more steps to curve your html boxes in Magento. Hope you found how to use curvycoreners from its site (Refer it how to use section). There are some lines of code to add to the header section of the code. Here i suggest you to add that code to a new .js file and include it like curvycorners.js.
The file content will be like this. So now you are done. This post is not of course to teach curvycorners, so if you have any doubt with curvycorenrs please visit curvycoreners.net and explore more.
