SlideShare a Scribd company logo
Best Practices for Building Sites
           in dotCMS
 Presenters:
 Click to edit Master subtitle style
 Michael Fienen – Pittsburg State University, nuCloud LLC, .eduGuru
 Maria Bouza – dotCMS




  @fienen - google.com/profiles/fienen
What we're looking at...
1)Container Must-haves
2)Template vs. Containers
3)Using VTL Files, when and where
4)Widgets
5)URLMap for Detail Pages
6)Custom Forward Pages
7)Valid HTML and 508 Compliance
Container Must-haves
•
    Functional Template Include
    –
        Inserted at the top of templates to include data
        and information
    –
        Loads before <html> tag
    –
        No visual elements included
    –
        Good for:
         •   Global Variables
         •   Macro testing
         •   Timestamps for CSS/JS cachebusters
Example Include Container:
Container Must-haves
•
    Meta Container
    –
        Page Title, Friendly Name and Title for Page details
    –
        HTML Page Meta tags: $!HTMLPAGE_META
          – Good for meta keywords, descriptions, or
            other things you need in the <head> per page 
    –
        Include all common CSS Files
    –
        Include all common JS files
    –
        Lives inside the <head>...</head> tags
Example Meta Container:
Container Must-haves
•
    Statistics Container
    –
        Create one container that holds your Statistics
        code, such as Google Analytics
    –
        Container will normally be included at the end of
        all templates
    –
        If multiple hosts, use Host Property to hold
        Account ID
Example Analytics Container:
Template vs. Containers
•
    dotCMS uses Yahoo Grids (a CSS framework) to create
    HTML used in templates:
    http://developer.yahoo.com/yui/grids/
•
    Try to create small number of templates
•
    Templates should be created only for different layouts,
    the functionality should all be handled through widgets
Template vs. Containers
•
    All reusable sections of the HTML should be
    created as Containers (max contents 0)
•
    All sections of the site that are editable should
    be created as Containers (max contents > 0)
•
    Doctype should be added to template
•
    Head section (<head>) should be created in
    the template to allow to have specific JS and
    CSS files on each template
Looking at Containers
Using VTL files, when and where
•
    Limit use of VTL files only to Simple Widgets
•
    Should not be used as “widgets” parsed from
    containers, content or templates
•
    Should be saved to a central location on the
    site (/application/velocity)
•
    Limit to “application” like functionality
•
    Good as building blocks of complex widgets
•
    Used for source code in some macros
•
    Don’t abuse them!
Widgets
•
    Simple Widgets:
    –
        Use them for dynamic code that does’t need parameters
    –
        Good for generic, dynamic tools (listings, detail page bodies,
        etc...)
•
    Structured Widgets (Widgets that receive
    parameters)
    –
        When the widget needs to be reused on different sections of the
        site
    –
        When we need to send parameters to the widget
    –
        As a front end for macro setup
Structured Widget for Macro
URLMaps for Detail Pages
•
    Create URLMaps for structures (1.9)
•
    Better for SEO purposes (human-readable):
    http://yoursite.com/news/some-unique-field
•
    Easier to print and share
•
    Make sure your structure has at least one
    unique field to tie to.
•
    Example:
    http://1.9.demo.dotcms.org/news/dotcms-launches-1.9
Building a URLMap
Set Up Custom Forward Pages
●   You already do this for your home page when
    you set up the /cmsHomePage virtual link
    (Vanity URL in 1.9)
●   You can also do this with typical error pages
    with:
    /cms###Page
    ●   Works with 400, 401, 402, 403, and 404
Custom 404 Page Example
Valid HTML and 508 Compliance
•
    Garbage in – garbage out. Validate templates before
    loading them in.
      ●
        HTML Validation
        http://validator.w3.org/
     ●
         508 Compliance
         http://www.contentquality.com/
•
    TinyMCE won't do your job for you (even if it wants
    to try)
•
    Microsoft Word hates the internet
Thanks Boys and Girls!


            Questions?
          Hunt me down:
 http://google.com/profiles/fienen

         dotCMS Cheatsheet:
http://tinyurl.com/dotcmscheatsheet
Ad

More Related Content

What's hot (20)

Super quick introduction to html5
Super quick introduction to html5Super quick introduction to html5
Super quick introduction to html5
Woody Pewitt
 
Html intro
Html introHtml intro
Html intro
Danielle Oser, APR
 
Webpack: What it is, What it does, Whether you need it
Webpack: What it is, What it does, Whether you need itWebpack: What it is, What it does, Whether you need it
Webpack: What it is, What it does, Whether you need it
Mike Wilcox
 
Full stack development using javascript what and why - ajay chandravadiya
Full stack development using javascript   what and why - ajay chandravadiyaFull stack development using javascript   what and why - ajay chandravadiya
Full stack development using javascript what and why - ajay chandravadiya
ajayrcgmail
 
Lecture11
Lecture11Lecture11
Lecture11
Châu Thanh Chương
 
Dangerous CSS
Dangerous CSSDangerous CSS
Dangerous CSS
Mike Wilcox
 
Making Multisite Work for You
Making Multisite Work for YouMaking Multisite Work for You
Making Multisite Work for You
drywallbmb
 
Introduction to web application development
Introduction to web application developmentIntroduction to web application development
Introduction to web application development
Ayyappadhas K B
 
Club website demo
Club website demoClub website demo
Club website demo
blstov
 
