This article discusses the chapter page builder feature which allows admins to customize chapter pages for their community.

Chapter Page Builder allows you to customize chapter page layouts and formats for your community chapters.

Accessing Chapter Page Builder in Bevy

Only users with admin dashboard permissions on Bevy can access the chapter page builder, edit the default chapter template or edit the chapter page for a specific chapter. The HQ admin can also access the chapter page builder via the chapter dashboard. When the chapter page builder is accessed via the chapters dashboard, any modifications made on the page builder canvas are only applied to that specific chapter. The default chapter template and published chapters utilizing this template are unaffected.

Chapter Page Builder can only be enabled or disabled in the admin dashboard.

Enabling Chapter Page Builder

In the admin dashboard, select the settings option in the left menu navigation. Scroll to the Page Builder section and check the "enable chapter page builder" box. When chapter page builder is enabled on your site, ALL published chapter pages will inherit the chapter page builder template format and layout.

Disabling Chapter Page Builder

In the admin dashboard, select the settings option in the left menu navigation. Scroll to the Page Builder section and deselect the "enable chapter page builder" box. When chapter page builder is disabled on your site, ALL published chapter pages will revert to the legacy chapter page format and layout.

Chapter Page Customization

You can customize a chapter page in two ways:

• chapter page global template
• single chapter page

From the admin dashboard, you can access the global chapter page template. Changes made here will apply to all chapter pages and have the same layout and format.

When you make changes to the template, they are available any time you open the page builder for any chapter. When you create a chapter, the latest template is applied. 

To access and edit the default global chapter template on your Bevy site, navigate to the admin dashboard and select the page builder tab.

Single Chapter Page

From the chapter dashboard in the chapter settings dashboard, admins can customize the layout and format of a single chapter page. Changes that are made and saved in a single chapter do not apply to the global chapter page template.

Configuring the Template

Customizing the global chapter page template

HQ admins create a template to define the appearance of all chapters and sub-chapters for an organization. When you make changes to the template, they're available any time you open the page builder for any chapter. Likewise, when you publish a chapter, the latest template is applied.

To configure a global chapter template:

1. In the admin dashboard, select Templates in the left-hand sidebar menu.

2. Select the Edit default template button for the template you want to change.

Customizing a one-off chapter page

HQ admins can access page builder from the chapter dashboard to change a specific chapter. 

To customize a single chapter page:

1. In the chapter dashboard, select settings in the left-hand sidebar menu.

2. Next, select the Page Builder button.

To prevent conflicts, changes to the chapter template don't apply to chapter pages you customize with the page builder. After you save changes in the page builder, you won't see any changes in the global template. 

Duplicating items in your design

1. Click the item on the canvas you want to duplicate.

2. On the floating toolbar that appears, click the duplicate icon.

You can only duplicate one item at a time on the canvas.

Deleting items in your design

1. Click the item on the canvas you want to duplicate.

2. On the floating toolbar that appears, click the delete icon.

You can only delete one item at a time from the canvas.

Moving items in your design

1. Click the item on the canvas you want to move.

2. On the floating toolbar that appears, click the up arrow to move the item one spot up on the canvas. Next, click the down arrow to move the item one place down the canvas. Finally, click the four arrow icon to drag the item to any location on the canvas.

You can only move one item at a time on the canvas.

Canvas Preview

Allows the review of the chapter page design before saving their changes and updating the template. The chapter page can be previewed as a desktop, tablet, or phone display.

Chapter Banner

• Container one includes the chapter banner image.
• Container two includes the chapter’s region information.
• Container three consists of the chapter name, chapter join (or leave) button, and chapter member count.
• Container four includes the chapter’s description, and the last container consists of the chapter share button.

Bevy recommends placing the chapter banner at the top of your chapter page design.

Three Columns

HQ Admins can adjust the spacing between and within columns with the spacing margin and gap controls. In addition, deleting addition, deleting, and duplicating actions can modify this layout to fewer or more than three columns.

Alternating

Bevy recommends using this layout when incorporating longer-form content on a chapter page.

Featured Video

Quote

Statistics

HQ Admins can adjust the spacing between and within each statistic with the spacing margin and gap controls. In addition, deleting and duplicating actions can modify this layout to fewer or more than four statistics.

Empty Container

