Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0
RecapRabbitHole

I want 10 blog posts to come up on mobile, but only 8 to come up on the desktop version.

Question

2 answers to this question

Recommended Posts

  • 1

Hi @RecapRabbitHole

Navigate to your Blog Settings and increase the number of posts per page to 10 (see attached).

then paste this code in Custom CSS


@media(max-width: 767px) {
    .blog-basic-grid article.entry.blog-item:nth-child(9), 
    .blog-basic-grid article.entry.blog-item:nth-child(10) {
        display: none;
    }
}

 

let me know if you still have any confusion.

Screen Shot 2020-05-14 at 3.20.37 AM.png

Share this post


Link to post
  • 0
Posted (edited)

Hi @moeezali

Unfortunately this gives me the inverse of what I would like.

Currently I have:

  • 8 Blog posts displayed on Web
  • Blog posts displayed on  Mobile. 

I want:

  • 8 Blog posts displayed on Web
  • 10 (n) Blog posts displayed on  Mobile. 

(n) - being a variable I can change. 

Sorry about that, I don't think my wording was very clear to begin with. 

I think your code should be:

 

@media(min-width: 760px)  {
    .blog-basic-grid article.entry.blog-item:nth-child(9), 
    .blog-basic-grid article.entry.blog-item:nth-child(10) {
        display: none;
    }
}

This code, with my change, gives me the desired result. Thanks! your code did the heavy lifting. 

Great Job!

Edited by RecapRabbitHole

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...