Blog Index Layout Change | Blog Layout Change

Hello,

I want to do a couple things, and I couldn’t find any posts on this exact subject.

First, I want the blog index to be bound by a container, not marginless.

next, i want all the border around each blog post in the index to go away.

Next, i want the blog title to appear under the featured image (and possibly not at all).

and last… PRO won’t let me select a blog to edit.
I can’t make or edit blogs using the pro builder?
What’s up with that?

Jesse

Hi Jesse,

If you have set the Site Layout setting in X/Pro > Theme Options > Layout and Design > Site Layout to Fullwidth and you set the Layout Options in X/Pro > Theme Options > Blog > Layout to Use Global Content Layout, the layout of your blog page will also be fullwidth. If you want to limit it in a container, you can do so by adding this code in X > Theme Options > CSS:

.blog .x-container.offset-bottom {
    max-width: 1200px;
}

Then to do the rest, please add these codes as well:

.blog .entry-wrap .x-container {
    display: flex;
    flex-direction: column;
}

.blog .entry-wrap .x-container .entry-featured {
    order: 1;
}

.blog .entry-wrap .x-container .entry-header {
    order: 2;
    padding: 15px;
}

Kindly note that since this is a custom code that changes the default behavior/display of the theme, you will be responsible to maintain or update the code in case you require further changes or if the code stops working in future updates. If you are uncertain how to proceed, it would be best to get in touch with a developer.

Hope this helps.

none of that worked unfortunately.
I want the title of the blog below the featured image, just the title.
So that it’s in between the preview text and the image.

And that width change just drove 1/3rd of the content off the right side of the page.
I just want the contents to be at 80% max width of the container.

And that didn’t remove any of the borders on the blog page itself.
And this doesn’t address why i can’t make blog posts using the Pro editor.

Hello Jesse,

I cannot check if the code works or not. Did you already remove it?
Please make use of this code:

.blog .x-container.offset-bottom {
    max-width: 1200px;
}

.blog .entry-wrap .x-container {
    display: flex;
    flex-direction: column;
}

.blog .entry-wrap .x-container .entry-featured {
    order: 1;
}

.blog .entry-wrap .x-container .entry-header {
    order: 2;
    padding: 15px;
}

.blog .entry-wrap .x-container .entry-content.excerpt {
    order: 3;
}

And lastly, go to X > Theme Options > Header > Navbar and set the “Navbar Top Height” to at least 120 pixels so that the items will not be behind the navbar.

If nothing is helping, provide us access to your site so that we can check your settings. Please create a secure note with the following info:
– Link to your site
– WordPress Admin username / password

To know how to create a secure note, please check this out: https://theme.co/apex/forum/t/how-to-get-support/288

Regards.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.