SlideShare uma empresa Scribd logo
1 de 20
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

Mais conteúdo relacionado

Mais procurados

Super quick introduction to html5
Super quick introduction to html5Super quick introduction to html5
Super quick introduction to html5Woody 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 itMike 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 chandravadiyaajayrcgmail
 
Making Multisite Work for You
Making Multisite Work for YouMaking Multisite Work for You
Making Multisite Work for Youdrywallbmb
 
Introduction to web application development
Introduction to web application developmentIntroduction to web application development
Introduction to web application developmentAyyappadhas K B
 
Club website demo
Club website demoClub website demo
Club website demoblstov
 
Front end-design and best practices
Front end-design and best practicesFront end-design and best practices
Front end-design and best practicesMario 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 WordPressGerald Glynn
 
WordPress Development in the Enterprise
WordPress Development in the EnterpriseWordPress Development in the Enterprise
WordPress Development in the EnterpriseIan Oeschger
 
Wordcamp Wilmington Wordpress 101
Wordcamp Wilmington Wordpress 101Wordcamp Wilmington Wordpress 101
Wordcamp Wilmington Wordpress 101Jared McMullin
 
Word press 2017 hosting
Word press 2017   hostingWord press 2017   hosting
Word press 2017 hostingAshley Cribb
 
MongoBoston - MongoHQ
MongoBoston - MongoHQMongoBoston - MongoHQ
MongoBoston - MongoHQbenwyrosdick
 
Developing JavaScript Widgets
Developing JavaScript WidgetsDeveloping JavaScript Widgets
Developing JavaScript WidgetsBob German
 
Expert guide for PHP
Expert guide for PHPExpert guide for PHP
Expert guide for PHPSteve Fort
 

Mais procurados (20)

Super quick introduction to html5
Super quick introduction to html5Super quick introduction to html5
Super quick introduction to html5
 
Html intro
Html introHtml intro
Html intro
 
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
 
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
 
Lecture11
Lecture11Lecture11
Lecture11
 
Dangerous CSS
Dangerous CSSDangerous CSS
Dangerous CSS
 
Making Multisite Work for You
Making Multisite Work for YouMaking Multisite Work for You
Making Multisite Work for You
 
Introduction to web application development
Introduction to web application developmentIntroduction to web application development
Introduction to web application development
 
Club website demo
Club website demoClub website demo
Club website demo
 
Web Pages
Web PagesWeb Pages
Web Pages
 
Front end-design and best practices
Front end-design and best practicesFront end-design and best practices
Front end-design and best practices
 
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
 
WordPress Development in the Enterprise
WordPress Development in the EnterpriseWordPress Development in the Enterprise
WordPress Development in the Enterprise
 
Wordcamp Wilmington Wordpress 101
Wordcamp Wilmington Wordpress 101Wordcamp Wilmington Wordpress 101
Wordcamp Wilmington Wordpress 101
 
Word press 2017 hosting
Word press 2017   hostingWord press 2017   hosting
Word press 2017 hosting
 
MongoBoston - MongoHQ
MongoBoston - MongoHQMongoBoston - MongoHQ
MongoBoston - MongoHQ
 
Introduction to maya
Introduction to mayaIntroduction to maya
Introduction to maya
 
Developing JavaScript Widgets
Developing JavaScript WidgetsDeveloping JavaScript Widgets
Developing JavaScript Widgets
 
Expert guide for PHP
Expert guide for PHPExpert guide for PHP
Expert guide for PHP
 
Web storage
Web storage Web storage
Web storage
 

Destaque

Going Multi-Tenant with dotCMS
Going Multi-Tenant with dotCMSGoing Multi-Tenant with dotCMS
Going Multi-Tenant with dotCMSdotCMS
 
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 2012Kai 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 SitecoredotCMS
 
Diffusion-Limited Aggregation
Diffusion-Limited AggregationDiffusion-Limited Aggregation
Diffusion-Limited AggregationAbhranil Das
 
Ikaskuntza eta jarrera 2011 4. gaia
Ikaskuntza eta jarrera 2011 4. gaiaIkaskuntza eta jarrera 2011 4. gaia
Ikaskuntza eta jarrera 2011 4. gaiaKirolPsikologia
 
Landing local customers webinar final
Landing local customers webinar finalLanding local customers webinar final
Landing local customers webinar finalMargaret Stangl
 
Open Source
Open SourceOpen Source
Open Sourcejcluke1
 
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 11mythicgroup
 
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 FinalSally 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 EditionMargaret Stangl
 
Auto-loading of Drupal CCK Nodes
Auto-loading of Drupal CCK NodesAuto-loading of Drupal CCK Nodes
Auto-loading of Drupal CCK Nodesnihiliad
 
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 FAbigail Howe
 
e-politics project
e-politics projecte-politics project
e-politics projectjasonmeyers
 
2ª Investidura em Granito
2ª Investidura em Granito2ª Investidura em Granito
2ª Investidura em GranitoEclesio Modesto
 
Skema Stpm Pam Kertas1 Set2
Skema Stpm Pam Kertas1 Set2Skema Stpm Pam Kertas1 Set2
Skema Stpm Pam Kertas1 Set2Kay Aniza
 

