Openspaces Labs
  • 🏠 Getting Started
    • Installing the Plain Jane Theme
    • Theme Versions + Features Table
  • 🧰 Theme Settings
    • Announcement Bar
    • Animations
    • Cart Drawer
    • Clock Settings
    • Collection Layout Settings
    • Cursor Settings
    • Footer Settings
    • Global Menu Settings
    • Music Player Settings
    • Logo Settings
    • Skip Home Screen
    • SEO Settings
    • Main Theme Color
    • Typography Settings
  • 🗂 Pages & Menus
    • Homepage + Menu
      • Center Menu
      • Side-Aligned Menu
      • Compact Menu Layout (Global Menu)
    • Collection Page
      • Classic Collection
      • Sidebar Collection
    • Collection List Page
    • Product Page
      • Product Section (Showcase)
      • Product Section (Thumbnail)
    • About Page
    • Contact Page
    • Lookbook Page
      • 🛠 How to Create a Lookbook Page
      • 🗂 Creating a Lookbook Archive
      • ⚙️ Lookbook Settings & Features
    • Password Page
      • How To Password Lock Store
      • How To Add and Set Timer
      • How To Collect Emails + SMS
      • Using The Store Unlock Animation
  • 🧩Sections and Features
    • Blog Feed Section
    • Collection Display Section
    • Collection List Section
    • Email Signup (Popup)
    • Email Signup (Embed)
    • FAQ Section
    • Hero Section
    • Image Selector Section
    • Image Stream Section
    • Marquee Section
    • Preloader Section
    • Product Carousel Section
    • Text Block Section
    • Video Spotlight Section
  • 🏷️Advanced
    • How to Add Size Charts to Each Product
    • Setting Up Color Swatches
    • Setting Up Model Info
    • Setting Up Pre-Orders
  • 👥Customer Accounts
    • How To Setup Customer Accounts
    • Login Page
    • Register Page
    • Account Dashboard Page
    • Address Management Page
  • 🌎Languages & SEO
    • Language Files (Locales)
    • Update Favicon
    • Meta Descriptions
  • ⭐️Plain Jane Interactive
    • How to Create an Interactive Space
    • Setting The Background
    • Adding Interactive Points
    • Using Transition Arrows
    • Best Practices for Mobile + Spacing
  • 💬 FAQ & Troubleshooting
Powered by GitBook
On this page
  • What You’ll Learn
  • 🧩 Section Overview
  • How to Add the Section
  • Content & Data
  • Layout & Display
  • Typography Settings
  • Colors
  • Styling
  • Spacing
  • Need Help?
  1. 🧩Sections and Features

Text Block Section

PreviousProduct Carousel SectionNextVideo Spotlight Section

Last updated 4 days ago

What You’ll Learn

  • How to add and format subtitle and body text

  • How to control alignment, font size, and colors

  • How to enable animation effects

  • How to upload and apply custom fonts

🧩 Section Overview

The Text Block section is perfect for storytelling, mission statements, or brand descriptions. You can add a subtitle, a main text block, and customize layout, typography, and spacing for both desktop and mobile.

How to Add the Section

  1. In the Shopify Theme Editor, click Add section

  2. Choose Text Block

  3. Position it in your layout as needed

Content & Data

  • Subtitle: A small label or intro line (e.g., “ABOUT US”)

  • Main Text: The primary paragraph text

  • Both fields support plain text only (no HTML or rich formatting)

Layout & Display

  • Subtitle Alignment: Choose left, center, or right

  • Text Alignment: Choose left, center, or right

💡 Tip: Center alignment works well for short mission statements or quotes

Typography Settings

Fonts

You can choose from built-in fonts or upload your own.

  • Subtitle Font and Text Font: Pick from dropdown

  • Enable Custom Font: Toggle this ON to use your own

To use a custom font, follow these steps:

🛠️ How to Add a Custom Font

  1. Upload your font file (usually .woff2) to Settings > Files in Shopify Admin

  2. Copy the file URL

  3. In the Text Block settings:

    • Paste the font name (e.g., "MyCustomFont") into Custom Subtitle Font Name or Custom Text Font Name

    • Paste the file URL into Custom Subtitle Font URL or Custom Text Font URL

Once saved, your text will render using the custom font you uploaded.

Font Sizes

Adjust font sizes separately for desktop and mobile:

  • Subtitle Font Size (Desktop / Mobile)

  • Text Font Size (Desktop / Mobile)

  • Toggle Bold Subtitle or Bold Text for added emphasis

Colors

  • Background Color: Solid or gradient background

  • Subtitle Color

  • Text Color

All colors are set using hex codes or Shopify's color picker.

Styling

  • Text Animation: Choose from:

    • No Animation

    • Typewriter

    • Fade Up

    • Reveal

Animations apply to the main text only and trigger as the section scrolls into view.

Spacing

Control top and bottom padding for both desktop and mobile:

  • Top Spacing (Desktop / Mobile)

  • Bottom Spacing (Desktop / Mobile)

  • Toggle Remove Section Padding to flush the section edge-to-edge

💡 Use increased spacing when stacking this section between media-heavy blocks.

Need Help?

  • 📧 Email us at: support@openspaces.design

  • 💻 Live chat with us: Available Monday–Friday, 10AM–6PM EST, directly on our website

💬 Join our community on Discord:

https://discord.gg/hcc2GvgZc6