Download - The panels family
![Page 1: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/1.jpg)
The Panels Family
An overview
![Page 2: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/2.jpg)
High Level
• Structure– Page Manager Page– Panels Everywhere
• Content– Panelizer
• Miscellaneous– Panel fields (Views)– Display suite
• Components– Custom content– Custom layouts– Custom styles– Mini Panels– Views panes– Views contexts– Custom rulesets
![Page 3: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/3.jpg)
Typical Drupal Design• Blue areas are regions• Blocks in regions are
unrelated to the content• Have to use PHP snippets
to make blocks context sensitive
• Can only place a block in one region
• All regions always render even when not displayed in page.tpl.php
Header
Left Sidebar
Footer
Right Sidebar
Content
![Page 4: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/4.jpg)
How Designers See A Page
• Everything on a page is a part of the content of that page, taken within the context of the entire site.
Content
![Page 5: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/5.jpg)
How Designers See A Page
• Everything on a page is a part of the content of that page, taken within the context of the entire site.
• Also, designers like grids.
Content
![Page 6: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/6.jpg)
Structure: Page Manager page
• Has URL path of its own• System pages override existing Drupal
functionality• Can assign arguments to contexts• Variants can provide different pages on criteria• Exportable, can be provided by modules
![Page 7: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/7.jpg)
What the Frog is Context?!?!
• Context is the underlying data you need to render a page.
• A context is an object in Drupal: i.e, node, user, view, entity, form, taxonomy term, etc.
• Arguments and relationships produce context• Access rules, relationships, content panes
consume context.
![Page 8: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/8.jpg)
Contexts are objects
• Nodes• Users• Taxonomy terms• Forms• Any other object someone writes a plugin for
![Page 9: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/9.jpg)
Context source: Arguments
http://www.example.com/node/12345
Node: Story XYZ
![Page 10: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/10.jpg)
Context source: Relationships
Node: Story XYZ
Taxonomy Term
Post Author
Node: Author Profile
![Page 11: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/11.jpg)
Context at workHeader
Left Sidebar
Footer
Right Sidebar
Node: Story XYZ
Taxonomy Term
Post Author
Node: Author Profile
![Page 12: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/12.jpg)
Structure: Panels Everywhere
• Partially or Completely replace page.tpl.php and block admin UI
• Change “page template” based upon context.• Assign specific page templates directly to
specific pages.• Exportable, can be provided by modules and
themes.
![Page 13: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/13.jpg)
Content: Panelizer
• Panelizer.module• Node which contains a panel• Can have default panel layout• Content creator can create new layout• Lots of room for future expansion.
Contributors wanted!
![Page 14: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/14.jpg)
Component: Custom Content
• Can simply from the UI or complex from a plugin
• Equivalent to custom blocks in block UI• Can control naming and categorization• Text with an input filter• Reusable• Exportable
![Page 15: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/15.jpg)
Component: Custom layout
• Regions that can contain blocks• Can create as a plugin or using the “flexible”
layout builder from the UI
![Page 16: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/16.jpg)
Complex layout
![Page 17: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/17.jpg)
Component: Custom style
• Can add decorations, such as rounded corners• Can control CSS properties such as font size,
weight• Can repurpose panes to create tabsets,
accordions• Can be plugins, or simpler custom styles can
be created in the UI and exported.• See: Stylizer module
![Page 18: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/18.jpg)
Component: Mini panel
• Anything you want in a panel…in a block (or pane)
• Useful for side by side or for putting several distinct content pieces together for re-use
![Page 19: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/19.jpg)
Component: Views pane
• A special display type that makes a view available as a content pane
• Can use contexts as arguments• Can control the appearance in the Add Content dialog• Can control what config option is available• Can optionally allow panel config to control which
fields show• Can repurpose exposed filters into panel config to
improve experience of content managers
![Page 20: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/20.jpg)
Component: Views context
• Load a view into a context• Split the pieces of a view across a layout• Extract other contexts from view results
![Page 21: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/21.jpg)
Component: Custom ruleset
• Group complex rules (a & b & c) into a single rule to make life easier for content managers
![Page 22: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/22.jpg)
Misc: Panels fields
• Style plugin for view• Split the fields of a view across a layout
![Page 23: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/23.jpg)
Misc: Display suite
• Display suite now can use Panels layout and content to control node layout directly from the display suite UI
![Page 24: The panels family](https://reader035.vdocuments.mx/reader035/viewer/2022081519/5584c451d8b42aeb138b46a2/html5/thumbnails/24.jpg)
Pain Points
• Too many ways to do Views• Can be hard to do forms that aren’t nodes• Modules that don’t talk Panels don’t put their
content in a way Panels can use it• Block system sucks, spreads suck to everything
it touches