I'm having difficulty editing the product.tpl so that my product options are in three columns.
At the moment the colour options and images are in one single column which makes the page quite long:
http://www.ruggerbug.com/store/index.ph ... duct_id=50
I'd like to have them aligned in three columns.
Appreciate any help and happy new year
Dan
A small modification could be done to your product.tpl file. Could you post it as an attachment file ?
Dedication and passion goes to those who are able to push and merge a project.
Regards,
Straightlight
Programmer / Opencart Tester
From stylesheet.css file, since the product options are being separated by subjects, you'd need to edit each of those subjects for your product options:
Code: Select all
.product-info .options {
border-bottom: 1px solid #E7E7E7;
padding: 0px 5px 10px 5px;
margin-bottom: 10px;
color: #000000;
}
.product-info .option-image {
margin-top: 3px;
margin-bottom: 10px;
}
.product-info .option-image label {
display: block;
width: 100%;
height: 100%;
}
.product-info .option-image img {
margin-right: 5px;
border: 1px solid #CCCCCC;
cursor: pointer;
}
Dedication and passion goes to those who are able to push and merge a project.
Regards,
Straightlight
Programmer / Opencart Tester
Hi,
could you please clarify the changes that would need to be made to display the images in two columns as the code posted is identical to the base install css.
Many Thanks.
could you please clarify the changes that would need to be made to display the images in two columns as the code posted is identical to the base install css.
Many Thanks.
A bit old thread but I saw you didn't solve it yet. This works for me:
Add to your css:
Tested on Chrome 21, FF 15, Opera 12, IE 8.
Opencart 1.5.3.1 (should work on your 1.5.1.3)
Add to your css:
Code: Select all
.product-info .option-image tr {
float: left;
width: 49%;
padding-right: 1%;
}
Opencart 1.5.3.1 (should work on your 1.5.1.3)
I know the thread is old, but your solution helped me today and as nobody thanked you, I do that now.mirek wrote:A bit old thread but I saw you didn't solve it yet. This works for me:
Add to your css:
Tested on Chrome 21, FF 15, Opera 12, IE 8.Code: Select all
.product-info .option-image tr { float: left; width: 49%; padding-right: 1%; }
Opencart 1.5.3.1 (should work on your 1.5.1.3)
Who is online
Users browsing this forum: No registered users and 343 guests
