Craft Theme View All Blog Posts Not Working

Store Design
,
1

I am using the craft theme and have written 6 blogs, however only 4 of these are visible. I have enabled the view all button but when this is clicked it only displays the same 4 blogs. I can not see all blogs on a single page.

https://loveandtiers.co.uk/blogs/news

Please could someone tell me how i can get all blogs visble on a single page, thank you.

2

Hello @loveandtiers :waving_hand:

I just checked the page and it seems the View all button just redirect to https://loveandtiers.co.uk/blogs/news and nothing else. So it does not help at all.

Please check to make sure all 6 blog posts are visible, and have been assigned to the blog category News, then test again.

3

Thanks for responding so quickly, apologies for the delay in testing this solution. I checked and all blogs have been set to the correct category, however i had hidden the default section on the relevant template page for some reason and added another blog section below on the the template. Removing the secondary section and turning the blog posts to visible has enabled all published post to be visible. Thanks for the help.

I am wondering however if there is a way to make the card smaller, e.g A 3 or 4 grid rather than the two grid as the post look rather large on the page.

Thanks in advance for your response.

4

Hi @loveandtiers

If you want the 3 columns grid, add this CSS code to base.css

.blog-articles {
    grid-template-columns: 1fr 1fr 1fr !important;
}

To set it to 4 columns, use this code

.blog-articles {
    grid-template-columns: 1fr 1fr 1fr 1fr !important;
}
5

Thanks for the help, is there a way in which we can scale the overall product image down so that it displays the carousel below without the need for scrolling the page.

Please see two screens shots added below, please see the scroll bar on the right. Ideally i do not want to scroll to show the additonal image options. I hope this makes sense, thanks in advance.

loveandtiers_0-1704229703397.png
loveandtiers_0-1704229703397.png1920×963 201 KB

loveandtiers_1-1704229818307.png
loveandtiers_1-1704229818307.png1916×967 289 KB

6

I have also noticed that the overall size of the blog post image when reading the actual blog, appears large, please click on the below link.

https://loveandtiers.co.uk/blogs/news/cooking-up-joy-christmas-recipes-to-share-with-your-toddler

Is there a way in which this can be reduced in size approx by half?

Thanks in advance.

7

Hi @loveandtiers :waving_hand:

You can reduce the product image height by adding this code

.product__media {
    padding-top: 80% !important;
}

.product__media img {
    top: 50% !important;
    transform: translateY(-50%) !important;
}

You can reduce the blog post image size by adding this code

.article-template__hero-container {
    max-width: 72.6rem;
}