Results 1 to 7 of 7
  1. #1
    Join Date
    Apr 2007
    Posts
    25
    Plugin Contributions
    0

    Default Customize Color of Sidebox Name (Link)

    My concern is about the color of the 'Shopping Cart' name on my sidebox. Unlike the other sidebox names (categories, search, more information, etc), the color of the 'shopping cart' sidebox name is different because it is a link. When you hover over it, it changes to another color. I want to be able to change the color (before & after hovering) of this sidebox name. Where do I change this and how?

    Also, how can I disable or turn-off this link function of sidebox names?

    Thank you so much for your help.

  2. #2
    Join Date
    Jul 2005
    Location
    Upstate NY
    Posts
    22,010
    Plugin Contributions
    25

    Default Re: Customize Color of Sidebox Name (Link)

    In your stylesheet, find or add

    #shoppingcartHeading a

    and give it a color

    #shoppingcartHeading a {
    color: #aaccee;
    }

    and then style the hover

    #shoppingcartHeading a:hover {
    color: #bbddff;
    }

  3. #3
    Join Date
    Apr 2007
    Posts
    25
    Plugin Contributions
    0

    Default Re: Customize Color of Sidebox Name (Link)

    Thank you so much for your time and effort.

    I tried to look for '#shoppingcartHeading a' in stylesheet.css and I couldn't find it. If I'm gonna make one, I don't know the exact spot where I should incorporate it. I don't want to mess up with the stylesheet. I saw h1, h2... codes in it and I wonder if they have something to do with the color of the sidebox name link.

    Guess I need to learn more about the stylesheet.

    Thank you for helping me.

  4. #4
    Join Date
    Jul 2005
    Location
    Upstate NY
    Posts
    22,010
    Plugin Contributions
    25

    Default Re: Customize Color of Sidebox Name (Link)

    There is a /*sideboxes*/ section near the bottom of stylesheet.css - that would be a sensible place to put the info.

    Just add the whole block
    Code:
    #shoppingcartHeading a {
        color: #aaccee;
        }
    
    #shoppingcartHeading a:hover {
        color: #bbddff;
        }
    there and adjust to your liking.

  5. #5
    Join Date
    Apr 2007
    Posts
    25
    Plugin Contributions
    0

    Default Re: Customize Color of Sidebox Name (Link)

    Thank you so much for your help. Below is a chunk of my stylesheet.css where I made the changes.

    [FONT=Times New Roman]/*sideboxes*/[/FONT]
    [FONT=Times New Roman].columnLeft {}[/FONT]
    [FONT=Times New Roman][/FONT]
    [FONT=Times New Roman]h3.leftBoxHeading, h3.leftBoxHeading a {[/FONT]
    [FONT=Times New Roman] font-size: 1em;[/FONT]
    [FONT=Times New Roman] height: 22px;[/FONT]
    [FONT=Times New Roman] color: #FFFFFF;[/FONT]
    [FONT=Times New Roman] }[/FONT]
    [FONT=Times New Roman][/FONT]
    [FONT=Times New Roman].leftBoxHeading, .centerBoxHeading {[/FONT]
    [FONT=Times New Roman] margin: 0em;[/FONT]
    [FONT=Times New Roman] background-color: transparent;[/FONT]
    [FONT=Times New Roman] padding: 0.5em 0.2em;[/FONT]
    [FONT=Times New Roman] }[/FONT]
    [FONT=Times New Roman] [/FONT]
    [FONT=Times New Roman].leftBoxHeading {[/FONT]
    [FONT=Times New Roman] margin: 0em;[/FONT]
    [FONT=Times New Roman] background-color: transparent;[/FONT]
    [FONT=Times New Roman] padding: 5px 0px;[/FONT]
    [FONT=Times New Roman] background-image: url(../images/menu_bg.gif);[/FONT]
    [FONT=Times New Roman] background-repeat: no-repeat;[/FONT]
    [FONT=Times New Roman] }[/FONT]
    [FONT=Times New Roman][/FONT]
    [FONT=Times New Roman].leftBoxContainer {[/FONT]
    [FONT=Times New Roman] border: none;[/FONT]
    [FONT=Times New Roman] }[/FONT]
    [FONT=Times New Roman][/FONT]
    [FONT=Times New Roman].sideBoxContent {[/FONT]
    [FONT=Times New Roman] background-color: transparent;[/FONT]
    [FONT=Times New Roman] padding: 0.4em;[/FONT]
    [FONT=Times New Roman] }[/FONT]
    [FONT=Times New Roman][/FONT]
    [FONT=Times New Roman]h3.rightBoxHeading, h3.rightBoxHeading a {[/FONT]
    [FONT=Times New Roman] font-size: 1em;[/FONT]
    [FONT=Times New Roman] height: 22px;[/FONT]
    [FONT=Times New Roman] color: #FFFFFF;[/FONT]
    [FONT=Times New Roman] }[/FONT]
    [FONT=Times New Roman][/FONT]
    [FONT=Times New Roman].rightBoxHeading {[/FONT]
    [FONT=Times New Roman] margin: 0em;[/FONT]
    [FONT=Times New Roman] background-color: transparent;[/FONT]
    [FONT=Times New Roman] padding: 5px 0px;[/FONT]
    [FONT=Times New Roman] background-image: url(../images/menu_right_bg.gif);[/FONT]
    [FONT=Times New Roman] background-repeat: no-repeat;[/FONT]
    [FONT=Times New Roman] }[/FONT]
    [FONT=Times New Roman] [/FONT]
    [FONT=Times New Roman].rightBoxContainer {[/FONT]
    [FONT=Times New Roman] border: none;[/FONT]
    [FONT=Times New Roman] }[/FONT]
    [FONT=Times New Roman][/FONT]
    [FONT=Times New Roman][/FONT]
    [FONT=Times New Roman]h3.leftBoxHeading a:hover {[/FONT]
    [FONT=Times New Roman] color: #FFFF33;[/FONT]
    [FONT=Times New Roman] text-decoration: none;[/FONT]
    [FONT=Times New Roman] }[/FONT]
    [FONT=Times New Roman][/FONT]
    [FONT=Times New Roman]h3.rightBoxHeading a:hover {[/FONT]
    [FONT=Times New Roman] color: #FFFFFF;[/FONT]
    [FONT=Times New Roman] text-decoration: none;[/FONT]
    [FONT=Times New Roman] }[/FONT]
    [FONT=Times New Roman][/FONT]
    [FONT=Times New Roman].rightBoxContent {[/FONT]
    [FONT=Times New Roman] background-color: #000000;[/FONT]
    [FONT=Times New Roman] margin-bottom: 1em;[/FONT]


    The red text is the one I tweaked to change the color of the text PRIOR TO HOVERING and it failed. There wasn't any effect at all.

    The blue text is the one I tweaked to change the color of the text WHEN YOU HOVER over it and it was successful.

    Can you please help me on how I could change the color of it PRIOR TO HOVERING?

    Thank you so much for your time.

  6. #6
    Join Date
    Aug 2007
    Posts
    114
    Plugin Contributions
    0

    Default Re: Customize Color of Sidebox Name (Link)

    Do you know how to turn the style off for a sidebox? If i use the blank side box module to insert an image in my sidebox it still has the header and background colour which kinda messes up the image!

    Cheers

  7. #7
    Join Date
    Jul 2005
    Location
    Upstate NY
    Posts
    22,010
    Plugin Contributions
    25

    Default Re: Customize Color of Sidebox Name (Link)

    Something like
    Code:
    #blankSideBoxName .sideBoxContent {
        background-color: transparent;
        }
    
    #blankSideBoxName h3 { display: none;}
    may work.
    I would have to see it live to give the exact selectors to use, especially as you have a Template Monster template. They typically discard many of the standard Zen Cart identifying tags, and this may even affect your new blank sidebox.

 

 

Similar Threads

  1. v151 Change specific category link color on sidebox
    By longstockings in forum General Questions
    Replies: 0
    Last Post: 8 Oct 2013, 11:00 AM
  2. sidebox/header link color
    By jenesaisquoi in forum Templates, Stylesheets, Page Layout
    Replies: 11
    Last Post: 31 Mar 2011, 07:27 AM
  3. customize picture sidebox with a link page
    By langflyer in forum Addon Sideboxes
    Replies: 0
    Last Post: 13 Mar 2008, 07:34 AM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
disjunctive-egg