Building a 5-page AI Template

By following this guide, you can create your own AI templates containing as many pages as you need.

Before getting started, make sure Quick Creator AI is enabled. Learn how you can enable it here

You can use any template as a starting point, either regular or AI.

In this guide, we will convert the regular Mono Template Studio Nim (Template ID: 1025239) into an AI template. 
Studio Nim Template.jpg

For more information about how to initially create the template in RAI, go to: Creating a template in RAI for Quick Creator AI

 

How to build a 5-page template for Quick Creator AI

In order to build a template for Quick Creator AI, you need to complete the following steps:

  1. Add AI tags to all relevant Text and/or Gallery Modules in the template. 
  2. Enable the template for use with Quick Creator AI. You do this in RAI.
  3. Optional: Enable additional AI prompts to give AI more context to create content for you. You do this under website settings.

Let's look at each step in more detail. 

 

Adding AI Tags to the template

AI tags tell the Editor where to place AI content on the template. Let's walk through how to apply AI Tags to each page of Studio Nim, step-by-step.

 

HOMEPAGE: Welcome Title

  1. Let's start by changing the Welcome Title on the homepage. There are two lines of text within the same text module: "Welcome to Studio Nim" and "Hair and Beauty Studio". We want to add an AI Tag to each of these separately.welcome.jpg

  2. There are two ways we can add an AI Tag to text: Either by adding it to the entire text module, or by adding it to individual snippets of text within the module.
  3. In this example, we want to add an AI Tag to individual snippets of text within the module.
  4. Double click on the text module and highlight the text you want to apply the AI Tag to. Let's start with "Welcome to Studio Nim" by highlighting it as shown below:
    highlight the text.jpg

  5.  Click the star cluster icon called 'AI Tag'. Click "Insert"
    ai tag in text editor.jpg
  6. A new overlay pops up, where you can set the AI Tag properties for this highlighted text.
    text editor overlay.jpg
    Here is the breakdown of the settings we have chosen in this particular case:
     Property  Chosen setting Why we chose this setting
     Grouping:   Module  We chose "Module". This means  that this AI Tag will only be associated to the content within the module. 
     Category:   Text  We chose "Text", as none of the other categories are relevant (services, products etc). 
     Topic:  Welcome  We chose Welcome, because it's a header, designed to welcome the visitor to the website.
     Type:   Title  We chose Title, as this is the most relevant
     Word count:   5  We chose 5 words, so it stays within the same amount of space as the original template.
     Paragraph count:   1  We only have 5 words, so no need for any line breaks. We choose 1 paragraph.
  7. Click the green "Save" button.

  8. Now let's repeat this for the tag line underneath it: "Hair and Beauty Studio".
    hair and beauty studio.jpg

  9. Highlight the text, Choose the "AI Tag" star cluster icon from the Text Editor, Click "Insert" & Set the AI Tag properties. We set the properties to the followingsecond text line.jpg
     Property  Chosen setting Why we chose this setting
     Grouping:   Module  We chose "Module". This means  that this AI Tag will only be associated to the content within the module. 
     Category:   Text  We chose "Text", as none of the other categories are relevant (services, products etc). 
     Topic:  Introduction  We chose introduction, because it's an introduction to what the website is about.
     Type:   Description  We chose Description, as this is the most relevant. 
     Word count:   10

     We chose 10 words, so it's a bit more expansive than the original, but still fits neatly into the template.

     Paragraph count:   1  We only have 10 words, so no need for any line breaks.
  10. Follow the same step on the Welcome to our studio text further down the page: 
    welcome.jpg

 

HOMEPAGE: About Us

  1. Let's scroll down until we get to the 'About us...' section on the Homepage.
    About us.....jpg

  2. Let's add AI Tags to this section, just like the previous section.

  3. For the 'About us...' title, we will not add an AI Tag. This title can easily stay the same, and be relevant to any site. You can always replace 'us' with the Company Name global content tag for more personalization.

  4. For the description underneath, we add an AI Tag and define the following properties:
    About us description.jpg
     Property  Chosen setting Why we chose this setting
     Grouping:   Module  We chose "Module". This means  that this AI Tag will only be associated to the content within the module. 
     Category:   Text  We chose "Text", as none of the other categories are relevant (services, products etc). 
     Topic:  About  We chose "About", because this is an about section.
     Type:   Description  We chose Description, as this is the most relevant here. 
     Word count:   40

     The existing text is 40 words long, so we will stick to that. 

     Paragraph count:   1  One paragraph is okay in this case. 

 

