The goal of this presentation is to explain how to minimize the markup that Drupal outputs, and gain complete control over the what and the where of the markup.
Using the system described herein, we can coerce the HTML output of Drupal to match provided designs, or pre-existing HTML Layouts. We are not forced to try to make the Drupal default HTML output look like the design.
For more information, please visit my long form blog post about the subject here:
http://jimbir.ch/blog/using-fences-page-manager-optimize-html-markup-drupal-7
Call Girls Ludhiana Just Call 98765-12871 Top Class Call Girl Service Available
Optimizing Drupal 7 HTML Markup - Using Panels, Page Manager, and Fences to Perfection.
1. OPTIMIZING DRUPAL 7
HTML MARKUP
USING PANELS, PAGE MANAGER, AND
FENCES TO PERFECTION.
Created by Jim Birch
jimbir.ch/optimizing-drupal-7-html-markup
@thejimbirch
Xeno Media, Inc.
2. PANELS AND PAGE MANAGER (CTOOLS)
Allows us to:
completely separate design from content and layout.
easily create variations.
configure customizations rapidly.
3. FENCES MODULE
Helps us to:
gain complete control of every field.
reset all HTML no matter what field type.
add additional field templates available to any field.
4. PANELS ARE FASTER THAN BLOCKS
Going back to 2010, Developers have been writing about
Panels' performance advantage
Lullabot: Assembling Pages with Drupal [2010]
Code Enigma: Performance Of Panels [2012]
Koplowicz and Sons: Panels vs. Blocks [2013]
8. EASILY ADD MORE FIELD TEMPLATES
Create a new TPL in your theme, and Fences will find it and
add it to the list.
field--fences-NAMEOFELEMENT.tpl.php
and
field--fences-NAMEOFELEMENT-multiple.tpl.php
12. ADD LAYOUT PLUGIN LOCATION TO THE
.INFO FILE OF YOUR THEME
; Panels layouts. You can place multiple layouts in this folder.
plugins[panels][layouts] = layouts
13. COPY AN EXISTING LAYOUT PLUGIN FROM:
/sites/all/modules/contrib/panels/plugins/layouts/
The plugin contains 4 files:
.css - The CSS file used to layout the admin.
.inc - Defines the attributes of the layout.
.png - The icon for the layout, used in the admin.
.tpl - The template for layout.
17. PANELS EVERYWHERE
Traditionally, Panels replaces the "content" area of a Drupal
layout.
With the Panels Everywhere module, you can replace the
Region system of Drupal.
20. General Tab: Remove Excess CSS
no-sidebars page-node- node-type-page not-logged-in html
logged-in one-sidebar sidebar-first not-front
SITE TEMPLATE
Define the default layout, provided by the Panels
Everywhere module.
You can also add classes, and ID, or additional CSS to be
loaded inline.
32. SUMMARY
Using Fences, we can gain complete control over fields.
Using the Theme templates, we can strip out any
unwanted HTML inserted by Drupal core.
Page Manager allows us to define layouts, and what
content gets loaded gives us complete control over the
page.
33. THE END
CONTINUING THE CONVERSATION:
Created by Jim Birch
jimbir.ch/optimizing-drupal-7-html-markup
@thejimbirch
Xeno Media, Inc.
35. BONUS POINTS
- For adding pages that
already exist into Page Manager.
Panelizer - For allowing the overriding of invididual
nodes.
Mini Panels - For adding more nesting of Panels inside of
Panels
Custom content panes and Views content panes - Blocks
are slow, use Content Panes instead!
Page Manager Existing Pages