Tagged: 

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • April 14, 2017 at 8:04 pm #778038
    abmich

    Boxed layout, top header. We have a number of pages with custom sidebars and would like the background for the sidebar to span the entire height of the page. It appears that there’s no sidebar div to target with our styling.

    Accomplishing this through columns in the advanced layout editor is not a solution we can use for this problem. Link in Private Comments.

    April 15, 2017 at 11:10 am #778178
    Vinay

    Hey Andrew,
    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

    @media only screen and (min-width:767px) {
#main .container_wrap_first > .container {
padding-right:0!important;
}
.sidebar {
	position: absolute;    
    top:0;
    left:0;
    padding-left:30px!important;
    bottom:0;
    max-width:calc(25% - 50px);
    background:gold;
}}

    Best regards,
    Vinay

    April 15, 2017 at 2:16 pm #778204
    abmich

    That works. A couple of followup questions please:

    1. Is there a way to adjust the spacing between the sidebar and the main content? It’s about 2x bigger that we want it.

    2. What’s the best way change the background color of the sidebar background on pages? Just use the page id like: .page-id-12597 .sidebar {
    background:red;
    }
    That works, but if there’s a more elegant way, particularly one that lets you set based on what page the page is a child of would be appreciated!

    April 15, 2017 at 9:23 pm #778287
    Vinay

    Hi,

    1. You can try adding padding to the right and left or set a min-width to the sidebar.

    2. If you like to add a different background color to different pages please use the page id class, it’s the best way to achieve it.

    Best regards,
    Vinay

    April 18, 2017 at 1:35 pm #779273
    abmich

    Targeting by page-id works, but how do I set a default background color for all the other pages?

    I tried both “.page” and “.page-template-default” of these above the specific page-id directives but nothing seems to work:

    .page-template-default .sidebar { background-color: #4c8599; width: 260px !important;}
    .page-id-12564 .sidebar { background-color: #b2a0ab; width: 260px !important;}

    Also, how would I change the link colors on the custom menus in a section? Looking for the easiest way, but I’d settle for any way!! See below for the page.

    April 18, 2017 at 6:30 pm #779541
    Victoria

    Hi,

    Here is how to specify the width of sidebar once and how to adjust menu links in that sidebar

    
#top #main .sidebar_left .sidebar {
    width: 260px !important;
}

#nav_menu-5 li a {
    color: #ffffff;
}

    If you need further assistance please let us know.
    Best regards,
    Victoria

    April 18, 2017 at 10:29 pm #779684
    abmich

    Great. One more thing is that the sidebar goes crazy on the page that I am trying to make the “Blog” page. See links below.

    Thank you!

    April 19, 2017 at 7:12 am #779813
    Nikko

    Hi,

    Try adding this css code also:

    
@media only screen and (min-width: 767px) {
  .sidebar.sidebar_right {
    left: auto;
    right: 0;
    background-color: #4c8599;
  }

  .sidebar.sidebar_right .inner_sidebar {
    margin-left: 0;
    margin-right: 50px;
  }
}

    Hope this helps :)

    Best regards,
    Nikko

    April 19, 2017 at 2:16 pm #779972
    abmich

    That did work Nikko but is there any way to have the sidebar be on the left as on the rest of the site?

    April 20, 2017 at 12:08 am #780219
    abmich

    Also if you look at the link below you can see how the CSS pushes items slightly off the edge of the box. Do you have a thought on the best way to fix that?

    April 20, 2017 at 8:46 pm #780757
    Victoria

    Hi abmich,

    Here are the settings in theme options to have sidebar on the left or on the right.
    And here is css for having that right padding:

    
.content .entry-content-wrapper {
    padding-right: 50px !important;
}

    If you need further assistance please let us know.
    Best regards,
    Victoria

  • Author
    Posts
Viewing 11 posts - 1 through 11 (of 11 total)
  • You must be logged in to reply to this topic.