How many AI Tags can I add?

In theory, you can add as many AI Tags as you like.

However, the more AI Tags you place, the longer the Quick Creator flow becomes.

Each AI Tag is represented in the Quick Creator flow by a text field with suggested content, which you can either approve or re-generate. Placing two AI Tags on a template means you need to review two content fields in the Quick Creator AI flow. Placing 50 AI Tags means you need to review 50 content fields in the flow.

More AI Tags also result in a higher number of content requests placed to OpenAI, meaning potential higher costs. 

 

HOMEPAGE: Testimonials

  1. Scroll down to the testimonials section of the Homepage
    Testimonials.jpg
  2. Double click on the text module.
  3. Highlight the testimonial text.
    Highlight testimonial.jpg
  4. Click on the AI Tag Icon in the banner and click "Insert"
    Click Insert.jpg
  5. We filled the AI Tag properties with the following options:
    AI Tags testimonials.jpg

     Property  Chosen setting Why we chose this setting
     Grouping:   Row  We chose "Row". This means the AI tag will relate to the other testimonial within the row.
     Category:   Testimonials  We chose "Testimonials", as this text is supposed to be a mock testimonial.
     Topic:  Generic  We chose Generic, because none of the other categories were relevant.
     Type:   Description  This is a description, not a title, name or image.
     Word count:   25  The existing lorem ipsum is 25 words, so we will choose the same to make sure it fits the template.
     Paragraph count:   1  With 25 words, no need for more than 1 paragraph.
  6. Double click the name under the testimonial, highlight it and insert an AI Tag.
  7. Fill out the AI Tag properties. The only thing that is different from the above testimonial text, is that we chose "Name" instead of "Description" under type, and set the word count to: 2 
    AI Tags testimonial name.jpg
     Property  Chosen setting Why we chose this setting
     Grouping:   Row  We chose "Row" in this case. This means the AI tag will relate to the other testimonial within the row.
     Category:   Testimonials  We chose "Testimonials", as this text is supposed to be a mock testimonial.
     Topic:  Generic  We chose Generic, because none of the other categories were relevant.
     Type:   Name  This is a name
     Word count:   2  We chose a 2 word name. 
     Paragraph count:   1  Again no need for more than 1 paragraph.
  8. Repeat for the other testimonials

 

SERVICE PAGE: Welcome Title

  1. For the welcome title and tagline, you can add an AI Tag like we did on the homepage. Or you can simply write some generic industry relevant text, potentially with a global content tag if you find it relevant.

SERVICE PAGE: Services

  1. Let's scroll down to the 'services'. 
    services.jpg
  2. Here the title "Service title one" and the service description are both part of the same text module, so once again we will need to set the AI tags to the specific text within the module.
  3. However, to illustrate how to set the AI Tag if these two text types were in each their own module, Let's explore that. 
  4. Let's image Service title one was in one text module, and the description was in a different text module.
  5. Edit the text module of the Service title one by hovering over the module and clicking the pencil icon.
    Edit service module.jpg

  6. This brings up the Text Module editing overlay. Scroll down until you see the headings called AI Tag.
    Text module overlay.jpg

  7. Click the + icons to expand the properties. 

  8. Choose the appropriate properties like in previous examples.Text module AI Tags.jpg
     Property  Chosen setting Why we chose this setting
     Grouping:   Column  We chose "Column". This means the AI tag will relate to the service description below (as they are two separate text modules within the same column).
     Category:   Services  We chose "Services", as this text is supposed to be a service.
     Topic:  Services  We chose Services again, as it is the most relevant topic
     Type:   Title  This is a title
     Word count:   3  This service title will be 3 words long. 
     Paragraph count:   1  No need for more than 1 paragraph.
  9. Now repeat for the description underneath the titleText module AI Tags descriptuon.jpg
     Property  Chosen setting Why we chose this setting
     Grouping:   Column  We chose "Column" in this case. This means the AI tag will relate to the service title above it (as they are two separate text modules within the same column).
     Category:   Services  We chose "Services", as this text is supposed to be a service.
     Topic:  Services  We chose Services again, as it is the most relevant topic
     Type:   Description  This is a description
     Word count:   35  This service description will be 35 words long. 
     Paragraph count:   1  No need for more than 1 paragraph.
  10. Now repeat for the other Services on the page.

 

SERVICE PAGE: Image and text

If you scroll down the Services page, you come to this section with an image on the left, and text on the right. Let's add AI Tags to the text on the right.

