Stackbox CMS: Next Generation Content Management

1. Vance Lucas php|tek - May 26, 2011 stackbox CMS (Formerly Cont-xt) Monday, May 30, 2011
2. Why another CMS? Monday, May 30, 2011
3. Because this one is different* *Just like every other CMS on the market Monday, May 30, 2011
4. What is a page? Monday, May 30, 2011
5. Title Text KWWSZZZH[DPSOHFRP ,QVLGH3DJH )RUPRUHLQIRFRPPHQWVDQGVXJJHVWLRQVJRWRPRUWHQMXVWFRPDZLUHIUDPHNLWIRUJRRJOHGUDZLQJV 6HFWLRQ 6HFWLRQ /RJLQ 6LJQXS ,WHP ,WHP ,WHP ,WHP ,WHP ,WHP +HDGLQJ /RUHPLSVXPGRORUVLWDPHW FRQVHFWHWXUDGLSLVFLQJHOLW&UDV LPSHUGLHWHQLPDFDXJXHDXFWRU YLYHUUD &RS\ULJKW0\3URMHFW QSXWRN" <HV 1R SOD\HUURU   WLFN\QRWH +HDGLQJ /RUHPLSVXPGRORUVLWDPHWFRQVHFWHWXUDGLSLVFLQJHOLW&UDV LPSHUGLHWHQLPDFDXJXHDXFWRUYLYHUUD 3KDVHOOXVFRQJXHWHPSRUMXVWRVHGFXUVXV4XLVTXHQRQTXDP WXUSLV&XUDELWXUPROOLVOXFWXVWHPSRU$OLTXDPVLWDPHWQLVOYHO DUFXUXWUXPRUQDUHDWYHOVHP8WFRQVHTXDWVFHOHULVTXH DGLSLVFLQJ 3UDHVHQWSUHWLXPOLEHURQHFOHFWXVHOHPHQWXPLQWHUGXP8WDW RGLRORUHP6HGSRVXHUHWHPSXVOLEHURLQFXUVXVPLDFFXPVDQ LG1XOODIDFLOLVL0DHFHQDVYDULXVOHRLGODFXVSUHWLXPDOLTXHW 3HOOHQWHVTXHDFHUDWHOLW Â%XOOHW Â%XOOHW Â%XOOHW +HDGLQJ Simple Content Page Monday, May 30, 2011
6. Content for this page KWWSZZZH[DPSOHFRP ,QVLGH3DJH )RUPRUHLQIRFRPPHQWVDQGVXJJHVWLRQVJRWRPRUWHQMXVWFRPDZLUHIUDPHNLWIRUJRRJOHGUDZLQJV 6HFWLRQ 6HFWLRQ /RJLQ 6LJQXS ,WHP ,WHP ,WHP ,WHP ,WHP ,WHP +HDGLQJ /RUHPLSVXPGRORUVLWDPHW FRQVHFWHWXUDGLSLVFLQJHOLW&UDV LPSHUGLHWHQLPDFDXJXHDXFWRU YLYHUUD &RS\ULJKW0\3URMHFW QSXWRN" <HV 1R SOD\HUURU   WLFN\QRWH +HDGLQJ /RUHPLSVXPGRORUVLWDPHWFRQVHFWHWXUDGLSLVFLQJHOLW&UDV LPSHUGLHWHQLPDFDXJXHDXFWRUYLYHUUD 3KDVHOOXVFRQJXHWHPSRUMXVWRVHGFXUVXV4XLVTXHQRQTXDP WXUSLV&XUDELWXUPROOLVOXFWXVWHPSRU$OLTXDPVLWDPHWQLVOYHO DUFXUXWUXPRUQDUHDWYHOVHP8WFRQVHTXDWVFHOHULVTXH DGLSLVFLQJ 3UDHVHQWSUHWLXPOLEHURQHFOHFWXVHOHPHQWXPLQWHUGXP8WDW RGLRORUHP6HGSRVXHUHWHPSXVOLEHURLQFXUVXVPLDFFXPVDQ LG1XOODIDFLOLVL0DHFHQDVYDULXVOHRLGODFXVSUHWLXPDOLTXHW 3HOOHQWHVTXHDFHUDWHOLW Â%XOOHW Â%XOOHW Â%XOOHW +HDGLQJ Monday, May 30, 2011
7. Common Elements • URL • Title • Body • Parent / Hierarchy • Section / Category / Tags • Metadata • Template Monday, May 30, 2011
8. Wordpress 3.1 Monday, May 30, 2011
9. Title Text Drupal 7 Monday, May 30, 2011
10. Anything Missing? Monday, May 30, 2011
11. Title Text KWWSZZZH[DPSOHFRP ,QVLGH3DJH )RUPRUHLQIRFRPPHQWVDQGVXJJHVWLRQVJRWRPRUWHQMXVWFRPDZLUHIUDPHNLWIRUJRRJOHGUDZLQJV 6HFWLRQ 6HFWLRQ /RJLQ 6LJQXS ,WHP ,WHP ,WHP ,WHP ,WHP ,WHP +HDGLQJ /RUHPLSVXPGRORUVLWDPHW FRQVHFWHWXUDGLSLVFLQJHOLW&UDV LPSHUGLHWHQLPDFDXJXHDXFWRU YLYHUUD &RS\ULJKW0\3URMHFW QSXWRN" <HV 1R SOD\HUURU   WLFN\QRWH +HDGLQJ /RUHPLSVXPGRORUVLWDPHWFRQVHFWHWXUDGLSLVFLQJHOLW&UDV LPSHUGLHWHQLPDFDXJXHDXFWRUYLYHUUD 3KDVHOOXVFRQJXHWHPSRUMXVWRVHGFXUVXV4XLVTXHQRQTXDP WXUSLV&XUDELWXUPROOLVOXFWXVWHPSRU$OLTXDPVLWDPHWQLVOYHO DUFXUXWUXPRUQDUHDWYHOVHP8WFRQVHTXDWVFHOHULVTXH DGLSLVFLQJ 3UDHVHQWSUHWLXPOLEHURQHFOHFWXVHOHPHQWXPLQWHUGXP8WDW RGLRORUHP6HGSRVXHUHWHPSXVOLEHURLQFXUVXVPLDFFXPVDQ LG1XOODIDFLOLVL0DHFHQDVYDULXVOHRLGODFXVSUHWLXPDOLTXHW 3HOOHQWHVTXHDFHUDWHOLW Â%XOOHW Â%XOOHW Â%XOOHW +HDGLQJ Content for all pages Monday, May 30, 2011
12. Is it editable? How? Monday, May 30, 2011
13. Yes and No. It depends. Monday, May 30, 2011
14. Do Your End-Users Know... Monday, May 30, 2011
15. Monday, May 30, 2011
16. Probably Not. Good luck telling them to edit templates. Monday, May 30, 2011
17. But That’s Not The Only Problem... Monday, May 30, 2011
18. Complex Page KWWSZZZH[DPSOHFRP +RPHSDJH+XOXVW\OH )RUPRUHLQIRFRPPHQWVDQGVXJJHVWLRQVJRWRPRUWHQMXVWFRPDZLUHIUDPHNLWIRUJRRJOHGUDZLQJV 6HFWLRQ 6HFWLRQ /RJLQ 6LJQXS ,WHP ,WHP ,WHP ,WHP ,WHP ,WHP +HDGLQJ /RUHPLSVXPGRORUVLWDPHW FRQVHFWHWXUDGLSLVFLQJHOLW&UDV LPSHUGLHWHQLPDFDXJXHDXFWRU YLYHUUD $FWLRQ /RUHPLSVXPGRORUVLWDPHW FRQVHFWHWXUDGLSLVFLQJHOLW &UDVLPSHUGLHWHQLPDF DXJXHDXFWRUYLYHUUD /RUHPLSVXPGRORUVLWDPHW FRQVHFWHWXUDGLSLVFLQJHOLW &UDVLPSHUGLHWHQLPDF DXJXHDXFWRUYLYHUUD /RUHPLSVXPGRORUVLWDPHW FRQVHFWHWXUDGLSLVFLQJHOLW &UDVLPSHUGLHWHQLPDF DXJXHDXFWRUYLYHUUD +HDGHU +HDGHU +HDGHU &RS\ULJKW0\3URMHFW QSXWRN" <HV 1R SOD\HUURU   WLFN\QRWH Monday, May 30, 2011
19. Content for this page KWWSZZZH[DPSOHFRP +RPHSDJH+XOXVW\OH )RUPRUHLQIRFRPPHQWVDQGVXJJHVWLRQVJRWRPRUWHQMXVWFRPDZLUHIUDPHNLWIRUJRRJOHGUDZLQJV 6HFWLRQ 6HFWLRQ /RJLQ 6LJQXS ,WHP ,WHP ,WHP ,WHP ,WHP ,WHP +HDGLQJ /RUHPLSVXPGRORUVLWDPHW FRQVHFWHWXUDGLSLVFLQJHOLW&UDV LPSHUGLHWHQLPDFDXJXHDXFWRU YLYHUUD $FWLRQ /RUHPLSVXPGRORUVLWDPHW FRQVHFWHWXUDGLSLVFLQJHOLW &UDVLPSHUGLHWHQLPDF DXJXHDXFWRUYLYHUUD /RUHPLSVXPGRORUVLWDPHW FRQVHFWHWXUDGLSLVFLQJHOLW &UDVLPSHUGLHWHQLPDF DXJXHDXFWRUYLYHUUD /RUHPLSVXPGRORUVLWDPHW FRQVHFWHWXUDGLSLVFLQJHOLW &UDVLPSHUGLHWHQLPDF DXJXHDXFWRUYLYHUUD +HDGHU +HDGHU +HDGHU &RS\ULJKW0\3URMHFW QSXWRN" <HV 1R SOD\HUURU   WLFN\QRWH Monday, May 30, 2011
20. Which one is the main content area? Monday, May 30, 2011
21. Which one is the main content area? Hint: None of them are. Monday, May 30, 2011
22. The definition of a page these content management systems use is fundamentally flawed. Monday, May 30, 2011
23. No CMS that uses this definition of a page agrees on the same solution to this problem, or even the same terminology. Monday, May 30, 2011
24. Solutions(?) for “other” content • Widgets • Blocks • Modules • Plugins • Nodes • Extensions • Code Snippets • Hard-coded in Templates Monday, May 30, 2011
25. Users are forced to edit pieces of the same page in completely different areas of a complex admin system several pages away from the content itself. Monday, May 30, 2011
26. These methods are all workarounds to a flawed model that doesn’t work for pages. Monday, May 30, 2011
27. What about Stackbox? Monday, May 30, 2011
28. Title Text What is a page? Monday, May 30, 2011
29. Title Text What is a page? We need a new definition Monday, May 30, 2011
30. A page is a container for content. Monday, May 30, 2011
31. Common Elements • URL • Title • Body • Parent / Hierarchy • Section / Category / Tags • Metadata • Template Monday, May 30, 2011
32. Common Elements • URL • Title • Parent / Hierarchy • Metadata • Template Monday, May 30, 2011
33. The page template defines the content. It is impossible to know the content - amount, placement, or type - ahead of time. Monday, May 30, 2011
34. Content for this page KWWSZZZH[DPSOHFRP +RPHSDJH+XOXVW\OH )RUPRUHLQIRFRPPHQWVDQGVXJJHVWLRQVJRWRPRUWHQMXVWFRPDZLUHIUDPHNLWIRUJRRJOHGUDZLQJV 6HFWLRQ 6HFWLRQ /RJLQ 6LJQXS ,WHP ,WHP ,WHP ,WHP ,WHP ,WHP +HDGLQJ /RUHPLSVXPGRORUVLWDPHW FRQVHFWHWXUDGLSLVFLQJHOLW&UDV LPSHUGLHWHQLPDFDXJXHDXFWRU YLYHUUD $FWLRQ /RUHPLSVXPGRORUVLWDPHW FRQVHFWHWXUDGLSLVFLQJHOLW &UDVLPSHUGLHWHQLPDF DXJXHDXFWRUYLYHUUD /RUHPLSVXPGRORUVLWDPHW FRQVHFWHWXUDGLSLVFLQJHOLW &UDVLPSHUGLHWHQLPDF DXJXHDXFWRUYLYHUUD /RUHPLSVXPGRORUVLWDPHW FRQVHFWHWXUDGLSLVFLQJHOLW &UDVLPSHUGLHWHQLPDF DXJXHDXFWRUYLYHUUD +HDGHU +HDGHU +HDGHU &RS\ULJKW0\3URMHFW QSXWRN" <HV 1R SOD\HUURU   WLFN\QRWH Monday, May 30, 2011
35. How do we define content areas? Designers will be working with templates. Monday, May 30, 2011
36. Regions defined with CSS classes <html> <head> <title>Homepage</title> </head> <body> <div class=”cms_region” id=”slideshow”></div> <div class=”cms_region” id=”intro_left”></div> <div class=”cms_region” id=”intro_center”></div> <div class=”cms_region” id=”intro_right”></div> </body> </html> Monday, May 30, 2011
37. What about content on all pages? Headers, Footers, Sidebars, etc. Monday, May 30, 2011
38. Title Text KWWSZZZH[DPSOHFRP ,QVLGH3DJH )RUPRUHLQIRFRPPHQWVDQGVXJJHVWLRQVJRWRPRUWHQMXVWFRPDZLUHIUDPHNLWIRUJRRJOHGUDZLQJV 6HFWLRQ 6HFWLRQ /RJLQ 6LJQXS ,WHP ,WHP ,WHP ,WHP ,WHP ,WHP +HDGLQJ /RUHPLSVXPGRORUVLWDPHW FRQVHFWHWXUDGLSLVFLQJHOLW&UDV LPSHUGLHWHQLPDFDXJXHDXFWRU YLYHUUD &RS\ULJKW0\3URMHFW QSXWRN" <HV 1R SOD\HUURU   WLFN\QRWH +HDGLQJ /RUHPLSVXPGRORUVLWDPHWFRQVHFWHWXUDGLSLVFLQJHOLW&UDV LPSHUGLHWHQLPDFDXJXHDXFWRUYLYHUUD 3KDVHOOXVFRQJXHWHPSRUMXVWRVHGFXUVXV4XLVTXHQRQTXDP WXUSLV&XUDELWXUPROOLVOXFWXVWHPSRU$OLTXDPVLWDPHWQLVOYHO DUFXUXWUXPRUQDUHDWYHOVHP8WFRQVHTXDWVFHOHULVTXH DGLSLVFLQJ 3UDHVHQWSUHWLXPOLEHURQHFOHFWXVHOHPHQWXPLQWHUGXP8WDW RGLRORUHP6HGSRVXHUHWHPSXVOLEHURLQFXUVXVPLDFFXPVDQ LG1XOODIDFLOLVL0DHFHQDVYDULXVOHRLGODFXVSUHWLXPDOLTXHW 3HOOHQWHVTXHDFHUDWHOLW Â%XOOHW Â%XOOHW Â%XOOHW +HDGLQJ Content for all pages Monday, May 30, 2011
39. We also need global regions <html> <head> <title>Homepage</title> </head> <body> <div class=”cms_region_global” id=”header”></div> <div class=”cms_region” id=”content”></div> <div class=”cms_region_global” id=”sidebar”></div> <div class=”cms_region_global” id=”footer”></div> </body> </html> Monday, May 30, 2011
40. Unobtrusive markup for regions • Content regions defined with CSS classes • cms_region • Content for the current page • cms_region_global • Content shared across multiple pages • Any global template region that shares the same ID Monday, May 30, 2011
41. Different types of content KWWSZZZH[DPSOHFRP +RPHSDJH+XOXVW\OH )RUPRUHLQIRFRPPHQWVDQGVXJJHVWLRQVJRWRPRUWHQMXVWFRPDZLUHIUDPHNLWIRUJRRJOHGUDZLQJV 6HFWLRQ 6HFWLRQ /RJLQ 6LJQXS ,WHP ,WHP ,WHP ,WHP ,WHP ,WHP +HDGLQJ /RUHPLSVXPGRORUVLWDPHW FRQVHFWHWXUDGLSLVFLQJHOLW&UDV LPSHUGLHWHQLPDFDXJXHDXFWRU YLYHUUD $FWLRQ /RUHPLSVXPGRORUVLWDPHW FRQVHFWHWXUDGLSLVFLQJHOLW &UDVLPSHUGLHWHQLPDF DXJXHDXFWRUYLYHUUD /RUHPLSVXPGRORUVLWDPHW FRQVHFWHWXUDGLSLVFLQJHOLW &UDVLPSHUGLHWHQLPDF DXJXHDXFWRUYLYHUUD /RUHPLSVXPGRORUVLWDPHW FRQVHFWHWXUDGLSLVFLQJHOLW &UDVLPSHUGLHWHQLPDF DXJXHDXFWRUYLYHUUD +HDGHU +HDGHU +HDGHU &RS\ULJKW0\3URMHFW QSXWRN" <HV 1R SOD\HUURU   WLFN\QRWH Monday, May 30, 2011
42. How do we handle completely different types of content? Monday, May 30, 2011
43. Different types of content • Text / HTML / WYSIWYG • Site Navigation • Blog / News • Event Calendar • Image/Video Slideshow • Contact Form • Product Listing • etc... Monday, May 30, 2011
44. Every piece of content is a module so nothing is pre-defined. Monday, May 30, 2011
45. How do we make it easy for end-users? Monday, May 30, 2011
46. Kill the admin panel. Put all edit controls on-page, overlaid on top of the content the user wants to edit. Monday, May 30, 2011
47. Modules are placed inside defined regions on-page with user-friendly drag-and-drop and point-and-click methods. Monday, May 30, 2011
48. How do we make developers love modules? Monday, May 30, 2011
49. Modules are self-contained MVC triads that define their own behavior and structure. Monday, May 30, 2011
50. This is made possible with Hierarchical MVC (HMVC). Monday, May 30, 2011
51. One More Thing... Monday, May 30, 2011
52. Stackbox is multi-site capable. Monday, May 30, 2011
53. Demo Time! Monday, May 30, 2011
54. hello@brightb.it http://brightb.it (405) 595-0101 Oklahoma City stackbox CMS http://stackboxcms.com Monday, May 30, 2011