Hello!
I´m adding my first blog post to my page and would like to make the text wider and change the font but I haven’t been able to find the solution online.
On the same line, as I’ve seen beautiful blog post on other Shopify pages I wonder why do I have only the option of “default blog theme”, how can I add new blog themes like in other themes for example Sense or Colorblock.
Thank you in advance
Hi @JoaoMaldini
This is Kate from PageFly - Landing page builder, I’d like to suggest this idea:
To edit the width of your text and change the font in the Shopify , you’ll need to access the HTML and CSS of your theme. You can do this by going to the “Online Store” section of your Shopify dashboard, clicking on “Themes,” and then clicking on the “Actions” button next to your “Default Blog Theme” and selecting "Edit code.
To add new blog themes to your Shopify store, you’ll need to add a free theme or purchase a new theme from the Shopify Theme Store or a third-party theme provider
Hope my answer will help you.
Thank you for answering, I know a little about coding, so what would be the part that I need to edit?
I have added new themes to shopify but it doesn’t change the option of blog themes (I added screenshots for references) The only option is default blog post.
Cheers
J
Hi @JoaoMaldini
If you’ve added new themes to your Shopify store but the option to select a different blog theme is not available, it’s likely that the themes you’ve installed do not include this feature. Not all Shopify themes include the option to choose different blog templates or styles, and some themes only offer the option to choose from a limited set of templates.
If you want to add more options for your blog theme, you can either:
Purchase a new theme that includes multiple blog templates or styles, or
Customize the existing “Default Blog Theme” by editing its HTML and CSS files.
Aah ok, i understand now, thank you. Going back to the original question, which part of the code should I edit and what is that code line I have to add in order to edit the width of the article’s text and to change the font?
Hi J, to change the width of the text in your blog articles and to change the font, you’ll need to make changes to the CSS (Cascading Style Sheets) code of your “Default Blog Theme.”
To find the CSS code for your blog articles, follow these steps:
Once you have opened the CSS file, you can change the width of the text by finding the CSS class that controls the width of the content area and adjusting its value. Here’s an example of what that code might look like:
.content-area {
width: 70%; /* change this value to increase or decrease the width */
}
To change the font, you can find the CSS class that controls the font-family and change it to the desired font. Here’s an example of what that code might look like:
body {
font-family: Arial, sans-serif; /* change this value to the desired font */
}
But doing so will change the whole of the pages’ settings, I’m looking just to change the blog article. Is there an option to do so?
I´ve solve it
For anyone out there interested, in the section-blog-post.css go to the line “.article-template__content {”
And add the following text so it should look like this:
.article-template__content {
width: 80%; /* or any other desired width /
max-width: 1024px; / or any other desired maximum width */
margin: 0 auto;
font-family: “Montserrat”, sans-serif;
}
I chose the Montserrat font you can pick any
cheerio!
hello !
i would like to add a code inside the blog default article ( i use Dawn on shopify ); can you please tell me where i can add this code?
many thanks
Benjamin