Youth Homepage Overview

Youth Homepage Sections

Similar to the main church homepage, all the content underneath the rotator of the Youth homepage is also powered by Sections (CONTENT > SECTIONS). In the page settings for your homepage, you will see a Sections area at the bottom where each are pulling into your page. These can be rearranged, removed, etc, depending on which sections you want to display.

Help Site: Sections Overview

Default Youth Homepage Sections

Navigate to CONTENT > SECTIONS. The pre-built sections for the youth homepage include the following:

  • Homepage - Youth - Custom Section: This section uses the WYSIWYG editor to display custom content, so you can add in your own text, images, links, background image, etc (similar to the page content area).
  • Homepage - Youth - Featured Items: This section uses a pre-built monklet: {{page-monklet--featured-links|find="homepage-youth-featured-links"}} to show 3 featured links from CONTENT > LINK LIST > HOMEPAGE YOUTH FEATURED LINKS. See Help Article: Editing a Link List
  • Homepage - Youth - Events: This section uses 2 pre-built monklets {{page-monklet-feature-event-youth}} and {{page-monklet-events-3-youth}} to automatically display the latest featured event on the left, and the next upcoming events on the right. This section will only pull event that have the "Youth" category assigned.

Note: For the Custom Section, you can create responsive columns of content by using the Grid Generator Tool. Also check out this article and short video on Creating Responsive Columns

Within each section, the following fields/options are used:

  • Name: title of the section (for internal use only)
  • Content: will either contain a pre-built monklet (as outlined above) or WYSIWYG editor that supports all text, media, links, etc.
  • Background Color: Adding a hex code will change the background color of a section.
  • Background Image: The image will display behind the section content and replace the color if uploaded
  • Dark Background: Inverts the section content to show white text on a dark background
  • Parallax Background: Adds parallax scrolling functionality, so you would see the text scrolling overtop of the background image