Customizing fonts and typography

Select custom fonts and adjust text styling across your entire wedding website.

Want your wedding website to have the perfect typography? You can customize fonts, sizes, spacing, and more for different text elements throughout your site. Create a cohesive, beautiful design that matches your wedding style!

What you can customize

WedSites lets you control typography for six different text types:

Body text (Font): Main paragraphs and content

Couple's names (Names font): Your names in the header

Ampersand (Ampersand font): The "and" or "&" between your names

Date (Date font): Wedding date text

Headings (Heading font): Section headings

Titles (Title font): Page titles

Labels (Label font): Form labels, buttons, small text

Each has customizable font family, size, case, letter spacing, and line height!

How to access typography settings

  1. Go to Site in your main navigation
  2. Click on the settings icon to open Site settings
  3. Click the Fonts tab at the top
  4. You'll see sections for each text type
  5. Customize each element as desired
  6. Click Save changes at the bottom

Your typography updates across your site!

Restoring default fonts

At the top of the Fonts tab, there's a Restore defaults link.

Clicking it resets all font settings to your theme's original typography. Useful if you want to start over!

Font case options

For each text type, choose the case:

Mixed case (Aa): Normal capitalization - "Emily and Jordan"

Uppercase (AA): All capitals - "EMILY AND JORDAN"

Lowercase (aa): All lowercase - "emily and jordan"

Click the case buttons to change how text appears!

Body text (Font) customization

Controls your main content text.

Font family: Choose from the dropdown (more than 200 fonts available)

Font size: 10-72px

Letter spacing: -0.2 to 0.8 (slider)

Line height: 1 to 3 (slider)

Case: Mixed, uppercase, or lowercase

This affects all paragraph text throughout your site!

Names font customization

Controls how your couple's names appear.

Font family: Choose from dropdown

Font size: 24-300px

Letter spacing: -0.2 to 0.8

Line height: 0 to 3

Case: Mixed, uppercase, or lowercase

Auto resize: Checkbox to automatically adjust size for different screens

Use Auto resize for responsive names that look good on all devices!

Ampersand font customization

Controls just the "and" or "&" between your names.

Font family: Choose from dropdown

Font size: 24-300px

Letter spacing: -0.2 to 0.8

Line height: 0 to 3

Case: Mixed, uppercase, or lowercase

Spell out "and": Checkbox to write "and" instead of "&"

Make the ampersand fancy and decorative, or keep it simple!

Date font customization

Controls your wedding date text.

Font family: Choose from dropdown

Font size: 10-72px

Letter spacing: -0.2 to 0.8

Line height: 0 to 3

Case: Mixed, uppercase, or lowercase

Style your date to match your formality level!

Heading font customization

Controls section headings throughout your site.

Font family: Choose from dropdown

Font size: 24-200px

Letter spacing: -0.2 to 0.8

Line height: 0 to 3

Case: Mixed, uppercase, or lowercase

Auto resize: Checkbox for responsive headings

Headings should stand out but be readable!

Title font customization

Controls page titles.

Font family: Choose from dropdown

Font size: 24-200px

Letter spacing: -0.2 to 0.8

Line height: 0 to 3

Case: Mixed, uppercase, or lowercase

Auto resize: Checkbox for responsive titles

Titles are similar to headings but might appear differently in your theme!

Label font customization

Controls form labels, buttons, and small text.

Font family: Choose from dropdown

Font size: 10-72px

Letter spacing: -0.2 to 0.8

Line height: 0 to 3

Case: Mixed, uppercase, or lowercase

Keep labels readable and functional!

Choosing font families

The font dropdown includes more than 200 professionally selected fonts:

Serif fonts: Traditional, elegant (like Playfair, Lora)

Sans-serif fonts: Modern, clean (like Open Sans, Raleway)

Script fonts: Fancy, handwritten (like Great Vibes, Pacifico)

Display fonts: Unique, decorative

Preview fonts in the dropdown to see how they look!

Font pairing tips

