Docs

[maritzalopez]

Can you help me remove the White Space Beneath Header and Footer?

My URL is http://www.buildersbookdepot.com

Also how do I make the category bar a different color?

Thank you.

M Lopez

[Darshana]

Hi Lopez,

Thanks for writing in! You can add this under Custom > CSS in the Customizer.

.x-container.offset {
    margin: 0 auto;
}

To make your categories a different color, follow the example below.

#menu-item-4642 span, #menu-item-4646 span, #menu-item-4643 span, #menu-item-4321 span, {
    color: #ff0000;
}

Hope that helps.

[maritzalopez]

That worked great! The white space under the header is gone but there is also a white space in the content (see attached) Can you help?

[Rupok]

Hi there,

Thanks for writing back! Your screenshot was not uploaded correctly due to exceeded size (should be under 512KB).
However I believe I got what you are referring. You can add this as well :

.entry-wrap {
	padding-top: 20px;
}

You can adjust the value if needed.

Cheers!

[maritzalopez]

You guys freaking rock! It worked!

Can you show me in a little more detail of how to change the category bar into a different color?

[maritzalopez]

Can you show me how to make these products smaller?

Example: Here is what appears when I search “electrical” –> https://buildersbookdepot.com/?s=electrical

[Jade]

Hi there,

Please add this code in the customizer:

.search-results .entry-thumb {
    width: 50%;
    margin: 0 auto;
}

Hope this helps.

[maritzalopez]

Can you make the results look more like this instead? https://buildersbookdepot.com/product-tag/california/

[maritzalopez]

Can you show me in a little more detail of how to change the category bar into a different color?

[Lely]

Hi M Lopez,

To make the search result look like this page: https://buildersbookdepot.com/product-tag/california/ , please remove this:

.search-results .entry-thumb {
    width: 50%;
    margin: 0 auto;
}

Then add this instead:

.search-results article {
    width: 22%;
    margin: 0 auto;
    float: left;
    overflow: hidden;
    position: relative;
    margin: 0 4% 4.5% 0;
    padding: 0;
    background-color: #fff;
    border-radius: 4px;
    box-shadow: 0 0.15em 0.35em 0 rgba(0,0,0,0.135);
}
.search-results .x-pagination {
    clear: both;
}
.search-results article:nth-child(4n+4) {
    margin-right: 0;
}

On Appearance > Customize > BLog >Full Post Content on Index: set this to OFF.
Regarding changing category bar color, can you give us details which bar and on which page?

Hope this helps.

[maritzalopez]

The category bar Im talking about is the menu “ADA BUSINESS AND LAW…” in the header: https://buildersbookdepot.com

How do i make that a different color?

[Rue Nel]

Hello There,

Thanks for updating in! Are your referring to this?

If that is the case, you can have a different color with that menu items by adding this css in your customizer, Appearance > Customize > Custom > Edit GLOBAL CSS

.x-navbar .desktop .x-nav>li.menu-item-4642 a{
    color: red;
}

.x-navbar .desktop .x-nav>li.menu-item-4642 a:hover{
    color: violet;
    box-shadow: inset 0 4px 0 0 violet;
}

.x-navbar .desktop .x-nav>li.menu-item-4646 a{
    color: yellow;
}

.x-navbar .desktop .x-nav>li.menu-item-4646 a:hover{
    color: blue;
    box-shadow: inset 0 4px 0 0 blue;
}

Feel free to change the colors to match with your site preferences.

Hope this helps.

[Author]

Posts