Web Pages
Web PagesWeb Pages
Web Pages
Sayed Hamid Raza
 
Front end-design and best practices
Front end-design and best practicesFront end-design and best practices
Front end-design and best practices
Mario Hernandez
 
How to Build a Bespoke Page Builder in WordPress
How to Build a Bespoke Page Builder in WordPressHow to Build a Bespoke Page Builder in WordPress
How to Build a Bespoke Page Builder in WordPress
Gerald Glynn
 
WordPress Development in the Enterprise
WordPress Development in the EnterpriseWordPress Development in the Enterprise
WordPress Development in the Enterprise
Ian Oeschger
 
Wordcamp Wilmington Wordpress 101
Wordcamp Wilmington Wordpress 101Wordcamp Wilmington Wordpress 101
Wordcamp Wilmington Wordpress 101
Jared McMullin
 
Word press 2017 hosting
Word press 2017   hostingWord press 2017   hosting
Word press 2017 hosting
Ashley Cribb
 
MongoBoston - MongoHQ
MongoBoston - MongoHQMongoBoston - MongoHQ
MongoBoston - MongoHQ
benwyrosdick
 
Introduction to maya
Introduction to mayaIntroduction to maya
Introduction to maya
ManamiIshimura
 
Developing JavaScript Widgets
Developing JavaScript WidgetsDeveloping JavaScript Widgets
Developing JavaScript Widgets
Bob German
 
Expert guide for PHP
Expert guide for PHPExpert guide for PHP
Expert guide for PHP
Steve Fort
 
Web storage
Web storage Web storage
Web storage
PratikDoiphode1
 
Super quick introduction to html5
Super quick introduction to html5Super quick introduction to html5
Super quick introduction to html5
Woody Pewitt
 
Webpack: What it is, What it does, Whether you need it
Webpack: What it is, What it does, Whether you need itWebpack: What it is, What it does, Whether you need it
Webpack: What it is, What it does, Whether you need it
Mike Wilcox
 
Full stack development using javascript what and why - ajay chandravadiya
Full stack development using javascript   what and why - ajay chandravadiyaFull stack development using javascript   what and why - ajay chandravadiya
Full stack development using javascript what and why - ajay chandravadiya
ajayrcgmail
 
Making Multisite Work for You
Making Multisite Work for YouMaking Multisite Work for You
Making Multisite Work for You
drywallbmb
 
Introduction to web application development
Introduction to web application developmentIntroduction to web application development
Introduction to web application development
Ayyappadhas K B
 
Club website demo
Club website demoClub website demo
Club website demo
blstov
 
Front end-design and best practices
Front end-design and best practicesFront end-design and best practices
Front end-design and best practices
Mario Hernandez
 
How to Build a Bespoke Page Builder in WordPress
How to Build a Bespoke Page Builder in WordPressHow to Build a Bespoke Page Builder in WordPress
How to Build a Bespoke Page Builder in WordPress
Gerald Glynn
 
WordPress Development in the Enterprise
WordPress Development in the EnterpriseWordPress Development in the Enterprise
WordPress Development in the Enterprise
Ian Oeschger
 
Wordcamp Wilmington Wordpress 101
Wordcamp Wilmington Wordpress 101Wordcamp Wilmington Wordpress 101
Wordcamp Wilmington Wordpress 101
Jared McMullin
 
Word press 2017 hosting
Word press 2017   hostingWord press 2017   hosting
Word press 2017 hosting
Ashley Cribb
 
MongoBoston - MongoHQ
MongoBoston - MongoHQMongoBoston - MongoHQ
MongoBoston - MongoHQ
benwyrosdick
 
Developing JavaScript Widgets
Developing JavaScript WidgetsDeveloping JavaScript Widgets
Developing JavaScript Widgets
Bob German
 
Expert guide for PHP
Expert guide for PHPExpert guide for PHP
Expert guide for PHP
Steve Fort
 

Viewers also liked (20)

Going Multi-Tenant with dotCMS
Going Multi-Tenant with dotCMSGoing Multi-Tenant with dotCMS
Going Multi-Tenant with dotCMS
dotCMS
 
SEO
SEO SEO
SEO
dotCMS
 
Systems Integration in the Cloud Era with Apache Camel @ ApacheCon Europe 2012
Systems Integration in the Cloud Era with Apache Camel @ ApacheCon Europe 2012Systems Integration in the Cloud Era with Apache Camel @ ApacheCon Europe 2012
Systems Integration in the Cloud Era with Apache Camel @ ApacheCon Europe 2012
Kai Wähner
 
How to Easily Create a Page in Sitecore
How to Easily Create a Page in SitecoreHow to Easily Create a Page in Sitecore
How to Easily Create a Page in Sitecore
dotCMS
 
Diffusion-Limited Aggregation
Diffusion-Limited AggregationDiffusion-Limited Aggregation
Diffusion-Limited Aggregation
Abhranil Das
 
Ikaskuntza eta jarrera 2011 4. gaia
Ikaskuntza eta jarrera 2011 4. gaiaIkaskuntza eta jarrera 2011 4. gaia
Ikaskuntza eta jarrera 2011 4. gaia
KirolPsikologia
 
Novidades do .Net 4.0
Novidades do .Net 4.0Novidades do .Net 4.0
Novidades do .Net 4.0
Giovanni Bassi
 
Landing local customers webinar final
Landing local customers webinar finalLanding local customers webinar final
Landing local customers webinar final
Margaret Stangl
 
