00:00:12:24 - 00:00:13:24
In this tutorial.
00:00:13:24 - 00:00:17:20
we’ll learn how to begin
creating customized content templates.
00:00:18:16 - 00:00:21:13
So content templates
aim to eliminate the need
00:00:21:13 - 00:00:24:27
for HTML knowledge
to create beautiful storefronts.
00:00:25:22 - 00:00:26:07
They do this
00:00:26:07 - 00:00:31:04
by replacing the standard Code Mirror
editor with a series of simple inputs
00:00:31:04 - 00:00:33:26
and controls to create the content
that works for you.
00:00:35:05 - 00:00:37:16
Whilst Infigo, provide a range of default
00:00:37:16 - 00:00:40:16
content templates
which you can use straight out of the box.
00:00:40:25 - 00:00:44:16
We also provide users
the ability to generate their own custom
00:00:44:16 - 00:00:48:05
content templates.
00:00:48:05 - 00:00:49:29
Some thing to note on this configuring
00:00:49:29 - 00:00:53:26
a content template
does require HTML and coding knowledge.
00:00:54:09 - 00:00:57:29
However, once those content templates
have been set up and configured,
00:00:58:07 - 00:01:02:12
it can be used over and over again without
the need to interact with any code.
00:01:03:09 - 00:01:06:06
This makes them perfect for use cases
where a particular
00:01:06:06 - 00:01:09:29
configuration of content
will need to be repeated numerous times.
00:01:10:15 - 00:01:13:12
So for example, this could be
what you need to make identically
00:01:13:12 - 00:01:16:03
laid out product pages.
00:01:16:16 - 00:01:17:23
A person with HTML
00:01:17:23 - 00:01:21:15
knowledge can set up the templates
and other administrative uses
00:01:21:15 - 00:01:26:24
are then able to utilize them
and populate them as required.
00:01:26:24 - 00:01:31:00
Over this short series of videos
will be generating a very simple content
00:01:31:00 - 00:01:34:23
template aimed at showcasing
some of the key features.
00:01:35:04 - 00:01:38:07
This includes things
such as the creation of input fields,
00:01:38:15 - 00:01:46:10
utilization of custom scripts, and more.
00:01:46:10 - 00:01:50:08
So to begin, we want to navigate
to our content templates section.
00:01:51:00 - 00:01:55:24
Now you will likely need to request access
to this section from our customer
00:01:55:24 - 00:02:01:27
support team if you want to use it
as it's not enabled by default.
00:02:01:27 - 00:02:04:27
However, once it's enabled once
you'll be able to create content
00:02:04:27 - 00:02:15:06
templates on any of your storefronts
or future storefronts.
00:02:15:06 - 00:02:18:09
So once you click on the content templates
area, you'll see a list
00:02:18:09 - 00:02:21:00
of existing default content templates.
00:02:21:12 - 00:02:24:23
Any custom ones that have already been
made will be at the bottom of the list
00:02:25:03 - 00:02:27:14
and they are the only ones that
are editable.
00:02:27:17 - 00:02:28:14
The rest are
00:02:29:16 - 00:02:33:22
fixed and can't be changed by the user.
00:02:33:22 - 00:02:37:18
We can add a new content template
by clicking on Add New on the top right
00:02:37:18 - 00:02:38:24
hand corner.
00:02:38:24 - 00:02:41:06
We're going to start off
just by entering a name
00:02:56:12 - 00:02:57:07
you can check
00:02:57:07 - 00:03:00:24
for enabling or disabling
this particular content template.
00:03:01:08 - 00:03:04:17
So if you want it to be
00:03:04:19 - 00:03:07:09
a unusable, then turn that off
so it's selected
00:03:07:09 - 00:03:10:08
and then it'll mean that that content
template is not currently in use.
00:03:10:25 - 00:03:13:14
Enabled of course,
means that you are able to utilize
00:03:13:14 - 00:03:15:19
that content template
00:03:18:08 - 00:03:19:05
and click on Save
00:03:19:05 - 00:03:22:27
and Continue edit
to fix that as a content template.
00:03:23:06 - 00:03:25:22
And you'll see
we now get access to additional settings
00:03:25:29 - 00:03:29:22
and additional taps.
00:03:29:22 - 00:03:32:21
The first thing we want to actually do
is to define
00:03:32:28 - 00:03:35:25
where the new content template
can be used.
00:03:36:11 - 00:03:40:18
To do this, we go on the Settings tab
and what this primarily contains
00:03:40:18 - 00:03:44:10
is the different areas Infigo
where we can use content templates.
00:03:44:28 - 00:03:47:27
So you may be making this content template
specifically
00:03:47:27 - 00:03:51:05
for a product
or specifically for categories.
00:03:51:14 - 00:03:53:08
So you would just site the one.
00:03:53:08 - 00:03:57:18
However, you can select multiple of these
if you want the same templates available
00:03:57:23 - 00:03:58:28
in multiple places.
00:04:00:21 - 00:04:01:06
So for this
00:04:01:06 - 00:04:03:20
example,
I'm going to go for a content page
00:04:04:14 - 00:04:06:15
and then again
click Save and continue. Edit
00:04:12:12 - 00:04:14:15
So I'll go back to General and next
00:04:14:15 - 00:04:18:12
we're going to start
populating the HTML markup section.
00:04:18:26 - 00:04:23:18
So this is the main HTML content
to be used when selecting this template.
00:04:24:04 - 00:04:27:13
Later on, we'll make sections of this code
dynamic.
00:04:27:13 - 00:04:31:28
However, for now, we will simply place
a section of static boilerplate code.
00:04:33:05 - 00:04:37:20
So in our example,
we'll create a very simple HTML section
00:04:37:29 - 00:04:46:27
containing a h2 title block
and a paragraph of text.
00:04:46:27 - 00:04:50:24
I have some preconfigured code available
which I'm just going to
00:04:51:28 - 00:04:54:18
copy and paste, and
00:04:54:18 - 00:04:55:19
from there I'm just going to click
00:04:55:19 - 00:04:58:06
Save and continue, edit
00:05:00:15 - 00:05:01:27
and then it's most simple form.
00:05:01:27 - 00:05:04:18
That's all we need to do,
but we want to actually see
00:05:05:06 - 00:05:08:23
how that's going to be utilized.
00:05:08:23 - 00:05:11:24
So what I want to do
first, we've specified that this template
00:05:11:24 - 00:05:14:07
is going to be available
on a content page.
00:05:14:16 - 00:05:18:04
So I'm actually going to go and create
a new content page to use this on
00:05:18:17 - 00:05:21:05
and we'll use this throughout this short
tutorial series.
00:05:21:25 - 00:05:23:14
So if I go to content pages,
00:05:24:18 - 00:05:27:25
I'll make a new content page
00:05:36:18 - 00:05:38:07
and then I'll save that.
00:05:38:07 - 00:05:41:09
We can access the content templates
by switching the body
00:05:41:09 - 00:05:42:24
editor type
00:05:44:18 - 00:05:47:22
and then that will give us a selection
list of all the default
00:05:47:22 - 00:05:50:00
templates, which are the ones
with the star next to them,
00:05:51:11 - 00:05:54:10
or the custom made templates
which we can see down at the bottom.
00:05:55:13 - 00:05:57:01
So this is the one I've just made.
00:05:57:01 - 00:06:02:04
So if I select this, you see that that
custom template is now loaded, there isn't
00:06:02:04 - 00:06:05:03
any additional settings at the moment
because we haven't specified them.
00:06:05:15 - 00:06:08:17
However,
now once we hit save and continue to edit
00:06:08:27 - 00:06:11:19
and then view this page, the haz
00:06:11:19 - 00:06:16:05
HTML markup code that we had
within the actual template itself
00:06:16:14 - 00:06:22:10
should be defined to that particular page.
00:06:22:10 - 00:06:27:17
So if I go and view that page,
00:06:27:17 - 00:06:31:25
we can see there that we have our H2 title
and our paragraph description.
00:06:33:21 - 00:06:34:27
So that's successfully using
00:06:34:27 - 00:06:37:18
that content template.