White space above content in blog post

Hello

I would like to have a slider directly under my header without any white space between the bottom of the header and the top of the slider. i also would like to have the slider at full width.

can anyone provide me a css code or tell me what settings i need to check please?

Greetings.

Hello @Vhcarweb,

Thanks for asking. :slightly_smiling_face:

I suggest you to use Revolution Slider to create slider. Revolution Slider can be installed from X > Theme Options > Extensions. To have slider under header, you need to edit the page and select the slider under Slider Settings: Below Masthead. Here is a screencast that you can take a look.

To get started with Revolution Slider, please take a look at following article:

To create a full width slider, please take a look at following article:

https://www.themepunch.com/revslider-doc/slider-setup/#slidelayout

Thanks.

Hello

I can’t select the ‘below masthead’ option in a blog post, i already knew how to do it on a page, but this concerns a blog post :wink:

Also, i can’t use revolution slider on this post because i had to select the option to only load revslider on the homepage because when i load it globally, my ‘close’ button of envira gallery doesn’t work anymore. do you have a solution for that?

Hello @Vhcarweb,

Thanks for updating the thread.

Can you please share the page/post url where you are facing the problem of close button not working? I tried looking at the website but I am not able replicate the issue on my end.

Thanks.

Hello, i am also building a site for a friend using x theme but i use the same account that i am making the other site with: the site that is facing the problem is: www.steyaertbouw.be/blog/zwemvijver-te-moerkerke/
i have found that if i put the ‘gallery thumbnails’ option off, i don’t have the problem anymore, so for me that’s ok :wink:
i do still have the problem of the white space under my header that needs to go away :confused:

Hello @Vhcarweb,

Thanks for updating the thread.

I checked the link you have shared but it seems that you have activated under construction page. Can you please share the details in secure note so that we can take a closer look at the page?

Thanks.

Hi again,

I tried to login but the given credentials are not working on my end, can you please double check the username and password?

Thanks!

I’ve checked and changed them :wink:

Hey Kris,

Can you give us a screenshot of the white space you’re referring to? Here’s what I currently see. Looks like there’s no issue.

Also note that X does not have the ability to display a slider for posts like the page. For that, you need to upgrade to Pro so you can create a header, add the slider to the header and then assign the header to a specific post or all of your posts.

Please also don’t mix up topics in a single thread because this causes confusion resulting to a lot of back and forth and thus increasing our response time.

Thanks.

I mean all the white space around the colums, i know i can delete the space on pages but i don’t know how to do it on blog posts. since i want a picture on the top under the header in full-width, the blank space needs to go away, i think i need a shortcode but i don’t know which one.
Many greetings

Hi There,

Please try adding this custom CSS under Theme Options > CSS:

.single-post .entry-wrap { padding: 0; }

This custom CSS will remove the padding around the post content.

Hope it helps :slight_smile:

Hello

I’ve added it in global css in theme options, i saw i’ve already added it in my extra css in my customizer to, but it didn’t change anything :confused:

I think it is because my post is in a ‘container’

Hi @Vhcarweb,

I checked and the CSS works, if you’re planning to make it have an absolute full-width, then yes, it’s due to the container. But it doesn’t look good for the type of content you’re displaying. It looks good as what I see it now, centered in white background.

Thanks!

hello
i changed the post, now you can see what i want to achieve.
i have posted a big picture with a title, if you look at the post you will see the change.
i want that picture to be full width just like the following page: http://steyaertbouw.be/tuinaanleg/
there i have a full width picture with a title above. now i want to achieve that effect on a post so i don’t have white borders.

greetings

Hi There,

Please add this to Theme Options > CSS

/*remove the posts template offset container's max-width*/
.single-post .x-container.offset {
	width: 100%;
	max-width: none;
	margin-top: 0;
}
/*remove the gap between header and content*/
.single-post .x-container.offset  .entry-content {
	margin-top: 0;
}

Keep in mind that the posts template now has no more max-width. So keep the Inner Container of the ROW, if you don’t want the content copy to go full width with the image.

You should get this look after.


Cheers!

1 Like

It worked, thanks :slight_smile:

You’re welcome!

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