X-Cart: shopping cart software

X-Cart forums (https://forum.x-cart.com/index.php)
-   Changing design (https://forum.x-cart.com/forumdisplay.php?f=51)
-   -   Changing color of product variant selector (https://forum.x-cart.com/showthread.php?t=23841)

soyuz02 08-04-2006 07:20 AM

Changing color of product variant selector
 
Hi,

I am seeking to change the color of the product variant selector label which is displayed on the product details page. Any ideas?

Thanks a lot guys.

And Balinor, if you read this one, thank you so much for your dedication to this forum, you've helped me loads.

balinor 08-04-2006 11:06 AM

I read every one :) Glad I can help!

By the selector, do you mean the drop-down box itself or the label next to it?

soyuz02 08-04-2006 01:26 PM

I mean the text next to it, so the label of the control. Thanks :)

carpeperdiem 08-04-2006 01:32 PM

Although this post is not SPECIFICALLY how to change your specific "option" tag (actually you are not changing anything in the template -- you will be editing the CSS file), it will show you how you can figure this out on your own in about 30 seconds...

For your specific case, change step #4 to:

4. click on a product detail that has a variant

then proceed...

http://forum.x-cart.com/viewtopic.php?p=148575#148575

balinor 08-04-2006 01:36 PM

Unfortunately X-Cart didn't bother to assign a class to that piece of text, so it isn't that easy. This is the line that controls the code, it is in skin1/modules/Product_options/customer_options.tpl:

<td valign="middle" height="25">{if $usertype eq "A"}{$v.class}{else}{$v.classtext|default:$v.class }{/if}</td>

You'll need to either add a class to it, or use <span> tags to format it.

carpeperdiem 08-04-2006 01:52 PM

Sorry..

I was thinking you wanted

class="ProductDetailsTitle"

or

.ProductDetailsTitle in the CSS file....

In this case, change this line of code from:
Code:

<td valign="middle" height="25">{if $usertype eq "A"}{$v.class}{else}{$v.classtext|default:$v.class}{/if}</td>
to:
Code:

<td class="ProductVariantTitle" valign="middle" height="25">{if $usertype eq "A"}{$v.class}{else}{$v.classtext|default:$v.class}{/if}</td>

then in your skin1/skin1.css - add this anywhere...
Code:

.ProductVariantTitle { color: #FF00CC; text-decoration: line-through; font-weight: bold; font-size: 14px; }

Obviously, change the CSS to match what you really want it to look like. This particular code will look pretty nasty there...

if you are not proficient in CSS editing, no worries. there are countless sites on the web with everything you need to know. You only need to know how to search for the answer...

hope this helps.

Jeremy

soyuz02 08-05-2006 04:07 PM

Thanks a lot guys, it worked just fine. Just one more question:

I have one selector box which lets the customer choose the product variant. Now left of it is of course the label or name of the option group whose format I have now been able to change. However I would like to inlcude another text label on the right side of it. How would I do this??

Thanks!

balinor 08-05-2006 04:08 PM

Same template, just add a new table cell at the end.

Scott DeToffol 08-07-2006 01:21 PM

skin1.css cheat sheet?
 
balinor or anyone - is there a good guide to skin1.css that explains in detail what the selectors affect? Maybe someone has placed a bunch of comments in that would help guide us?


All times are GMT -8. The time now is 09:27 AM.

Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.