Personalized checkout and custom promotions with Shopify Scripts
Page url 541460-60.myshopify.com
pass: pialaw
I want to use multiple fonts on different pages.
For example Times New Roman on the Home page
and Ariel on the Collection Page.
I am really new to code and have no idea how to go about this. Any help is appreciated, if need you can contact me on discord at: tcwhyte
Solved! Go to the solution
This is an accepted solution.
@HJGtry this one
Step 1. Go to Admin -> Online store -> Theme > Edit code
Step 2. Find the file theme.liquid
Step 3: Add this code before </body>
<style>
{% if template.name == 'index' %}
body * {
font-family: 'Times New Roman', serif!important;
}
{% elsif template.name == 'collection' %}
body * {
font-family: 'Arial', sans-serif!important;
}
{% endif %}
</style>
If it helps you, please like and mark it as the solution.
Best Regards 😊
B2B Wholesale Solution: Streamline your B2B operation with advanced features like wholesale registration forms, custom pricing.
B2B Portal, Quote, Net 30: Speed up purchasing and streamline your quotation process with advanced features like quick order, request for quote.
B2B Lock Password Protect: Easily control access to pages, products, and pricing with robust features.
BSS Commerce - Full-service eCommerce Agency I Use Shopify for 1$ in the first month now
This is an accepted solution.
@HJGtry this one
Step 1. Go to Admin -> Online store -> Theme > Edit code
Step 2. Find the file theme.liquid
Step 3: Add this code before </body>
<style>
{% if template.name == 'index' %}
body * {
font-family: 'Times New Roman', serif!important;
}
{% elsif template.name == 'collection' %}
body * {
font-family: 'Arial', sans-serif!important;
}
{% endif %}
</style>
If it helps you, please like and mark it as the solution.
Best Regards 😊
B2B Wholesale Solution: Streamline your B2B operation with advanced features like wholesale registration forms, custom pricing.
B2B Portal, Quote, Net 30: Speed up purchasing and streamline your quotation process with advanced features like quick order, request for quote.
B2B Lock Password Protect: Easily control access to pages, products, and pricing with robust features.
BSS Commerce - Full-service eCommerce Agency I Use Shopify for 1$ in the first month now
Hi @HJG,
To make this happen you need to add a small css code in your theme file. for that follow below steps,
From Shopify backend
1. Online Store -> Themes -> "..." -> Edit Code
2. In Edit Code -> "assets" directory -> "theme.css" file.
3. Open the base.css file and add the following code at the end of the file:
for this, you can upload the fonts in the assets directory as well as in Content -> Files
If you upload it in the assets directory then use this code:
@font-face {
font-family: "Font name";
src: url("{{ '[font-file-name]' | asset_url }}") format("[font-format]");
}
If you upload it in the Content -> Files then use this code:
@font-face {
font-family: "Font name";
src: url("{{ '[font-file-name]' | file_url }}") format("[font-format]");
}
replace it with correct name for the things given in [].
Now you can style a class name for which you need the custom font.
4. Save the file and reload your website.
I hope this helps! If it does, please like it and mark it as a solution!
If you need further assistance, feel free to reach out!
Regards,
Sweans
We recently spoke with Zopi developers @Zopi about how dropshipping businesses can enha...
By JasonH Oct 23, 2024A big shout out to all of the merchants who participated in our AMA with 2H Media: Holi...
By Jacqui Oct 21, 2024We want to take a moment to celebrate the incredible ways you all engage with the Shopi...
By JasonH Oct 15, 2024