WordPress.org

Ready to get started?Download WordPress

Forums

Hueman
[resolved] Define sidebar-top color for different sidebars (6 posts)

  1. wp4flo
    Member
    Posted 6 months ago #

    Dear Alexander,
    first of all thank you for this great theme and for your great support.

    On my Blog I use only the one-sidebar-option. On some pages I define the sidebar to appear right on others left. I have different sidebars, but the color of de sidebar-top is always the primary color set in theme options.
    I would like to have a different color depending on the sidebar appears right or left. For example primary color if sidebar is left and secondary color if sidebar is right. Is there a short and simple way to get this? I use a child-theme for customization.
    Cheers,
    Flo

  2. Alexander Agnarson
    Member
    Theme Author

    Posted 6 months ago #

    Hi Flo! Thanks.

    You can do like this I think with some custom CSS:

    .col-2cl .s1 .sidebar-top,
    .col-2cl .s1 .sidebar-toggle { background: red; }

    col-2cl = 2cl = 2 column, content left (sidebar right)

    .col-2cr .s1 .sidebar-top,
    .col-2cr .s1 .sidebar-toggle { background: green; }

    col-2cr = 2cr = 2 column, content right (sidebar left)

  3. wp4flo
    Member
    Posted 6 months ago #

    Works great! Thanks!
    Is there a similar way to get links on that sidebar in the same color?

  4. Alexander Agnarson
    Member
    Theme Author

    Posted 6 months ago #

    Nice - for a complete change of all the primary-color values of the s1 sidebar, you'd need something like:

    .col-2cl .s1 .post-nav li a:hover i,
    .col-2cl .s1 .widget_rss ul li a,
    .col-2cl .s1 .widget_calendar a,
    .col-2cl .s1 .alx-tab .tab-item-category a,
    .col-2cl .s1 .alx-posts .post-item-category a,
    .col-2cl .s1 .alx-tab li:hover .tab-item-title a,
    .col-2cl .s1 .alx-tab li:hover .tab-item-comment a,
    .col-2cl .s1 .alx-posts li:hover .post-item-title a,
    .col-2cl .child-menu a:hover,
    .col-2cl .child-menu .current_page_item > a { color: red; }
    
    .col-2cl .s1 .sidebar-top,
    .col-2cl .s1 .sidebar-toggle,
    .col-2cl .s1 .widget_calendar caption { background-color: red; }
    
    .col-2cl .s1 .alx-tabs-nav li.active a { border-bottom-color: red!important; }

    And the same for .col-2cr. Unless you use the default color for one of them, then you should only need to specify the other one with CSS.

  5. wp4flo
    Member
    Posted 6 months ago #

    Perfect!
    I just modified .col-2cl (sidebar on the right side) an use the default color for the sidebar on the left side.

    Thanks for great and fast support!
    Flo

  6. Thony Sabathier
    Member
    Posted 2 months ago #

    Dear Alexander,
    As Flo said, congrats for your theme, I love it!

    I'm trying to change the sidebar top color as well, but I have a 3 columns layout with 2 sidebars. Could you help me with this?

    I'm using the custom.css file.

    Thanks a lot!
    Tony

Reply

You must log in to post.

About this Theme

About this Topic