Pique theme blog layout

elizm66 · Member · Mar 7, 2017 at 2:32 pm
Copy link

Add topic to favorites
Hi,

I’m using the Pique theme, and whilst I love the Home page panel layout, I’d prefer the Blog page to display as a grid of the different posts, rather than each blog taking up the full-width page in the list. Is there a way to adjust this in the HTML code please?

Thank you!

The blog I need help with is: (visible only to logged in users)
staff-loquaciousloon · Staff · Mar 7, 2017 at 8:20 pm
Copy link
Hi @elizm66!

Grids can be tricky sometimes – generally, it’s best to choose a theme that already has one built in:
https://wordpress.com/themes/filter/grid-layout/

since adapting a non grid theme’s layout can be problematic at times.

If you wanted to try to adapt Pique, it would require using Custom CSS, which is part of a Premium Plan or Business Plan.

In that case, you could try the following CSS. You may run into the occasional alignment glitch on some screen sizes, depending on how long certain posts are on the page, and where they land in the listing:
```
@media screen and ( min-width: 600px) {
    .blog .pique-panel {
        width: 50%;
        float: left;
    }
}
@media screen and ( min-width: 1000px) {
    .blog .pique-panel {
        width: 33.333%;
        float: left;
    }
}
```
If you try it out, let me know how it goes! :)
elizm66 · Member · Mar 8, 2017 at 8:10 am
Copy link
Thanks Chad!

Pique does have a grid page layout built in, I’ve used it as part of the main homepage within a couple of the panels – so theoretically it should render as well as those, but unfortunately it doesn’t look like it works for the Blog page (I’ve applied the Grid layout option already)?

In fact I chose Pique as the only theme (paid or otherwise) I could find that had the variety of layouts (inc. grid) that I could use either as panels in a scrolling homepage (I love this feature in particular!) or as pages in their own right – do you know of any please? If not, I guess I’ll have to start editing CSS!

Cheers,
Elizabeth
staff-loquaciousloon · Staff · Mar 8, 2017 at 5:43 pm
Copy link
theoretically it should render as well as those, but unfortunately it doesn’t look like it works for the Blog page (I’ve applied the Grid layout option already)?

Correct. The blog page has its own, automatic template that overrides the settings on the page itself.

Hm. A grid page template that can be pulled into a panel isn’t a common combo (though I agree, it is a cool one), so CSS will likely be your best bet :)

No items found.