DAWN 5.0.0. How do I center all Titles?

How do I center all the titles on Dawn? And center a title of a specific section?

I read a previous question which mentioned putting a

in the liquid file of a section,

And another question mentioned adding

.title-wrapper–no-top-margin>.title {text-align: center;} to the base.css file, but that only centers the Featured Collection.

rosesands.myshopify.com password: website

Thank you.

1 Like

Hi @Smiley1311 ,

I don’t know if I understood exactly what you mean with “center all the titles on Dawn” and “center a title of a specific section”.

The issue you may be facing is that in some cases changing the fonts in some elements may be enough in others you may need to change the flex container where the font element is.

I present here two solutions for you to test them and see the one that works best.

  • Solution 1 will center all titles inclusive the product titles, but not the price, because it will center all the heading elements using h2 and h3;
  • Solution 2 will center only the titles of the “featured collection” and “collection list” sections in the homepage. You can test both, see if it works, if not let me know exactly what you want to change.

Go to the code editor, click on Assets > base.css and in the end of the file copy this code click save and preview the result.

Solution 1

h2,
h3 {
  text-align:center;
}

.title-wrapper-with-link {
    justify-content: center;
}

Solution 2 (if you want to test this solution erase the code of solution 1)

.title-wrapper--no-top-margin>.title {
    text-align: center;
}

@media screen and (min-width: 990px)
.title, .title-wrapper-with-link {
    text-align: center;
}

.title-wrapper-with-link {
    justify-content: center;
}

Note: It is a good practice to make a backup version of your site, avoid working in the original version

I hope this helps!

All the best, Bruno

OUTSIDEGRID

hello@outsidegrid.com

You can find more solutions in my blog or in my Youtube channel

3 Likes

@OUTSIDEGRID Thank you. Much appreciated. The first solution was perfect but I will also keep the second solution in mind.

1 Like