forked from open-y-subprojects/openy_docs
-
Notifications
You must be signed in to change notification settings - Fork 7
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #58 from YCloudYUSA/sept-updates
feat: Sept updates keep on coming...
- Loading branch information
Showing
16 changed files
with
323 additions
and
29 deletions.
There are no files selected for viewing
21 changes: 21 additions & 0 deletions
21
content/en/docs/content-structure/content-types/lb-landing-page.md
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,21 @@ | ||
--- | ||
title: Landing Page (Layout Builder) | ||
--- | ||
|
||
Landing Page content type is used to add Landing Pages to your website using Layout Builder widgets. | ||
|
||
This page is managed with Layout Builder. You may want to uncheck "Publish Content" before creating a page, use the "Layout" tab to build the content, then Publish when the page is complete. See our [User Guide](../../user-documentation/layout-builder) for help. | ||
|
||
## Fields | ||
|
||
| Label | Machine Name | Required | Description | Field Settings | Notes | | ||
|------------------|------------------------|----------|-----------------------------------------------------|--------------------------------|-------| | ||
| Title | title | yes | Title of Landing Page | | | | | ||
| **Metadata** | Field group | | ||
| Meta description | field_meta_description | no | Short text used for metatags and cards | Text (plain, long) | | | ||
| Meta image | field_meta_image | no | Media image reference for use in metatags and cards | Entity reference (Media image) | | | ||
| Meta tags | field_meta_tags | no | Provided by Metatag module | | | | ||
|
||
## URL pattern | ||
|
||
Content type is using following pattern: `[node:title]` |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,16 +1,137 @@ | ||
--- | ||
title: How to migrate content into Layout Builder | ||
linkTitle: "migrate to Layout Builder" | ||
description: Making the leap to Layout Builder can seem daunting, but we have resources to help. | ||
description: Leaping to Layout Builder can seem daunting, but we have resources to help. | ||
--- | ||
|
||
Before you start your migration, we recommend getting a better understanding of your current site with a [Content Audit](../content-audit). | ||
Before you start your migration, we recommend you: | ||
|
||
- understand your current site with a [Content Audit](../content-audit), | ||
- familiarize yourself with the [new Layout Builder Components](../../user-documentation/layout-builder/), | ||
- watch our [comparison of Paragraphs and Layout Builder](https://youtu.be/YdYaYE0bd6w?t=794&si=xPvRoLM0O-VxABDZ), and | ||
- see a side-by-side demo of the [old vs. new page building experiences](https://youtu.be/jrRY3q2lP4s). | ||
|
||
## Plan your migration | ||
|
||
- Familiarize yourself with [new Layout Builder Components](../../user-documentation/layout-builder/) | ||
- Get organized - Write new content, complete audit spreadsheet, identify components you will need | ||
- Identify key pages - start with your home page and important top-level pages | ||
- Programs, Locations (Branches, Camps, etc.), Memberships, Articles/Blogs, Events, Schedules, etc. | ||
- Create a plan - decide which pages you want to build first | ||
- Most → Least complex | ||
The migration from Paragraphs to Layout Builder is not a small one, but it can be done in bite-sized pieces and spread out over some time if necessary. We recommend working with a [partner agency](https://ds.ymca.org/partners) to assist you through the process. | ||
|
||
> **TIP**: As you work through the migration, the new pieces of your site _will_ look different than others. Help members through the process with some messaging in an [Alert](../../user-documentation/content-types/alert) or [news post](../../user-documentation/content-types/lb-article) letting them know that things will be changing. | ||
## Decide where to start | ||
|
||
If you're doing your migration throughout your regular business, without starting from scratch (sometimes called a "lazy migration"), it helps to identify a strategy for planning the migration. These are a few possible strategies: | ||
|
||
### A campaign or goal | ||
|
||
If you have an upcoming marketing campaign you could build one or a few brand new Landing Pages with Layout Builder to try out the process. This way you're easing both your editors and members into the new designs without getting too deep. | ||
|
||
If you have a natural pause in events (maybe over a holiday) or a big series coming up you could use that as the break point for new events. Old events don't necessarily have to be converted to the new design as they're not often viewed after their date has passed. | ||
|
||
### A section of the site | ||
|
||
Maybe you want to ease into the process with some lesser-used pages, maybe you want to change the home page and top-level menu items to show off the new designs right from the outset. Either way, you can decide on a section and carve off a few pages at a time. | ||
|
||
### A content type | ||
|
||
Events or News articles are a good option to try out the new designs, although you'll need to ensure any Landing Pages that display lists of that content are also updated. Branch pages can be converted one by one without changing their listing on the Locations page. | ||
|
||
## Prepare your content | ||
|
||
Once you know what you're going to move, you'll want to get the content ready to migrate. Most text will need to be copied and pasted to the new pages (this is a great opportunity for review), but images and documents will be able to be re-used from the [Media Library](../../user-documentation/media). | ||
|
||
It could be helpful to print or screenshot pages (Firefox can capture a [full-page screenshot](https://support.mozilla.org/en-US/kb/take-screenshots-firefox)) and then annotate them to decide how each section of the page will map to its Layout Builder component. You could even use the [Wayback Machine](https://web.archive.org/) to save a snapshot of the page. | ||
|
||
### Component mapping | ||
|
||
While the exact mappings are up to each site's content editors, here are some possible mappings from Paragraphs to Layout Builder | ||
|
||
> Paragraph | ||
> : the Layout Builder component it maps to. | ||
1 Column | ||
2 Columns | ||
3 Columns | ||
4 Columns | ||
Secondary Description and Sidebar | ||
: These paragraphs can be replicated using 1-4 column [Layouts](../../user-documentation/layout-builder/#layouts) | ||
|
||
Activity Finder | ||
: [Activity Finder](../../user-documentation/layout-builder/activity-finder) | ||
|
||
All Amenities | ||
: [Branch Amenities](../../user-documentation/content-types/branch/#layout-builder-blocks) | ||
|
||
Banner | ||
Small Banner | ||
: [Banner](../../user-documentation/layout-builder/banner) | ||
|
||
Blog Posts Listing | ||
Featured Blog Posts | ||
Featured News Posts | ||
Latest Blog Posts | ||
Latest News Posts | ||
News Posts Listing | ||
: [Articles Filter, Articles Listing, Featured Articles](../../user-documentation/layout-builder/article-views) | ||
|
||
Camp Menu | ||
: [Camp Menu](../../user-documentation/content-types/camp/#camp-menus) | ||
|
||
Categories Listing | ||
: TBD | ||
|
||
Code | ||
: [Code](../../user-documentation/layout-builder/code) | ||
|
||
Date Block | ||
: None | ||
|
||
Embedded GroupEx Pro Schedule | ||
: Due to changes in the GroupEx Pro embed functionality, we recommend moving to a [Code](../../user-documentation/layout-builder/code) block. | ||
|
||
FAQ | ||
: [Accordion](../../user-documentation/layout-builder/accordion) | ||
|
||
Featured Content | ||
Story Card | ||
: [Cards](../../user-documentation/layout-builder/cards) or [Grid CTA](../../user-documentation/layout-builder/grid-cta) | ||
|
||
Gallery | ||
: [Carousel](../../user-documentation/layout-builder/carousel) | ||
|
||
Grid Content | ||
: [Grid CTA](../../user-documentation/layout-builder/grid-cta) or [Icon Grid](../../user-documentation/layout-builder/icon-grid) | ||
|
||
Limited Time Offer | ||
: Banner (small variant) or Alert | ||
|
||
Membership Calculator Paragraph | ||
: [Membership Calculator](../../user-documentation/membership) | ||
|
||
Promo Card | ||
: [Promo Card](../../user-documentation/layout-builder/promo-card) | ||
|
||
Simple Content | ||
: [Table](../../user-documentation/layout-builder/table) | ||
|
||
Social Share Icons | ||
: [Deprecated](../../user-documentation/paragraphs/social-share-icons) | ||
|
||
Teaser | ||
: [Ping-pong](../../user-documentation/layout-builder/ping-pong) | ||
|
||
Webform | ||
: [Webform](../../user-documentation/layout-builder/webform) | ||
|
||
## Build it | ||
|
||
Once you have a plan, go build it! Use the [Layout Builder](../../user-documentation/layout-builder) documentation to help you through the process. Building each page might look something like this: | ||
|
||
- Create a new, unpublished, Landing Page (with Layout Builder) | ||
- Add blocks and content to the new page | ||
- Ensure the URL Alias of the new page matches that of the old page | ||
- Un-publish the old page and publish the new page. | ||
- Test out the new page in a new browser, an incognito window, or your phone or tablet | ||
|
||
## Get help | ||
|
||
If at any point in this process you need help, be sure to reach out to [our community](../../../community). The functionality is always being improved, and we have a wide variety of developers and builders from other Ys who are happy to help. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,52 @@ | ||
--- | ||
title: How to leverage structured data | ||
linkTitle: use structured data | ||
description: Structured data helps the machines reading your site - search engines, AI models, and more - understand your content. | ||
--- | ||
|
||
> Adding structured data can enable search results that are more engaging to users and might encourage them to interact more with your website | ||
> | ||
> -- [Why add structured data to a page (Google)](https://developers.google.com/search/docs/appearance/structured-data/intro-structured-data#why) | ||
The distribution (as of [version 10.3.0]({{% relref "release-ds-10.3.0.md" %}})) leverages the community contributed [Schema.org metatag module](https://www.drupal.org/project/schema_metatag) and custom code to integrate structured data into many content types. You can test if your page is outputting structured data by using the [Schema.org Validator](https://validator.schema.org/) or [Google's Rich Results Test](https://search.google.com/test/rich-results) | ||
|
||
Once your site is updated, structured data will be _automatically generated_ 🎉 with no additional work from content editors. | ||
|
||
## Articles | ||
|
||
The [Article (Layout Builder)](../../user-documentation/content-types/lb-article) content type implements the [Article Schema](https://schema.org/Article) as per [Google's Article structured data docs](https://developers.google.com/search/docs/appearance/structured-data/article). | ||
|
||
Articles have three options for the **Type**, which map to their appropriate Schema: | ||
|
||
- Blog → [BlogPosting](https://schema.org/BlogPosting) | ||
- News → [NewsArticle](https://schema.org/NewsArticle) | ||
- Press Release → [Article](https://schema.org/Article) (there is currently no other appropriate Schema) | ||
|
||
### Customizing Articles | ||
|
||
This mapping is set in code (`y_lb_article_metatags_alter` in [y_lb_article.module](https://git.drupalcode.org/project/y_lb_article/-/blob/1.1.x/y_lb_article.module)), but all other settings are configurable via the Metatag configuration (`/admin/config/search/metatag/node__article_lb`). | ||
|
||
## Branches | ||
|
||
The [Branch](../../user-documentation/content-types/branch) content type implements the [LocalBusiness Schema](https://schema.org/LocalBusiness) as per [Google's Local business structured data docs](https://developers.google.com/search/docs/appearance/structured-data/local-business). | ||
|
||
Any time the Branch Hours are updated, that content will also be reflected in the Structured Data that's read by search engines. | ||
|
||
### Customizing Branches | ||
|
||
The mapping is configurable in the Metatag configuration (`/admin/config/search/metatag/node__branch`). Hours configuration uses the [Open Y Hours_metatag tokens](https://github.com/open-y-subprojects/openy_hours_formatter#open-y-hours-metatag-tokens). | ||
|
||
## FAQs | ||
|
||
The [Accordion Layout Builder Block](../../user-documentation/layout-builder/accordion) has an option to implement the [FAQPage Schema](https://schema.org/FAQPage) as per [Google's FAQ structured data docs](https://developers.google.com/search/docs/appearance/structured-data/faqpage). | ||
|
||
If an Accordion section contains Frequently Asked Questions, check the **FAQ?** checkbox to output them as structured data. | ||
|
||
Tips for writing good FAQ content: | ||
|
||
- Ensure the content contains individual sets of questions ("How old does my child need to be to swim at the YMCA?") and answers ("The YMCA offers swim classes starting at age 3 and the pool is open to children of all ages with parental supervision"). | ||
- Only one FAQ should be added to a page. If more than one is added, only the first will be output to the structured data. | ||
|
||
### Customizing FAQs | ||
|
||
Due to the complexity of the FAQ data, the structured data is [managed entirely in code](https://git.drupalcode.org/project/lb_accordion/-/blob/1.0.x/lb_accordion.module?ref_type=heads#L40) and is not customizable via the Drupal admin. If you need specific customizations, please post your ideas in Slack or suggest them on [the Roadmap](/roadmap) for the core team to discuss and implement. |
31 changes: 31 additions & 0 deletions
31
content/en/docs/user-documentation/content-types/lb-landing-page/_index.md
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,31 @@ | ||
--- | ||
title: Landing Page (Layout Builder) | ||
description: A flexible content type that uses Sections and Blocks, managed with Layout Builder, to build content. | ||
--- | ||
|
||
This page is the base for building pages with [Layout Builder](../../layout-builder). | ||
|
||
## Creating a Landing Page | ||
|
||
Go to **Admin** > **Content** > **Add Content** > **Landing Page (Layout Builder)** | ||
|
||
Fill in the content fields: | ||
|
||
- **Title** (required): The title of the page. It will not be added to the page and should be added manually with a block in the [Banner section](#customizing-a-landing-page). | ||
- **Metadata**: This content is used to provide context to search engines and page previews. For the best user experience create [clickable titles](https://backlinko.com/on-page-seo#optimize-title-and-description-tags), [write a compelling description](https://moz.com/learn/seo/meta-description), and [add a descriptive image](https://yoast.com/image-seo/#always). | ||
- **Meta description**: A brief and concise summary of the page's content that is a maximum of 160 characters in length. | ||
- **Meta image**: Choose or upload an image to be used as a thumbnail for social sharing and preview cards. | ||
- **Meta tags**: Advanced meta tag configuration. This section should not be edited unless you know what you're doing. | ||
|
||
## Customizing a Landing Page | ||
|
||
Once you create a Landing Page you can customize it with [Layout Builder](../../layout-builder). | ||
|
||
Landing Pages come with these pre-configured sections: | ||
|
||
- [**Header**](../../layout-builder/header-footer/#header-section) | ||
- **Banner**: An edge-to-edge, no gutters section that works best with a single [Banner](../../layout-builder/banner) or [Carousel](../../layout-builder/carousel). | ||
- **Body**: A section with left and right margins. This can contain the bulk of your page content. | ||
- [**Footer**](../../layout-builder/header-footer/#footer-section) | ||
|
||
Sections can be [edited, reordered, or removed](../../layout-builder/#sections) to configure your page as you like. You can even remove the header and footer altogether if you need to create content for a digital display or other embedded system. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.