Pragmatic orchard


Published on

The first Module of a workshop about orchard CMS, with the goal to form a new Orchard development team

Published in: Technology
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Pragmatic orchard

  1. 1. Alexandre Marreiros, 2011A Quick Intro
  2. 2. Alexandre Marreiros, 2011Agenda Introduction Build on Concepts Review Get and Setup Orchard Orchard Concepts Theme Widget Modules Advance Theme Concepts
  3. 3. Alexandre Marreiros, 2011Introduction“Orchard is a Web CMS, which essentially aims at helpingyou build web sites from existing pieces. Those piecescome in a few different sizes and shapes that need to bewell understood if youre going to be productive with them.This article will go through those pieces and explain theirnames and behavior.” Orchard Team
  4. 4. Alexandre Marreiros, 2011IntroductionWhat is Orchard CMS ? Is a CMS User Centric Open Source Suported by Outercurve Foundation A framework based on an architecture of Plugins and Provider’sIs built on top of .NET
  5. 5. Alexandre Marreiros, 2011Built On Orchard CMS Razor Views Database Engine OR ASP.NET MVC 3 Sql Server SQL CE (*) .NET 4.5*sql server > 2000 any version in house and SQL Azure
  6. 6. Alexandre Marreiros, 2011Concepts ReviewASP.NET MVC 3Built on Top off ASP.NET with the main intent of implement MVC pattern withMicrosoft Web Technologies Model View Controller
  7. 7. Alexandre Marreiros, 2011Concepts ReviewRazorIs a general propose template engine used to generate HTML from data. Isavaiable in ASP.NET MVC 3 Views.Razor provides a easy to read and wirte sintaxe that allow us to use ritch codein the midle of Markup code.@ - Marks the begining of a razor sentence in ASP.MVC 3 Generated Template Data Output
  8. 8. Alexandre Marreiros, 2011Concepts ReviewRazor Glossary@ - Marks the begining of a razor sentence in ASP.MVC 3@{ } – Code Block@i - Implicit code(@i) – explicit code<text> </text> - Razor tag that allows to define a plain text part@HTML – Use html util helper functionsExample of razor to display a partial view @HTML.Partial( “_partialview “, Model )
  9. 9. Alexandre Marreiros, 2011 Demo ASP.NET MVC3 & RazorDemo
  10. 10. Alexandre Marreiros, 2011IntroductionHow I get Orchard? With WebMatrix & WebPlataform With Codeplex  Download the release  Clone source code First time I run Orchard Setup happens
  11. 11. Alexandre Marreiros, 2011 Get OrchardDemo
  12. 12. Alexandre Marreiros, 2011Orchard Concepts Buch ofTyped single information andInformation Content Content Field reusable Part behaviour Content Classes of Data, Type Abstration of concepts Instance of content Content type, Single piece of Item content
  13. 13. Alexandre Marreiros, 2011Orchard ConceptsOrchard define his own model of security basedon users roles and premissions. Premission User Role Premission ….N
  14. 14. Alexandre Marreiros, 2011Orchard ConceptsCustomizable built in Orchard CMS roles Full control over site and settings Administrator Is not allowed to creat content only edit Editor Validate user created contents, only Moderator frontend content for now Author Writes and plublishes Write content can be or not allowed to Contributor publish Anonymous Unknown user not login in CMS engine Authenticated Any user with a role in the CMS
  15. 15. Alexandre Marreiros, 2011Orchard ConceptsThe user interface of Orchard uses a Themmingaproach.
  16. 16. Alexandre Marreiros, 2011Orchard ConceptsOrchards offers a plug an play cross contentengine that enable us to use widgets and definezones for that in our theme
  17. 17. Alexandre Marreiros, 2011Orchard ConceptsThe most basic building Block of Orchard areModules.Each Module is a MVC Block that extendsOrchard Architecture Modules Modules Modules Modules Modules Orchard CMS Core Framework
  18. 18. Alexandre Marreiros, 2011Orchard ConceptsEach Module we install in the Platform give us agroup of functionalities, that can be or notenabled to this concept as the name of feature.
  19. 19. Alexandre Marreiros, 2011 Orchard conceptsDemo
  20. 20. Alexandre Marreiros, 2011Orchard ConceptsIn review
  21. 21. Alexandre Marreiros, 2011ThemeMechanism for specified the look and feel of aOrchard solution.In Orchard when you define a Module youdefine the way he render, that is the look andFeel of the module unless the theme say isdifferenteThe same is true for Parts, Widgets and Fields(that are also modules).
  22. 22. Alexandre Marreiros, 2011ThemeTheme Possible States Enabled Active Install Disabled Current* An Active current doesn’t have necessary to be the current
  23. 23. Alexandre Marreiros, 2011ThemeTheme rendering engine Current Active Theme Theme Module• When a theme does not define the look and feel of a module that comes from the active team and if no active team from the module itself• The Active Theme can become the cureent theme if a theme selector elevate is priority
  24. 24. Alexandre Marreiros, 2011 Orchard ThemeDemo
  25. 25. Alexandre Marreiros, 2011ThemeAll Orchard Themes live in a Folder that makespart of Orchard IIS Directory Named:
  26. 26. Alexandre Marreiros, 2011ThemeLet’s take a look at Theme Folder organization
  27. 27. Alexandre Marreiros, 2011 Orchard ThemeDemo
  28. 28. Alexandre Marreiros, 2011Widget Widget widget
  29. 29. Alexandre Marreiros, 2011Widget Theme.txt Layouts.cshtml
  30. 30. Alexandre Marreiros, 2011Widget Layer’s
  31. 31. Alexandre Marreiros, 2011ModulesAre the basic building blocks of OrchardEach module is a MVC application that lives inthe Orchard ecosystem
  32. 32. Alexandre Marreiros, 2011 Orchard ModulesDemo
  33. 33. Alexandre Marreiros, 2011Modules
  34. 34. Alexandre Marreiros, 2011Modules Modules are Costum Extensions Grouped in a Modules package. Features . Features are a logical grouping of functionality. (can be enabled or disable)
  35. 35. Alexandre Marreiros, 2011ModulesAnd what kind of modules we have? Modules Modules Modules Modules Orchard CMS Core FrameworkWhere Modules Live?
  36. 36. Alexandre Marreiros, 2011 Orchard Modules anatomyDemo
  37. 37. Alexandre Marreiros, 2011Advance Theme Concepts ShapeShape Shape Shape Shape Shape
  38. 38. Alexandre Marreiros, 2011Advance Theme ConceptsRender Engine Header Widget Shape Theme Layout … Render UI Content Content ShapeThe UI of Orchard are a compound UI once that all the UI isdivided in to different small blocks of UIShapes are dynamic UI models of dataWe can define just as a Shape as simple a Razor template
  39. 39. Alexandre Marreiros, 2011Advance Theme ConceptsYou can define alternates to specific UIelements.Imagine if i want to override the Shape thatrenders the Content but just when the url of theitem is homepage i can create the shape Content-url-homepage.cshtml
  40. 40. Alexandre Marreiros, 2011Advance Theme ConceptsRules for alternatesFor content parts: [ShapeType]__[Id]. (Example template: PartsCommon.Metadata-42) [ShapeType]__[ContentType]. (Example template: PartsCommon.Metadata-BlogPost)
  41. 41. Alexandre Marreiros, 2011Advance Theme ConceptsRules for alternatesFor widget shapes: Widget__[ZoneName]. (Example template: Widget-SideBar) Widget__[ContentType]. (Example template: Widget-BlogArchive)
  42. 42. Alexandre Marreiros, 2011Advance Theme ConceptsRules for alternatesFor Content shapes: Content__[DisplayType]. (Example template: Content.Summary) Content__[ContentType]. (Example template: Content-BlogPost) Content__[Id]. (Example template: Content-42) Content_[DisplayType]__[ContentType]. (Example template: Content-BlogPost.Summary) Content_[DisplayType]__[Id]. (Example template: Content- 42.Summary)
  43. 43. Alexandre Marreiros, 2011Advance Theme ConceptsThe placement of shapes can be defined by theTheme
  44. 44. Alexandre Marreiros, 2011 Orchard UI composed “Shapes”Demo
  45. 45. Alexandre Marreiros, 2011More Thoughts We had made a long dive in to Orchard Concepts, now we are able to understand all the orchard picture and start working. Next session is Development dive in to the plataform. For you start playing start working start using Orchard, collaborate with the community
  46. 46. Alexandre Marreiros, 2011Refrences net-mvc-3-and-the-helper-syntax-within-razor.aspx
  47. 47. Alexandre Marreiros, 2011Email: Amarreiros@gmail.comTwitter: @alexmarreirosFeel free to ask