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)
-   -   Speed Bar Color Change (https://forum.x-cart.com/showthread.php?t=27732)

grdrc1963 01-01-2007 06:13 PM
Speed Bar Color Change
 
Just downloaded this yesterday and started changing the template, mainly colors for now. The only issue I have so far is the speed bar color. I have not yet found any .tpl file that I can change the color to match the rest of the changes. How can this color be changed?

Is there anyway to just change the color of the buttons ie buy now, checkout and so on? I can play with other things later, but getting this up and running is priority.

PS: So far I am quite impressed by the power of this cart, good job!

inebriate 01-01-2007 07:28 PM
Re: Speed Bar Color Change
 
the speedbar template is in skin1/customer/tab.tpl and uses an image instead of a background color so you will either have to replace it with your own images or rewrite some of the code to use background color instead

carpeperdiem 01-01-2007 08:21 PM
Re: Speed Bar Color Change
 
Use PhilJ's "advanced speedbar" -- it's CSS and quite flexible. And now, it's free!

http://www.xcartmods.co.uk

grdrc1963 01-02-2007 04:38 AM
Re: Speed Bar Color Change
 
The advanced speed bar from xcartmods looks good and something I will use later, thanks. But I need to change the color of the 3 original tabs at the top of the page. I see the code in the .tpl file, but since I am not familier with much other than HTML, or copy and paste scripts, I become helpless, but willing to learn.

grdrc1963 01-02-2007 05:11 PM
Re: Speed Bar Color Change
 
Guess I need a little education. I played around with the tab.tpl in skin/images and replaced the spacer.gif with another .gif I created. Of course the result was not what I wanted, but learned a little something. Even changed the sizes and so on. Where is the code that determines the color/image that is displayed on the speed bar behind the links? And what would need to be changed to display a color like FFEBC4 or an image/gif I create?

Thanks

Charlie 06-19-2007 10:33 AM
Re: Speed Bar Color Change
 
I'm confused about this too. The stock color of spacer.gif as viewed on the store is #83E1D3.

Yet, when I download the 1 X 1 pixel image, it is #FFFFFF.

I need to change the color of this also. Can someone offer an explanation?

Thank you.

Charlie 06-20-2007 11:47 AM
Re: Speed Bar Color Change
 
Asking again if I may. :)

Charlie 06-21-2007 11:02 AM
Re: Speed Bar Color Change
 
If anyone can help me I sure would be appreciative.

Charlie

Charlie 06-22-2007 09:54 AM
Re: Speed Bar Color Change
 
Have I violated some protocol by asking this question?

Charlie

Charlie 06-23-2007 11:05 AM
Re: Speed Bar Color Change
 
I'm still in here swinging... strike two!

carpeperdiem 06-23-2007 02:20 PM
Re: Speed Bar Color Change
 
Charlie,

Sometimes things are not obvious. This is not one of those times.

If you can't figure this out, you need a crash course in CSS.

Examine file, skin1/customer/tab.tpl

you'll see all kinds of references to

class="TabCorner"
class="TabSide"

etc...

examine "spacer.gif" in photosop and it's a transparent gif. It does not have any color. Itis only used for spacing (old school, yes, but it works).

SO -- your tab colors are all coming from the CSS... so look at the CSS for the tabs:

Code:
/*
    Tab mechanism
*/
.Tab { BACKGROUND-COLOR: #FFD44C; FONT-WEIGHT: bold; TEXT-TRANSFORM: uppercase; WIDTH: 85px; HEIGHT: 30px; TEXT-ALIGN: center; }
.TabTop { HEIGHT: 5px; BACKGROUND-COLOR: #FFD44C; }
TD.TabLeftSide { WIDTH: 9px; BACKGROUND-IMAGE: url(images/tab_l.gif); }
TD.TabRightSide { WIDTH: 9px; BACKGROUND-IMAGE: url(images/tab_r.gif); }
TD.TabLeftCorner { WIDTH: 9px; HEIGHT: 9px; BACKGROUND-IMAGE: url(images/tab_c1.gif); }
TD.TabRightCorner { WIDTH: 9px; HEIGHT: 9px; BACKGROUND-IMAGE: url(images/tab_c2.gif); }
TD.TabCenter { HEIGHT: 9px; BACKGROUND-IMAGE: url(images/tab_b.gif); }
IMG.TabCorner { WIDTH: 9px; HEIGHT: 9px; }
IMG.TabSide { WIDTH: 9px; HEIGHT: 1px; }

It's all there... the images that actually make the tab are called by CSS, not the template.

I still think this way of making tabs is inferior to PhilJ's way (which is 99% CSS - you could make it 100%) and since my last post in this thread, Phil decided to no longer give it away... so now it will cost $19

There are countless pages of CSS tips, tutorials and simple "how do I do that" articles on the net. I suggest you acquire some basic CSS skills, or else x-cart will be a real headache.

Charlie 06-24-2007 04:46 AM
Re: Speed Bar Color Change
 
Quote:
Originally Posted by carpeperdiem
examine "spacer.gif" in photosop and it's a transparent gif. It does not have any color. Itis only used for spacing (old school, yes, but it works).

SO -- your tab colors are all coming from the CSS... so look at the CSS for the tabs

This explains the confusion I was having. Thanks for the help. You've set me back on the right path. 8O

Charlie


All times are GMT -8. The time now is 04:58 AM.

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