Picture of Creating custom modules for use in Content Templates | BG_ADV_CCT_005

Creating custom modules for use in Content Templates | BG_ADV_CCT_005

In this tutorial, we'll learn how to leverage custom modules for use in standard and custom Content Templates. Here, "module" refers to one of the building blocks you can utilise whilst constructing your Content Template, such as when you select "paragraph", or "image" content types. We wish for our newly created module to be selectable whilst we are creating our site pages using Content Templates.

Tutorial Video Transcript

00:00:05:15 - 00:00:05:23
In this

00:00:05:23 - 00:00:09:07
tutorial,
we'll learn how to create custom modules

00:00:09:09 - 00:00:13:02
for use in
standard and custom content templates.

00:00:13:04 - 00:00:16:06
Here, module
refers to one of the building blocks

00:00:16:06 - 00:00:19:27
that you can utilize
whilst constructing your content templates

00:00:20:00 - 00:00:24:08
such as when you select paragraph
or image content types.

00:00:24:08 - 00:00:27:17
So when you're actually generating
your page content,

00:00:27:19 - 00:00:31:08
we wish for a newly created module
to be selectable

00:00:31:11 - 00:00:35:04
whilst we are creating our site pages
using content

00:00:35:04 - 00:00:38:18
templates.

00:00:38:20 - 00:00:40:13
Now to begin, we're going to navigate

00:00:40:13 - 00:00:46:16
to our content templates
screen with the Infigo admin.

00:00:46:18 - 00:00:47:28
This is where you're able to create

00:00:47:28 - 00:00:50:28
and modify custom content templates.

00:00:50:29 - 00:00:54:15
If you can't access this page,
then please put in a request

00:00:54:15 - 00:00:56:00
with our customer support team.

00:00:56:00 - 00:01:00:22
Who may need to enable your access to it.

00:01:00:25 - 00:01:01:25
You can see we have a list of

00:01:01:25 - 00:01:06:15
all of our default and custom
content templates that we've created.

00:01:06:17 - 00:01:09:16
I'm just going to hit
add new on the top right hand side.

00:01:09:16 - 00:01:12:21
So we'll begin as if we're
making a completely new template

00:01:12:21 - 00:01:17:02
as we've seen in previous tutorials
in this series.

00:01:17:04 - 00:01:25:28
So when I enter a name,

00:01:26:01 - 00:01:27:28
click enable

00:01:27:28 - 00:01:29:14
and then hit, save and continue.

00:01:29:14 - 00:01:34:23
Edit.

00:01:34:26 - 00:01:36:28
So in our example, it's
going to be incredibly

00:01:36:28 - 00:01:41:02
basic simply to show you
how this functionality operates.

00:01:41:04 - 00:01:44:21
So populate the HTML markup
with the required code.

00:01:44:23 - 00:01:47:23
And remember,
that you can create variable fields

00:01:47:23 - 00:01:50:23
within this code using the fields section.

00:01:50:28 - 00:01:53:11
And if you need more guidance on
how to do that, you can see

00:01:53:11 - 00:02:00:14
previous videos in this tutorial series
For further information.

00:02:00:16 - 00:02:03:02
So once that's been populated,
we now need to define

00:02:03:02 - 00:02:07:08
where this content template can be used
and we need to actually specify

00:02:07:08 - 00:02:12:01
that it is going to be a module
rather than a full blown template itself.

00:02:12:04 - 00:02:14:29
If we go over to the settings tab,

00:02:14:29 - 00:02:19:04
we then need to check the content module
section here.

00:02:19:06 - 00:02:23:28
So assigning this template as a content
module is the first major change

00:02:23:28 - 00:02:26:11
from the previous tutorials
that we've seen.

00:02:26:11 - 00:02:27:01
This enables

00:02:27:01 - 00:02:30:23
also a separate list that you'll see below
where you are able to select

00:02:30:23 - 00:02:36:21
where this module is able to be placed
within your other content templates.

00:02:36:24 - 00:02:39:06
So for example, we will allow this module

00:02:39:06 - 00:02:43:02
to be used as content
within the one column layout,

00:02:43:04 - 00:02:46:12
because on the second page

00:02:46:14 - 00:02:49:02
content, one column layout.

00:02:49:02 - 00:02:53:03
And what this means is when I'm actually
constructing my page content,

00:02:53:06 - 00:02:55:26
when I get to the format of one column.

00:02:55:26 - 00:02:59:04
So within a slider or within a section,
whatever it may be,

00:02:59:07 - 00:03:03:12
and then going to be able
to add this particular content template

00:03:03:15 - 00:03:07:12
as a module, as a block
within that particular

00:03:07:15 - 00:03:11:23
form.

00:03:11:25 - 00:03:12:15
Now bear in mind

00:03:12:15 - 00:03:16:05
that you can select multiple areas
where this module can be used if desired.

00:03:16:07 - 00:03:21:15
You're not just limited to selecting one

00:03:21:17 - 00:03:22:06
on site.

00:03:22:06 - 00:03:24:03
Don't click, save and continue.

00:03:24:03 - 00:03:26:00
Edit and that's it.

00:03:26:00 - 00:03:29:14
Our basic content
template module has now been generated.

00:03:29:16 - 00:03:32:02
Now all that we need to do is to specify
where it is