Contrast: Pair serif with sans-serif (heading serif, body sans-serif)

Similarity: Use fonts from the same family for harmony

Hierarchy: Use font size and weight to create visual hierarchy

Limit: Don't use more than 2-3 different font families

Test: Make sure fonts are readable together

Good pairing example:
- Names: Elegant script
- Body: Clean sans-serif
- Headings: Bold serif

Font size guidelines

Body text: 14-18px (readable for long paragraphs)

Names: 48-96px (prominent but not overwhelming)

Headings: 24-36px (larger than body, smaller than names)

Labels: 12-16px (small but legible)

Sizes can vary based on your theme and design!

Letter spacing (tracking)

Controls space between letters.

Negative values: Letters closer together (tight, compact)

Zero: Default spacing

Positive values: Letters farther apart (airy, spacious)

Uppercase text: Often needs more letter spacing

Lowercase text: Usually fine with default spacing

Adjust the slider to find the perfect spacing!

Line height (leading)

Controls vertical space between lines of text.

Lower values (1-1.5): Tight, compact

Medium values (1.5-2): Comfortable reading

Higher values (2-3): Airy, lots of white space

Body text: Usually 1.5-1.8 for readability

Headings: Can be tighter, 1.2-1.4

Auto resize feature

Available for Names, Headings, and Titles.

When enabled: Font size adjusts automatically for different screen sizes

When disabled: Font size is fixed

Recommended: Turn ON for responsive typography that works on mobile

Testing typography

After customizing:

  1. Visit your live site
  2. Check readability of body text
  3. Look at names and headings
  4. View different pages
  5. Test on mobile
  6. Test on different browsers
  7. Ask friends for opinions

Typography should be beautiful AND functional!

Mobile considerations

Font sizes: Might appear different on phones

Auto resize: Helps fonts adapt to small screens

Letter spacing: Might need adjustment for mobile

Line height: Keep comfortable for mobile reading

Always test mobile typography!

Accessibility

Readable fonts: Avoid overly decorative fonts for body text

Sufficient size: Body text should be at least 14-16px

Line height: Adequate spacing for easy reading

Contrast: Make sure text stands out from background

Consistent: Use hierarchy clearly (headings bigger than body)

Good typography helps all guests enjoy your site!

Common typography styles

Classic elegant:
- Names: Playfair Display
- Body: Lora
- Headings: Cinzel

Modern clean:
- Names: Montserrat Bold
- Body: Open Sans
- Headings: Raleway

Romantic script:
- Names: Great Vibes
- Body: Quicksand
- Headings: Libre Baskerville

Rustic casual:
- Names: Amatic SC
- Body: Karla
- Headings: Merriweather

Formal vs. casual

Formal weddings:
- Serif fonts
- Proper case
- Tighter letter spacing
- Classic combinations

Casual weddings:
- Sans-serif or playful fonts
- Maybe all lowercase
- Looser letter spacing
- Fun combinations

Match typography to your wedding vibe!

Typography hierarchy

Create clear hierarchy:

Largest: Names (80-100px)
Large: Titles and headings (30-40px)
Medium: Body text (16-18px)
Small: Labels (12-14px)

Size differences help guests navigate your content!

Brand consistency

If you have wedding branding (invitations, stationery):

Match fonts from your print materials

Use same sizes relative to each other

Keep same style (formal, casual, romantic)

Consistency makes everything feel cohesive!

Theme defaults

Your theme comes with thoughtfully chosen typography. The Restore defaults link at the top resets to these theme settings if you want to start over!

Custom CSS for advanced typography

If you need even more control, you can use custom CSS in the Design tab. But the Fonts tab covers most typography needs!

Saving your typography settings

Write down your font choices and sizes:

Names: Great Vibes, 72px
Body: Open Sans, 16px
Headings: Playfair Display, 32px

That way you can recreate your settings if needed!

Customizing fonts and typography gives your wedding website a unique, polished look that perfectly matches your wedding style and makes content easy to read!