00:00:05:15 - 00:00:07:25
In this tutorial, we'll take a look
at one of the form

00:00:07:25 - 00:00:11:22
builders available modes which tailor
the experience directly to how

00:00:11:22 - 00:00:15:08
you wish your end users
to interact with a particular product.

00:00:16:06 - 00:00:19:06
It will take a look at the upload mode.

00:00:19:09 - 00:00:22:03
This mode keeps the interface
nice and simple,

00:00:22:03 - 00:00:25:26
allowing end users to simplify,
uploading their own artwork

00:00:25:26 - 00:00:30:15
to predefined frames
via the user facing form within MegaEdit.

00:00:30:17 - 00:00:34:20
This is a great feature primarily used
for posters or canvas products,

00:00:34:27 - 00:00:37:27
however has wide reaching potential.

00:00:39:02 - 00:00:41:08
so I'm on the product details page.

00:00:41:08 - 00:00:44:07
For the product
I've started to configure for this.

00:00:44:07 - 00:00:45:01
I'm going to start off

00:00:45:01 - 00:00:48:19
just by going to the MegaEdit
config of this particular product.

00:00:49:12 - 00:00:51:21
And all I'm going to do in this example is

00:00:51:21 - 00:00:54:21
make sure that we apply more than one
canvas.

00:00:54:23 - 00:00:58:23
This is allows me to demonstrate
how the upload mode can be effectively

00:00:58:23 - 00:01:03:06
used, so applying more than one
canvas will allow me to choose the canvas

00:01:03:06 - 00:01:04:21
it's utilized either

00:01:04:21 - 00:01:08:27
before we launch the product in MegaEdit
or during the MegaEdit session.

00:01:11:14 - 00:01:14:01
I'm also going to go over to scripts

00:01:14:01 - 00:01:17:13
and then start some basic
config of my Form

00:01:17:13 - 00:01:20:13
Builder script.

00:01:24:25 - 00:01:27:07
Now the only line we need to import here
is this one.

00:01:27:07 - 00:01:30:07
So instance mode editor upload

00:01:30:09 - 00:01:34:05
this sets the Infigo Form Builder
to utilize its upload mode.

00:01:34:05 - 00:01:37:06
This pre-configures
these capabilities to match this

00:01:37:06 - 00:01:40:06
particular mode.

00:01:40:29 - 00:01:43:29
Once that's been input,
click save and continue edit

00:01:44:02 - 00:01:47:02
and then launch the product
within MegaEdit.

00:01:54:02 - 00:01:57:00
Okay, so now we're going to add
an image field and perform

00:01:57:00 - 00:02:00:07
some basic configuration
using the Infigo form builder.

00:02:06:07 - 00:02:06:26
So this includes

00:02:06:26 - 00:02:09:26
the usual step of applying a field name,

00:02:10:17 - 00:02:13:17
which in this case
I'm going to call upload your artwork

00:02:21:16 - 00:02:24:07
and defining interactivity options.

00:02:24:07 - 00:02:27:04
This configuration is most likely
the user should not be able

00:02:27:04 - 00:02:28:19
to interact with the field.

00:02:28:19 - 00:02:32:09
So I'm going to d select
all of these interactivity toggles.

00:02:32:28 - 00:02:36:02
Basically all of the interactivity
is going to come from the form over on

00:02:36:02 - 00:02:36:27
the right hand side.

00:02:42:11 - 00:02:44:07
Next,
I'm going to go into the advanced settings

00:02:44:07 - 00:02:49:11
for this particular frame
and I'm going to choose user image Select.

00:02:50:22 - 00:02:52:24
This will allow users to upload custom

00:02:52:24 - 00:02:55:26
imagery to the field via
the customer facing form.

00:02:56:16 - 00:02:59:16
Using the button that you can see
has just appeared.

00:03:05:00 - 00:03:08:00
Next, I'm going to actually define the

00:03:08:11 - 00:03:11:15
the boundaries
in the extents of this particular frame.

00:03:11:15 - 00:03:14:00
So the one
which is going to receive the artwork.

00:03:14:00 - 00:03:16:20
And again,
this is covered in other tutorials.

00:03:16:20 - 00:03:19:20
But just to give you a summary of this,

00:03:19:27 - 00:03:23:12
I've got the ability in these manual field
tags down at the bottom

00:03:23:21 - 00:03:29:21
to assign fit, to bleed, fit to page
or fit to margin out with Fit to Bleed,

00:03:29:23 - 00:03:34:04
and then add that as a field tag and
you can see that it automatically resizes

00:03:34:04 - 00:03:38:14
that frame to actually match
the bleed of this particular product.

00:03:39:27 - 00:03:40:11
So this will

00:03:40:11 - 00:03:43:11
ensure that regardless of the canvas
that's used,

00:03:43:15 - 00:03:47:13
the field will always resize
to correspond to the canvas bleed.

00:03:47:13 - 00:03:51:18
And what we'll see is that
if we go ahead and change the canvas

00:03:51:18 - 00:03:54:18
that's utilized,

00:03:59:02 - 00:04:00:12
the frame still matches.

00:04:00:12 - 00:04:04:07
So the frame is still extending
to the bleed of that particular

00:04:04:10 - 00:04:07:10
canvas

00:04:08:17 - 00:04:09:15
and users will be able

00:04:09:15 - 00:04:12:25
to interact with an upward button
in the user facing form.

00:04:13:02 - 00:04:16:02
And this will allow them to upload imagery
from their computer.

00:04:32:19 - 00:04:33:10
So now if I go ahead

00:04:33:10 - 00:04:36:10
and just change that canvas back again,
we'll see that it's

00:04:37:13 - 00:04:40:17
still going to utilize that same imagery,
but it will update it

00:04:40:17 - 00:04:43:17
based on the available space,
but it will still extend

00:04:43:27 - 00:04:45:19
to where I set it to extend to.