00:03:32:02 - 00:03:36:02
that we want to utilize
that particular module.

00:03:36:04 - 00:03:38:19
So I've already got a page open
right to this.

00:03:38:19 - 00:03:39:07
What we need to do

00:03:39:07 - 00:03:44:02
is to navigate to an area where you wish
for this template to be utilized.

00:03:44:04 - 00:03:47:16
So in our example,
we're going to add it to our home page.

00:03:47:19 - 00:03:50:16
I've navigated
to my editable content section

00:03:50:16 - 00:03:54:00
and then I've gone to my above mid page
content section.

00:03:54:02 - 00:03:56:10
So you can see that
we're already using the builder

00:03:56:10 - 00:03:59:10
content template,
which is one of our default ones.

00:03:59:12 - 00:04:01:27
But what we want to do
is to actually incorporate our newly

00:04:01:27 - 00:04:07:13
created template module
within the content that we construct here.

00:04:07:16 - 00:04:09:29
So you can see
we already got two sections.

00:04:09:29 - 00:04:14:00
I'm now going to create a third section,

00:04:14:03 - 00:04:15:28
specify a way out for that section,

00:04:15:28 - 00:04:20:02
as we normally
would in a content template.

00:04:20:05 - 00:04:23:07
We remember that we specified
that this particular module

00:04:23:07 - 00:04:26:07
was going to be available
within the one column layout.

00:04:26:13 - 00:04:29:22
So you'll see now that if I go to add
content within that one column,

00:04:29:23 - 00:04:32:09
my custom module is now available.

00:04:32:09 - 00:04:35:20
If you created any variable fields,
you will also be able to populate them

00:04:35:20 - 00:04:36:02
here.

00:04:36:02 - 00:04:42:06
As we've seen in previous tutorials
in this series.

00:04:42:09 - 00:04:44:12
So let's just go ahead and save that.

00:04:44:12 - 00:04:46:01
I'm just going to clear the cache
for good measure

00:04:46:01 - 00:04:49:01
just to make sure
that we're getting the most up to date

00:04:49:04 - 00:04:51:08
version of the site.

00:04:51:08 - 00:05:00:08
And then I'm going to refresh my homepage.

00:05:00:10 - 00:05:03:05
And what we find here
is that that content module

00:05:03:05 - 00:05:06:05
that we've created,
the custom content module,

00:05:06:05 - 00:05:10:19
is now being utilized as part of one of
our other content templates.

 

Incomplete
Step by Step Guide

Creating custom modules for use in Content Templates | BG_ADV_CCT_005

In this tutorial, we'll learn how to leverage create custom modules for use in standard and custom Content Templates.

Here, "module" refers to one of the building blocks you can utilise whilst constructing your Content Template, such as when you select "paragraph", or "image" content types.

We wish for our newly created module to be selectable whilst we are creating our site pages using Content Templates.

Creation Date: Nov 29, 2023
Created By: Sam Webster

1. Navigate to Content Templates

TO begin, navigate to the Content Template screen. This is where you are able to create and modify custom Content Templates.

If you cannot access this page, please put a request in with our Support team, who may need to enable your access.

Navigate to Content Templates

2. Click on Add new

We will begin as if we're making a completely new template, as seen in previous tutorials.

Click on Add new

3. Enter a name for the custom Content Template

Enter a name for the custom Content Template

4. Check Enabled

Check Enabled

5. Click on Save and Continue Edit

Click on Save and Continue Edit

6. Populate your HTML and Fields, then click Save

Our example will be incredibly basic, simply to show you how this functionality operates.

Populate the HTML Markup field with the required code, and remember you can create variable fields within this code using the Fields section.

See previous videos in this tutorial series for further information.

Populate your HTML and Fields, then click Save

7. Click on Settings

Click on Settings

8. Check Content module

Assigning this template as a Content Module is the first main change from previous tutorials. This enables a separate list, where you are able to select where this module is able to be placed.

Check Content module

9. Select where the module can be placed

For example, we will allow this module to be used as content within the 1 column layout.

This is a commonly used area, which you will find is available in many of the default content templates.

You can select multiple areas where this module can be used, if desired.

Select where the module can be placed

10. Click on Save and Continue Edit

That's it! Our basic content template module has now been generated.

Now all we have to do is specify where we want to utilise it!

Click on Save and Continue Edit

11. Navigate to an area where you wish to utilise this template

In our example, we'll add it to the home page. I have navigated to the Above Midpage Content within the Editable Content area.

Next, I will begin building my content, until I reach the point where our custom module can be utilised.

Navigate to an area where you wish to utilise this template

12. Click on Section*

Click on Section*

13. Click on Add Content

Click on Add Content

14. Click on One Column*

Click on One Column*

15. Click on Add Content

Click on Add Content

16. Click on Custom Module 2

We allowed our module to be added as content under the 1 Column layout.

Once we reach this point when building our content, we will see our custom module is available for selection in the list.

Click on Custom Module 2

17. If you created any variable fields, you will be able to populate them here

If you created any variable fields, you will be able to populate them here

18. Click on Save and Continue Edit

Click on Save and Continue Edit

19. Click on Clear cache

Click on Clear cache

20. Navigate to the front end. You will see your custom module is now being utilised!

Navigate to the front end. You will see your custom module is now being utilised!
Alternate Search Terms