Appearance

Heading Block ​

What This Block Does ​

The Heading Block creates titles and headlines for your content with powerful text effects like typewriter animations, highlights, gradients, and more. It's your go-to block for grabbing attention and organizing content.

Perfect for: Section titles, hero headlines, product announcements, and any text that needs to stand out

How to Add It ​

Step 1: Add the Heading Block

  1. In your Shopify admin, go to Online Store → Themes
  2. Click Customize next to your live theme
  3. Navigate to any section that supports blocks
  4. Click Add block and choose Heading Block from the list

Step 2: Configure Your Heading

  1. Enter your heading text in the text field
  2. Choose your heading size (small to extra-large, or full-width)
  3. Select a text effect if desired
  4. Set alignment for desktop and mobile

Key Settings to Configure ​

Text Effects ​

Effect Type: Choose how your heading appears

  • None: Standard heading text (fastest loading)
  • Styled: Add gradients, shadows, glows, or outlines
  • Underline: Highlight specific words with animated effects
  • Typewriter: Text appears letter-by-letter or cycles through different words
  • When to use: Use effects sparingly for maximum impact - save them for your most important headings

Heading Size ​

Size Options: Control how large your heading appears

  • Full-width: Text automatically sizes to fill the container width
  • Extra-large to Extra-small: Fixed sizes that work across all devices
  • Pro tip: Use larger sizes for hero sections, smaller sizes for subsection headings

Text Alignment ​

Desktop & Mobile Alignment: Control text positioning

  • Best practice: Center alignment works well for hero sections, left alignment for body content
  • Mobile consideration: Mobile alignment overrides desktop on smaller screens

Pro Tips for Success ​

Design Best Practices

  • Use hierarchy: Make your most important heading the largest, then decrease sizes for subheadings
  • Limit effects: Don't use text effects on every heading - save them for key messages
  • Test readability: Ensure your headings are readable on all devices and backgrounds
  • Keep it concise: Shorter headings have more impact than long ones

Common Mistakes

  • Too many effects: Using multiple text effects on the same page can look unprofessional
  • Poor contrast: Make sure your heading color contrasts well with the background
  • Overusing large sizes: Not every heading needs to be extra-large