Destaque (20)

Going Multi-Tenant with dotCMS
Going Multi-Tenant with dotCMSGoing Multi-Tenant with dotCMS
Going Multi-Tenant with dotCMS
 
SEO
SEO SEO
SEO
 
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
 
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
 
Diffusion-Limited Aggregation
Diffusion-Limited AggregationDiffusion-Limited Aggregation
Diffusion-Limited Aggregation
 
Ikaskuntza eta jarrera 2011 4. gaia
Ikaskuntza eta jarrera 2011 4. gaiaIkaskuntza eta jarrera 2011 4. gaia
Ikaskuntza eta jarrera 2011 4. gaia
 
Novidades do .Net 4.0
Novidades do .Net 4.0Novidades do .Net 4.0
Novidades do .Net 4.0
 
Landing local customers webinar final
Landing local customers webinar finalLanding local customers webinar final
Landing local customers webinar final
 
Profil tik cerdas
Profil tik cerdasProfil tik cerdas
Profil tik cerdas
 
Open Source
Open SourceOpen Source
Open Source
 
T2, Week 10
T2, Week 10T2, Week 10
T2, Week 10
 
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
 
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
 
Sql Data Services
Sql Data ServicesSql Data Services
Sql Data Services
 
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
 
Auto-loading of Drupal CCK Nodes
Auto-loading of Drupal CCK NodesAuto-loading of Drupal CCK Nodes
Auto-loading of Drupal CCK Nodes
 
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
 
e-politics project
e-politics projecte-politics project
e-politics project
 
2ª Investidura em Granito
2ª Investidura em Granito2ª Investidura em Granito
2ª Investidura em Granito
 
Skema Stpm Pam Kertas1 Set2
Skema Stpm Pam Kertas1 Set2Skema Stpm Pam Kertas1 Set2
Skema Stpm Pam Kertas1 Set2
 

Semelhante a Best Practices for Building Sites in dotCMS

Share point 2013 Building Websites
Share point 2013 Building WebsitesShare point 2013 Building Websites
Share point 2013 Building WebsitesSuhas R Satish
 
Sps redmond 2014 deck
Sps redmond 2014 deckSps redmond 2014 deck
Sps redmond 2014 deckDorinda Reyes
 
Visual Design for Content Management Systems
Visual Design for Content Management SystemsVisual Design for Content Management Systems
Visual Design for Content Management SystemsDani 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 Barcelonahernanibf
 
Blooming SharePoint Design
Blooming SharePoint DesignBlooming SharePoint Design
Blooming SharePoint DesignKathy 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 webmastersMiguel López Zuleta
 
Developing Branding Solutions for 2013
Developing Branding Solutions for 2013Developing Branding Solutions for 2013
Developing Branding Solutions for 2013Thomas 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 frameworkOmkarsoft Bangalore
 
Intermediate Web Design.doc
Intermediate Web Design.docIntermediate Web Design.doc
Intermediate Web Design.docbutest
 
Intermediate Web Design.doc
Intermediate Web Design.docIntermediate Web Design.doc
Intermediate Web Design.docbutest
 
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.pptRyanTeo35
 
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 developmentDave 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.pdfOrtus Solutions, Corp
 
02 From HTML tags to XHTML
02 From HTML tags to XHTML02 From HTML tags to XHTML
02 From HTML tags to XHTMLRich Dron
 
Website Development Guidelines
Website Development GuidelinesWebsite Development Guidelines
Website Development GuidelinesAmit Kute
 
Web technologies-course 02.pptx
Web technologies-course 02.pptxWeb technologies-course 02.pptx
Web technologies-course 02.pptxStefan 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 & ATGVignesh sitaraman
 
Maintainable Sitecore Solutions
Maintainable Sitecore SolutionsMaintainable Sitecore Solutions
Maintainable Sitecore SolutionsThomas Eldblom
 

Semelhante a 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
 
Sps redmond 2014 deck
Sps redmond 2014 deckSps redmond 2014 deck
Sps redmond 2014 deck
 
Visual Design for Content Management Systems
Visual Design for Content Management SystemsVisual Design for Content Management Systems
Visual Design for Content Management Systems
 
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
 
Blooming SharePoint Design
Blooming SharePoint DesignBlooming SharePoint Design
Blooming SharePoint Design
 
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
 
Developing Branding Solutions for 2013
Developing Branding Solutions for 2013Developing Branding Solutions for 2013
Developing Branding Solutions for 2013
 
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
 
Intermediate Web Design.doc
Intermediate Web Design.docIntermediate Web Design.doc
Intermediate Web Design.doc
 
Intermediate Web Design.doc
Intermediate Web Design.docIntermediate Web Design.doc
Intermediate Web Design.doc
 
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 ...
 
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)
 
HTML course.ppt
HTML course.pptHTML course.ppt
HTML course.ppt
 
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
 
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
 
02 From HTML tags to XHTML
02 From HTML tags to XHTML02 From HTML tags to XHTML
02 From HTML tags to XHTML
 
