I’m trying to change the width of the blog pages on my site. I use Impulse theme. Does anyone know how to do this? Any help would be massively appreciated - thank you!
Hello @Wildworx ,
Please share your blog page’s URL and if your store is password protected then please provide a password too.
So that we can help you.
Thank you.
Thank you, article page: https://wildworxcustoms.com/blogs/campervan/swamper
Hello @Wildworx,
I checked your article page and found that if you remove this “page-width–narrow” class from your div.
Before removing class:
After removing class:
Please check and let me know if this works for you.
If this affects other pages then add the below condition inside your div.
Condition: {% if template != ‘article’ %}page-width–narrow{% endif %}
Let me know if you need other help.
Are you trying to change the width of your blog archives (landing page - https://wildworxcustoms.com/blogs/campervan) or the blog posts https://wildworxcustoms.com/blogs/campervan?
I’m assuming you’re familiar with HTML but if you’re not entirely sure what you’re doing reach it’s probably best to reach out to a dev.
To change the width of your blog post in Shopify using the Impulse theme, you will need to edit the liquid files and change some HTML and CSS. Here’s a step-by-step guide on how to do that:
- Log into your Shopify store and go to the “Themes” section.
- Find the Impulse theme you are using and click on the “Actions” button, then select “Edit code”.
- In the left-side panel, navigate to the “Sections” folder and find the “blog-posts.liquid” file.
- Look for something like the following code in the “blog-post.liquid” file (note you might have other classes too):
-
You can modify the width of your blog by adding a new CSS class (If you haven’t already create a new file in “Assets” called custom “custom-css.css”). For example, to set the width of your blog to 1200 pixels, you can add the following CSS code to that file:
.page-width-blog {
max-width: 1200px;
} -
You will most likely need to add a @media queries for mobile etc in the CSS file.
-
Replace the “page-width” class in “blog-post.liquid” with the “page-width-blog” class, it should look something like this:
Save your changes and refresh your blog page to see the new width in action.
Note: Before making any changes to your theme files, it’s a good idea to make a backup of your theme or download a copy of the file to your computer. This will allow you to revert to the original code if something goes wrong.
Again I want to reiterate that this is just a quick guide on the steps involved but I strongly recommend not trying this on your own unless you understand CSS and HTML otherwise you could make your site look worse.
Happy to help further as I customise Impulse Themes every day 
