Joomla Templates Club 406,261 posts

[jsgrill Friend jsgrillJoin date: January 2008Posts: 28Downloads:0Uploads:0 Thanks: 2]

#130038

What’s the file that controls the layout of the ‘Add to Cart’ box? It looks fine in IE but is messed up in Firefox. I’d like to try to fix it but I can’t figure out the exact file that controls the layout. I’ve found addtocart_advanced_attribute.tpl.php, addtocart_custom_attribute.tpl.php, addtocart_drop.tpl.php, addtocart_form.tpl.php, addtocart_list_multi.tpl.php, addtocart_list_single.tpl.php.

Should it be addtocart_form.tpl.php?

Thanks

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#255752

Hi jsgrill !
You can open addtocart_form.tpl.php file in componentscom_virtuemartthemesdefaulttemplatesproduct_detailsincludes folder . that is template for add to cart form.

[jsgrill Friend jsgrillJoin date: January 2008Posts: 28Downloads:0Uploads:0 Thanks: 2]

#255888

Actually, it looks like it is the ja-vm.css file that caused the problem. I commented out the following line in ja-vm.css so that it would use the css code from the main virtuemart theme.css:

div.vmCartContainer div {
display: inline;
}

Now the Add to Cart/Attribute box looks like this:

Now I need to figure out how to fix the border box around the attributes or remove them altogether.
I also need to figure out why the main border box isn’t stretching all the way across the screen. It does so in IE. The width is set to 100%.

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#255976

Hi jsgrill !
Please send url of your site and link to obove form.

[jsgrill Friend jsgrillJoin date: January 2008Posts: 28Downloads:0Uploads:0 Thanks: 2]

#255978

Link to one of the products on my site.

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#255981

You can remove border box around attributes by way :
Open theme.css file in componentscom_virtuemartthemesdefault folder , find following code section at about line 282 :


.vmCartChild { /* Container for the Child Product */

vertical-align: middle;
border: 1px solid #000;
padding-left: 2px;
padding-right: 2px;
margin-bottom: 2px;
float:left;
}

change to :


.vmCartChild { /* Container for the Child Product */

vertical-align: middle;
padding-left: 2px;
padding-right: 2px;
margin-bottom: 2px;
float:left;
}


[jsgrill Friend jsgrillJoin date: January 2008Posts: 28Downloads:0Uploads:0 Thanks: 2]

#255996

Well, I had thought about that. But, I would ultimately have to remove the entire ContainerBox as well. For example, this product’s color attribute drop-down box is so wide that the drop-down box goes over all the lines.

If there was a way to force the container to a wider width, that would be a better solution.

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#256011

Hi jsgrill !
You can do following way :
Open theme.css file in componentscom_virtuemartthemesdefault folder , find following code section at about line 267 :


.vmCartContainer {
background:lightblue none repeat scroll 0% 0%;
border:1px solid #000000;
float:left;
padding:3px;
width:auto;
}


change to :


.vmCartContainer {
background:lightblue none repeat scroll 0% 0%;
float:left;
padding:3px;
width:500px;
}


[jsgrill Friend jsgrillJoin date: January 2008Posts: 28Downloads:0Uploads:0 Thanks: 2]

#256130

I changed the following:

.vmCartAttributes { /* Attributes Div*/

margin-top:8px;
width: 100%;
}

to

.vmCartAttributes { /* Attributes Div*/

margin-top:8px;
width:494px;
}

And the Add to Cart/Attribute box looks correct in both FireFox and IE now. Odd how FireFox couldn’t handle setting the width to 100%.

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#256308

OK jsgrill.

[Author]

Posts