Image and text.jpg

  1. Once, again the Headline and the Body Text are together in the same module, so we insert the AI Tag via the Text Editor ribbon.
  2. Double click the Light Headline Lorem text > click the AI icon in the Text Editor Ribbon > Click Insert.
    Image and text - ai tag.jpg
  3. We set the AI Tag properties to the following in the overlay:
    Image and text - ai tag overlay.jpg
     Property  Chosen setting Why we chose this setting
     Grouping:   Module  We chose "Module", because both related texts are located within the same module. Remember that if the headline and the text were in separate modules (within the same column), you would need to choose Grouping: "Column".
     Category:   Text  We chose "Text", as we don't want this to be about services, products or testimonials.
     Topic:  About  We chose About, so that this section can become an About us section
     Type:   Title  This is a title
     Word count:   5  We keep the title short at 5 words. 
     Paragraph count:   1  No need for more than 1 paragraph.
  4. Repeat the same step to insert and AI Tag for the Body Text in the module. 
    Image and text - ai tag overlay description.jpg
     Property  Chosen setting Why we chose this setting
     Grouping:   Module  We chose "Module", because both related texts are located within the same module. Remember that if the headline and the text were in separate modules (within the same column), you would need to choose Grouping: "Column".
     Category:   Text  We chose "Text", as we don't want this to be about services, products or testimonials.
     Topic:  About  We chose About, so that this section can become an About us section
     Type:   Description  This is a description
     Word count:   40  Let's keep the paragraph at the same length as the template. 
     Paragraph count:   1  No need for more than 1 paragraph.
  5. The only changes we make to the AI Tag properties, are word count and Type (Description instead of title)

 

SERVICE PAGE: Gallery

Let's scroll down the Services page, until we come to the gallery section.

Gallery AI.jpg

Let's set up the gallery, so it works together with the Quick Creator AI flow. 

Please note that the Quick Creator AI flow currently does not support AI-generated images. However, you can upload up to 4 images, which will be displayed in a gallery module on the finished website.

 

Let's set up our gallery module to be populated with images uploaded during the Quick Creator AI flow:

  1. Hover over the Gallery module until the blue Module banner appears in the top left corner. Click the banner, then click the "Edit" pencil icon.
    Gallery - Edit.jpg
  2. This opens up the Gallery Module editing overlay, where we can add or remove images, and adjust other settings.
  3. First, make sure that the images are selected via Global Data source for it to work properly with Quick Creator AI, by toggling the Use Global Data source button
    Gallery - global data.jpg
  4. Quick Creator AI allows you to upload 4 images during the flow. Let's make sure we only have 4 images in the Gallery, so that it fits the flow.
    1. In the top menu in the Editor, Navigate to Content > Global Data > Gallery
      Gallery - global data edt.jpg
    2. Remove all but 4 images and click save.
      Gallery - remove.jpg
  5. Now when we go back to our Gallery Module, we can see there are 4 images in the overview.
    Gallery - number of images.jpg

  6. Scroll down to the bottom of the overlay, until you get to the AI TAGS section.
    Gallery - AI section.jpg
  7. Expand the properties on the + icons and fill out the properties.
    Gallery - properties.jpg
     Property  Chosen setting Why we chose this setting
     Grouping:   Module  We chose "Module", because the gallery is all within one module.
     Category:   Gallery  We chose "Gallery", as this is a gallery.
     Topic:  Generic  For Gallery Modules, you can choose Generic as nothing else is relevant.
     Type:   Type  The type is image.
     Item count:  4 Item count refers to the number of images that can be uploaded during the Quick Creator AI flow. If you have 4 images uploaded to the template, but choose an item count of 2, this means that 2 images can be uploaded via the flow. The remaining 2 images will default to the existing placeholder images in the template. 

For more in-depth information about how to set up AI Tags for Gallery Module, please read the Gallery section in the article Adding AI tags to AI templates.

 

ABOUT PAGE: Welcome text

On the About page we have a welcome text, and we also have a longer text further down the page.

  1. Let's start by adding an AI Tag on the welcome text, choosing AI Tag from the Text Editor ribbon.
    About.jpg
  2. Fill in the AI Tag properties
    About AI Tag properties.jpg
     Property  Chosen setting Why we chose this setting
     Grouping:   Module  This text is only related to the module itself.
     Category:   Text  We chose "Text", as we don't want this to be about services, products or testimonials.
     Topic:  About  We chose About, so that this section is on the About page, and we would like some About information to go here.
     Type:   Description  This is a description
     Word count:   10  Let's keep the text short, so it's alike to a tag line.
     Paragraph count:   1  No need for more than 1 paragraph.

