Ready to get started?Download WordPress


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

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

  2. Alexander Agnarson
    Theme Author

    Posted 1 year 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
    Posted 1 year ago #

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

  4. Alexander Agnarson
    Theme Author

    Posted 1 year 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
    Posted 1 year ago #

    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!

  6. Thony Sabathier
    Posted 10 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!

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic