Arrrrcamp Radiant Intro

1,079 views

Published on

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,079
On SlideShare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
9
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Arrrrcamp Radiant Intro

  1. 1. Radiant CMS Basic walkthrough
  2. 2. Radiant CMS Basic walkthrough 1 Radiant in onze workflow 2 Hoe werkt Radiant (basics) 3 Extensions 4 Vragen 5 Vragen aan de bar
  3. 3. Radiant CMS Basic walkthrough 1 Radiant in onze workflow 2 Hoe werkt Radiant (basics) 3 Extensions 4 Vragen 5 Vragen aan de bar Get wasted! fuck yeaaah!!!
  4. 4. Gorilla Digs ruby
  5. 5. Gorilla Digs ruby Websites Web-apps Radiant Rails
  6. 6. Gorilla: Benny & Jelle Benny • Ruby/Rails/Radiant • Web-apps met Rails • Extensions voor
  7. 7. Gorilla: Benny & Jelle Benny Jelle • Ruby/Rails/Radiant • Information Architect • Web-apps met Rails • Designer & Slicer • Extensions voor • Non-programmer
  8. 8. Gorilla: Benny & Jelle Benny Jelle • Ruby/Rails/Radiant • Information Architect • Web-apps met Rails • Designer & Slicer • Extensions voor • Non-programmer Radiant
  9. 9. ‘97
  10. 10. Gorilla: Zo gebruiken wij Radiant Benny • Zet server/ repository op • Zet Radiant instance op
  11. 11. Gorilla: Zo gebruiken wij Radiant Benny Jelle • Zet server/ • Maakt HTML templates repository op • Bouwt website op in • Zet Radiant instance Radiant op • Gebruikt alleen Radiant
  12. 12. Radiant
  13. 13. Radiant: Meet & Greet • Open-source CMS (gebouwd in Rails)
  14. 14. Radiant: Meet & Greet • Open-source CMS (gebouwd in Rails) • Simpel (opgebouwd uit pages)
  15. 15. Radiant: Meet & Greet • Open-source CMS (gebouwd in Rails) • Simpel (opgebouwd uit pages) • Toch flexibel (Parent/child model, page-parts & radius)
  16. 16. Radiant: Meet & Greet • Open-source CMS (gebouwd in Rails) • Simpel (opgebouwd uit pages) • Toch flexibel (Parent/child model, page-parts & radius) • Modulair (+300 extensions op GitHub)
  17. 17. Radiant: Meet & Greet • Open-source CMS (gebouwd in Rails) • Simpel (opgebouwd uit pages) • Toch flexibel (Parent/child model, page-parts & radius)
  18. 18. Radiant: bouwstenen pages
  19. 19. Radiant: bouwstenen pages page-parts
  20. 20. Radiant: bouwstenen pages snippets page-parts
  21. 21. Radiant: bouwstenen pages layouts snippets page-parts
  22. 22. Radiant: bouwstenen pages layouts snippets page-parts radius
  23. 23. Radiant: bouwstenen pages layouts snippets page-parts radius
  24. 24. Radiant: Layouts
  25. 25. Radiant: Layouts <html> <img src=”g.gif” /> <head>…</head> <p>Welkom stranger.</p> <body> </div> <div id=”header”> <div id=”content_sec”> <p id=”logo”> <ul id=”nav_sec”> <a href=”/”>Radiant</a> <li>…</li> </p> … <ul id=”nav_main”> </ul> <li> <h3>Gorilla’s</h3> <a href=”/”>Home</a> <p>Ze zijn de max</p> </li> </div> … <div id=”footer”> </ul> <p>Contact info</p> </div> </div> <div id=”content”> </div> <div id=”content_main”> </body> <h1>Welkom!</h1> </html>
  26. 26. Radiant: Layouts <html> <img src=”g.gif” /> <head>…</head> <p>Welkom stranger.</p> <body> </div> <div id=”header”> <div id=”content_sec”> <p id=”logo”> <ul id=”nav_sec”> <a href=”/”>Radiant</a> <li>…</li> </p> … <ul id=”nav_main”> </ul> <li> <h3>Gorilla’s</h3> <a href=”/”>Home</a> <p>Ze zijn de max</p> </li> </div> … <div id=”footer”> </ul> <p>Contact info</p> </div> </div> <div id=”content”> </div> <div id=”content_main”> </body> <h1>Welkom!</h1> </html>
  27. 27. Radiant: Layouts <html> <r:snippet <head>…</head> name=”footer” /> <body> </div> <div id=”header”> </div> <r:snippet name=”header” /> </body> </div> </html> <div id=”content”> <div id=”content_main”> <r:content /> </div> <div id=”content_sec”> <r:content part=”nav_sec” /> <r:content part=”content_sec /> </div> <div id=”footer”>
  28. 28. Radiant: Snippets
  29. 29. Radiant: Snippets (Header) <p id=”logo”><a>GorillaCMS</a></p> <ul id=”nav_main”> <li><a href=”/”>Home</a></li> <li><a href=”/soorten”>Soorten</a></li> … </ul>
  30. 30. Radiant: Snippets (Header) <p id=”logo”><a>GorillaCMS</a></p> <r:nav id=”nav_main” root=”/” include_root=”true” depth=”1” />
  31. 31. Radiant: Snippets (Footer) <p id=”contact”> Ladies contact me on 0484 42 97 62<br /> (will get naked for Rum - Arrrrr!) </p>
  32. 32. Radiant: Pages
  33. 33. Radiant: Pages Overzicht genereren van child pages <ul id=”gorilla_soorten”> <r:children:each> <li> <h3><r:link /></h3> <p><r:content /></p> </li> </r:children:each> </ul>
  34. 34. Radiant: Page-parts
  35. 35. Radiant: Page-parts “overerving” van page-parts <r:content part=”nav-sec” inherit=”true” />
  36. 36. Radiant: Page-parts “overerving” van page-parts <r:content part=”nav-sec” inherit=”true” /> Check op bestaan van page-parts <r:if_content part=”nav-sec”> <div><r:content part=”nav-sec” /></div> </r:if_content>
  37. 37. Radiant: Radius template language
  38. 38. Radiant: Radius template language • Tag-based template language developed for Ruby • Bindmiddel dat Radiant samen houdt • Heel simpel, heel flexibel • Speelt goed in op Parent/child model van
  39. 39. Radiant: Radius template language Voorbeelden van enkele handige tags <r:find url=”/diensten” /> <r:link /> <r:title /> <r:next by=”title” /> <r:slug /> <r:previous by=”date” /> <r:breadcrumb /> <r:site_area /> <r:breadcrumbs /> <r:site_sub_area /> <r:gallery:lightbox id=”3” /> <r:nav id=“subnav” /> <r:if_content part=”foo” /> <r:children:each /> <r:unless_content part=”foo” /> <r:children:count />
  40. 40. Extensions
  41. 41. Extensions: Extra flexibiliteit Navigation tags (r:nav) Gallery Nested layouts Gmaps Mailer Blog Settings Archive WYM Editor Filter Paperclipped
  42. 42. Extensions: Nested layouts 1-col layout 2-col layout
  43. 43. Extensions: Nested layouts MASTER LAYOUT
  44. 44. Extensions: Nested layouts MASTER LAYOUT 1-col layout 2-col layout
  45. 45. Extensions: Nested layouts 1-col 2-col <html> <html> <head>…</head> <head>…</head> <body> <body> <div id=”content”> <div id=”content”> <r:content /> <div id=”col-1”> </div> <r:content /> </body> </div> </html> <div id=”col-2”> <r:content part=”detail” /> </div> </div> </body> </html>
  46. 46. Extensions: Nested layouts 1 master layout 1-col <html> <r:inside_layout name=”master”> <head>…</head> <r:content /> <body> </r:inside_layout> <div id=”content”> <r:content_for_layout /> </div> 2-col </body> </html> <r:inside_layout name=”master”> <div id=”col-1”> <r:content /> </div> <div id=”col-2”> <r:content part=”detail” /> </div> </r:inside_layout>
  47. 47. Questions? (be gentle)
  48. 48. That’s it Hit the bar!

×