ABOUT PAGE: Paragraph title

Let's scroll down to the section with an image and text. Let's put an AI Tag here, so the final website will have an 'about' text in this spot.

  1. Let's start with the title by adding an AI Tag, as we have done on the previous pages.
    About - title.jpg
  2. And fill in the AI Tag properties
    About - title properties.jpg
     Property  Chosen setting Why we chose this setting
     Grouping:   Module  This text is only related to the module itself.
     Category:   Text  We chose "Text", as this is not about services, products or testimonials.
     Topic:  About  We chose About, so that this section is on the About page, and we would like some About information to go here.
     Type:   Title  This is a title
     Word count:   7  We chose 7 words to give AI a bit wider playing field to come up with information here
     Paragraph count:   1  No need for more than 1 paragraph.

ABOUT PAGE: Paragraph description

Now let's do the same thing for the description part of this paragraph.

  1. Insert an AI Tag by highlighting the text like previous examples.
  2. Fill in the AI Tag properties.
    About -descrip properties.jpg
     Property  Chosen setting Why we chose this setting
     Grouping:   Module  This text is only related to the module itself.
     Category:   Text  We chose "Text", as this is not about services, products or testimonials.
     Topic:  About  We chose About, so that this section is on the About page, and we would like some About information to go here.
     Type:   Description  This is a description
     Word count:   70  Let's pick 70 words to match the current template.
     Paragraph count:   1  No need for more than 1 paragraph.

 

CONTACT PAGE

  1. On the Contact page, we have a Title and Tagline. It does not make sense to add AI Tags here, since there are no specific AI Tags for contact us content. In this case we recommend simply writing some industry relevant content, and adding global content tags for more personalization.
  2. The template already comes with a lot of personalised content on this page, such as address and opening hoursContact page.jpg

  3. The Quick Creator flow will auto-fill in address, phone number, email address, and company name based on the information provided. No need to change anything.
  4. However there is no option for opening hours. You can remove this from the template, if you don't want something generic.
     

BLOG PAGE

  1. On the blog page, we have a Title, Tagline and Description. 
    blog.JPG

  2. In this case, it does not make sense to add AI Tags, since there are no specific AI Tags for blog content. We recommend simply writing some industry relevant content, and adding global content tags for more personalization.

  3. For example, in the tag line, you can change the text to something like this: Latest hair and beauty trends by [company_name]
    blog tag line.jpg

  4. The same applies to the Description on the right side of the page. Here, you could change it to industry specific text, such as: Welcome to my blog, your go-to destination for all things hair and beauty. Whether you're looking for the latest trends, styling tips, or hair care advice, you're in the right place. 
    welcome to my blog.jpg

     

Enabling additional AI prompts

Under website settings, you can choose to make additional prompts available in the template. Read more in the article: AI enriching questions.

These prompts include:

  • What is the company mission?
  • What type of services are being offered?
  • What type of products are being offered?
  • Company description (short)

 

To enable or disable additional AI prompts:

  1. Click the Cog Icon in the top right corner of the Editor, then click Settings
    website settings.jpg
  2. Open the menu point Website settings in the left navigation, then click the menu point Questions to enrich AIs knowledge
    QA AI.jpg
  3. Choose the extra questions/ prompts you would like to appear in the Quick Creator AI flow.

  4. Click SAVE

Remember: Enabling or disabling these questions impacts just that: the questions. These questions can impact the quality or relevance of the content, but it will not impact the type of content you have in your template.

For example, let's say you have a Services section on your template, with AI tags related to services. If you enable the question What type of services are being offered?, then the user will be prompted to provide specific answers in the flow, which the AI will generate content based on the information provided. However, if this question is disabled, it is not that content will not be generated, but that the AI will have less guidance on how to craft the content.

 

Make your new template available in the Quick Creator AI flow

Now we need to make sure the template shows up in the flow, so it can be selected for use.

  1. Navigate to RAI > Templates
  2. Click the "INFO" link to the left of the templateINFO.jpg

  3. Select "YES" in both the "Quick Creator" and "Is AI Template" dropdowns
    QC yes AI yes.jpg

  4. Click the green SAVE button.
    Click save.jpg

 

Now that you have set up a 5-page template, you are ready to start using it through the Quick Creator AI flow. For more information about the flow, and template set-up, read other articles on Quick Creator AI:

 

 

 

Was this article helpful?
0 out of 0 found this helpful