Generated Elements are usually not customizable when you add them to your site using Page Builder. In this article, we will walk you through how to create an editable Generated Element using ShortPoint Generator.
TABLE OF CONTENTS
- Before We Begin
- Step-by-step Tutorial
Before We Begin
- To use ShortPoint Generator, make sure that you have ShortPoint installed.
- Make sure that you have the latest version of ShortPoint SPFx. ShortPoint Generator is available in ShortPoint versions 22.214.171.124 and above.
This is the notification you usually see whenever you add a Generated Element to your site. Follow the guide closely to learn how to make fields in your Generated Element editable.
Step 1: Open ShortPoint Generator
Go to the ShortPoint Dashboard and select Generator.
Step 2: Name your Custom Element
Name your custom element (1) and select Element (2) from the drop-down list.
Step 3: Customize your Design Element
After naming your element, click the plus button and start creating your own design element.
NOTE: You can also copy & paste a design from our Demos Library and customize it the way you want.
For the purpose of this tutorial, we have created the Generated Element below.
Step 4: Add %%content%% to the field you want to edit
To make an editable design element, you need to add %%content%% to the fields you want to edit.
NOTE: You can replace the word content with any title or word you want. Just remember to add %% before and after the word you selected. For example, you want to replace content with Title_panel. You will then write it as %%Title_panel%%.
For this guide, we made the Title and Description of our design element editable.
Step 5: Save your Generated Element
Once you are satisfied with your Generated Element, click Save Changes.
You will now see all your Generated Elements and footers at the top of your Generator page.
Step 6: Add the Generated Element to your page
Open Page Builder and find your new Generated Element. You will see all Generated Elements at the end of the elements list.
You will notice that you now have the option to edit content in your Generated element. Fill in all the necessary details and click Insert.
Congratulations! You have now created an editable Generated Element. Enjoy exploring this feature on your own SharePoint sites.