Happening now! Shopify Community AMA: PayPal Express Migration to Shopify Payments | Ask your questions to be answered by our team.

Re: Custom Font not working when signing up to newsletter

Solved

Custom Font not working when signing up to newsletter

Maiselnielsen
Excursionist
40 1 3

Hi, 

 

I have installed my own custom font but it isn't working two places 

 

1) When you type in your e-mail it shows in the wrong font. See attached.

 

2) And the QT selecter under every product and in check-out shows the QT in the wrong font. However this is ONLYE on mobile. See attached.

 

Otherwise the font is working well. 

 

www.linierelingerie.com

Password - xef84eju (the site is password protected) 

 

Thank you in advance. 🙂 

 

Skærmbillede 2024-09-23 kl. 12.56.53.pngIMG_5951.PNG

Accepted Solution (1)

Arif_Shopidevs
Shopify Partner
263 37 36

This is an accepted solution.

Step 1: Navigate to your Shopify admin panel and go to "Online Store."

Step 2: Click on "Themes" and then select  Edit code

Step 3:  Find base.css

 

.newsletter-form__field-wrapper .field__input {
    padding-right: 5rem;
    font-family: 'Glossy Display' !important;
}

 

this will solve your issues

Arif_Shopidevs_0-1727090170731.png



Thank you

Found it helpful? Please like and mark the solution that helped you.
Slider Revolution - Create sliders, theme sections, banners, videos, pages, advanced animation, and social feeds.
Essential Grid Gallery - Create photo galleries, video galleries, portfolio galleries, product gallery, collection gallery and more.
EasyDisplay: Product Showcase - Easily display collections, related products, discounts, recently viewed items, and best sellers

View solution in original post

Replies 8 (8)

Arif_Shopidevs
Shopify Partner
263 37 36

This is an accepted solution.

Step 1: Navigate to your Shopify admin panel and go to "Online Store."

Step 2: Click on "Themes" and then select  Edit code

Step 3:  Find base.css

 

.newsletter-form__field-wrapper .field__input {
    padding-right: 5rem;
    font-family: 'Glossy Display' !important;
}

 

this will solve your issues

Arif_Shopidevs_0-1727090170731.png



Thank you

Found it helpful? Please like and mark the solution that helped you.
Slider Revolution - Create sliders, theme sections, banners, videos, pages, advanced animation, and social feeds.
Essential Grid Gallery - Create photo galleries, video galleries, portfolio galleries, product gallery, collection gallery and more.
EasyDisplay: Product Showcase - Easily display collections, related products, discounts, recently viewed items, and best sellers
Maiselnielsen
Excursionist
40 1 3

Thank you! It works on desktop now but not on mobile. Anything I can do about that? 🙂 

Arif_Shopidevs
Shopify Partner
263 37 36
.newsletter-form__field-wrapper .field__input {
font-family: 'Glossy Display' !important;
}

this code will solve mobile 

Found it helpful? Please like and mark the solution that helped you.
Slider Revolution - Create sliders, theme sections, banners, videos, pages, advanced animation, and social feeds.
Essential Grid Gallery - Create photo galleries, video galleries, portfolio galleries, product gallery, collection gallery and more.
EasyDisplay: Product Showcase - Easily display collections, related products, discounts, recently viewed items, and best sellers
Maiselnielsen
Excursionist
40 1 3

Hm it didn't work. I keep the other code and added this. Should i replace the first code with this? 🙂 

Arif_Shopidevs
Shopify Partner
263 37 36

In that case use this code and try to clear your cache it must work.

.field__input, .customer .field input{
font-family: 'Glossy Display' !important;
}
Found it helpful? Please like and mark the solution that helped you.
Slider Revolution - Create sliders, theme sections, banners, videos, pages, advanced animation, and social feeds.
Essential Grid Gallery - Create photo galleries, video galleries, portfolio galleries, product gallery, collection gallery and more.
EasyDisplay: Product Showcase - Easily display collections, related products, discounts, recently viewed items, and best sellers
Maiselnielsen
Excursionist
40 1 3

Hmm weird. Still do not work. 

Arif_Shopidevs
Shopify Partner
263 37 36

which device you are checking.

Found it helpful? Please like and mark the solution that helped you.
Slider Revolution - Create sliders, theme sections, banners, videos, pages, advanced animation, and social feeds.
Essential Grid Gallery - Create photo galleries, video galleries, portfolio galleries, product gallery, collection gallery and more.
EasyDisplay: Product Showcase - Easily display collections, related products, discounts, recently viewed items, and best sellers
Maiselnielsen
Excursionist
40 1 3

Safari on iPhone 14 pro, also when i preview on mobile in google crome on desktop. 🙂