Creating a grid page on my wordpress site

Hi I'd really like to create a page with a similar look to this http://www.michaelaboehm.com/workshops/- could someone advise how I would create a grid like this? Not sure where to start.

  • Tyler Postle

    Hey Prue,

    Hope you're doing well today and thanks for your question!

    What does your page look like now? A lot of the time you can do this with CSS by adjusting the width and margins of your post entries.

    For example, if you have a full width page and your blogs are listed 1 after the other, then you can float them left and give them 33% width so you get 3 columns.

    .post {
    float: left;
    width: 32.2%;
    margin-right: 1.1%;
    margin-bottom: 11px;
    }

    That .post is just an example, depending what classes your page uses for it's entries it would be different. The above code is what the site you linked to uses.

    If you aren't too comfortable with code yet, then the best place to start is with a page builder. It will create the columns and everything for you :slight_smile: you just need to tell it what you want where.

    We have a nice article on 3 page builders you could check out: https://premium.wpmudev.org/blog/3-wordpress-page-builder-plugins/

    There are a ton of others you can look up too! They can be pretty handy.

    If you wanted to dive into the code a bit more then you could check out our tutorial on how to build your own page template without a page builder: https://premium.wpmudev.org/blog/wordpress-custom-page-template/

    Hope that helps Prue :slight_smile: Let us know if you have any further questions!

    Cheers,
    Tyler

    PS. If you link us to the page you want to make into a 3 column grid then perhaps we can offer up some custom code to make it work for ya.

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.