►
From YouTube: 3: Introduction to Layouts - #BackdropCMS
Description
Taking the vanilla site install we’ve been working on and exploring:• Layouts in general• Context paths and visibility paths• Layouts per content type• Layouts per taxonomy vocabulary• Displaying fields in different regions of the page• Layouts at a specific path (“empty pages” that can be filled in using Views/blocks)• Touch on Project Installer
A
So
let's
talk
a
little
bit
about
the
layouts
click
on
structure
and
in
the
layouts,
and
you
can
see
we
have
a
default
layout
for
the
homepage
and
then
a
default
layout
for
everything
else.
And
then
the
administration
has
its
own
layout,
which
we
won't
be
touching
in
this
demo.
You're
just
worried
about
the
front
end
right
now,
so
you
can
see
the
little
icon
here
until
it
gives
you
a
rough
idea.
What
this
layout
is
gonna
look
like
so
the
home
page
has
no
sidebars,
it's
it's
using
the
template.
A
So
what
I
would
like
to
do
is
I'd
like
to
set
up
a
layout
that
only
works
with
flavors,
so
I'm
gonna
click
on
add
layout
here
and
I'm
gonna
call
it
the
flavors
layout
and
what
I
want
to
happen
here
is
I
like
this
half-and-half
thing
that
sutram
gives
so
I'm
going
to
do
that
and
now
the
path
here,
we're
going
to
type
in
node,
slash
percent,
which
will
make
this
layout
work
on
every
node
page,
which
the
that's
the
internal
term
for
all
the
content.
Pages
that
you
add.
A
So
when
you
add
a
flavor,
when
you
add
a
post
that
kind
I
think
it
will,
it
will
reside
at
node.
Slash
one
note
/,
that
kind
of
thing
so
by
saying
nodes.
Last
percent
we're
providing
the
layout
with
the
context
that
the
layout
will
work
within,
which
is
any
any
Content
page.
That's
added,
and
you
can
see
as
soon
as
we
added
that
it.
It
automatically
figured
out
the
context
that
it's
a
node
type
that
we're
adding.
A
However,
I
only
want
this
to
display
four
flavors,
so
I'm
gonna,
say
I'm
gonna,
add
a
visibility,
condition
and
say
the
the
type
of
content
only
has
to
be
flavors,
otherwise
use
the
default
layout.
Not
this
one,
then
I'm
going
to
click,
save
or
create
layout,
and
you
can
see
the
layout
here
is
generated
for
and
we
have
the
different
regions
of
the
page
header
top
content,
and
then
here's
that
half
and
a
half
thing
I
talked
about
bottom
footer
and
we
can
just
grab
this
little
hand
to
some
things
around.
A
So
I'm
gonna
move
the
breadcrumb
down
to
the
bottom
here
and
then
the
page
title
shows
up
in
a
default
location,
but
you
can
change
that
so
I'm
going
to
move
the
page
title
down
here
into
the
sidebar,
this
half
first
thing
and
you
can
change
classes
here.
So
you
could
add.
Let's
say
your
your
theme
had
had
some
special
styling
for
each
one
dot
flavor.
A
So
you
could
add
flavor
class
here
and
then
the
title
would
get
that
class
on
the
front
end
and
display
appropriately
I'm,
also
gonna,
add
I'm
going
to
start
typing
in
field.
Here.
You
can
see
all
these
fields
that
we
added
or
that
we
had
on
the
on
the
flavors
content
text
shot,
and
it's
because
we
have
a
context
of
a
node
for
this
layout.
It
provides
all
of
these
node
options
to
us,
so
I'm
actually
going
to
pull
the
image
out
of
the
of
the
flavor
content
piece
and
I.
A
Don't
want
to
put
any
labels
on
that
on
that
image,
but
I'm
gonna
show,
let's
just
say
for
now
a
large
image
in
this.
In
this
first
half
sidebar
there
I'm
not
going
to
link
it
to
anything
or
float
it
to
the
left
or
the
right,
and
then
I'm
gonna
move
a
little
bit
out
of
the
box
here
and
remove
the
main
page
content
of
a
second
half.
So
this
would
be.
You
know,
whatever's
left
in
the
description
area.
A
We
won't
want
that
image
showing
twice
there
so
I'm
just
going
to
go
back
to
structure
content
type
flavors
man
displays
and
for
the
default
display.
I'm
just
gonna
drag
that
image
down
to
the
hidden
area
so
that
it
does
not
display
in
the
main
content
area.
And
now,
if
we
jump
back
to
Mint
you'll
see
just
as
we
expected
the
title
will
the
image
on
the
left
and
then
the
content
on
the
right.
A
And
now,
if
we
go
back
to
the
content
and
go
to
a
post,
where
we
had
check
out
these
scoops,
you
can
see
it's
still
using
the
default
layout
with
a
sidebar
on
the
right
and
that
and
all
the
main
content
on
the
left
and
that
kind
of
thing
so
you're
gonna
see
the
layout
only
applied
to
the
to
the
one
that
we
wanted.
Now.
A
If
we
go
back
to
mint
you'll
see
the
the
chocolate
syrup
topping
was
selected
for
mint.
So
if
we
click
on
that,
you'll
get
the
the
default
display
for
chocolate
syrup
here
and
then
underneath
that
the
two
flavors
that
we
thought
that
topping
might
go
with
chocolate
and
mint
I'd
like
to
change
this
layout
as
well,
and
could
maybe
get
that
image
over
into
the
right-hand
sidebar.
For
for
these
taxonomy
pages.
A
A
Taxonomy
slash
terms:
last
percent
is
the
context
path
that
we'll
use
here
to
let
it
know
that
we're
gonna
have
a
taxonomy
term
coming
in
here.
So
again
you
can
see
the
contexts
jumps
in
here
figures
it
out.
It's
a
term
that
we're
looking
at
and
again
this
isn't
going
to
be
for
all
terms.
It's
going
to
just
be
for
terms
from
the
toppings
vocabulary:
okay,
I'll
create
this
layout
I.
A
Alright,
so
I'm
just
gonna
save
that
and
test
out
how
that
looks.
So
when
we
get
to
the
chocolate
page
and
we
click
on
chocolate
syrup
again,
we'll
have
to
get
rid
of
this
image
out
of
the
main
area,
because
we've
pulled
it
out
here
so
other
than
that
it
looks
like
it's
working.
Just
fine,
so
structure,
taxonomy
toppings
manage
displays,
manage
the
default
display.
We
don't
have
to
show
that
image
because
we're
pulling
it
out
separately
and
yeah,
so
we
should
be
good.
A
Let's
check
it,
mint
go
to
chocolate
syrup
now
we
can
see
the
image
for
the
topping,
shows
here,
description
here
and
then
anything
that's
tagged
with
that
term
shows
up
underneath,
so
we
can
click
through
and
that's
the
basics
of
what
I
wanted
to
show.
One
other
thing,
I'll
note
is
that
you
can
create
a
layout
that
doesn't
have
a
context
that
has
a
specific
path
which
is
actually
what
the
home
layout
is
just.
It
uses
the
path
home,
so
you
could
create
a
layout
at
any
path.
A
You
want
and
then
fill
it
in
with
blocks
and
content
blocks
and
custom
text
blocks
and
view
block,
so
whatever
you
want
to
put
in
the
different
regions
of
the
page
and
fill
it
in
that
way,
I
think
in
in
Drupal.
There
are
modules
that
exist
to
let
you
create
an
empty
page
that
doesn't
have
any
content
which
you
could
then
fill
in
with.
However,
you
want
to,
and
this
essentially
does
that
in
a
much
nicer
way.
A
Alright
and
the
next
last
thing
I'm
going
to
mention
about
layouts-
is
that
you
can.
If
you've
got
a
project
installer
activated
under
functionality,
you
can
click
on
install
new
layouts
and
see
what's
available
from
the
contributed,
layouts
and
click
Add
to
installation
queue,
install
it's
kind
of
just
walks.
You
through
one
two,
three
four
successful,
and
if
you
jump
over
to
settings,
you
should
see
the
new
one
and
there's
senjo,
I
just
added,
and
that's
it
for
this
time.
Thank
you
for
watching
and
feel
free
to
ping
me.