Download - Panels 3 for designers
![Page 1: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/1.jpg)
Panels for designersAn introduction to Panels 3 for people who like
crayons
![Page 2: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/2.jpg)
You do realize, I’m just demoing some moduleanother guy made?
![Page 3: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/3.jpg)
The session
What?
Why?
Basic setup?
+ Views
Workflows & version control
Custom layouts
![Page 4: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/4.jpg)
Jesper WøldicheDesigner
Journalist
Architect
Markup Marine
Danish
Using Drupal since 2008
![Page 5: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/5.jpg)
You?
![Page 6: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/6.jpg)
A word of caution
![Page 7: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/7.jpg)
Earl MilesCreator of Panels
![Page 8: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/8.jpg)
The real Earl Miles(when coding)
![Page 9: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/9.jpg)
Me(while coding)
![Page 10: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/10.jpg)
The workings of PanelsAs I understand it
![Page 11: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/11.jpg)
Config Black Magic Output
![Page 12: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/12.jpg)
Features of Panels
![Page 13: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/13.jpg)
$content
![Page 14: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/14.jpg)
![Page 15: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/15.jpg)
![Page 16: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/16.jpg)
Different layouts and contentA way of serving different layouts and content based on
different criteria.
![Page 17: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/17.jpg)
A way of controllingdisplaysYes, you can do that with node-type.tpl.php and template.php
too…
![Page 18: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/18.jpg)
Making content awareA way of making content aware of context
![Page 19: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/19.jpg)
Why?Reasons to use Panels
![Page 20: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/20.jpg)
One of severaloptions
![Page 21: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/21.jpg)
Reasons to go with Panels
Easy way to theme nodes
Conditional layouts and content
Combining components
Easy export and version control
Context aware content
Easy deployment
![Page 22: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/22.jpg)
Installing panels
![Page 23: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/23.jpg)
Packages
Panels 3.x
Ctools
![Page 24: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/24.jpg)
Extras
Views (2)
CCK
Semantic Views
Semantic CCK
Menu Block
ImageCache etc.
![Page 25: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/25.jpg)
Getting set up
![Page 26: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/26.jpg)
Built in & custom panels
![Page 27: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/27.jpg)
Best friendsforeverViews Content Panes
![Page 28: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/28.jpg)
Exporting Panels
![Page 29: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/29.jpg)
Creating layouts
![Page 30: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/30.jpg)
Adding layouts
sites/all/modules/panels/plugins/layouts/
sites/all/themes/your-theme/layouts/
![Page 31: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/31.jpg)
![Page 32: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/32.jpg)
Anatomy of a customlayout
![Page 33: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/33.jpg)
my_awesome_layout.inc
my-awesome-layout.tpl.php
my_awesome_layout.css
my_awesome_layout.png
![Page 34: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/34.jpg)
What’s in a name?Don’t scare Panels
![Page 35: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/35.jpg)
A few words onstyling
![Page 36: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/36.jpg)
my_awesome_layout.css#panels-dnd-main
![Page 37: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/37.jpg)
Selectors on pages / variantsClasses and IDs for pages
![Page 38: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/38.jpg)
Selectors on contentClasses and IDs for panes
![Page 39: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/39.jpg)
Good o’le CCK and Views
![Page 40: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/40.jpg)
Or take the easy way outSemantic Views and Semantic CCK
![Page 41: Panels 3 for designers](https://reader036.vdocument.in/reader036/viewer/2022081404/5594d9be1a28ab36578b46eb/html5/thumbnails/41.jpg)
Questions?