mini shopping cart customization

Questions and answers about ShopSite Custom Templates

mini shopping cart customization

Postby lneibauer » Tue Oct 07, 2014 8:09 am

I am new to Shopsite but I have made inroads in modifying templates. The question I have is I would like to modify the mini-shopping cart template and with the help of my hosting provider determine that I am using the default mini-shopping cart template but it really looks more like a Javascript then a Shopsite template. I am trying to modify the color of the text, text size and background color of the mini shopping cart but can't seem to find these variables. Can somone please point me in the correct direction to modify these variables. Thanks in advance!
lneibauer
 
Posts: 108
Joined: Tue Sep 30, 2014 7:13 am
Location: Warminster, PA

Re: mini shopping cart customization

Postby ShopSite Lauren » Tue Oct 07, 2014 9:04 am

What is the URL to the website where I can view this?

The mini cart is just javascript code, and can be added to templates in many different ways. I would suggest that the best way to change the colors and font styles would be just to use CSS. Most the build in templates include classes with the mini cart javascript so that you can customize it.
- ShopSite Lauren
Contact me for help with any of your
custom ShopSite template questions.
ShopSite Lauren
 
Posts: 887
Joined: Fri Aug 11, 2006 1:35 pm
Location: Orem, UT

Re: mini shopping cart customization

Postby lneibauer » Tue Oct 07, 2014 10:15 am

the URL is www.churchsupplier.com
lneibauer
 
Posts: 108
Joined: Tue Sep 30, 2014 7:13 am
Location: Warminster, PA

Re: mini shopping cart customization

Postby ShopSite Lauren » Tue Oct 07, 2014 10:30 am

I don't see the mini cart javascript on the home page of your website. Could you give me the URL to where I can view the mini cart?
- ShopSite Lauren
Contact me for help with any of your
custom ShopSite template questions.
ShopSite Lauren
 
Posts: 887
Joined: Fri Aug 11, 2006 1:35 pm
Location: Orem, UT

Re: mini shopping cart customization

Postby lneibauer » Tue Oct 07, 2014 12:57 pm

http://www.churchsupplier.com/shopsite_sc/store/html/8597.html

its only on the more information pages, sorry for not including that before
lneibauer
 
Posts: 108
Joined: Tue Sep 30, 2014 7:13 am
Location: Warminster, PA

Re: mini shopping cart customization

Postby Jim » Tue Oct 07, 2014 1:50 pm

Here is the text that I get when I select the minicart area of the page and View the Source
Code: Select all
<th class="MiniCart" colspan="3"><a class="MiniCart" href="http://www.churchsupplier.com/cgi-churchsupplier/sb/order.cgi?storeid=*10cbe218a907e240ef8c&amp;function=show">Your Shopping Cart</a></th></tr><tr><td class="MiniCartHead">Qty</td><td class="MiniCartHead">Product</td><td class="MiniCartHead">Price</td></tr>
<tr><td class="MiniCartQty">1</td><td class="MiniCartProduct">All Things Are Possible A</td><td class="MiniCartPrice">$1.59</td></tr>
<tr><td class="MiniCartSubtotalText" colspan="2">Subtotal</td><td class="MiniCartSubtotal">$1.59</td></tr></tbody>


So there are several styles defined that you need to modify the text font and colors.
class MiniCart,
class MiniCartHead
class MiniCartQty
class MiniCartProduct
class MiniCartPrice
Class MiniCartSubtotalText
class MiniCartSubtotal

There is code on the page that defines most of those so you just need to change that code. Here is a section of the page source that has the styles defined.
Code: Select all
 div.MiniCart {background-color:  ##DAE4F6; text-align: center; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 8pt; color: ##000000; margin-bottom: 10px;}
  img.MiniCart {vertical-align: middle;}
  table.MiniCart {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 7pt; width: 99%;}
  th.MiniCart {font-weight: bold; text-align: center;}
  td.MiniCart {font-size: 9pt;}
  td.MiniCartHead {font-weight: bold; text-align: center;}
  td.MiniCartQty {text-align: center; border-bottom: 1px dotted ##FFFFFF;}
  td.MiniCartProduct {text-align: left; border-bottom: 1px dotted ##FFFFFF;}
  td.MiniCartPrice {text-align: right; border-bottom: 1px dotted ##FFFFFF;}
  td.MiniCartSubtotalText {text-align: right;}
  td.MiniCartSubtotal {text-align: right;}
Jim
Site Admin
 
Posts: 4953
Joined: Fri Aug 04, 2006 1:42 pm
Location: Utah

Re: mini shopping cart customization

Postby lneibauer » Wed Oct 08, 2014 9:59 am

Thank you this helped a lot and now I know where to look to correct the issue
lneibauer
 
Posts: 108
Joined: Tue Sep 30, 2014 7:13 am
Location: Warminster, PA


Return to Custom Template Questions

Who is online

Users browsing this forum: No registered users and 19 guests

cron