Grid Layout For Posts

Sparkling
1

Hi, thanks for the great theme. Please how do I make my posts appear in grid format, is there any custom css code I could use? I tried some plugins but the result wasn’t good.

2

I am also interested in this. Two or one columns and little thumbnails

3

Hi there,

I hope you are well today and thank you for your question.

You can try achieving this by adding the following CSS code in the Custom CSS option of the latest version of Sparkling theme on the below path.

Admin Area -> Appearance -> Customize -> Sparkling Options -> Other -> Custom CSS



@media (min-width: 768px) {

    .blog.home #primary article.post {
        width: 50%;
        margin: 0;
        padding-right: 10px;
        display: inline-block;
        float: left;
    }
    .blog.home #primary article.post .post-inner-content{
        border: 0;
        padding: 0 0 30px;
    }

    .blog.home #primary article.post:nth-child(odd){
        clear: left;
        padding-right: 25px;
    }
    .blog.home #primary article.post:nth-child(even){
        padding-left: 25px;
    }

    .blog.home #primary ul.pagination {
    clear: both;
    display: block;
    margin: 50px 0;
    float: left;
}
}

Best Regards,
Movin

4

Thanks a lot for your reply. It worked but the read more button wasn’t coming up again. Any way to fix that?

5

Is there a way to have only one column?

6

@biodun

Thanks a lot for your reply. It worked but the read more button wasn’t coming up again. Any way to fix that?

I have updated above shared CSS code so that Read More button will be displayed so please try using that updated code.

7

@sebagela

Is there a way to have only one column?

It by default displays in one column and above custom CSS code makes it display in two columns.

8

Wow! Thanks a lot. You are the best.

9

It only worked for the posts on the first page not subsequent pages. I am not using a static page. All the same, thank you…but I wished it worked for all pages

10

You are most welcome here :slight_smile:

It only worked for the posts on the first page not subsequent pages. I am not using a static page. All the same, thank you….but I wished it worked for all pages

It’s working fine for me on all blog pages.

Could you please share me the page URL from your site where it’s not working so that i can troubleshoot it?

11

My URL is http://howtotechnaija.com (I gave you guys credit for the theme on the ABOUT US page). I allowed 5 posts to show on the first page, so others enter the next pages. I switched back to the default one colum since other pages were not showing in grid format. Should I put the custom CSS code back?

12

It’s working perfectly now. Thank you.

13

Hello, I am really interested in this as well. I tried it out but my page got all messed up. Can you please help me with this, as this makes my blog perfectly as I want it if I get it to work.

Best regards
Orlando

14

@biodun You are always welcome here :slight_smile:

15

@owlando

To help us keep support thread separates could you please create your own thread for your question here https://colorlibsupport.com/c/sparkling/ instead of replying on others thread as it makes the thread messy and hard to read.

If you want to you can also add reference of this thread in your newly created thread.

We would be more than happy to help you on your new thread.

16

How to display a much small thumbnail and blog short description in one row/div,so then will display more blogs on the screen rather than only on blog and big thumbnail now?

17

@blockchain To help us keep support thread separates could you please create your own thread for your question here https://colorlibsupport.com/c/sparkling/ instead of replying on others thread as it makes the thread messy and hard to read.

If you want to you can also add reference of this thread in your newly created thread.

We would be more than happy to help you on your new thread.