Shopify themes, liquid, logos, and UX
hye
how can i change and add font for my entire store. Also i want to change anouncement bar's text to Bold font and want to add social icons in announcement bar which is on the top.https://37e364.myshopify.com/?_ab=0&_fd=0&_sc=1
thanks
what font you want to use?
Go to "Online Store" > "Themes" > "Customize.
You may need to use custom CSS. In the "Additional CSS" section, add:
body{
font-family: 'as you like font';
}
Hi Zikriarathore,
Go to "Online Store" > "Themes" > "Customize.
You may need to use custom CSS. In the "Additional CSS" section, add:
.announcement-bar {
font-weight: bold;
}
body {
font-family: 'Your Chosen Font', sans-serif;
}
If I managed to help you then, don't forget to Like it and Mark it as Solution!
You can add code by following these steps
1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file
3. Paste the below code before </body> on theme.liquid
<style>
p.announcement-bar__message.h5 span {
font-weight: 700 !important;
font-size: 20px !important;
}
</style>
For social media icon you have to add custom code in anouncement.liquid file
custom code:
For example
<div class="socialMediaWrapper">
<p>
<a href="https://facebook.com/your-page" target="_blank"><i class="fab fa-facebook"></i></a>
<a href="https://twitter.com/your-handle" target="_blank"><i class="fab fa-twitter"></i></a>
<!-- Add more social icons as needed -->
</p>
</div>
where is this file announcement.liquid and where to add this code ?at the end?
Hey @zikriarathore , you can add me as staff, i will help you with that, by following shopify community rules i cnt share my details here, you can find it from my signture. i will be waiting.
Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025Expand into selling wholesale with Shopify Academy’s learning path, B2B on Shopify: Lau...
By Shopify Jan 28, 2025