What I Wish I Had Known In my first 30 days with umbraco
What to expect A fast-paced session for beginners who want to learn from (rather than repeat) others mistakes. Concepts Best practices, tips, rules of thumb Demos (as many as we have time for) Your questions Presentation available at: http://blog.percipientstudios.com
Document types The storage area for your content
Content Pages Your Stuff
Document Type A Box or Container
Content Pages Your Stuff
Document types Use the best container for your content Like packing boxes for your web content (or, like database tables and fields)
FOR IMMEDIATE RELEASE: Contact: Contact Person Company Name Telephone Number Fax Number Email Address Headline City, State, Date Lorem ipsum dolor sit lorem ipsum dolor sit lorem ipsum dolor sit For additional information, contact: Contact Person Company Name Telephone Number Fax Number Email Address ###
FOR IMMEDIATE RELEASE: Contact: Contact Person Company Name Telephone Number Fax Number Email Address Headline City, State, Date Lorem ipsum dolor sit lorem ipsum dolor sit lorem ipsum dolor sit For additional information, contact: Contact Person Company Name Telephone Number Fax Number Email Address ###
Document types Rules of thumb Make as many doctypes as you need If your design has a unique template you probably want a unique doctype as well Typically, a doctype has only one template associated with it
Document types Defacto standard properties: bodytext (primary content richtext editor) umbraconavihide (true/false)
Document types Special property aliases: umbracoredirect A nodeid (contentpicker) Umbraco will redirect to the selected page umbracointernalredirectid A nodeid (contentpicker) Umbraco will load the selected page s content transparently; no url change
Document types Special property aliases, continued: umbracourlname A textstring Override the page s default url umbracourlalias A textstring Add additional urls for the page Example: faq,support/help/answers No spaces, no leading slash, no.aspx
Templates Where doctypes and markup meet
Templates DocTypes define the fields to store Content nodes contain the actual data Templates are for static HTML Notice the separation of content and presentation Save time with parallel site development, design, content entry
Templates Templates are created by a designer Use your favorite design tool Visual Studio Dream Weaver GoLive FrontPage (*gasp*) Umbraco has no limits what you put in is what you get out
Templates Use.NET Master Pages MainNav bodytext HTML with placeholders For doctype property fields <umbraco:item field="bodytext" runat="server"/> For macros <umbraco:macro Alias="MainNav" runat="server" />
Templates Rules of thumb If you need another template, you probably want another doctype to go with it You ll have a unique homepage template You can have multiple templates for a page E.g., Print, RSS feed, Mobile views Remember the?alttemplate= syntax, or append the template alias to the url
Content organization Can make your life easy (or difficult)
Content organization Organize content into logical sections according to website visitor s expectations Url s are created from the content tree structure Easier to remember urls Helps with SEO Place the homepage at the top level, and all other pages below it Macros are easier with this structure Also helpful for multi-language sites
Content organization Keep detailed information in sub-nodes and render the result on the parent container with a macro Job postings Press releases FAQs Products
Content organization Rules of thumb Organize the Media section into folders Store only items used by content nodes in the media section Keep imagery used in the templates and css on the filesystem Users shouldn t be changing these anyway
Simplify the user experience
Simplify the user experience Do as much work for the user as possible Better consistency Easier for the users More praise for you Less time supporting users Arrange doctype properties Organize tabs Supply property descriptions Use mandatory and validation settings (if appropriate)
Simplify the user experience Rules of thumb Add styles in the drop-down list Set richtext editor width to match site design for better WYSIWYG Create multiple RTE datatypes Allows control over width, styles, toolbar features for each doctype Ensure the right content appears in the right place with doctype structure
XSLT macros are easy If you use the built-in samples
XSLT Samples Building Blocks
XSLT macros are easy Macros automate and simplify your site XSLT macros are fast Common uses Main and sub-navigation Sitemap Product list News list Staff list notice the word list in many of these?
XSLT macros are easy Umbraco s built-in xslt macro templates Provide most of the functionality you ll need Can often be used as is Quickly modified Don t require extensive knowledge of XSLT Easier to edit than create
XSLT macros are easy XSLT is simple, but verbose Common functions <xsl:value-of select=" " /> Optional: disable-output-escaping="yes" <xsl:copy-of select=" " /> <xsl:if test=" "> </xsl:if> <xsl:choose> <xsl:when test=" "> </xsl:when> <xsl:otherwise> </xsl:otherwise> </xsl:choose> <xsl:for-each select=" "> </xsl:for-each> <xsl:sort select=" " />
XSLT macros are easy Discover the XML you re working with /data/umbraco.config Contains the XML for the site s content <xsl:copy-of select=" " /> Echoes the XML View browser s source to view output properly Or, <textarea><xsl:copy-of /></textarea> Use with XSLT Visualizer toolbar button
XSLT macros are easy $currentpage provides context for macros The page the website visitor is currently viewing For example, a sub-navigation menu might list those pages below the current page Yes, there s an xslt sample for this
XSLT macros are easy XPATH Is a bit like traversing folders from a command prompt select="$currentpage/node" Is a bit like SQL The 'where' clause is in [brackets] select="./node [@nodetypealias='news'] " Means, select nodes where the nodetypealias is news
XSLT macros are easy Pass parameters to a macro <umbraco:macro alias="mymacro" slogan="the friendly cms" runat="server"/> Remember to set the macro properties and aliases
XSLT macros are easy Pass dynamic parameters to a macro [#propertyalias] Insert a page value [$propertyalias] Insert a recursive page value [%cookievaluekey] Insert a cookie value [@requestvaluekey] Insert value from a request collection
XSLT macros are easy Test for multiple values <umbraco:macro alias="mymacro" slogan="[#propertyalias], [#propertyalias2], my static string" runat="server"/>
XSLT macros are easy Rules of thumb Most XSLT macros are short Umbraco.library and Exslt extensions Functions you ll want to know and use Make your own xslt extensions Use macro caching for performance
XSLT macros are easy Rules of thumb Use XSLT macros to Render umbraco content Use.NET macros to Access external data Edit umbraco content
Don t reinvent the wheel Modules, packages and code available for pillage
Don t reinvent the wheel Some of my favorites CWS2 Runway & Modules ImageGen ImageCropper XSLTsearch ZipUpload umbimport Content & Media Pickers Our.umbraco.org projects Package repository Blogs CodePlex Google include umbraco in your search
Looking for help You re never alone with umbraco
Looking for help Our.umbraco.org Forum, Projects, People Umbraco Pro support Umbraco.tv Training On-site UK training offered by Percipient Studios Twitter #umbraco Blogs Get this presentation at blog.percipientstudios.com Regional meetups