The empty container enables an HQ admin to create a new layout. Building the layout within a container allows the community admin to quickly move the content to different locations on the chapter page.

 

Social Links

Add social follow icons to a chapter page and encourage chapter members to follow the social media accounts of the chapter. When the social links element is added to the chapter page, all or some social sharing icons are displayed on the chapter page (this is dictated by the content settings configured on the chapter’s settings tab). An HQ admin cannot change the order of the social share icons, but they can change the color of the icons.

Social Share

Add social share to a chapter page and encourage members to share the chapter’s information on an external social platform. When the social share element is added to the chapter page, all or some of the share icons are displayed on the chapter page. After adding the social share element to the canvas, select the settings tab and choose the platforms where chapter members can share chapter information’s placing the chapter banner at the top of your chapter page design.

The supported platforms are:

• Copy link

• Email

• Facebook

• LinkedIn

• Pinterest

• SMS (only appears on mobile devices)

• Twitter

Kindly note that the default color for the Social Share button is transparent. You need to update it to see the share icon.

Text

Add static content to the chapter page with the text element. The static text does not automatically update on the chapter page and must be manually updated. Within the text settings, these settings can be customized:

• Text Style: In the text style drop-down, assign the body or heading style to the selected text. Heading styles 1 through 5 are supported in the page builder.
• Font: In the font drop-down, assign a specific font to the selected text. Only font styles enabled on your Bevy site will show in the list.
• Text Size: Adjust the text size of the selected text. Sizes 12 - 80 are supported in the page builder.
• Text Color: Adjust the text color of the selected text. The text color can be changed by entering the hex color code, the RGB color code, or selecting a color from the color picker.
• Text Align: Adjust the alignment of the text. For example, the chapter page builder supports the left, center, and right alignment.
• Style: Add bold, italic, or underlined styles to the selected text.
• Insert link: Display text as hyperlinks via the insert link drop-down. Hyperlinked text can direct the page viewer to a custom URL, external website, featured video URL, or parent chapter URL.
• Lists:  Add content to the chapter page as a bulleted or numbered list.

Video

The HQ admin can add embedded videos to any chapter page builder page with the video element. Visitors can watch the video on your chapter page without leaving the current page.

• External Video: This embeds video content from an external video platform like YouTube, Vimeo, or Vidyard using an URL.
• Featured video: This embeds video content from the chapter dashboard found in the settings. This content must also be an external URL from video platforms such as YouTube or Vimeo.

Video content can not be uploaded into Bevy.

The height of the embedded video cannot be adjusted, only the width, by setting the percentage in the video width setting.

Button

Buttons are a visual addition to your chapter page, making it easier for viewers to know where to click. Adding button(s) to the chapter page encourages viewers to engage with content further down the chapter page or other community web pages. 

Buttons can be left, center, or right aligned, and one of two button styles can be selected. The available button styles in the chapter page builder are consistent with the established button styles throughout your Bevy Instance. Additional button styles are not supported.

Button Options:

• Link: Direct page visitors to any of the following content pages

  • Custom URL

  • External Website

  • External video URL

  • Parent Chapter URL

• Anchor: An anchor is a web page element that links the viewer to another location on the same page. Anchors improve the chapter page user experience because visitors can jump to specific parts of the page without having to scroll as much. An anchor can be applied to any section heading on the chapter page. The following anchor locations are supported:

• • Social share element

  • Social links component

  • Sub-chapters

  • Upcoming events

  • Social share

  • Past events

  • Organizers

  • Global sponsors

  • Local sponsors

  • Partners

• Load more: Allows the visitor to view more content for a page component. This is most relevant when a chapter page component has a default configuration to show a default number of items on the chapter page. The load more button can be used in conjunction with the following components:

  • Sub-chapters

  • Upcoming events

  • Past events

  • Organizers

  • Global sponsors

  • Sponsors

  • Partners

• Join chapter: Create an automatic link for attendees to join or leave the chapter.

• Contact Chapter: Allows viewers to email the event's chapter organizer. When the button is selected, a form opens on the user's screen.

Image

Add images to any chapter page builder page with the image element.  Existing images, such as the chapter banner or chapter thumbnail, can be added to the chapter canvas. Additionally, new images can be uploaded via the custom image upload option. Custom images must be 2MB or smaller and have a supported file format of .jpg, .png, or .svg. Images can be left, center, or right-aligned.