Website Development Guidelines
Website Development GuidelinesWebsite Development Guidelines
Website Development Guidelines
 
Web technologies-course 02.pptx
Web technologies-course 02.pptxWeb technologies-course 02.pptx
Web technologies-course 02.pptx
 
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
 
Maintainable Sitecore Solutions
Maintainable Sitecore SolutionsMaintainable Sitecore Solutions
Maintainable Sitecore Solutions
 

Mais de 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 areasMichael 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 CareerMichael 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 KeynoteMichael 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 AnalyticsMichael Fienen
 
Head First Video Strategy
Head First Video StrategyHead First Video Strategy
Head First Video StrategyMichael 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 ResultsMichael Fienen
 

Mais de 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
 
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
 
Got centerpiece? (#hewebar 2013 edition)
Got centerpiece? (#hewebar 2013 edition)Got centerpiece? (#hewebar 2013 edition)
Got centerpiece? (#hewebar 2013 edition)
 
Creatively Common (#BootCamp12)
Creatively Common (#BootCamp12)Creatively Common (#BootCamp12)
Creatively Common (#BootCamp12)
 
The Web is Human
The Web is HumanThe Web is Human
The Web is Human
 
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
 
(re)Mix010gy (long version)
(re)Mix010gy (long version)(re)Mix010gy (long version)
(re)Mix010gy (long version)
 
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
 
(re)Mix010gy
(re)Mix010gy(re)Mix010gy
(re)Mix010gy
 
Head First Video Strategy
Head First Video StrategyHead First Video Strategy
Head First Video Strategy
 
Got Centerpiece? So Does Everyone Else.
Got Centerpiece? So Does Everyone Else.Got Centerpiece? So Does Everyone Else.
Got Centerpiece? So Does Everyone Else.
 
Check Mini Yields Big Results
Check Mini Yields Big ResultsCheck Mini Yields Big Results
Check Mini Yields Big Results
 

Último

Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Mark Simos
 
"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii SoldatenkoFwdays
 
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024BookNet Canada
 
From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .Alan Dix
 
A Deep Dive on Passkeys: FIDO Paris Seminar.pptx
A Deep Dive on Passkeys: FIDO Paris Seminar.pptxA Deep Dive on Passkeys: FIDO Paris Seminar.pptx
A Deep Dive on Passkeys: FIDO Paris Seminar.pptxLoriGlavin3
 
The Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and ConsThe Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and ConsPixlogix Infotech
 
Gen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfGen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfAddepto
 
The Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptx
The Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptxThe Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptx
The Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptxLoriGlavin3
 
Take control of your SAP testing with UiPath Test Suite
Take control of your SAP testing with UiPath Test SuiteTake control of your SAP testing with UiPath Test Suite
Take control of your SAP testing with UiPath Test SuiteDianaGray10
 
Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Commit University
 
Scanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsScanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsRizwan Syed
 
Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 3652toLead Limited
 
Unleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubUnleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubKalema Edgar
 
Moving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdfMoving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdfLoriGlavin3
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brandgvaughan
 
The State of Passkeys with FIDO Alliance.pptx
The State of Passkeys with FIDO Alliance.pptxThe State of Passkeys with FIDO Alliance.pptx
The State of Passkeys with FIDO Alliance.pptxLoriGlavin3
 
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek SchlawackFwdays
 
Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?Mattias Andersson
 
Advanced Computer Architecture – An Introduction
Advanced Computer Architecture – An IntroductionAdvanced Computer Architecture – An Introduction
Advanced Computer Architecture – An IntroductionDilum Bandara
 

Último (20)

Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
 
"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko
 
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
 
From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .
 
A Deep Dive on Passkeys: FIDO Paris Seminar.pptx
A Deep Dive on Passkeys: FIDO Paris Seminar.pptxA Deep Dive on Passkeys: FIDO Paris Seminar.pptx
A Deep Dive on Passkeys: FIDO Paris Seminar.pptx
 
The Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and ConsThe Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and Cons
 
DMCC Future of Trade Web3 - Special Edition
DMCC Future of Trade Web3 - Special EditionDMCC Future of Trade Web3 - Special Edition
DMCC Future of Trade Web3 - Special Edition
 
Gen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfGen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdf
 
The Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptx
The Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptxThe Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptx
The Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptx
 
Take control of your SAP testing with UiPath Test Suite
Take control of your SAP testing with UiPath Test SuiteTake control of your SAP testing with UiPath Test Suite
Take control of your SAP testing with UiPath Test Suite
 
Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!
 
Scanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsScanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL Certs
 
Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365
 
Unleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubUnleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding Club
 
Moving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdfMoving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdf
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brand
 
The State of Passkeys with FIDO Alliance.pptx
The State of Passkeys with FIDO Alliance.pptxThe State of Passkeys with FIDO Alliance.pptx
The State of Passkeys with FIDO Alliance.pptx
 
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
 
Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?
 
Advanced Computer Architecture – An Introduction
Advanced Computer Architecture – An IntroductionAdvanced Computer Architecture – An Introduction
Advanced Computer Architecture – An Introduction
 

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