Home Forums Weaver Xtreme Theme Space between posts on post pages broken in some cases (mobile view)

Topic Resolution: Answered
Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #65828
    Answered
    travincult
    Participant

    Something seems to have happened to my website.

    In some cases the white space between posts have been reduced on post pages in mobile view (and sometimes on other screen sizes as well), for example on this page: https://travelinculture.com/destinations/europe/denmark/

    In mobile view you will see that on this post page the white space under the first post has gone (and the word Denmark gets much too close to the next post). It happens again some posts further down. Before, it was not like that.

    Is this due to the last Weaver Xtreme upgrade? Can you help me get it back to ‘normal’?

    Thank you.

     

    #65829
    scrambler
    Moderator

    How did you set the post display in the page with posts?

    Right now it looks like some posts have no content and some have an empty content with an empty paragraph tag that causes extra space.

    Given you do not want to see the content, you should be using display post as “Title plus featured image”. That would cause ALL posts content to not be displayed at all and produce equal spacing.

    #65838
    travincult
    Participant

    I set all posts display ‘Default Blog FI’.

    All my posts have non-empty content and they all show on the post pages (within the defined categories). I use the category tag to display the country below each post on the post pages.

    It works fine (looks the same with a small space in between) for about one hundred posts – and then in just 5 cases there is no space between the category tag and the following post.

    I have created all posts with a featured image of the same dimension (which are the featured images appearing on the post pages). I really don’t understand why it looks different in these 5 cases (4 in the category Denmark and 1 in the category Sweden). It is a new problem that I didn’t experience earlier.

    Any idea?

    #65842
    scrambler
    Moderator

    “I set all posts display ‘Default Blog FI’.”

    You misunderstood what I meant, I am not speaking of the post editing page option, but the Blog page editing page that is created using a page with post template.

    In the Blog page editing page > Weaver Xtreme option for this page section > Page with posts TAB > Display post as Drop down list, you should select “Title + Featured Image

    Something is different between some of your post as some have an empty excerpt and some have a truncated excerpt with the …

    And you have a CSS rule below that hides the three excerpt cutoff dots

    .excerpt-dots {display:none;}

    Using the display option I mention above on the page with post should fix the issue as it will hide the whole excerpt properly.

    If that does not work for some reason, you could add the CSS rule below to the theme Global custom CSS Rule box to hide the excerpts manually.

    .page-id-9429 .entry-summary {display:none;}

    #65847
    travincult
    Participant

    Thank you! – that nearly does the trick. (with equal spaces)

    It is only that the ‘display post as Title + Featured Image’ moves the country category (‘Denmark’) down overlaying the featured image of the following post (on the post page). So I would need to know how to insert an extra space between the posts (after the category tag)…?!?

    If I use the other rule .page-id-9429 .entry-summary {display:none;}, it is better – the country category doesn’t overlay the next FI, but it is still very close to it. Also in this case I would like to add some extra space between the posts.

    I would really appreciate if you could also help with this!?

     

    #65848
    scrambler
    Moderator

    Using display Title + featured image should not cause overlap. To know what could cause that on your site, I need you to set it up this way and post back so I can see what is going on.

    If you brute force it with the rule I gave you and need more space, you should be able to use the Post top/bottom margin options found in the the theme

    #65849
    travincult
    Participant
    #65850
    travincult
    Participant

    I just realised that the title is actually now above the FI. I intended it to be the other way round.

    #65851
    scrambler
    Moderator

    That would be a problem 🙂

    Use the rule I gave you then to Hide the Excerpt, and add top or bottom margin using the post theme settings

    #65852
    Private Reply
    travincult
    Participant
    This reply has been marked as private.
    #65853
    scrambler
    Moderator

    If you want to add the space only in the page we discussed here, instead of adding margin in your post info lines, just use the rule below

    .page-id-9429 .content-2-col {margin-bottom:10px;}

    #65854
    travincult
    Participant

    Yes, that works for that page. I just have the problem that the posts from this page can also appear on my home page which is also a post page (a mix of countries) …  So the best solution would be to apply a CSS rule to all the post pages (together with adding a margin in the post info lines).

    Can you therefore give me such a rule applying to all post pages?

    #65855
    Best Answer
    scrambler
    Moderator

    This reply has been accepted as the best answer.

    If what you are saying is that you want space between posts on all blog pages (2 columns or not) but not single post pages, then use

    .blog .post-area {margin-bottom:10px;}

    If you want only 2 columns blog pages use

    .blog .content-2-col {margin-bottom:10px;}

    Basically, the selector .blog will target all blog pages (page with posts)

    #65901
    travincult
    Participant

    That just did the trick, thank you so much!

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