Updating the Together We’re More Site

Although the site should be fairly straightforward to edit, the Together We’re More site showcases a few new design patterns, so here’s a quick guide on what (and where) to look.

The Home Page

The Category Swiper

The Category swiper is powered by two areas: the home page ACF fields and the “Site Settings” options page.

The home page fields control the section’s text (“these are true stories…”) and background image. The Category Settings tab controls the category preview—namely, the photo and short description.

The Category Setting tab controls content both for the home page and the category archive pages.

The Category Spotlight

This section has the unique capability of previewing the quarter’s upcoming posts. The button’s text is dynamically set based on the post status (“Published” or “Scheduled”).

The “upcoming stories” section on the home page

The three profile “cards” are powered by the same template, which makes use of the following bits of content:

  1. The Featured Image
  2. The Title
  3. The Category
  4. The “Title”
  5. The “Brief Description”
  6. The Publish (or Scheduled) Date

If only one story is written (e.g. at the top of a quarter), the other two need to be scheduled for their respective months (the day doesn’t matter). As long as the month is correct, the button text will grab the month it’s scheduled for and show “Read More in [Month]”.

The Profiles

Editing a single “profile” (aka a “post,” “story” or “bio”) has a few key areas of note.

The Meta Details

The “Meta Details” block controls content that might get featured outside of the main content (hence the “meta” name).

  • The “Title” shows up two places:
    • the card preview on the home page and
    • the category archive page
  • The Video shows up in (potentially) 4 places:
    • The home page (when the story is the featured story)
    • The header of the profile page
    • The horizontal swiper in the profile page (if it gets used and no other video is set)
    • The category archive page

If the video is not public, there are a few extra options that need to be set in order for previews to work correctly!

The Content Sections

The “Article” repeater + flexible content sections power the story. Here’s a breakdown of what’s going on.

  • Media + Text: This block has a number of controls that make it supremely flexible:
    • Text Type: Toggles text as long-form content or short pull quote
    • Media Type: Toggles the media as video or photo, each with its own set of subsettings
    • Media Position: Sets the media to either the left or right. This only affects the desktop view.
  • Full Width Media + Text: This is the same as the Media + Text block, but the media is displayed at full-width instead of within the confines of the article body.
  • Diamond Separator: This has a few controls—full-width, or moveable with Left, Right and Center as available positions
  • Block Quote: This block creates a block quote that takes up 100% of the article width. It can be used with or without its background image.
  • Slider: Creates the 5-element slider image. Each slide has its own controls, and there can only be one of these on a page.
  • Gallery: Creates a simple image gallery

Image Captions

Although at the time this doc was first published, only Chief Batton’s story made use of image captions, technically any image used in a profile can make use of this design pattern. When an image is uploaded to the Media Library, if a caption is added to the image, it will be displayed below the image on profile pages.

See something inaccurate?