An Introduction to Umbraco

  • 2,083 views
Uploaded on

This targets an audience that is new to Umbraco, .net, or CMS.

This targets an audience that is new to Umbraco, .net, or CMS.

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
2,083
On Slideshare
0
From Embeds
0
Number of Embeds
3

Actions

Shares
Downloads
23
Comments
0
Likes
1

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Moving from classic web site development to a CMS
  • 2.  Umbraco is a Content Management System A CMS is an application(s) that makes it easy to publish, edit, and manage web based content. Typically, a CMS is a web application that allows editing of the content inside the browser. This is an alternative to creating files on your local computer, then uploading them to the hosting provider.
  • 3.  Classic web sites used collection of HTML files to store content. An index.htm or default.htm file would placed in the root of your www folder. Each HTML file would contain part of the completely rendered page. The URL correlates directly to the file system.  Example - Mysite.com/ContentPage1.htm
  • 4.  The web application parses the URL to determine the action needed The URL will a contain a ‘key’ to a record in the database The method used by the web application may be unique or may implement a popular pattern.  Example Umbraco URL ▪ MyUmbracoSite.com/MyPage
  • 5.  For general development in a CMS, you don’t need to understand how it accesses the content. You just need to know how to use the CMS to develop content. Common Example of Abstraction  Using a key in a car  You don’t need to understand how to wire the ignition up.  The keyhole is a standard interface.
  • 6.  A flexible open-source content management system developed on the .NET framework  http://umbraco.com/videoplayer.aspx?videoURL= /assets/umbracotv/introduction/tour/tour.flv
  • 7.  Deployment options  Many hosting providers have an Umbraco installation script available in the hosting interface.  Install locally and publish the files to the remote server. ▪ In this case, using WebMatrix is an easy way to install, develop, and deploy your Umbraco installation ▪ http://www.microsoft.com/web/post/installing-umbraco- with-webmatrix  You can also install Umbraco on Azure ▪ http://umbraco.com/azure
  • 8.  Download and install WebMatrix
  • 9.  You may be required to install other dependencies during the installation of WebMatrix.
  • 10.  If the installation fails, try installing again.  Network issues, for example, can cause a temporary installation issue. If you continue to get a failed install, investigate the components that failed to install.
  • 11.  Use Bing to investigate any error message.
  • 12.  Re-launch the installation to access the dependency direct download links
  • 13.  If everything goes well, you should the WebMatrix start screen. If it does not launch automatically, find it in the ‘Start’ menu.
  • 14.  Use the App Gallery to install Umbraco to your local computer.  Use the SQL Server CE (Embedded) option for simplicity
  • 15.  Accept the EULA and proceed through the installation.
  • 16.  Once the web site has been created in WebMatrix, the local Umbraco app should launch automatically. If not, click the URL in the window.
  • 17.  During these screens, the database is configured and template files are copied to the directory structure.
  • 18.  Use the Simple Starter Kit to install some basic content types
  • 19.  We will use the Sweet@s skin in our session
  • 20.  At this point the site should be installed and configured. If you encountered any fatal errors during the configuration, delete the site in WebMatrix and start over. Click ‘Preview your new website’ to access the ‘Front End’ (the public facing part)
  • 21.  If everything went well, you should see something like this. The first time you access the page, you may see the ‘customize skin’ popup appear. Adjust the settings and click OK You may be able to do some limited content development from the front end, but we will use the back end.
  • 22.  Access the Back Office area of your site by using “/Umbraco/” after your root url  Example - http://localhost:1605/Umbraco/ The back office is used by the site contributors for developing and managing –  Content  Media  Users/Members  Permissions  Content Types  And other settings
  • 23.  Use the ‘Sections’ module to navigate the Back Office.  Content ▪ Manage the pages or content on the site ▪ Specific permissions can be set on individual content nodes  Media ▪ Manage the media available in the properties or configuration items for the content  Users ▪ Manage the Back Office Users  Settings ▪ Manage style sheets, templates, JavaScript, and media/document types  Developer ▪ Manage data types, macros, scripts, and packages  Members ▪ Manage the members (users) of the public facing site
  • 24.  You can change properties for a content item by selecting it in the content navigator. Using the tree view to represent the content structure is similar to the way we typically navigate a computer file system. The tabs and properties that you see are defined in the content type. The content tab may contain a rich text editor for modifying the HTML on the page.
  • 25.  Right click tree view nodes to access a context menu If you choose ‘create’ a new node will be created as a child of the selected node. Choosing ‘sort’ allows you to sort the children of the selected node
  • 26.  A document type is like the foundation of a node on your site. A document type defines the properties and tabs available to a template. You can define which templates can use this document type, and the default template that will be used. Setting the ‘structure’ allows you to restrict where this document type can be created. For example –  Suppose you create a document type of ‘Book Collection’.  You create another document type of ‘Book’.  You can configure the ‘Book Collection’ type to only allow children of type ‘Book’
  • 27.  A template defines how a ‘Document Type’ is rendered. There is support for nested master pages. A new content node can use any ‘allowed’ template for the selected document type.
  • 28.  A new template can use an existing template as a master. In the Starterkit templates, both default templates (for the ‘Homepage’ and ‘Textpage’ document types) use the ‘Starterkit Master’ as the master. Changes to this template effect all content using this template. The Umbraco Item tag (<umbraco:item>) references a property (bodyText) defined in the document type that uses this template.
  • 29.  This was a brief overview of a basic Umbraco installation and configuration. Explore these sites to learn more.  http://our.umbraco.org/documentation  http://umbraco.com/help-and-support/video-tutorials Also, these topics will take you far in Umbraco development  CSS ▪ http://w3schools.com/css/default.asp  HTML ▪ http://w3schools.com/html/default.asp  ASP.NET Master Pages ▪ http://w3schools.com/aspnet/aspnet_masterpages.asp  ASP.NET User Controls (building plug-ins for Umbraco) ▪ http://msdn.microsoft.com/en-us/library/y6wb1a0e.aspx
  • 30.  Jeremy Branham  Blog ▪ http://JeremyBranham.Wordpress.com  Linked In ▪ http://www.linkedin.com/in/jeremybranham  Twitter ▪ @Jeremy_Branham Fort Worth .NET User’s Group  http://FWDNUG.com