Getting Started for Content Editors

Your complete guide to creating and managing content on YMCA websites.

Welcome to YMCA Website Services! This guide will help you get started creating beautiful, engaging content for your YMCA website.

What You’ll Learn

By the end of this guide, you’ll be able to:

  • βœ… Log in and navigate the admin interface
  • βœ… Create your first landing page with Layout Builder
  • βœ… Add and configure blocks from the Block Library
  • βœ… Upload and manage images and media
  • βœ… Publish and preview your content

Estimated time: 15-20 minutes


Step 1: Log In and Find Your Way Around

Accessing the Admin

  1. Navigate to your YMCA website and add /user/login to the end of the URL
    • Example: https://yourymca.org/user/login
  2. Enter your username and password
  3. Click Log in

The Admin Toolbar

Once logged in, you’ll see a black toolbar at the top of the page. This is your admin toolbar with quick access to:

  • Content - Create and manage all your pages and posts
  • Structure - Configure menus, blocks, and site structure
  • Appearance - Theme and visual settings
  • Extend - Add new features and modules

Admin toolbar screenshot


Step 2: Explore the Block Library 🧱

The Block Library is your toolkit for building pages. Before creating your first page, take 5 minutes to browse what’s available.

  • Banner - Full-width hero images with headlines and CTAs
  • Cards - Flexible card grid layouts (2-4 columns)
  • Accordion - Expandable Q&A sections
  • Article Views - Automatically display recent blog posts
  • Testimonials - Member quote carousels

β†’ Browse the Full Block Library (30+ blocks organized by category)


Step 3: Create Your First Landing Page

Let’s build a simple landing page using Layout Builder!

Create the Page

  1. Click Content in the admin toolbar
  2. Click the blue Add content button
  3. Select Landing Page (Layout Builder)
  4. Fill in the required fields:
    • Title: “Welcome to [Your YMCA Name]”
    • Leave other fields as defaults for now
  5. Click Save and edit layout

You’re now in Layout Builder! This is where the magic happens.

Understanding Sections and Blocks

  • Sections = Rows that structure your page (like shelves)
  • Blocks = Content components that fill sections (like items on shelves)

Add Your First Section

  1. Click Add section at the top
  2. Choose One column layout
  3. Click Add section

Add a Banner Block

  1. In your new section, click Add block
  2. Click Create custom block
  3. Select Banner
  4. Fill in:
    • Title: “Welcome to Our YMCA”
    • Description: “Building healthy communities since [year]”
    • Image: Click Select Image and upload a photo
    • Link URL: /join (or your membership page)
    • Link text: “Join Today”
  5. Click Add block

Save and Publish

  1. Click Save layout at the top
  2. Click the Edit tab
  3. Check the Published checkbox
  4. Click Save

πŸŽ‰ Congratulations! You’ve created your first page. Click View to see it live.


Step 4: Add More Content

Now let’s add variety to your page.

Add a Cards Block

  1. Click the Layout tab
  2. Click Add section below your banner
  3. Choose One column layout
  4. Click Add block β†’ Create custom block β†’ Cards
  5. Set # of columns to 3
  6. Add 3 card items with:
    • Heading: Program names (e.g., “Youth Sports”)
    • Description: Brief summary
    • Link: Link to program page
  7. Click Add block

Add an Accordion (FAQ Section)

  1. Add another section
  2. Add an Accordion block
  3. Add 3-4 accordion items with common questions:
    • “What are your hours?”
    • “How do I join?”
    • “Do you offer financial assistance?”
  4. Fill in the answers
  5. Save the block

Preview and Publish

  1. Click Save layout
  2. View your page to see how it looks
  3. Make adjustments as needed

Step 5: Working with Images and Media

Upload an Image

  1. When adding a block with an image field
  2. Click Select Image
  3. Click Upload tab
  4. Drag and drop your image or click Choose File
  5. Fill in:
    • Alternative text: Describe the image for accessibility
    • Name: Descriptive file name
  6. Click Save

Image Best Practices

  • File size: Keep under 500KB (use tools like TinyPNG to compress)
  • Dimensions: 1920x1080 for banners, 800x600 for cards
  • Alt text: Always describe the image for screen readers
  • File names: Use descriptive names like youth-soccer-team.jpg

β†’ Learn more about media management


Next Steps

Now that you’ve mastered the basics, explore these topics:

Continue Learning

Block Library

Explore all 30+ blocks and learn when to use each one.

Browse Blocks
Content Types

Learn about Articles, Events, Branches, and more.

View Types
Text Editor

Format text, add links, embed videos, and build tables.

Learn Editing

Advanced Topics


Quick Reference

Common Tasks

TaskSteps
Create a pageContent β†’ Add content β†’ Landing Page (Layout Builder)
Edit a pageNavigate to page β†’ Click Edit tab
Add a blockLayout tab β†’ Add section β†’ Add block β†’ Create custom block
Upload imageSelect Image β†’ Upload tab β†’ Drag file β†’ Save
PublishEdit tab β†’ Check “Published” β†’ Save

Keyboard Shortcuts

  • Ctrl+S (Cmd+S on Mac) - Save content
  • Ctrl+Shift+S - Save and continue editing
  • Ctrl+F - Search page

Need Help?

Troubleshooting

  • Blocks not appearing? Troubleshoot Layout Builder Issues
  • Images not uploading? Check file size and format (JPG, PNG, WebP under 500KB)
  • Page not saving? Try clearing your browser cache (Ctrl+Shift+R)

Get Support


Additional Resources


Ready to build amazing content? Start with the Block Library and explore what’s possible! πŸš€


Layout Builder

Build beautiful, flexible pages with Layout Builder’s drag-and-drop interface.

Text Editor

Some fields in YMCA Website Services allow you to format your text with a WYSIWYG (What Your See Is What You Get) editor.

Page/Content Types

YMCA Website Services features many different kinds of pages, or content types. Choosing the right content type will ensure your collect the right information and allow you the flexibility to create layouts.

Blocks

Blocks allow content editors to reuse sections of content across multiple pages.

Taxonomy, Vocabularies, and Terms

Group pieces of related content together for tagging, filtering, sorting and grouping.

Images and Documents

The media library stores images and files, allowing you to have custom cropping, focal pointing, folders and image styles.

Webforms

Beyond just a basic contact form, Drupal’s robust webforms features allow you to build interactive webforms with logic-based questions, built-in animation fields and a submissions manager.

Virtual Y

Virtual YMCA allows members and other authorized users to enjoy exclusive content for their local Y.

Paragraphs (Legacy)

⚠️ DEPRECATED: Paragraphs are legacy components. New sites should use Layout Builder. See migration guide below.

Content Editing Basics

Demo Content

The distribution comes with demo content to help kick-start your site building.

Membership

Guide prospective members through the join process.

Schedules

The distribution provides two separate applications for managing schedules at your YMCA.