MINIMAL - HOW DO YOU CENTRE A 'COLLECTION' 'TITLE' - HOME PAGE

New Member
10 0 0

Screenshot 2019-08-31 at 18.33.25.png

0 Likes
Highlighted
Shopify Staff
Shopify Staff
81 8 15

Hey, @RogueButton!

 

My name is Lilith, I'm on the Social Care team at Shopify.

 

I'd like to ensure that you're aware that small customizations like this might be able to be covered under our Shopify Design Policy. In order to find that out, we'd have to take a look at your account and check for eligibility for coverage of these small tasks.

 

That said, if you'd rather do this on your own and are comfortable with HTML/CSS and Liquid, you can follow the below instructions to achieve your style change.

 

Warning: Making changes to the following CSS sections aren't reversible nor covered by support if a mistake is made. Please make a duplicate copy of your theme before making these changes.

 


 

Step 1

 

Head over to your Themes section in your Shopify Admin by going to Online Store > Themes.

 

Then, you'll click on Actions > Edit Code

 

 

alt

 

 

This will open up your code files for the theme.

 

Step 2

 

Select the Assets folder and open up timber.scss.liquid

 

 

alt

 

 

Step 3

 

You'll need to find this specific line:

 

.section-header--small

 

To make it easy you can use the search function on your computer and paste this into the search field. On a Mac, you'll press ⌘ + F; on a PC, you'll press Ctrl + F.

 

This should show up approximately around Lines 1900 - 2100. This might be different on your side, but this might help point you in the right location.

 

 

alt

 

 

The section here is the specific line that manages how your section titles on your homepage show up. We'll modify the style in the next step.

 

Step 4

 

We're going to now change this code:

 

.section-header--small {
  margin-bottom: 0;
}

 

To make the headers centered and override any styles that apply to all headers, we'll add an alignment snippet to center it and override as a priority style for this header by adding !important to the line. See the below code to see what the new snippet should look like:

 

.section-header--small {
  text-align: center !important;
  margin-bottom: 0;
}

 

Hit Save and it should now look like this:

 

 

alt

 

 

Open up your theme editor or refresh any pages that already have your theme open.

 

Result

 

You should now consistently see all of your headers centered on your homepage sections:

 

 

alt


 

An alternative solution to this would be to use our other free theme, Debut. Debut comes with all accounts on Shopify as the default theme, however, you can download the more up to date version by going to the theme store.

 

Debut has all of the sections on the home page centered and also allows you to add several other sections to the homepage that Minimal may not have. Minimal is a great simplified and clean theme. However, if you have specific features that you might need, you're likely to find those in Debut or other themes. You can take a peek at the demo of this theme as well anytime if you'd like to see an example of what it looks like.

 

Lastly, the other option is to hire a Shopify Expert to help you customize your theme to the specifications you wish. They're well versed with our themes and can certainly handle a wide array of small to complex customizations.

 

Let me know if that helped! I'm happy to answer any questions you think of as you work on your business.

Lilith | Social Care @ Shopify
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

0 Likes
New Member
10 0 0

Hello, Thank you for your response it was really helpful but for some reason this didnt work :/ any advice?

0 Likes
Shopify Staff
Shopify Staff
81 8 15

Hey, @RogueButton.

 

I've gone ahead and tested this again on several versions of the theme on different testing stores. It works every time.

 

Can you grab a screenshot of the whole page where you made the code changes? I can check to make sure it was added correctly.

 

In my previous response, I added a few alternative solutions as well if you've got a theme that contains many customizations already.

 

Let me know. Looking forward to helping once you've got that screenshot.

 

Thanks for the reply!

Lilith | Social Care @ Shopify
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

0 Likes
New Member
10 0 0

This is very weird. ive copied and pasted ive typed it in very careful and it wont work. For some reason 'Center' doesnt show red and it ruins my whole website. Luckily ive managed to reset it but copying and pasting the whole timber 5000line code so i can reset that but ill send a pic of what i copy and paste in/type in my self sometimes and what happens to my website

Screenshot 2019-09-03 at 18.04.25.pngScreenshot 2019-09-03 at 18.04.55.png

0 Likes
Shopify Staff
Shopify Staff
81 8 15

Hi @RogueButton!

 

Thanks for the screenshots on that there! This is super helpful to see what's happening.

 

There may be some custom code or app scripts that might be interfering with your theme. I'd love to take a close look at this. Since your theme is a free Shopify Theme, I'll be able to check in with our theme developers to help out with this and see if we can help you with this directly.

 

Anytime you've got a free theme that hasn't been customized, we're able to help cover some custom work and support on your theme. If you'd like, you can also keep our Shopify Design Policy handy for any future reference if you need to contact our Support channels anytime.

 

I've gone ahead and sent over an email to securely assist with this on your account. I'm looking forward to helping you with your theme!

Lilith | Social Care @ Shopify
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

0 Likes
New Member
10 0 0

hi im on a paid plan now. Is their any way for this to happen? :)

0 Likes
Shopify Staff
Shopify Staff
81 8 15

Hey, again! Of course, we can take a look at this. If you email me back through the email I sent over a couple weeks ago, I can get started on that for you!

 

I've sent over another email just in case you might not find the old one.

Lilith | Social Care @ Shopify
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

0 Likes