Capitalise Titles & Buttons - (Refresh Theme)

Store Design
, , ,
1

Hello,

I would like all the page titles and text on the buttons on my store to be capitalised. I have manually done this for some titles and buttons via the language section however was wondering if theres any code I could input to handle the rest of the titles and buttons that I cannot locate myself.

Would also be great if there is any code I can input to make all button text bold font weight.

Thanks in advance!

Here is my store for reference:

www.mmmtrading.co.uk

2

@mmmtrading
put below css into base.css file (online store->theme->asset->base.css)

h2.banner__heading.h0 {
    text-transform: uppercase !important;
}
h2.image-with-text__heading.h1 {
    text-transform: uppercase ;
    font-size: 41px !important;
}
h1,h2
{
    text-transform: uppercase !important;
}
button {
    font-weight: bold !important;
}
3

Didn’t work unfortunately

4

Hello @mmmtrading

I would like to give you a solution to support you

you can try again with the following code:

h2.banner__heading.h0 {
    text-transform: uppercase !important;
}
h2.image-with-text__heading.h1 {
    text-transform: uppercase !important;
}
h1,h2, .button
{
    text-transform: uppercase !important;
}

Hope my solution can work and support you!

Kind & Best regards!

GemPages Support Team.

5

Hey,

Thanks this has worked for the headings however some buttons are still not capitalised nor bold.

For example on the account page the ‘Sign In’ button hasn’t changed.

6

@mmmtrading You can updated this code:

h2.banner__heading.h0 {
    text-transform: uppercase !important;
}
h2.image-with-text__heading.h1 {
    text-transform: uppercase !important;
}
h1,h2, .button, button
{
    text-transform: uppercase !important;
}
7

Thanks

This has worked however the button is still not bold yet.

Is there any code I could input for this?

8

@mmmtrading

i updated bold text:

h2.banner__heading.h0 {
    text-transform: uppercase !important;
}
h2.image-with-text__heading.h1 {
    text-transform: uppercase !important;
}
h1,h2, .button, button
{
    text-transform: uppercase !important;
    font-weight: 700 !important;
}
9

Thank you so much!