add to cart button alignment

General ShopSite user discussion

add to cart button alignment

Postby peteuga » Wed Apr 26, 2017 11:55 am

hello,
My "add to cart" buttons do not line up, how would I fix this?
Image

Store front www.pillowflex.com

Theme is Familiar
peteuga
 
Posts: 73
Joined: Thu May 21, 2009 1:20 pm

Re: add to cart button alignment

Postby ShopSite Lauren » Tue May 02, 2017 9:08 am

The best way would be to make sure all your images are the same dimensions (or same ratio, such as all square, or all 4X3 ratio). That will make sure all product names line up since the names are displayed right at the bottom of the images. However this won't completely fix the add to cart buttons lining up since some product names are longer than others and wrap to multiple lines. So another option would be with CSS. To have all elements line up, you will want to set the general height for all elements. Below is some CSS you can add to your "header" field (Preferences > Layout Settings), that will make all image areas and product names the same height.

Code: Select all
.bb-prodimg {
    height: 180px;
    overflow: hidden;
}
.bb-prodimg img {
    max-height: 100%;
}
.bb-prodnme {
    height: 32px;
    line-height: 16px;
    overflow: hidden;
}


Also, I noticed that the product prices are all set to $0, then the ordering options completely set the price. I would suggest toggling the product price off so you just have the product image, name, and pull down menu (which has the price). You can do this under Products > Edit Product Layout, and uncheck the checkbox to "display this product's price." If this is how all products are setup, you can do a poweredit to accomplish this for all products at the same time.
- 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


Return to User Forum

Who is online

Users browsing this forum: No registered users and 42 guests