Profil tik cerdas
Profil tik cerdasProfil tik cerdas
Profil tik cerdas
Novianto Raharjo
 
Open Source
Open SourceOpen Source
Open Source
jcluke1
 
T2, Week 10
T2, Week 10T2, Week 10
T2, Week 10
Jeanette Murphy
 
Social Media For Small Business 5 10 11
Social Media For Small Business   5 10 11Social Media For Small Business   5 10 11
Social Media For Small Business 5 10 11
mythicgroup
 
Linked In Mc Kee Consulting Llc Ata 09 Pca Final
Linked In Mc Kee Consulting Llc Ata 09 Pca FinalLinked In Mc Kee Consulting Llc Ata 09 Pca Final
Linked In Mc Kee Consulting Llc Ata 09 Pca Final
Sally Cordova
 
Sql Data Services
Sql Data ServicesSql Data Services
Sql Data Services
James Johnson
 
Mobilizing Communities in a Connected Age Funders Edition
Mobilizing Communities in a Connected Age Funders EditionMobilizing Communities in a Connected Age Funders Edition
Mobilizing Communities in a Connected Age Funders Edition
Margaret Stangl
 
Auto-loading of Drupal CCK Nodes
Auto-loading of Drupal CCK NodesAuto-loading of Drupal CCK Nodes
Auto-loading of Drupal CCK Nodes
nihiliad
 
Pov Big Data And Bmi V F
Pov   Big Data And Bmi V FPov   Big Data And Bmi V F
Pov Big Data And Bmi V F
Abigail Howe
 
e-politics project
e-politics projecte-politics project
e-politics project
jasonmeyers
 
2ª Investidura em Granito
2ª Investidura em Granito2ª Investidura em Granito
2ª Investidura em Granito
Eclesio Modesto
 
Skema Stpm Pam Kertas1 Set2
Skema Stpm Pam Kertas1 Set2Skema Stpm Pam Kertas1 Set2
Skema Stpm Pam Kertas1 Set2
Kay Aniza
 
Going Multi-Tenant with dotCMS
Going Multi-Tenant with dotCMSGoing Multi-Tenant with dotCMS
Going Multi-Tenant with dotCMS
dotCMS
 
Systems Integration in the Cloud Era with Apache Camel @ ApacheCon Europe 2012
Systems Integration in the Cloud Era with Apache Camel @ ApacheCon Europe 2012Systems Integration in the Cloud Era with Apache Camel @ ApacheCon Europe 2012
Systems Integration in the Cloud Era with Apache Camel @ ApacheCon Europe 2012
Kai Wähner
 
How to Easily Create a Page in Sitecore
How to Easily Create a Page in SitecoreHow to Easily Create a Page in Sitecore
How to Easily Create a Page in Sitecore
dotCMS
 
Diffusion-Limited Aggregation
Diffusion-Limited AggregationDiffusion-Limited Aggregation
Diffusion-Limited Aggregation
Abhranil Das
 
Ikaskuntza eta jarrera 2011 4. gaia
Ikaskuntza eta jarrera 2011 4. gaiaIkaskuntza eta jarrera 2011 4. gaia
Ikaskuntza eta jarrera 2011 4. gaia
KirolPsikologia
 
Landing local customers webinar final
Landing local customers webinar finalLanding local customers webinar final
Landing local customers webinar final
Margaret Stangl
 
Open Source
Open SourceOpen Source
Open Source
jcluke1
 
Social Media For Small Business 5 10 11
Social Media For Small Business   5 10 11Social Media For Small Business   5 10 11
Social Media For Small Business 5 10 11
mythicgroup
 
Linked In Mc Kee Consulting Llc Ata 09 Pca Final
Linked In Mc Kee Consulting Llc Ata 09 Pca FinalLinked In Mc Kee Consulting Llc Ata 09 Pca Final
Linked In Mc Kee Consulting Llc Ata 09 Pca Final
Sally Cordova
 
Mobilizing Communities in a Connected Age Funders Edition
Mobilizing Communities in a Connected Age Funders EditionMobilizing Communities in a Connected Age Funders Edition
Mobilizing Communities in a Connected Age Funders Edition
Margaret Stangl
 
Auto-loading of Drupal CCK Nodes
Auto-loading of Drupal CCK NodesAuto-loading of Drupal CCK Nodes
Auto-loading of Drupal CCK Nodes
nihiliad
 
Pov Big Data And Bmi V F
Pov   Big Data And Bmi V FPov   Big Data And Bmi V F
Pov Big Data And Bmi V F
Abigail Howe
 
e-politics project
e-politics projecte-politics project
e-politics project
jasonmeyers
 
2ª Investidura em Granito
2ª Investidura em Granito2ª Investidura em Granito
2ª Investidura em Granito
Eclesio Modesto
 
Skema Stpm Pam Kertas1 Set2
Skema Stpm Pam Kertas1 Set2Skema Stpm Pam Kertas1 Set2
Skema Stpm Pam Kertas1 Set2
Kay Aniza
 
Ad

Similar to Best Practices for Building Sites in dotCMS (20)

Share point 2013 Building Websites
Share point 2013 Building WebsitesShare point 2013 Building Websites
Share point 2013 Building Websites
Suhas R Satish
 
Sps redmond 2014 deck
Sps redmond 2014 deckSps redmond 2014 deck
Sps redmond 2014 deck
Dorinda Reyes
 
