The Section Library is a central repository where you’ll find both Standard Sections and Custom Sections that can be used when designing the layout of Landing Page Templates. This article provides instructions on how to access the Section Library and how to add and store Custom Sections there.

• Standard Sections are pre-designed components that come out-of-the-box with the platform, offering commonly used layouts and elements. You can clone these sections and edit them to make Custom Sections. 
• Custom Sections are a part of a Landing Page Template that you can create and design to meet specific needs, such as adding unique content or branding elements. You can create these from scratch using Liquid code, or you can clone and then modify a Standard Section to make it custom. 

By keeping these Custom Sections in the Section Library, you can quickly and efficiently reuse any section in new Templates and related Experiences. This makes the sections accessible for use across all Themes within your organization, ensuring consistent styling and branding.

System administrators can view, edit, and manage all Custom Sections within the Section Library. Any future modifications you make to Custom Sections take immediate effect, simplifying the maintenance and updating of sections. This setup is particularly beneficial for organizations with multiple Themes tailored to different business units or campaigns.

The article assumes readers are already familiar with coding in Liquid, as this knowledge is required for the process to be successful.

Note: For tips on how to best configure Liquid code for use in PathFactory Custom Sections, see How to Optimize Liquid Code for PathFactory Themes. 

---

How to Access the Section Library

In the Platform Settings menu, find and click on Themes.

Once you’ve opened Themes, select the tab labeled Section Library as highlighted in the screen capture below.

You’ll see the following information on the Section Library tab.

• Categories – In the left pane you’ll see the available Custom Sections and components organized into folders. You can browse through both out-of-the-box (default) and Custom Sections.
• Main Display Pane – This area provides previews of sections based on the category you’ve selected.
• Filter Options – The filters at the top help narrow down your search by section type, theme, or other criteria.
• Search for Specific Sections – The search bar within the Section Library lets you quickly find a Custom Section by name.
• Modify a Custom Section – The Edit Code icon (</>) reveals the Liquid code so you can modify it. Once you’ve found a Custom Section you want to modify, click on it to highlight it and then select </>. 
• Manage Your Sections – You can delete, clone, or edit Custom Sections directly from the Section Library. You cannot edit out-of-the-box sections, but you can clone them for and customize the copied section.

To see usage details about a section, click on a section to highlight it. A quick pane appears on the right side of the screen with details about the section.

You’ll see the following information about the section:

• Components Used – this menu contains a list of fields, buttons, forms and other components that were used to create the given section.
• Used in Themes – this menu contains a list of all Themes that use the given section. 

---

How to Add a Custom Section or Custom Component to the Section Library

This section will guide you through adding a Custom Section or a Custom Component (a reusable piece of code or functionality that makes up multiple sections, such as buttons, forms, or widgets) to the Section Library to make it available for use in all Themes within your organization.

Note: You can add Custom Sections through the Theme File Editor tab within a Templated Experience, but in that case the Custom Sections would be available for that Theme file only. 

Use the instructions below to add a Liquid coded file for a component or a section to the Section Library. 

1. Within Themes, select the Section Library tab, and then click Add. In the menu that drops down, select Component or Section.

• If you choose Section, a popup menu appears, into which you enter a File Name and a Category where you want the new section to appear in the Section Type dropdown list
• If you choose Component, a popup menu appears for you to enter a File Name for the new component. The new component is automatically saved to the Components folder. 

2. To proceed with creating the section or component, click Save. To leave without saving, click Cancel.
3. For both components and sections, a new window opens for you to enter liquid code. 

Note: To access this coding window to modify the code later, select the section or component you want to edit, and then click the Edit Code icon (</>) as highlighted in the screen capture below.

4. Once you’ve finished coding, to apply the code click Save. The section or component you created is now available in the list on the left side of the Section Library. 

Note: If you exit without saving, any unsaved changes will be lost. Ensure you click Save to retain your work.

5. The new section is now available to use in a Theme file for a Landing Page Template. When users add a section to a Landing Page Template, this new section will appear as an option in the dropdown list alongside the out-of-the-box sections, for all Themes. 

---

How to Add a Custom Section to a Single Theme File

You can code a Custom Section separately and then add the section to the Theme File, making it available exclusively for that specific Theme.  

Note: The Theme File Editor method is useful if you want a Custom Section added to that Theme file only. 

Follow the steps below for instructions on how to proceed.

1. On the Platform Settings menu, select Themes. 

2. The Themes tab opens. To create a new Theme, click Create Theme. To modify and add Custom Sections to an existing Theme, choose the Theme file from the list of Themes. 

3. For new Theme files, a popup menu appears for you to enter a Theme Name, select the Theme Preset you want to use and then select a Status (Active or Sandbox). Save the file to continue.
4. The Theme file opens. Select its Theme File Editor tab. 

5. To add the new Custom Section, click the Add link beside the Sections heading. 

6. A popup menu appears. Enter a Filename for your new section, and then select a Category from the dropdown list. 

7. To finalize adding the Custom Section, click Save. To exit without saving, click Cancel.  The Custom Section will appear in the list on the Theme File Editor tab along with the other sections and components, and is automatically added to the Section Library. 

Views: 58