Center Page Titles

Highlighted
Excursionist
73 0 11

Hello,

I am using the minimal theme and am having trouble figuring out how to center page titles. To me, it just doesn't look right that everything else is centered except for that. I have searched and found references to doing this such as "just enter text-align:center;" but really, I'm an idiot when it comes to this.

Can someone walk me through it like as if they were teaching a 6 year old kid how to do this? I do know I have to go to page.liquid but beyond that, I am lost.

 

EDIT- I see that it is listing a site under my name that I will be closing down. That is not the site my question refers to so don't bother going there.

 

Thanks for any help I can get.

0 Likes
Highlighted
Shopify Partner
60 0 3

Start Off in dashboard

Goto ----> Themes

and then ----> Template Editor

Find your page.liquid under Templates

Find the following code

<h1>{{ page.title }}</h1>

and replace it with this

<center><h1>{{ page.title }}</h1></center>

that should work let me know if there is a problem

Spellmann & Associates Web Developer www.ericspellmann.com
2 Likes
Highlighted
Excursionist
73 0 11

Thanks for trying to help but it didn't work.

What I have is this now: <center><h1 class="p25">{{ page.title }}</h1></center>

But after saving and then checking, it didn't do anything.

0 Likes
Highlighted
Shopify Partner
60 0 3

Let me take a look at your site

Spellmann & Associates Web Developer www.ericspellmann.com
0 Likes
Highlighted
Shopify Partner
60 0 3

Ok under your style sheet under assets you should see the following code

.page-header h1{
  font-size: 24px;
  font-weight: normal;
  }

you will need to add the following

text-align:center;

so the finished product will look like this

.page-header h1{
  font-size: 24px;
  font-weight: normal;
  text-align:center;
  }

 

Spellmann & Associates Web Developer www.ericspellmann.com
0 Likes
Highlighted
Shopify Partner
60 0 3

that should work to center your page titles I already reporduced the desired results let me know if that does it thanks

Spellmann & Associates Web Developer www.ericspellmann.com
0 Likes
Highlighted
Excursionist
73 0 11

I can't find that anywhere under assets/styles.

If you went to the page listed under my name, that is not the page I am trying to alter...not sure if that matters or not.

At any rate, I thank you for trying to help me but I have to leave for the day. I may mess around with it later at home.

0 Likes
Highlighted
Shopify Expert
9933 106 1766

Do not use the <center> tag as mentioned above. That's been depreciated from the html spec years ago and is not even supported in html5. 

If you are just wanting this to effect the titles on pages only consider adding this to the bottom of your stylessheet (styles.css.liquid):

#page h1{ text-align:center } /* change the page titles to be be centered */

It's also recommended that you make a theme copy so you can tinker with the code, without breaking the master template.

 

★ Winning Partner of the Build a Business competition. ★ http://freakdesign.com.au
1 Like
Highlighted
Excursionist
73 0 11

Thanks, that did help.

Though I have discovered that it didn't help what I was specifically looking for. Page titles now center EXCEPT on the home page. I have an welcome type page showing on my home page just above a collection of items and I was hoping that page title would center there but it doesn't. I suppose that is hidden somewhere and I am off to look for it now.

0 Likes
Highlighted
Shopify Expert
9933 106 1766

The home page does not use the page template as it's an index (index.liquid) so this makes sense.

You could be brave and just drop the "#page" from the css selector so it's just "h1". This might effect things you don't want but it could also be perfect. A quick test should answer that for you.

★ Winning Partner of the Build a Business competition. ★ http://freakdesign.com.au
0 Likes