Shopify themes, liquid, logos, and UX
I have managed to import external OTF fonts into the assets folder and use them in custom blocks in my product page. I am looking to use these external fonts on blocks such as Description, to allow the text content to be edited from the customise tab.
Hiii @NativeHealth_R
You can try this code by following these steps:
1. Download the Webfont version of your font.
2. The font files must have the WOFF and WOFF2 file types includedFrom the Shopify dashboard, go to Online Store, click Actions > Edit Code.
3. Add a New Asset. Choose your Font file and click Upload Asset
4. choose Assets>theme.scss.liquid
5. Go to the bottom of this file to add the new code to your theme
@font-face {
font-family: myFirstFont;
src: url(sansation_light.woff);
}
6. Use above font-family name(myFirstFont) wherever you want this fonts
Where do i edit the CSS for the product button? I would appreciate information on how to edit existing NON-custom shopify blocks (eg: buy button, description, heading)
We have purchased the beyond theme, it does not contain theme.scss.liquid, it has theme--critical.css.liquid and theme--async.css.liquid
You have to pick that particular classes where you want to apply this font-family css.
except for external fonts, css doesn't work on existing shopify blocks
Unless i remove the "data-item" tag in the .liquid file
for eg:
User | RANK |
---|---|
169 | |
151 | |
70 | |
46 | |
34 |
Thanks to all Community members that participated in our inaugural 2 week AMA on the new E...
By Jacqui Mar 10, 2023Upskill and stand out with the new Shopify Foundations Certification program
By SarahF_Shopify Mar 6, 2023One of the key components to running a successful online business is having clear and co...
By Ollie Mar 6, 2023