• Alt text: Alt text is written copy describing an image's appearance on a page providing context for search engines, and is also read aloud by screen readers.

• Image width: The height of the image cannot be adjusted, only the width, by setting the percentage in the image width setting.

• Rounded corners: Define the radius of the corners of an element with the round corner settings.

Divider

Add the divider element to add a line to group content or create sections on the chapter page. The divider can be aligned left, right, or center and styled with width, drop shadow, and color settings.

Dynamic Text

Dynamic text is a feature that automatically populates and updates the chapter page with content from the chapter dashboard, eliminating manual updates on a chapter page whenever chapter details change. The following dynamic text options are available:

• City

• Country

• Description

• Member count

• Parent chapter name

• Region

• State

• Chapter name

Organizers

Displays the members of the chapter team. The default component layout renders when the component is added to the canvas but can be customized for design and content. For example, the following dynamic text sources are available for the organizers component:

• First name

• Last name

• Full name

• Company

• Title

• City

• Country

• Description

• Member count

• Parent chapter name

• Region

• State

• Chapter name

When the view profile link is clicked, the page viewer is brought to the chapter organizer’s Bevy profile page.

Sub-chapters

Displays sub-chapters within the community. The default component layout renders when the component is added to the canvas, but the HQ admin can customize the design and content. For example, the following dynamic text sources are available for the sub-chapters component:

• City

• Country

• Description

• Member count

• Parent chapter name

• Region

• State

• Chapter name

• Sub-chapter city

• sub chapter country

• Sub-chapter description

• Sub-chapter member count

• sub-chapter region

• Sub-chapter state

• Sub-chapter name

Sub-chapters is a term that can be customized on your Bevy site, and a different term may display on the chapter page builder canvas. The component only displays on the parent chapter page when sub-chapters are associated.

Past events

Displays events that previously occurred in the chapter . The default component layout renders when the component is added to the canvas but can be customized for design and content. For example, the following dynamic text sources are available for the past events component:

• City

• Country

• Description

• Member count

• Parent chapter name

• Region

• State

• Chapter name

• Event title

• Event description

• Event short description

• Event date

• Event type

Upcoming events

Displays events the chapter is hosting in the future. The default component layout renders when the component is added to the canvas but can be customized for design and content. For example, the following dynamic text sources are available for the upcoming events component:

• City

• Country

• Description

• Member count

• Parent chapter name

• Region

• State

• Chapter name

• Event title

• Event description

• Event short description

• Event date

• Event type

Global sponsors

Displays the organization(s) sponsoring the chapter. Only active global sponsors added via the the admin dashboard sponsors tab display in the global sponsors component.

Local sponsors

DIsplays the organization(s) sponsoring the chapter. Only local sponsors added via the the chapter dashboard sponsors tab display in the local sponsors component.

Local partners

Displaysthe organization(s) sponsoring the chapter. Only local partners added via the the chapter dashboard sponsors tab display in the local partners component.

Blog posts

Displays recently published blogs. The default component layout renders when the component is added to the canvas but can be customized for design and content. For example, the following dynamic text sources are available for the blog posts component:

• City

• Country

• Description

• Member count

• Parent chapter name

• Region

• State

• Chapter name

• Blog post title

• Blog post publish date

• Blog post description

• Blog post author

 

• Color

• Image

• Rounded Corners

• Width

• Minimum height

• Horizontal Margin

• Vertical Margin

• Horizontal Gap

• Vertical Gap

Interior Container Settings

• Maximum content width

• Alignment

• Direction

• Number of columns

Borders

• Position

• Style

• Width

• Color

• Color

• Angle

• Distance

• Blur

• Size

Display Rules

A display rule allows you to control when content should show or hide on the chapter page. Display rules can be applied to any container on the chapter page builder canvas and can be nested inside each other.

Always

Apply the Always display rule to any container on the chapter page builder canvas if the container and its content should always show on the chapter page.

Chapter has sub-chapters

Apply the chapter has sub-chapters display rule to any container on the chapter page builder canvas if the container and it’s content should only show on the chapter page when the chapter is associated with sub-chapters.

Chapter has blog category

Apply the chapter has blog category display rule to any container on the chapter page builder canvas if the blog category on the chapter’s dashboard settings is populated with a a category value.