A Recipe for Flexible Editing with Drupal, Panels, Kalatheme and Panopoly

Post on 07-May-2015

3,579 views 1 download

description

In this presentation I demoed a way to use a combination of panels, panelizer, ipe, kalatheme bootstrap and some borrowed panopoly magic mixed with a little bit of custom code to acheive some nice content editor interfaces in a flexible, yet controlled, way.

transcript

A Recipe for Flexible Editing

Carson Black

carsonblack

@carsonblack

www.carsonblack.com

Thursday, May 22, 14

Goals

• Flexibility

• Freedom under a benevolent dictator (developer)

• Structured Content

• Decoration

• Configuration in code

Thursday, May 22, 14

Demo

Thursday, May 22, 14

Prep and Pickup

• Prep

• Things that can be done in advance

• Pickup

• What you do when it’s time to put it together

Thursday, May 22, 14

Prep: Core vs. Panopoly Distro

• Core

• Plus modules

• Panopoly

• Most of what you need

• Plus maybe more than you really want...

Thursday, May 22, 14

Prep: Panels More flexible layout and content placement options

Thursday, May 22, 14

Panelizer

Default layout per bundle

Customize layout and “decoration” per node page

No overridden Features

Allowed content

Thursday, May 22, 14

Panels IPE

In-place editing of page content

Custom layout selection

Thursday, May 22, 14

Panopoly Magic

Customizes IPE Experience

Previews

Customize Views in Panels

Editing field content in IPE

Thursday, May 22, 14

Panopoly Theme Responsive Panels Layouts

Thursday, May 22, 14

Prep: Kalatheme

• Twitter Bootstrap

• Bootstrap importer and subtheme generator

• Panels instead of blocks

• Responsive

• Pane and region style plugins

• Responsive tools

• LESS / SASS

Thursday, May 22, 14

Demo

Thursday, May 22, 14

• Views module and obvious dependencies

• Views Content Panes

• Views Autocomplete Filters

Prep: Views

Thursday, May 22, 14

Prep: Custom Module(s)

• Custom View Modes for a content type

• Custom node templates (tpl.php) per view mode

• Default view mode selected

• Form alterations (Kalacustomize -> Custom) for field labels

Thursday, May 22, 14

Prep: Custom Module - Architecture

Thursday, May 22, 14

Prep: Custom Module - install

Basically, Set the weight of this module higher than Panopoly Magic module

Thursday, May 22, 14

Prep: Custom Module - hook_entity_info_alter()

Thursday, May 22, 14

Prep: Custom Module - hook_preprocess_node()

Thursday, May 22, 14

Prep: Custom Module - hook_theme_registry_alter()

Thursday, May 22, 14

Prep: Custom Module - hook_form_alter()’s

Thursday, May 22, 14

Prep: Custom Module - Node Templates

Thursday, May 22, 14

Pickup: Set Pane and Region Styles

Thursday, May 22, 14

Pickup: Create Content Pane Views

Thursday, May 22, 14

Pickup: Create Content Pane Views

Thursday, May 22, 14

Pickup: Create Content Pane Views

Thursday, May 22, 14

Pickup: Create Content Pane Views

Thursday, May 22, 14

Pickup: Create Content Pane Views

Thursday, May 22, 14

Pickup: Panelizer Allowed Content Settings

Thursday, May 22, 14

Pickup: Panelizer Default Panel Settings

Thursday, May 22, 14

Pickup: Get Crazy! ;-)

Thursday, May 22, 14

Pickup: Panopoly’s “Magical” Widgets

Thursday, May 22, 14

Goals Achieved?

• Flexibility

• Freedom under a benevolent dictator (developer)

• Content Structure vs. Decoration

• Configuration in code (Features friendly)

Thursday, May 22, 14

Thank You!

Carson Black

carsonblack

@carsonblack

www.carsonblack.com

Thursday, May 22, 14

Thursday, May 22, 14