WordPress.org

Ready to get started?Download WordPress

Forums

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

  1. wp4flo
    Member
    Posted 3 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 3 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 3 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 3 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 3 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

Reply

You must log in to post.

About this Theme

About this Topic