— Confucious
Custom
types
Reusable
System
blocks
Conditions
API
Fieldable
Structured markup
Reusable
Contextual links
Configurable
UUIDs in Config
Block layout page organization
Improves block organization
Cleaner HTML than alternative contrib modules
Supports Block Visibility Groups module
Overwrites default block configurations
... see:
d.o/node/2802749
Beta
Panelizer
API
Page
manager
solr_directory:
label: Solr Directory
category: Custom
template: layouts/solr-directory
regions:
header:
label: Directory header
browse:
label: Browse by block
search:
label: Search tools
current:
label: Current search
main:
label: Main content
Reacts to
paths
Permissions
Variants
Contexts
Power and complexity
Uses Contexts (ctools)
Integration with other systems
Learning curve
Developer's tool
Heavy footprint
"All or nothing" approach
<h1 style="border-bottom: 1px solid rgb(214, 214, 214); padding: 0px 0px 10px; margin: 0 0px 0.83em;">
<span style="font-family: HelveticaNeueW01-75Bold, Helvetica, Arial, sans-serif; line-height: 28px;">The WYSIWYG of Doom</span>
</h1>
<h2>
<img src="" />
Why is there an image in this H2?
</h2>
<p> </p>
<p><iframe align="left" frameborder="0" height="333" scrolling="no" src="https://www.youtube.com/embed/1qQ2hYIZn80" style="margin-left: 10px; margin-right: 10px;" title="YouTube video player" width="547"></iframe></p>
<div class="view view-partners view-id-partners view-display-id-panel_pane_1 view-dom-id-61e28642368d45b4be655e02cfe09fb5">
<div class="view-header">
<h2 class="mti_font_element">Featured Drupal Project</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</div>
<div class="view-content">
<div class="views-row views-row-1 views-row-odd views-row-first">
<article about="/content/example1" typeof="sioc:Item foaf:Document" role="article" class="node node--partner node-teaser node--teaser node--partner--teaser">
CKEDITOR.addTemplates( 'custom',
{
imagesPath: CKEDITOR_BASEPATH + '../../themes/custom/images/',
templates :
[
{
title: 'Custom Two Columns',
image: 'custom-two-columns.png',
description: 'Custom two columns flexible layout.',
html:
'<div class="custom-columns">' +
'<div class="custom-columns-row">' +
'<div class="custom-columns-cell"></div>' +
'<div class="custom-columns-cell"></div>' +
'</div>' +
'</div>'
},
]
});
Client feels empowered
Familiar tool
Conserve design budget
Efficient method to output a large amount of data
Custom HTML elements & templates
Design quality suffers
Performance risks
Markup issues
Custom styles & templates aren't bullet-proof
Nestable (2 levels)
Reorderable
Client controls both layout and content
Content not reusable
Not fully multilingual in D7
Edit forms
Beta
IPE
D7 != D8
Core
Entitites
Custom overrides
In-Place Editor
Ability to add additional data
Under active development
New, intuitive interface...
...Unfamiliar interface
Assumes layout risks
Enhances
displays
Drag &
Drop
Custom
layouts
node_full_layout:
label: Full node
category: Custom
template: layouts/node-full
regions:
header:
label: Header
image_card:
label: Image card
baseball_card:
label: Baseball card
upload_card:
label: Upload card
main:
label: Main content
related:
label: Related content
map:
label: Map
Integrates well with styleguides / components
Efficient and familiar UI
Define custom layouts in theme
Create block fields
Does not support custom overrides per entity
Structure stored in database (as opposed to templates)
Generic
templates
Total
control
Specific
templates