[dtrinidadParticipant]

Hi,

I’ve been trying to make my page fit like the ethos 1 example and bring the edges of my image and sidebar closer to the edge of the screen. Here is what I want it to look like: http://theme.co/x/demo/ethos/1/how-to-survive-the-desert-at-night/ . Here is what it actually looks like now: http://prntscr.com/551799

I’ve tried to use the customizer to do this, but can’t seem to make it work. Could you helm me make it fit more like the ethos 1 example?

Also, I’m trying to change the font color for headings and body on this page to black. Where do I go to change the color?

Thank you,

Denise

[dtrinidadParticipant]

This reply has been marked as private.

[ChristianModerator]

Hey there,

Please see https://theme.co/x/member/kb/customizer-ethos/ to learn how to setup Ethos.

Thanks.

[dtrinidadParticipant]

I watched the full video. It talks about the new features in Ethos, how to add a post carousel, how to add a slider, how to customize archive pages, and change the color in the tob bar navbar color and side bar text color. It doesn’t talk about how to change the layout.

It looks like my layout is automatically changed to “boxed”, but I’ve changed every option I see in the customizer to fullwidth. It doesn’t seem to make a difference. I’ve tried to adjust the content width, but that seems to warp the side bar. I’ve also tried to change the site width, but that doesn’t get rid of the “boxed” look.

I’m completely out of ideas. My page layout looked just like ethos 1 until I upgraded to the new version of X, then the layout changed without me manually changing any of the settings.

I really hope you can help me get it back the way it was.

Thank you,

Denise

[Nabeel AModerator]

Hi Denise,

Site width was not configured correctly, I changed it to 88% via Customizer > Ethos and then added the following CSS via Customizer > Custom > CSS:

.x-main {
width: 72% !important;
}
.x-sidebar {
width: 28% !important;
}
.x-content-sidebar-active .x-container-fluid.main:before {
right: 30% !important;
}

The layout is now fixed. You can compare it with Ethos demo now. Please check your website again after clearing your browser’s cache.

[dtrinidadParticipant]

Thank you so much. Looks much better, except now the main image sticks out onto the sidebar. Take a look http://prntscr.com/55otpd

I have over 100 images all the same size, so I can’t adjust the image size one by one. How can I adjust the page sot that it fits the images? The images are 855 pixels wide.

Thanks again,

Denise

[ChristianModerator]

Hey Denise,

Please change

.x-main {
width: 72% !important;
}

to

.x-main {
width: 70% !important;
}

The images will fit the area regardless of their original size.

Thanks.

[dtrinidadParticipant]

Thank you, thank you, thank you, a million thank yous! Looks like the problem is fixed

Denise

[ChristianModerator]

You’re welcome Denise.

[Author]

Posts