When you’re optimising your Squarespace website for mobile users, one of the things you might want to do is change the blog title size.

Just because you want to change it on mobile though doesn’t mean you want to change it on desktop too.

Well the good news is that you CAN change your blog title size on mobile only, you just need a little bit of code to help you out.

Watch the video

Check out the YouTube video below 👇

Navigate to your blog and switch to mobile view. Open up Google Developer Tools (Shift + Command + C) and find the block ID for your blog title.

Once you have the ID, head to Website > Website Tools > Custom CSS and paste in that ID along with the following custom code:

.blog-item-wrapper .blog-item-title h1.entry-title {

font-size: 20px;

}

You then need to wrap all of this in media tags to tell Squarespace that this is only to target mobile screen sizes:

@media screen and (max-width: 640px) {

.blog-item-wrapper .blog-item-title h1.entry-title {

font-size: 20px;

}

}

📩 Join the inner circle to get exclusive code updates

Once you’ve done that, hit save and you’ll have changed the blog title size on mobile only.

Your designer

I'm Sam, an award-winning Squarespace web designer. I have worked with every type of business, building platforms for solo entrepreneurs through to multi-million dollar corporations. If you want to discuss a potential project, you can email on sam@bycrawford.com or get in touch with me here. Alternatively, you can book in a free 15-minute consultation call here.

Want more?