IsoTech Shopify Theme
Try IsoTechDemos
  • What is IsoTech theme?
  • CHANGE LOG
  • Support Policy
  • Refund Policy
  • Getting Started
    • How to install IsoTech Theme?
    • How to set up your store as a IsoTech demo?
    • How to update IsoTech Theme?
  • Header Group
    • What is a header group?
    • Announcement bar
    • Header
    • Menu
      • How to create menu?
      • How to add a dropdown menu
      • How to add a mega menu (Promo banner)
      • How to add a mega menu (Collections)
      • How to add a mega menu (Products)
      • How to add a mega menu (Banner)
  • Footer Group
    • What is a footer group?
    • Footer
    • Mobile navigation bar
    • Popup
  • Theme Sections
    • How to add a section?
    • Slideshow
    • Featured collection
    • Collection list
    • Before/after image slider
    • Scrolling text
    • Shop the lookbook slider
    • Shop the look
    • Lookbook
    • Banner list
    • Product tabs
    • Featured product
    • Gallery
    • FAQ / Collapsible content
    • Image banner
    • Image with text
    • Multicolumn
    • Featured promotion
    • Video
    • Video hero
    • Testimonial
    • Text with banner masonry
    • Text with banner grid
    • Tiktok
    • Logo list
    • Image with biography
    • Google map
    • Counter up
    • Countdown banner
    • Contact info with map
    • Collection product banner
    • Contact form
    • Email signup
    • Rich text
    • Blog list
    • Welcome video
    • Page
  • Theme Settings
    • General
    • Layout
    • Colors
    • Typography
    • Product card
    • Color swatches
    • Quick shop
    • Wishlist page
    • Social media
    • Cart
    • Search
    • Customer/account
    • Checkout
    • Custom css
  • Collections & Products
    • Product page
      • Create a product template
      • Page sections
        • Page title banner
        • Product template
        • Product recommendations
        • Product Tabs
        • Recently Viewed Product
    • Products
      • Add local pickup to your store
      • Add product to your store
      • How to add a unique tab on the product page
      • Add a countdown timer to the product
      • Show a custom badge to your product
      • Add a product short description using a metafield
      • How to add a size guide popup for the individual product?
    • Collection page
      • Add Collections
      • Create a collection template
      • Page sections
        • Page title banner
        • Collection banner
        • Product grid
    • Collection list page
      • Add Collections
      • Page sections
        • Collection page title banner
        • Collection list section
  • Other Pages
    • Create a page
    • Create a page template
    • Blogs
      • Add blog post
      • Blog page
    • Blog posts / Article
    • Cart page
    • Search page
    • 404 page
    • Password page
    • Wishlist page
    • Compare page
  • Language & Countries/Regions
    • How to enable the COUNTRY/REGION of your store?
    • How to enable LANGUAGE of your store?
    • How to edit default theme content
    • How to translate theme for multiple languages
  • General Topics / FAQ
    • How to add a collection to your store?
    • How to enable free shipping bar
    • How to enable the pre-order product to your store
    • How to add product reviews to your store
    • How to add Complementary products
    • Add a gift wrap option to your cart
    • How to add a product to your store?
    • Add Shopify 2.0 storefront product filtering
    • Add recommended products to your store
    • Set up local pickup
    • How to enable a customer account?
Powered by GitBook
On this page
  • Body font
  • Custom font settings
  • Headings font
  • Buttons settings
  1. Theme Settings

Typography

PreviousColorsNextProduct card

Take the following steps:

  1. In the theme editor (Customize), click Theme settings

  2. Locate Typography settings

  3. Make the necessary adjustments.

  4. Save

The importance of typography cannot be overstated when it comes to influencing the overall appearance and impression of a website. In this article, we will guide you through the process of modifying the typography of your online store.

Body font

You have two options when it comes to selecting fonts for your website: utilizing the pre-existing fonts available in the library or using custom fonts. If you prefer to use custom fonts, please follow the steps outlined below:

Custom fonts guideline

Allow multiple links, each on a separate line. Please upload the font to Shopify files and copy and paste the link into the empty field. These formats TTF, OTF, WOFF & WOFF2 are supported.

Font_URL@font_weight&Font_URL@font_weight (You must follow this format)

Custom font settings

Settings
Description

Use custom font

You need to enable it to use custom font

Font URL

  1. You need to first upload fonts to the Shopify file

Body font weight

You can change the font weight of the custom font for the body text.

Body font size

You can increase/decrease the font size using percentages.

Letter spacing

You can add Letter spacing for the body text

Headings font

Follow the instructions

Similar to the body font, you can include a heading library/custom font, as well as font size, font weight, and letter spacing.

Buttons settings

Settings
Description

Button font size

You can increase/decrease the font size using percentages.

Border Width

You can change border width

Border Radius

You can change border for all the buttons

Letter spacing

You can add a letter spacing for all the buttons

Text transform

You can text transform the following options, "Default, Uppercase, Lowercase, Capitalize"

@400&@700

2. Following the format, "Font_URL@font_weight&Font_URL@font_weight" Put the URL in the "Font URL" field

https://cdn.shopify.com/s/files/1/0029/1101/0929/files/Jost-Regular.ttf?v=1687278895
https://cdn.shopify.com/s/files/1/0029/1101/0929/files/Jost-Bold.ttf?v=1687279173