arrrrcamp radiant intro
Post on 29-Nov-2014
1.481 Views
Preview:
DESCRIPTION
TRANSCRIPT
Basic walkthroughRadiant CMS
Basic walkthroughRadiant CMS
1 Radiant in onze workflow2 Hoe werkt Radiant (basics)3 Extensions4 Vragen5 Vragen aan de bar
Basic walkthroughRadiant CMS
Get wasted! fuck yeaaah!!!
1 Radiant in onze workflow2 Hoe werkt Radiant (basics)3 Extensions4 Vragen5 Vragen aan de bar
GorillaDigs ruby
Gorilla
WebsitesRadiant
Web-appsRails
Digs ruby
Gorilla: Benny & Jelle
Benny• Ruby/Rails/Radiant• Web-apps met Rails• Extensions voor
Gorilla: Benny & Jelle
Benny• Ruby/Rails/Radiant• Web-apps met Rails• Extensions voor
Jelle• Information Architect• Designer & Slicer• Non-programmer
Gorilla: Benny & Jelle
Benny• Ruby/Rails/Radiant• Web-apps met Rails• Extensions voor Radiant
Jelle• Information Architect• Designer & Slicer• Non-programmer
‘97
Gorilla: Zo gebruiken wij RadiantBenny• Zet server/repository op• Zet Radiant instance op
Gorilla: Zo gebruiken wij RadiantBenny• Zet server/repository op• Zet Radiant instance op
Jelle• Maakt HTML templates • Bouwt website op in Radiant• Gebruikt alleen Radiant
Radiant
Radiant: Meet & Greet
• Open-source CMS (gebouwd in Rails)
Radiant: Meet & Greet
• Open-source CMS (gebouwd in Rails)• Simpel (opgebouwd uit pages)
Radiant: Meet & Greet
• Open-source CMS (gebouwd in Rails)• Simpel (opgebouwd uit pages)• Toch flexibel (Parent/child model, page-parts & radius)
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)
Radiant: Meet & Greet
• Open-source CMS (gebouwd in Rails)• Simpel (opgebouwd uit pages)• Toch flexibel (Parent/child model, page-parts & radius)
pages
Radiant: bouwstenen
pages
page-parts
Radiant: bouwstenen
pages
page-parts
snippets
Radiant: bouwstenen
pages
page-parts
layouts snippets
Radiant: bouwstenen
pages
page-parts
snippets
Radiant: bouwstenen
radius
layouts
pages
page-parts
snippets
Radiant: bouwstenen
radius
layouts
Radiant: Layouts
Radiant: Layouts<html> <head>…</head> <body> <div id=”header”> <p id=”logo”> <a href=”/”>Radiant</a> </p> <ul id=”nav_main”> <li> <a href=”/”>Home</a> </li> … </ul> </div> <div id=”content”> <div id=”content_main”> <h1>Welkom!</h1>
<img src=”g.gif” /> <p>Welkom stranger.</p> </div> <div id=”content_sec”> <ul id=”nav_sec”> <li>…</li> … </ul> <h3>Gorilla’s</h3> <p>Ze zijn de max</p> </div> <div id=”footer”> <p>Contact info</p> </div> </div> </body></html>
Radiant: Layouts<html> <head>…</head> <body> <div id=”header”> <p id=”logo”> <a href=”/”>Radiant</a> </p> <ul id=”nav_main”> <li> <a href=”/”>Home</a> </li> … </ul> </div> <div id=”content”> <div id=”content_main”> <h1>Welkom!</h1>
<img src=”g.gif” /> <p>Welkom stranger.</p> </div> <div id=”content_sec”> <ul id=”nav_sec”> <li>…</li> … </ul> <h3>Gorilla’s</h3> <p>Ze zijn de max</p> </div> <div id=”footer”> <p>Contact info</p> </div> </div> </body></html>
Radiant: Layouts<html> <head>…</head> <body> <div id=”header”> <r:snippet name=”header” /> </div> <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”>
<r:snippet name=”footer” /> </div> </div> </body></html>
Radiant: Snippets
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>
Radiant: Snippets (Header)
<p id=”logo”><a>GorillaCMS</a></p><r:nav id=”nav_main” root=”/” include_root=”true” depth=”1” />
Radiant: Snippets (Footer)
<p id=”contact”> Ladies contact me on 0484 42 97 62<br /> (will get naked for Rum - Arrrrr!)</p>
Radiant: Pages
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>
Radiant: Page-parts
Radiant: Page-parts
“overerving” van page-parts<r:content part=”nav-sec” inherit=”true” />
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>
Radiant: Radius template language
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
Radiant: Radius template language
<r:find url=”/diensten” />
<r:next by=”title” /><r:previous by=”date” />
<r:site_area /><r:site_sub_area />
<r:nav id=“subnav” />
<r:children:each /><r:children:count />
<r:link /><r:title /><r:slug /><r:breadcrumb />
<r:breadcrumbs />
<r:gallery:lightbox id=”3” />
<r:if_content part=”foo” /><r:unless_content part=”foo” />
Voorbeelden van enkele handige tags
Extensions
Extensions: Extra flexibiliteit
Navigation tags (r:nav)Nested layoutsMailerSettingsWYM Editor Filter
GalleryGmapsBlogArchivePaperclipped
Extensions: Nested layouts
1-col layout 2-col layout
Extensions: Nested layouts
MASTER LAYOUT
Extensions: Nested layouts
MASTER LAYOUT
1-col layout 2-col layout
Extensions: Nested layouts
<html><head>…</head><body>
<div id=”content”><r:content />
</div></body>
</html>
<html><head>…</head><body>
<div id=”content”><div id=”col-1”>
<r:content /></div><div id=”col-2”>
<r:content part=”detail” />
</div></div>
</body></html>
1-col 2-col
Extensions: Nested layouts
<html><head>…</head><body>
<div id=”content”><r:content_for_layout />
</div></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>
1 master layout
2-col
<r:inside_layout name=”master”><r:content />
</r:inside_layout>
1-col
Questions?(be gentle)
That’s itHit the bar!
top related