Visual Design for Content Management Systems
Visual Design for Content Management SystemsVisual Design for Content Management Systems
Visual Design for Content Management Systems
Dani Nordin
 
Drupal architectures for flexible content - Drupalcon Barcelona
Drupal architectures for flexible content - Drupalcon BarcelonaDrupal architectures for flexible content - Drupalcon Barcelona
Drupal architectures for flexible content - Drupalcon Barcelona
hernanibf
 
Blooming SharePoint Design
Blooming SharePoint DesignBlooming SharePoint Design
Blooming SharePoint Design
Kathy Hughes
 
Guía SEO 2020: Trucos y recomendaciones para desarrolladores y webmasters
Guía SEO 2020: Trucos y recomendaciones para desarrolladores y webmastersGuía SEO 2020: Trucos y recomendaciones para desarrolladores y webmasters
Guía SEO 2020: Trucos y recomendaciones para desarrolladores y webmasters
Miguel López Zuleta
 
Developing Branding Solutions for 2013
Developing Branding Solutions for 2013Developing Branding Solutions for 2013
Developing Branding Solutions for 2013
Thomas Daly
 
Know the reason behind choosing bootstrap as css framework
Know the reason behind choosing bootstrap as css frameworkKnow the reason behind choosing bootstrap as css framework
Know the reason behind choosing bootstrap as css framework
Omkarsoft Bangalore
 
Intermediate Web Design.doc
Intermediate Web Design.docIntermediate Web Design.doc
Intermediate Web Design.doc
butest
 
Intermediate Web Design.doc
Intermediate Web Design.docIntermediate Web Design.doc
Intermediate Web Design.doc
butest
 
Popping the Hood: How to Create Custom SharePoint Branding by Randy Drisgill ...
Popping the Hood: How to Create Custom SharePoint Branding by Randy Drisgill ...Popping the Hood: How to Create Custom SharePoint Branding by Randy Drisgill ...
Popping the Hood: How to Create Custom SharePoint Branding by Randy Drisgill ...
SPTechCon
 
Module 4 - Dreamweaver Templates (Static vs. Dynamic Content)
Module 4 - Dreamweaver Templates (Static vs. Dynamic Content)Module 4 - Dreamweaver Templates (Static vs. Dynamic Content)
Module 4 - Dreamweaver Templates (Static vs. Dynamic Content)
Katherine McCurdy-Lapierre, R.G.D.
 
HTML course.ppt
HTML course.pptHTML course.ppt
HTML course.ppt
RyanTeo35
 
Content Management Systems (CMS) & Wordpress theme development
Content Management Systems (CMS) & Wordpress theme developmentContent Management Systems (CMS) & Wordpress theme development
Content Management Systems (CMS) & Wordpress theme development
Dave Wallace
 
ITB_2023_Extend_your_contentbox_apps_with_custom_modules_Javier_Quintero.pdf
ITB_2023_Extend_your_contentbox_apps_with_custom_modules_Javier_Quintero.pdfITB_2023_Extend_your_contentbox_apps_with_custom_modules_Javier_Quintero.pdf
ITB_2023_Extend_your_contentbox_apps_with_custom_modules_Javier_Quintero.pdf
Ortus Solutions, Corp
 
02 From HTML tags to XHTML
02 From HTML tags to XHTML02 From HTML tags to XHTML
02 From HTML tags to XHTML
Rich Dron
 
Website Development Guidelines
Website Development GuidelinesWebsite Development Guidelines
Website Development Guidelines
Amit Kute
 
Web technologies-course 02.pptx
Web technologies-course 02.pptxWeb technologies-course 02.pptx
Web technologies-course 02.pptx
Stefan Oprea
 
Search engine optimization (seo) from Endeca & ATG
Search engine optimization (seo) from Endeca & ATGSearch engine optimization (seo) from Endeca & ATG
Search engine optimization (seo) from Endeca & ATG
Vignesh sitaraman
 
Maintainable Sitecore Solutions
Maintainable Sitecore SolutionsMaintainable Sitecore Solutions
Maintainable Sitecore Solutions
Thomas Eldblom
 
Share point 2013 Building Websites
Share point 2013 Building WebsitesShare point 2013 Building Websites
Share point 2013 Building Websites
Suhas R Satish
 
Sps redmond 2014 deck
Sps redmond 2014 deckSps redmond 2014 deck
Sps redmond 2014 deck
Dorinda Reyes
 
Visual Design for Content Management Systems
Visual Design for Content Management SystemsVisual Design for Content Management Systems
Visual Design for Content Management Systems
Dani Nordin
 
Drupal architectures for flexible content - Drupalcon Barcelona
Drupal architectures for flexible content - Drupalcon BarcelonaDrupal architectures for flexible content - Drupalcon Barcelona
Drupal architectures for flexible content - Drupalcon Barcelona
hernanibf
 
Blooming SharePoint Design
Blooming SharePoint DesignBlooming SharePoint Design
Blooming SharePoint Design
Kathy Hughes
 
Guía SEO 2020: Trucos y recomendaciones para desarrolladores y webmasters
Guía SEO 2020: Trucos y recomendaciones para desarrolladores y webmastersGuía SEO 2020: Trucos y recomendaciones para desarrolladores y webmasters
Guía SEO 2020: Trucos y recomendaciones para desarrolladores y webmasters
Miguel López Zuleta
 
