How to use the ClickFunnels divider element inside the page editor

ClickFunnels™ Helpdesk Support Video

ClickFunnels™ Gives You EVERYTHING You Need To Market, Sell and Deliver Your Product Online!

:arrow_right: Start Your Free 14 Day Trial

Sign-Up Takes Less Than 60 Seconds.

YouTube Transcript: English (auto-generated)

00:02
you
00:08
hey human click final sport here so in
00:11
this video I’m just gonna go over how we
00:12
can configure the divider element
00:14
oftentimes on a page you’ll want to do
00:16
something to visually breakup or divide
00:18
different sections in your page you can
00:23
do this at any point using borders on
00:25
the road so for example if we want to
00:27
add a divider between these two
00:28
headlines we could create a second one
00:31
column row with this elements into that
00:34
and then set a border either on the top
00:37
row by going into advanced selecting
00:40
border and selecting bottom only or if
00:47
we could do the sort of the reverse by
00:49
choosing the bottom row going into
00:51
advanced selecting top only and
00:55
confirming it that way however because
01:02
this is such an often used technique we
01:04
haven’t included an element that’ll help
01:06
speed things up a little bit so we’ll
01:09
cut things down to a one column row
01:11
we’ll add in a headline and code it to
01:14
bring this back to our original starting
01:16
point we now have a simple page setup
01:18
with the only two headlines on it so
01:20
we’ll start by adding a divider we can
01:24
click on content to get a sub selection
01:26
of just the content related elements to
01:31
get into the settings for the element we
01:32
can click on the element itself or we
01:34
can hover over it and then click on the
01:36
gears icon here there’s a number of
01:38
things we can adjust starting with the
01:40
top margin we can adjust the width which
01:43
is the percent of the row that we want
01:46
to actually fill so it’s a hundred
01:48
percent it fills the entire row
01:58
and with 50% it fills half of it
02:05
additionally we can adjust the alignment
02:07
choosing from left right or center we
02:12
can set the height or the thickness of
02:13
the divider from one pixels all the way
02:16
up to 60
02:19
we can choose a style from solid dashed
02:23
or dotted and we can configure a color
02:28
we can get some additional options by
02:31
clicking on the Advanced tab by default
02:33
the Styles tab will be pre-selected here
02:35
we can adjust the padding on the top
02:38
from 50 to zero pixels as well as the
02:42
padding on the bottom again going from
02:44
50 to zero pixels we can add a shadow
02:47
choosing from bottom light bottom dark
02:52
or full light and flow duct which will
02:57
do it on both the top and the bottom
02:59
finally we can click on the animation
03:00
tab here and set up a time delay
03:02
choosing from fade in or fade in with
03:04
scale if I set this to 1 minute and 30
03:06
seconds for example the divider element
03:08
will not come into view on the screen
03:10
for one and tell one minute in 30
03:12
seconds after the page has initially
03:13
been loaded finally we can set up an
03:15
animation choosing from on page below or
03:17
on page scroll on page load will take
03:20
effect as soon as the page is loaded on
03:21
page scroll will only take effect when
03:23
the element in question actually comes
03:25
into view for the user and from there we
03:28
can choose a style and set a delay in
03:30
milliseconds so hopefully this helps
03:32
clear things up a little bit in terms of
03:33
how you can configure the divider
03:35
element inside of the clickfunnels
03:36
editor if you do have small questions
03:39
though or anything like that
03:39
definitely go ahead and will let us know
03:41
in support chat

ClickFunnels™ Gives You EVERYTHING You Need To Market, Sell and Deliver Your Product Online!

:arrow_right: Start Your Free 14 Day Trial

Sign-Up Takes Less Than 60 Seconds.