Try the Demo

Magento Forum

   
How could I add CSS and JS references to the Cart Page only? 
 
adrianalexan
Jr. Member
 
Total Posts:  3
Joined:  2012-11-11
 

There are countless articles about customizing the content and layout of the /checkout/cart page, however, I didn’t find one about how to add custom CSS or JS references to this page only, preferably in a “cleaner” manner, such as:

<reference name="head">
 <
action method="addCss"><stylesheet>mycustom.css</stylesheet></action>
</
reference>

Thank you for pointing out a useful reference on this particular matter!

 
Magento Community Magento Community
Magento Community
Magento Community
 
Lyonscg
Sr. Member
 
Avatar
Total Posts:  173
Joined:  2009-11-13
Chicago IL
 

The code you posted works for most pages, but because method “addCss” isn’t available to the checkout.xml file by default that won’t work for the cart. In fact it’ll actually generate an error.

I haven’t looked into this too much, but in theory you could extend a few core classes in a custom module to get Magento to first recognize that method in checkout.xml and then to add the css. I think I found my next weekend project =)

Out of curiosity, why do you want a specific CSS file for the cart? What would the benefit be over keeping the code in the same CSS file as the rest of the site?

 Signature 

Andrew J.
Sr. Applications Engineer
Lyons Consulting Group

Lyons Consulting Group is the premier digital agency specializing in strategy, ux/design, development, and ongoing support. With a proven track record to deliver creative, robust and most importantly, increasingly profitable ecommerce sites, our diverse group of experts are committed to customer satisfaction and project excellence.

 
Magento Community Magento Community
Magento Community
Magento Community
 
magestore
Enthusiast
 
Avatar
Total Posts:  961
Joined:  2009-08-07
Viet Nam
 

Hi adrianalexan,

If you only want to add a custom css for checkout cart page, you can go to file:
..\app\design\frontend\base\default\layout\checkout.xml (or the layout file that is corresponding to your theme)
After that, add your css file to checkout_cart_index tag:

<checkout_cart_index translate="label">
 <
reference name="head">
  <
action method="addCss"><stylesheet>mycustom.css</stylesheet></action>
 </
reference>
...
</
checkout_cart_index>
Hope this helps.

Best Regards,
Magestore

 Signature 

Mega Menu brings flexible configuration to store’s navigation Menu
Magento Extensions and Templates: Affiliate, Store pickup, Gift-wrap, Gift voucher, 1stepcheckout, Auction…
Magento Affiliate - Full-functioned Magento extension to run Affiliate program at $99

 
Magento Community Magento Community
Magento Community
Magento Community
 
MagikSwapna
Sr. Member
 
Total Posts:  76
Joined:  2010-12-14
 

Hello,

Try following code to add css and js in your cart page.

<link rel="stylesheet" href="<?php echo $this->getSkinUrl(); ?>css/yourcss.css" type="text/css" />
<
script src="<?php echo $this->getSkinUrl(); ?>js/yourjs.js" type="text/javascript"></script>
Hope this will help you.

 Signature 

Swapna | Magikcommerce
Find us at http://www.magikcommerce.com
Follow us http://twitter.com/magikcommerce
...................................................................................
Use coupon code “MAGIK2012” to get a
5% discount on all our Themes & Extensions.
...................................................................................

 
Magento Community Magento Community
Magento Community
Magento Community
 
pakerjon
Jr. Member
 
Total Posts:  1
Joined:  2013-02-25
 

informative post.. thanks for sharing it..

 Signature 

certkiller exam training certkiller exam training
gre sample test gre sample test
gre books gre books
online ged test online ged test
pmp exam questions pmp exam questions

 
Magento Community Magento Community
Magento Community
Magento Community
 
jasmine78888
Jr. Member
 
Total Posts:  1
Joined:  2013-05-02
 

it is really nice post i like this info i appreciate this post keep it up.........:dance:

 Signature 

Jasmine

 
Magento Community Magento Community
Magento Community
Magento Community
Magento Community
Magento Community
    Back to top