How to change blog format- Brooklyn Theme

[MarkKatzPhotos]

Hello,

I would like to change my current blog page format, to make the photos smaller, and to fit several blog posts on each row. I would also like to change the title. It currently is entitled “News” with an RSS symbol next to it. Any help with this would be much appreciated. Thank you.

Website: www.markkatzphotography.com

Best,

Mark

[BSS-Commerce]

Hi @MarkKatzPhotos

Please follow these steps:

1. Go to Shopify admin → Online store → Edit code:


2. Find the timber.scss file and add the following code at the end of the file:

.grid__item.large--five-sixths.push--large--one-twelfth {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 50px;
}
.section-header, .pagination{
	grid-column: 1 / span 3;
}
hr.hr--clear{
	display:none;
}
.date {
    width: max-content;
}

3. Next, you need to remove this width attribute to make the text look more reasonable:

@media only screen and (min-width: 769px)
.large--six-tenths {
    /* width: 60%; */
}

• Here is the result:

Regarding your title, can you give me more of what you are looking for? We will check it for you.

I hope that this will work for you.

[LisanneH]

Thanks, the first code works perfectly for switching the fonts (which was one of my problems). I don’t really understand the third point, about removing the width. I can’t find that part in the timber.scss file. At this moment my whole blogpost is only showed on the leftside of my screen, squeezed together. Will the third point fix that or do I need to do something else? Is there also a solution for the big white space under the title? I would like to start my text or a picture higher. Here is the example link (I don’t have a blog online yet): https://rh941s43p4wbqhk0-35057991819.shopifypreview.com/blogs/how-to-give-your-new-pet-a-warm-welcome/articles?preview_key=fe209e8aa3f1ce7e3ec82505ad58e3fb

Thanks in advance!