Developing Branding Solutions for 2013
Developing Branding Solutions for 2013Developing Branding Solutions for 2013
Developing Branding Solutions for 2013
Thomas Daly
 
Know the reason behind choosing bootstrap as css framework
Know the reason behind choosing bootstrap as css frameworkKnow the reason behind choosing bootstrap as css framework
Know the reason behind choosing bootstrap as css framework
Omkarsoft Bangalore
 
Intermediate Web Design.doc
Intermediate Web Design.docIntermediate Web Design.doc
Intermediate Web Design.doc
butest
 
Intermediate Web Design.doc
Intermediate Web Design.docIntermediate Web Design.doc
Intermediate Web Design.doc
butest
 
Popping the Hood: How to Create Custom SharePoint Branding by Randy Drisgill ...
Popping the Hood: How to Create Custom SharePoint Branding by Randy Drisgill ...Popping the Hood: How to Create Custom SharePoint Branding by Randy Drisgill ...
Popping the Hood: How to Create Custom SharePoint Branding by Randy Drisgill ...
SPTechCon
 
HTML course.ppt
HTML course.pptHTML course.ppt
HTML course.ppt
RyanTeo35
 
Content Management Systems (CMS) & Wordpress theme development
Content Management Systems (CMS) & Wordpress theme developmentContent Management Systems (CMS) & Wordpress theme development
Content Management Systems (CMS) & Wordpress theme development
Dave Wallace
 
ITB_2023_Extend_your_contentbox_apps_with_custom_modules_Javier_Quintero.pdf
ITB_2023_Extend_your_contentbox_apps_with_custom_modules_Javier_Quintero.pdfITB_2023_Extend_your_contentbox_apps_with_custom_modules_Javier_Quintero.pdf
ITB_2023_Extend_your_contentbox_apps_with_custom_modules_Javier_Quintero.pdf
Ortus Solutions, Corp
 
02 From HTML tags to XHTML
02 From HTML tags to XHTML02 From HTML tags to XHTML
02 From HTML tags to XHTML
Rich Dron
 
Website Development Guidelines
Website Development GuidelinesWebsite Development Guidelines
Website Development Guidelines
Amit Kute
 
Web technologies-course 02.pptx
Web technologies-course 02.pptxWeb technologies-course 02.pptx
Web technologies-course 02.pptx
Stefan Oprea
 
Search engine optimization (seo) from Endeca & ATG
Search engine optimization (seo) from Endeca & ATGSearch engine optimization (seo) from Endeca & ATG
Search engine optimization (seo) from Endeca & ATG
Vignesh sitaraman
 
Maintainable Sitecore Solutions
Maintainable Sitecore SolutionsMaintainable Sitecore Solutions
Maintainable Sitecore Solutions
Thomas Eldblom
 
Ad

More from Michael Fienen (12)

Acceptable application of analytics for your academic areas
Acceptable application of analytics for your academic areasAcceptable application of analytics for your academic areas
Acceptable application of analytics for your academic areas
Michael Fienen
 
My God, It's Full of Stars: Your Guide to a Visual Design Career
My God, It's Full of Stars: Your Guide to a Visual Design CareerMy God, It's Full of Stars: Your Guide to a Visual Design Career
My God, It's Full of Stars: Your Guide to a Visual Design Career
Michael Fienen
 
