Changing Font On Announcement Bar, Scrolling Text, subscription text

Changing Font On Announcement Bar, Scrolling Text, subscription text

gigloinspriga
Tourist
9 0 1

Hi, 

 

I am trying to change the font on my:

  1. announcement bar
  2. scrolling text
  3. slide out nav menu pages (under the hamburger: FAQ and recipes)
  4. email subscribe text/button text

I'm using an app to change the font on the rest of the site but it's not updating those items.

 

site is here. PW is: shopifyhelp

 

Thank you.

Replies 5 (5)

sakinur-rahman
Shopify Partner
139 17 22

It require much code. You may DM me

Need a Shopify developer? Chat on WhatsApp


- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications -

Your Coffee Tip and my code, A perfect blend. ❤️ Buy Me A Coffee


Website: HelloSakin.com

ZestardTech
Shopify Partner
6056 1082 1452

Hello @gigloinspriga 
Which font you want to use.



Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
gigloinspriga
Tourist
9 0 1

Hi, I'd like to use MEMORIES-REGULAR that I have uploaded in the assets folder, thank you.

websensepro
Shopify Partner
1854 215 260

Hi Gigloinspriga,

you've already uploaded the font file (MEMORIES-REGULAR) to your assets folder, you can reference it in your CSS. Here's a step-by-step guide:

 

1. Access Your Shopify Admin

2.  Go to Theme Editor

3. Edit Code

4.  Locate the CSS File

5.  Add CSS Styles for Custom Fonts

Add the following CSS code to apply your custom font (MEMORIES-REGULAR) to the specific elements:

 

/* Announcement Bar */
.site-header__announcement {
  font-family: 'MEMORIES-REGULAR', sans-serif; /* Adjust as needed */
}

/* Scrolling Text (if using a separate app or script) */
/* Replace .scrolling-text-class with the appropriate class */
.scrolling-text-class {
  font-family: 'MEMORIES-REGULAR', sans-serif; /* Adjust as needed */
}

/* Slide-out Navigation Menu Pages */
/* You may need to inspect the elements to find the appropriate selectors */
.slide-out-nav-menu .page-link {
  font-family: 'MEMORIES-REGULAR', sans-serif; /* Adjust as needed */
}

/* Email Subscribe Text/Button Text */
/* Replace .subscribe-text-class and .subscribe-button-class with the appropriate classes */
.subscribe-text-class, .subscribe-button-class {
  font-family: 'MEMORIES-REGULAR', sans-serif; /* Adjust as needed */
}

 

You may need to inspect the HTML or use your theme's documentation to find the correct class names.

 

Save Changes.

 

 

Need a Shopify developer? Hire us at WebSensePro For Shopify Design Changes/Coding
For Free Tutorials Subscribe to our youtube
Get More Sales Using Big Bulk Discount APP
Create Your Shopify Store For Just 1$/Month
Get More Sales Using Big Bulk Discount APP

PageFly-Richard
Shopify Partner
4902 1102 1776

Hi @gigloinspriga 

 

This is Richard from PageFly - Shopify Page Builder App

 

Please add this code to your theme.liquid above the </head> to get this solved

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: click on theme.liquid and paste the code above the </head>

<style>
.announcement-bar p, .main-logo-slide-text, .newsletter-container .h5, .input-group-btn .btn-contact,.sidebar-menu-item-parent a {
    font-family: 'memories-regular' !important;
}
</style>
 

 

Hope this can help you solve the issue 

 

Best regards,

Richard | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


➜ Optimize your Shopify store with PageFly Page Builder (Free plan available) 


All features are available from Free plan. Live Chat Support is available 24/7.