Super	
  Widgets…	
  
         (planning	
  for	
  flexible	
  and	
  reusable	
  
                              pulls)	
  ...
Quick	
  Overview	
  
•    Purpose	
  
•    Common	
  Uses	
  
•    Widget	
  vs.	
  ApplicaBon	
  Widget	
  
•    Macro	
...
Widgets:	
  The	
  Basics	
  
–  Purpose:	
  	
  
     •  Minimize	
  redundant	
  code	
  
     •  Facilitate	
  creaBon	...
Widgets:	
  The	
  Basics	
   	
                     cont.


–  Mechanism:	
  	
  
    •  Added	
  on	
  any	
  container	...
Types	
  of	
  Widgets	
  	
  
                             –  Simple	
  Widgets	
  vs.	
  Custom	
  Widgets	
  
         ...
When	
  to	
  create	
  a	
  widget	
  
      –  Rule	
  of	
  thumb:	
  1	
  widget	
  structure	
  per	
  content	
  
  ...
When	
  to	
  create	
  a	
  widget	
  
    –  Checklist	
  before	
  creaBng	
  a	
  widget	
  
            •  Wireframes...
Example	
  1:	
  News	
  LisBng	
  Widget	
  Structure	
  

  –  Overview	
  
      •  Uses	
  and	
  versaBlity	
  
     ...
Example	
  2:	
  Photo	
  Carrousel	
  	
  
•  Overview	
  
   •    Leveraging	
  macro	
  vs.	
  VTL	
  
   •    Not	
  B...
Recap	
  
•  Purpose	
  and	
  advantages	
  of	
  using	
  widgets	
  
•  Common	
  uses	
  for	
  widgets	
  
•  Differen...
Upcoming SlideShare
Loading in...5
×

Super widget

1,045

Published on

In this presentation from dotCMS Boot Camp 2010 you will learn about widgets and how to design them. Includes a step-by-step process of how to build a widget following dotCMS best practices.

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

  • Be the first to like this

No Downloads
Views
Total Views
1,045
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
17
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Super widget

  1. 1. Super  Widgets…   (planning  for  flexible  and  reusable   pulls)   Arnaud  Romary   Maria  Bouza  
  2. 2. Quick  Overview   •  Purpose   •  Common  Uses   •  Widget  vs.  ApplicaBon  Widget   •  Macro  Widget:  Photo  Carrousel   •  Super  Widget:  News  LisBng   •  QuesBons  
  3. 3. Widgets:  The  Basics   –  Purpose:     •  Minimize  redundant  code   •  Facilitate  creaBon  of  pulls  for  content  editors  UI   •  Permissioning    (widgets  vs.  web  page  content)   –  Common  Uses  (default  widgets)   •  Content  LisBngs   •  Detail  pages   •  Random  pulls   •  Macros  UI  
  4. 4. Widgets:  The  Basics     cont. –  Mechanism:     •  Added  on  any  container   •  Parameters:  fields  on  widget          structure   •  Widget  Code:  (VTL  widget  structure,  nested  for   paginaBon  
  5. 5. Types  of  Widgets     –  Simple  Widgets  vs.  Custom  Widgets   •  Simple  Widget:  forms,  detail  page,  sitemap   •  Custom  Widget:  used  for  pulls,  reusable  via  parameters   Simple  Widget:  News  Detail                                                                                                                                                                            Widget:  News  LisAng  
  6. 6. When  to  create  a  widget   –  Rule  of  thumb:  1  widget  structure  per  content   structure   •  Default  content  structures  &  widgets   •  Accelerators  and  addiBonal  structures   Need  to  Create   Need  to  Pull   Purpose   Content  for  your   Content  on  the   Site?   Front-­‐End?   News  LisBng   Structure   News  Item   Widget   •   Home  Page  News   •   Top  Headlines     Uses   •   Topic-­‐Specific  Latest  News  
  7. 7. When  to  create  a  widget   –  Checklist  before  creaBng  a  widget   •  Wireframes    as  foundaBon  for  structures   •  IdenBficaBon  of  all  dynamic  pulls   •  DefiniBon  of  parameters   Example:  Employment  Profile   What    fields   Which   Create  the   What  pages   make  up  a   parameters   pulls    for  pages   are  displaying   profile   give  flexibility   displaying   profiles     (required  vs.   to  fit  all  pages   profiles   opBonal)   Content   Widget   Wireframes   Widgets   Structures   Structures  
  8. 8. Example  1:  News  LisBng  Widget  Structure   –  Overview   •  Uses  and  versaBlity   •  Default  widget  structure   –  Fields   •  General   •  Forma[ng   •  Detail  page  URL   •  Custom  message  when  0  results   •  Filters  
  9. 9. Example  2:  Photo  Carrousel     •  Overview   •  Leveraging  macro  vs.  VTL   •  Not  Bed  to  a  content  structure   •  Basic  fields   •  Macro  parameters   •  PotenBal  addiBonal  fields   •  Working  example  
  10. 10. Recap   •  Purpose  and  advantages  of  using  widgets   •  Common  uses  for  widgets   •  Differences  between  simple  and  custom   widget  structures   •  Super  Widget:  News  LisBng   •  Macro  Widget:  Photo  Carrousel  
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×