Got centerpiece? (#hewebar 2013 edition)
Got centerpiece? (#hewebar 2013 edition)Got centerpiece? (#hewebar 2013 edition)
Got centerpiece? (#hewebar 2013 edition)
Michael Fienen
 
Creatively Common (#BootCamp12)
Creatively Common (#BootCamp12)Creatively Common (#BootCamp12)
Creatively Common (#BootCamp12)
Michael Fienen
 
The Web is Human
The Web is HumanThe Web is Human
The Web is Human
Michael Fienen
 
Sharing Superheroes - J.Boye Philadelphia 2012 Keynote
Sharing Superheroes - J.Boye Philadelphia 2012 KeynoteSharing Superheroes - J.Boye Philadelphia 2012 Keynote
Sharing Superheroes - J.Boye Philadelphia 2012 Keynote
Michael Fienen
 
(re)Mix010gy (long version)
(re)Mix010gy (long version)(re)Mix010gy (long version)
(re)Mix010gy (long version)
Michael Fienen
 
Chaos in Context: Informed Design Through Analytics
Chaos in Context: Informed Design Through AnalyticsChaos in Context: Informed Design Through Analytics
Chaos in Context: Informed Design Through Analytics
Michael Fienen
 
(re)Mix010gy
(re)Mix010gy(re)Mix010gy
(re)Mix010gy
Michael Fienen
 
Head First Video Strategy
Head First Video StrategyHead First Video Strategy
Head First Video Strategy
Michael Fienen
 
Got Centerpiece? So Does Everyone Else.
Got Centerpiece? So Does Everyone Else.Got Centerpiece? So Does Everyone Else.
Got Centerpiece? So Does Everyone Else.
Michael Fienen
 
Check Mini Yields Big Results
Check Mini Yields Big ResultsCheck Mini Yields Big Results
Check Mini Yields Big Results
Michael Fienen
 
Acceptable application of analytics for your academic areas
Acceptable application of analytics for your academic areasAcceptable application of analytics for your academic areas
Acceptable application of analytics for your academic areas
Michael Fienen
 
My God, It's Full of Stars: Your Guide to a Visual Design Career
My God, It's Full of Stars: Your Guide to a Visual Design CareerMy God, It's Full of Stars: Your Guide to a Visual Design Career
My God, It's Full of Stars: Your Guide to a Visual Design Career
Michael Fienen
 
Got centerpiece? (#hewebar 2013 edition)
Got centerpiece? (#hewebar 2013 edition)Got centerpiece? (#hewebar 2013 edition)
Got centerpiece? (#hewebar 2013 edition)
Michael Fienen
 
Creatively Common (#BootCamp12)
Creatively Common (#BootCamp12)Creatively Common (#BootCamp12)
Creatively Common (#BootCamp12)
Michael Fienen
 
Sharing Superheroes - J.Boye Philadelphia 2012 Keynote
Sharing Superheroes - J.Boye Philadelphia 2012 KeynoteSharing Superheroes - J.Boye Philadelphia 2012 Keynote
Sharing Superheroes - J.Boye Philadelphia 2012 Keynote
Michael Fienen
 
(re)Mix010gy (long version)
(re)Mix010gy (long version)(re)Mix010gy (long version)
(re)Mix010gy (long version)
Michael Fienen
 
Chaos in Context: Informed Design Through Analytics
Chaos in Context: Informed Design Through AnalyticsChaos in Context: Informed Design Through Analytics
Chaos in Context: Informed Design Through Analytics
Michael Fienen
 
Head First Video Strategy
Head First Video StrategyHead First Video Strategy
Head First Video Strategy
Michael Fienen
 
Got Centerpiece? So Does Everyone Else.
Got Centerpiece? So Does Everyone Else.Got Centerpiece? So Does Everyone Else.
Got Centerpiece? So Does Everyone Else.
Michael Fienen
 
Check Mini Yields Big Results
Check Mini Yields Big ResultsCheck Mini Yields Big Results
Check Mini Yields Big Results
Michael Fienen
 

Recently uploaded (20)

Electronic_Mail_Attacks-1-35.pdf by xploit
Electronic_Mail_Attacks-1-35.pdf by xploitElectronic_Mail_Attacks-1-35.pdf by xploit
Electronic_Mail_Attacks-1-35.pdf by xploit
niftliyevhuseyn
 
AI Changes Everything – Talk at Cardiff Metropolitan University, 29th April 2...
AI Changes Everything – Talk at Cardiff Metropolitan University, 29th April 2...AI Changes Everything – Talk at Cardiff Metropolitan University, 29th April 2...
AI Changes Everything – Talk at Cardiff Metropolitan University, 29th April 2...
Alan Dix
 
Build Your Own Copilot & Agents For Devs
Build Your Own Copilot & Agents For DevsBuild Your Own Copilot & Agents For Devs
Build Your Own Copilot & Agents For Devs
Brian McKeiver
 
TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...
TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...
TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...
TrustArc
 
Generative Artificial Intelligence (GenAI) in Business
Generative Artificial Intelligence (GenAI) in BusinessGenerative Artificial Intelligence (GenAI) in Business
Generative Artificial Intelligence (GenAI) in Business
Dr. Tathagat Varma
 
What is Model Context Protocol(MCP) - The new technology for communication bw...
What is Model Context Protocol(MCP) - The new technology for communication bw...What is Model Context Protocol(MCP) - The new technology for communication bw...
What is Model Context Protocol(MCP) - The new technology for communication bw...
Vishnu Singh Chundawat
 
AI and Data Privacy in 2025: Global Trends
AI and Data Privacy in 2025: Global TrendsAI and Data Privacy in 2025: Global Trends
AI and Data Privacy in 2025: Global Trends
InData Labs
 
How Can I use the AI Hype in my Business Context?
How Can I use the AI Hype in my Business Context?How Can I use the AI Hype in my Business Context?
How Can I use the AI Hype in my Business Context?
Daniel Lehner
 
Noah Loul Shares 5 Steps to Implement AI Agents for Maximum Business Efficien...
Noah Loul Shares 5 Steps to Implement AI Agents for Maximum Business Efficien...Noah Loul Shares 5 Steps to Implement AI Agents for Maximum Business Efficien...
Noah Loul Shares 5 Steps to Implement AI Agents for Maximum Business Efficien...
Noah Loul
 
Increasing Retail Store Efficiency How can Planograms Save Time and Money.pptx
Increasing Retail Store Efficiency How can Planograms Save Time and Money.pptxIncreasing Retail Store Efficiency How can Planograms Save Time and Money.pptx
Increasing Retail Store Efficiency How can Planograms Save Time and Money.pptx
Anoop Ashok
 
Cyber Awareness overview for 2025 month of security
Cyber Awareness overview for 2025 month of securityCyber Awareness overview for 2025 month of security
Cyber Awareness overview for 2025 month of security
riccardosl1
 
Mobile App Development Company in Saudi Arabia
Mobile App Development Company in Saudi ArabiaMobile App Development Company in Saudi Arabia
Mobile App Development Company in Saudi Arabia
Steve Jonas
 
Enhancing ICU Intelligence: How Our Functional Testing Enabled a Healthcare I...
Enhancing ICU Intelligence: How Our Functional Testing Enabled a Healthcare I...Enhancing ICU Intelligence: How Our Functional Testing Enabled a Healthcare I...
Enhancing ICU Intelligence: How Our Functional Testing Enabled a Healthcare I...
Impelsys Inc.
 
2025-05-Q4-2024-Investor-Presentation.pptx
2025-05-Q4-2024-Investor-Presentation.pptx2025-05-Q4-2024-Investor-Presentation.pptx
2025-05-Q4-2024-Investor-Presentation.pptx
Samuele Fogagnolo
 
Linux Professional Institute LPIC-1 Exam.pdf
Linux Professional Institute LPIC-1 Exam.pdfLinux Professional Institute LPIC-1 Exam.pdf
Linux Professional Institute LPIC-1 Exam.pdf
RHCSA Guru
 
SAP Modernization: Maximizing the Value of Your SAP S/4HANA Migration.pdf
SAP Modernization: Maximizing the Value of Your SAP S/4HANA Migration.pdfSAP Modernization: Maximizing the Value of Your SAP S/4HANA Migration.pdf
SAP Modernization: Maximizing the Value of Your SAP S/4HANA Migration.pdf
Precisely
 
Role of Data Annotation Services in AI-Powered Manufacturing
Role of Data Annotation Services in AI-Powered ManufacturingRole of Data Annotation Services in AI-Powered Manufacturing
Role of Data Annotation Services in AI-Powered Manufacturing
Andrew Leo
 
Into The Box Conference Keynote Day 1 (ITB2025)
Into The Box Conference Keynote Day 1 (ITB2025)Into The Box Conference Keynote Day 1 (ITB2025)
Into The Box Conference Keynote Day 1 (ITB2025)
Ortus Solutions, Corp
 
ThousandEyes Partner Innovation Updates for May 2025
ThousandEyes Partner Innovation Updates for May 2025ThousandEyes Partner Innovation Updates for May 2025
ThousandEyes Partner Innovation Updates for May 2025
ThousandEyes
 
How analogue intelligence complements AI
How analogue intelligence complements AIHow analogue intelligence complements AI
How analogue intelligence complements AI
Paul Rowe
 
Electronic_Mail_Attacks-1-35.pdf by xploit
Electronic_Mail_Attacks-1-35.pdf by xploitElectronic_Mail_Attacks-1-35.pdf by xploit
Electronic_Mail_Attacks-1-35.pdf by xploit
niftliyevhuseyn
 
AI Changes Everything – Talk at Cardiff Metropolitan University, 29th April 2...
AI Changes Everything – Talk at Cardiff Metropolitan University, 29th April 2...AI Changes Everything – Talk at Cardiff Metropolitan University, 29th April 2...
AI Changes Everything – Talk at Cardiff Metropolitan University, 29th April 2...
Alan Dix
 
Build Your Own Copilot & Agents For Devs
Build Your Own Copilot & Agents For DevsBuild Your Own Copilot & Agents For Devs
Build Your Own Copilot & Agents For Devs
Brian McKeiver
 
TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...
TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...
TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...
TrustArc
 
Generative Artificial Intelligence (GenAI) in Business
Generative Artificial Intelligence (GenAI) in BusinessGenerative Artificial Intelligence (GenAI) in Business
Generative Artificial Intelligence (GenAI) in Business
Dr. Tathagat Varma
 
What is Model Context Protocol(MCP) - The new technology for communication bw...
What is Model Context Protocol(MCP) - The new technology for communication bw...What is Model Context Protocol(MCP) - The new technology for communication bw...
What is Model Context Protocol(MCP) - The new technology for communication bw...
Vishnu Singh Chundawat
 
AI and Data Privacy in 2025: Global Trends
AI and Data Privacy in 2025: Global TrendsAI and Data Privacy in 2025: Global Trends
AI and Data Privacy in 2025: Global Trends
InData Labs
 
How Can I use the AI Hype in my Business Context?
How Can I use the AI Hype in my Business Context?How Can I use the AI Hype in my Business Context?
How Can I use the AI Hype in my Business Context?
Daniel Lehner
 
Noah Loul Shares 5 Steps to Implement AI Agents for Maximum Business Efficien...
Noah Loul Shares 5 Steps to Implement AI Agents for Maximum Business Efficien...Noah Loul Shares 5 Steps to Implement AI Agents for Maximum Business Efficien...
Noah Loul Shares 5 Steps to Implement AI Agents for Maximum Business Efficien...
Noah Loul
 
Increasing Retail Store Efficiency How can Planograms Save Time and Money.pptx
Increasing Retail Store Efficiency How can Planograms Save Time and Money.pptxIncreasing Retail Store Efficiency How can Planograms Save Time and Money.pptx
Increasing Retail Store Efficiency How can Planograms Save Time and Money.pptx
Anoop Ashok
 
Cyber Awareness overview for 2025 month of security
Cyber Awareness overview for 2025 month of securityCyber Awareness overview for 2025 month of security
Cyber Awareness overview for 2025 month of security
riccardosl1
 
Mobile App Development Company in Saudi Arabia
Mobile App Development Company in Saudi ArabiaMobile App Development Company in Saudi Arabia
Mobile App Development Company in Saudi Arabia
Steve Jonas
 
Enhancing ICU Intelligence: How Our Functional Testing Enabled a Healthcare I...
Enhancing ICU Intelligence: How Our Functional Testing Enabled a Healthcare I...Enhancing ICU Intelligence: How Our Functional Testing Enabled a Healthcare I...
Enhancing ICU Intelligence: How Our Functional Testing Enabled a Healthcare I...
Impelsys Inc.
 
2025-05-Q4-2024-Investor-Presentation.pptx
2025-05-Q4-2024-Investor-Presentation.pptx2025-05-Q4-2024-Investor-Presentation.pptx
2025-05-Q4-2024-Investor-Presentation.pptx
Samuele Fogagnolo
 
Linux Professional Institute LPIC-1 Exam.pdf
Linux Professional Institute LPIC-1 Exam.pdfLinux Professional Institute LPIC-1 Exam.pdf
Linux Professional Institute LPIC-1 Exam.pdf
RHCSA Guru
 
SAP Modernization: Maximizing the Value of Your SAP S/4HANA Migration.pdf
SAP Modernization: Maximizing the Value of Your SAP S/4HANA Migration.pdfSAP Modernization: Maximizing the Value of Your SAP S/4HANA Migration.pdf
SAP Modernization: Maximizing the Value of Your SAP S/4HANA Migration.pdf
Precisely
 
Role of Data Annotation Services in AI-Powered Manufacturing
Role of Data Annotation Services in AI-Powered ManufacturingRole of Data Annotation Services in AI-Powered Manufacturing
Role of Data Annotation Services in AI-Powered Manufacturing
Andrew Leo
 
Into The Box Conference Keynote Day 1 (ITB2025)
Into The Box Conference Keynote Day 1 (ITB2025)Into The Box Conference Keynote Day 1 (ITB2025)
Into The Box Conference Keynote Day 1 (ITB2025)
Ortus Solutions, Corp
 
ThousandEyes Partner Innovation Updates for May 2025
ThousandEyes Partner Innovation Updates for May 2025ThousandEyes Partner Innovation Updates for May 2025
ThousandEyes Partner Innovation Updates for May 2025
ThousandEyes
 
How analogue intelligence complements AI
How analogue intelligence complements AIHow analogue intelligence complements AI
How analogue intelligence complements AI
Paul Rowe
 

Best Practices for Building Sites in dotCMS

  • 1. Best Practices for Building Sites in dotCMS Presenters: Click to edit Master subtitle style Michael Fienen – Pittsburg State University, nuCloud LLC, .eduGuru Maria Bouza – dotCMS @fienen - google.com/profiles/fienen
  • 2. What we're looking at... 1)Container Must-haves 2)Template vs. Containers 3)Using VTL Files, when and where 4)Widgets 5)URLMap for Detail Pages 6)Custom Forward Pages 7)Valid HTML and 508 Compliance
  • 3. Container Must-haves • Functional Template Include – Inserted at the top of templates to include data and information – Loads before <html> tag – No visual elements included – Good for: • Global Variables • Macro testing • Timestamps for CSS/JS cachebusters
  • 5. Container Must-haves • Meta Container – Page Title, Friendly Name and Title for Page details – HTML Page Meta tags: $!HTMLPAGE_META – Good for meta keywords, descriptions, or other things you need in the <head> per page  – Include all common CSS Files – Include all common JS files – Lives inside the <head>...</head> tags
  • 7. Container Must-haves • Statistics Container – Create one container that holds your Statistics code, such as Google Analytics – Container will normally be included at the end of all templates – If multiple hosts, use Host Property to hold Account ID
  • 9. Template vs. Containers • dotCMS uses Yahoo Grids (a CSS framework) to create HTML used in templates: http://developer.yahoo.com/yui/grids/ • Try to create small number of templates • Templates should be created only for different layouts, the functionality should all be handled through widgets
  • 10. Template vs. Containers • All reusable sections of the HTML should be created as Containers (max contents 0) • All sections of the site that are editable should be created as Containers (max contents > 0) • Doctype should be added to template • Head section (<head>) should be created in the template to allow to have specific JS and CSS files on each template
  • 12. Using VTL files, when and where • Limit use of VTL files only to Simple Widgets • Should not be used as “widgets” parsed from containers, content or templates • Should be saved to a central location on the site (/application/velocity) • Limit to “application” like functionality • Good as building blocks of complex widgets • Used for source code in some macros • Don’t abuse them!
  • 13. Widgets • Simple Widgets: – Use them for dynamic code that does’t need parameters – Good for generic, dynamic tools (listings, detail page bodies, etc...) • Structured Widgets (Widgets that receive parameters) – When the widget needs to be reused on different sections of the site – When we need to send parameters to the widget – As a front end for macro setup
  • 15. URLMaps for Detail Pages • Create URLMaps for structures (1.9) • Better for SEO purposes (human-readable): http://yoursite.com/news/some-unique-field • Easier to print and share • Make sure your structure has at least one unique field to tie to. • Example: http://1.9.demo.dotcms.org/news/dotcms-launches-1.9
  • 17. Set Up Custom Forward Pages ● You already do this for your home page when you set up the /cmsHomePage virtual link (Vanity URL in 1.9) ● You can also do this with typical error pages with: /cms###Page ● Works with 400, 401, 402, 403, and 404
  • 18. Custom 404 Page Example
  • 19. Valid HTML and 508 Compliance • Garbage in – garbage out. Validate templates before loading them in. ● HTML Validation http://validator.w3.org/ ● 508 Compliance http://www.contentquality.com/ • TinyMCE won't do your job for you (even if it wants to try) • Microsoft Word hates the internet
  • 20. Thanks Boys and Girls! Questions? Hunt me down: http://google.com/profiles/fienen dotCMS Cheatsheet: http://tinyurl.com/dotcmscheatsheet