Blog page with - Horizon theme

Technical Q&A
,
1

Good evening everyone,

The main blog content on the Horizon theme is very narrow, limited to 980px. I’ve tried to make it full-width, but without success. I even tried modifying the block and section code, but nothing changed. I’ve already asked Gemini and Claude, but none of their suggestions worked.

Has anyone else faced this issue and managed to fix it?

Thanks!

2

Hey @tkev69150

Follow these Steps:

  1. Go to Online Store
  2. Edit Code
  3. Find theme.liquid file
  4. Add the following code in the bottom of the file above </ body> tag
<style>
.blog-post-content {
    max-width: 100% !important;
}
</style>

RESULT:

image
image1473×906 84.1 KB

Hope that helps! If it did, a Like and Marking it as Solution goes a long way and helps others find the fix faster too.

Best,
Moeed

3

Hey @tkev69150
Go to Shopify Admin
Open Online Store → Themes
Click ⋯ three dots → Edit code
Open Assets → base.css (or theme.css if base.css is not available)

Paste this code:

.page-width {
max-width: 100% !important;
}

And then click on save button
This wil remove 980px width limit and make you blog content full width in most shopify theme

Thank You!

4

I think the reason your code changes aren’t working is because the Horizon theme wraps its blog post articles in a strict global layout container.

Even if you force the internal blog section or blocks to be wider, the parent layout wrapper overrides your changes and keeps the content locked at its default width.

5

Hi @tkev69150

Please share your store URL and password (if it’s password-protected) so that I can review it and provide you with the most accurate solution.

Best regards,
Devcoder :laptop:

6

Thanks a lot, it works

7

Thank you for your reply. I’m glad to hear that the solution worked well for you. If you require any more help, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated.