Your SlideShare is downloading. ×
0
eZ Publish  Blog posts compilation : Netvibes / iGoogle widget, custom RSS, google maps & others tips… Gilles Guirand :  i...
eZ Publish  Blog posts compilation : Netvibes / iGoogle widget, custom RSS, google maps & others tips… Gilles Guirand :  i...
<ul><li>About the “ French language ” blog :  http://www.gandbox.fr </li></ul><ul><ul><li>1st Tab : eZ Publish Blog posts ...
eZ Publish  Blog posts compilation : Netvibes / iGoogle widget, custom RSS, google maps & others tips… Gilles Guirand :  i...
Gilles Guirand :  info@gandbox.fr  Demo :   http://www.gandbox.fr/ma-Cave/(sortby)/localisation   Working with Google Maps...
Gilles Guirand :  info@gandbox.fr  <ul><li>Working with Google Maps  / Choose your extension </li></ul><ul><li>Install the...
Gilles Guirand :  info@gandbox.fr  <ul><li>Working with Google Maps  / Choose your extension </li></ul><ul><li>Edit your c...
Gilles Guirand :  info@gandbox.fr  <ul><li>Working this Google Maps  / multiple locations in the same view </li></ul><ul><...
Gilles Guirand :  info@gandbox.fr  <ul><li>Working this Google Maps  / multiple locations in the same view </li></ul><ul><...
Gilles Guirand :  info@gandbox.fr  <ul><li>Working this Google Maps  / Markers clustering </li></ul><ul><li>Zoom managing ...
eZ Publish  Blog posts compilation : Netvibes / iGoogle widget, custom RSS, google maps & others tips… Gilles Guirand :  i...
About the “ UWA ” FrameWork :  http://dev.netvibes.com/   Gilles Guirand :  info@gandbox.fr  Demo :   http://www.gandbox.f...
Add my Widget on iGoogle / Netvibes Gilles Guirand :  info@gandbox.fr  Building an UWA Widget (Netvibes / iGoogle) Add on ...
Widget features :  Last posts & comments   Gilles Guirand :  info@gandbox.fr  Building an UWA Widget (Netvibes / iGoogle) ...
Widget features :  My personal wine cellar (full AJAX features) Gilles Guirand :  info@gandbox.fr  Building an UWA Widget ...
How  UWA  works ? Gilles Guirand :  info@gandbox.fr  Building an UWA Widget (Netvibes / iGoogle) http://www.google.com/ig/...
Build your  UWA  Widget : http://www.gandbox.fr/mywidget/gandbox_V1.0.html   Gilles Guirand :  info@gandbox.fr  Building a...
Use the  UWA  JavaScript FrameWork : Gilles Guirand :  info@gandbox.fr  Building an UWA Widget (Netvibes / iGoogle) Workin...
Working with  AJAX  and  eZ Publish  module calls Gilles Guirand :  info@gandbox.fr  Building an UWA Widget (Netvibes / iG...
Build the  eZ Publish  module :  URL calls Gilles Guirand :  info@gandbox.fr  Building an UWA Widget (Netvibes / iGoogle) ...
Build the  eZ Publish  module :  module definition Gilles Guirand :  info@gandbox.fr  Building an UWA Widget (Netvibes / i...
Build the  eZ Publish  module :  search template exemple Gilles Guirand :  info@gandbox.fr  Building an UWA Widget (Netvib...
eZ Publish  Blog posts compilation : Netvibes / iGoogle widget, custom RSS, google maps & others tips… Gilles Guirand :  i...
Building a custom RSS (by keyword) :  create your content class Gilles Guirand :  info@gandbox.fr  Building a custom RSS F...
Building a custom RSS (by keyword) :  create your templates Gilles Guirand :  info@gandbox.fr  Building a custom RSS Full ...
Building a custom RSS (by keyword) :  create your templates Gilles Guirand :  info@gandbox.fr  Building a custom RSS Full ...
Building a custom RSS (by keyword) :  result Gilles Guirand :  info@gandbox.fr  Building a custom RSS Full code exemple : ...
Any (french) questions ? Gilles Guirand :  info@gandbox.fr  Building a custom RSS Full code exemple :  http://www.gandbox....
Upcoming SlideShare
Loading in...5
×

Ez Community Gandbox.fr

1,688

Published on

eZ Publish Blog posts compilation :
Netvibes / iGoogle widget, custom RSS, google maps & others tips…

Published in: Technology, News & Politics
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

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

No notes for slide

Transcript of "Ez Community Gandbox.fr"

  1. 1. eZ Publish Blog posts compilation : Netvibes / iGoogle widget, custom RSS, google maps & others tips… Gilles Guirand : info@gandbox.fr Gilles Guirand http://www.gandbox.fr webmaster Technical Director / Kaliop eZ International Winter Conference 2010 Summary
  2. 2. eZ Publish Blog posts compilation : Netvibes / iGoogle widget, custom RSS, google maps & others tips… Gilles Guirand : info@gandbox.fr <ul><li>About gandbox.fr </li></ul><ul><li>Working with Google Maps </li></ul><ul><li>Building an UWA Widget (Netvibes / iGoogle) </li></ul><ul><li>Building a custom RSS </li></ul>eZ International Winter Conference 2010 Summary
  3. 3. <ul><li>About the “ French language ” blog : http://www.gandbox.fr </li></ul><ul><ul><li>1st Tab : eZ Publish Blog posts (technical posts, HOWTOs…) </li></ul></ul><ul><ul><ul><li>My webmaster point of view : explain how to build a “seems to be complex” feature in few time, with an easy way (I hope) </li></ul></ul></ul><ul><ul><li>2 nd Tab : My Personal French wine cellar (Wine regions, appellations, domains, bottles, color, rating, stock, google maps location, ...) </li></ul></ul><ul><ul><ul><li>Useful to manage my real wine cellar </li></ul></ul></ul><ul><ul><ul><li>Useful to find eZ Publish technical posts ideas : how to build “…” </li></ul></ul></ul><ul><ul><ul><li>Useful to contribute to the eZ Publish community, outside any commercial or professional branding </li></ul></ul></ul>Gilles Guirand : info@gandbox.fr Demo : http://www.gandbox.fr/ma-Cave/ About gandbox.fr Note : You can play with useless geek tools like drag & drop, changing the stylesheet
  4. 4. eZ Publish Blog posts compilation : Netvibes / iGoogle widget, custom RSS, google maps & others tips… Gilles Guirand : info@gandbox.fr <ul><li>About gandbox.fr </li></ul><ul><li>Working with Google Maps </li></ul><ul><li>Building an UWA Widget (Netvibes / iGoogle) </li></ul><ul><li>Building a custom RSS </li></ul>eZ International Winter Conference 2010 Summary
  5. 5. Gilles Guirand : info@gandbox.fr Demo : http://www.gandbox.fr/ma-Cave/(sortby)/localisation Working with Google Maps / What I need ? Set 1 location for each domain Display multiple domains locations on a same view (using a cluster Markers lib) Working with Google Maps
  6. 6. Gilles Guirand : info@gandbox.fr <ul><li>Working with Google Maps / Choose your extension </li></ul><ul><li>Install the Gmaps Location datatype : http://projects.ez.no/googlemaps </li></ul><ul><li>Create a ‘ location ’ attribute in your content class </li></ul>Working with Google Maps <ul><li>Set the GMapKey for both ‘site’ and ‘site_admin’ : each domain or subdomain </li></ul><ul><ul><li>http://www.site.com : /settings/siteaccess /[ my_siteaccess ]/site.ini.append.php </li></ul></ul><ul><ul><li>http://admin.site.com : /settings/siteaccess /[ my_siteaccess_admin ]/site.ini.append.php </li></ul></ul><ul><ul><li>[SiteSettings] GMapsKey=ABQIAAAAjjI5W4TgQODhLDv08YeFbRRHSVirfEVF1qGURhjW3ZpcMfgZzRQJfj9WirFbjfdTtkgqHOkHUjP7mQ </li></ul></ul><ul><li>Advice : override front / back templates, and use Google Maps API V3 : no more keys </li></ul>
  7. 7. Gilles Guirand : info@gandbox.fr <ul><li>Working with Google Maps / Choose your extension </li></ul><ul><li>Edit your content, and set your locations using the google maps control features </li></ul>Working with Google Maps 1. Google maps search 2. Auto Long / Lat setting Advice : override the edit.tpl template extension/[ mon_extension ]/design/standard/templates/content/datatype/edit/ezgmaplocation.tpl Enhance the default features using Google maps API (add controls…)
  8. 8. Gilles Guirand : info@gandbox.fr <ul><li>Working this Google Maps / multiple locations in the same view </li></ul><ul><li>Include once unique gmap/gmap.tpl template for each parent templates </li></ul>Working with Google Maps { include uri=' design:gmap/gmap.tpl ‘ locations = $nodes_location_list location_attribute = 'localisation' size =array(600,400) center =array( $node.data_map.localisation.content.latitude, $node.data_map.localisation.content.longitude ) show_popups_on_page=false() zoom=$node.data_map.zoom.content } Domain.tpl Custom zoom attribute Include gmap.tpl Region.tpl Include gmap.tpl Allwines.tpl Include gmap.tpl Search.tpl Include gmap.tpl 1 location N locations N locations N results / locations Locations Array
  9. 9. Gilles Guirand : info@gandbox.fr <ul><li>Working this Google Maps / multiple locations in the same view </li></ul><ul><li>Fetch your node list : $node_list </li></ul><ul><ul><li>$node_list = fetch ( ‘content’, ‘list’, …) </li></ul></ul><ul><ul><li>$node_list = fetch ( ‘ezfind’, ‘search’, …) </li></ul></ul><ul><ul><li>$node_list = array(…) </li></ul></ul>Working with Google Maps { foreach $node_list as $node } {if $node.data_map.localisation.content.latitude|ne('')} { set $nodes_location_list = $nodes_location_list |append( $node )} {/if} {/ foreach } Exclude empty locations { include uri=' design:gmap/gmap.tpl ‘ locations = $nodes_location_list … }
  10. 10. Gilles Guirand : info@gandbox.fr <ul><li>Working this Google Maps / Markers clustering </li></ul><ul><li>Zoom managing : the defaut view does not manage the zoom </li></ul><ul><ul><li>Option 1 : Add a zoom content class attribute (integer) </li></ul></ul><ul><ul><li>Option 2 : Enhance the default datatype </li></ul></ul><ul><ul><li>Option 3 : Manage zoom using Google Maps API, or using a Cluster Markers lib : ClusterMarker (cluster + auto bounds detection) </li></ul></ul><ul><li>ClusterMarker : http://googlemapsapi.martinpearman.co.uk/articles.php?cat_id=1 </li></ul>Working with Google Maps
  11. 11. eZ Publish Blog posts compilation : Netvibes / iGoogle widget, custom RSS, google maps & others tips… Gilles Guirand : info@gandbox.fr <ul><li>About gandbox.fr </li></ul><ul><li>Working with Google Maps </li></ul><ul><li>Building an UWA Widget (Netvibes / iGoogle) </li></ul><ul><li>Building a custom RSS </li></ul>eZ International Winter Conference 2010 Summary
  12. 12. About the “ UWA ” FrameWork : http://dev.netvibes.com/ Gilles Guirand : info@gandbox.fr Demo : http://www.gandbox.fr/ (add widgets by clicking on the right box ) Building an UWA Widget (Netvibes / iGoogle) A Netvibes FrameWork : Universal Widget API (UWA) Concept : Write once, run everywhere Languages : xHTML / CSS / JavaScript (AJAX) Others… (not tested) Vista / Apple / iPhone / WordPress / …
  13. 13. Add my Widget on iGoogle / Netvibes Gilles Guirand : info@gandbox.fr Building an UWA Widget (Netvibes / iGoogle) Add on Netvibes Add on iGoogle
  14. 14. Widget features : Last posts & comments Gilles Guirand : info@gandbox.fr Building an UWA Widget (Netvibes / iGoogle) Last comments, from a custom RSS Last blog posts , from a custom RSS Set options : RSS Feeds, number of full view items, number of short view items…
  15. 15. Widget features : My personal wine cellar (full AJAX features) Gilles Guirand : info@gandbox.fr Building an UWA Widget (Netvibes / iGoogle) Wine cellar home page : Browse by region, last buying, searching… Domain view : Description, wine list Wine view : description, color, rating, stock, price…
  16. 16. How UWA works ? Gilles Guirand : info@gandbox.fr Building an UWA Widget (Netvibes / iGoogle) http://www.google.com/ig/adde?moduleurl= nvmodules.netvibes.com/widget/gspec%3FuwaUrl%3D http%253A%252F%252Fwww.gandbox.fr%252Fmywidget%252Fgandbox_V1.0.html <ul><li>Blue URL part : my custom UWA Widget URL (with encoding) </li></ul><ul><ul><li>URL1 : http://www.gandbox.fr/mywidget/gandbox_V1.0.html </li></ul></ul><ul><li>Red URL part : UWA transformation (UWA XML format -> iGoogle XML format) </li></ul><ul><ul><li>URL2 : http://nvmodules.netvibes.com/widget/gspec/uwaUrl= URL1 </li></ul></ul><ul><li>Black URL part : Final URL to add a Google gadget </li></ul><ul><ul><li>URL3 : http://www.google.com/ig/adde?moduleurl= URL2 </li></ul></ul>
  17. 17. Build your UWA Widget : http://www.gandbox.fr/mywidget/gandbox_V1.0.html Gilles Guirand : info@gandbox.fr Building an UWA Widget (Netvibes / iGoogle)
  18. 18. Use the UWA JavaScript FrameWork : Gilles Guirand : info@gandbox.fr Building an UWA Widget (Netvibes / iGoogle) Working with tabs Working with generic RSS
  19. 19. Working with AJAX and eZ Publish module calls Gilles Guirand : info@gandbox.fr Building an UWA Widget (Netvibes / iGoogle) eZ Publish module URL Callback function Generate AJAX linking this dataprocessor set a recursive AJAX linking. If the 'ajax' CSS class is found, the script transforms all your default ez publish links by any AJAX call links Class selector ‘ ajax ’ means : AJAX link to generate On submit search event
  20. 20. Build the eZ Publish module : URL calls Gilles Guirand : info@gandbox.fr Building an UWA Widget (Netvibes / iGoogle) PHP Ajax proxy for your development mode : _URL_PROXY = 'http://localhost/html/widget/ajaxProxy.php?url=‘; Absolute path : http://www.gandbox.fr <ul><li>eZ Publish module access : </li></ul><ul><ul><li>widget : module name </li></ul></ul><ul><ul><li>action : module function </li></ul></ul><ul><ul><li>search : module param1 </li></ul></ul><ul><ul><li>text : module param2 (search value) </li></ul></ul>AJAX Proxy ? http://www.gandbox.fr/widget/action/search/gassac/
  21. 21. Build the eZ Publish module : module definition Gilles Guirand : info@gandbox.fr Building an UWA Widget (Netvibes / iGoogle) Full code exemple : http://www.gandbox.fr/Blogs/Technologies-Web/Faire-un-Widget-Netvibes-iGoogle-avec-UWA-AJAX-eZ-Publish-La-couche-eZ-Publish-Partie-2 Load your widget search template result Load your widget pagelayout
  22. 22. Build the eZ Publish module : search template exemple Gilles Guirand : info@gandbox.fr Building an UWA Widget (Netvibes / iGoogle) Get full path URL … … Set your CSS Class for your JavaScript selector Build your module URL call Full code exemple : http://www.gandbox.fr/Blogs/Technologies-Web/Faire-un-Widget-Netvibes-iGoogle-avec-UWA-AJAX-eZ-Publish-La-couche-eZ-Publish-Partie-2
  23. 23. eZ Publish Blog posts compilation : Netvibes / iGoogle widget, custom RSS, google maps & others tips… Gilles Guirand : info@gandbox.fr <ul><li>About gandbox.fr </li></ul><ul><li>Working with Google Maps </li></ul><ul><li>Building an UWA Widget (Netvibes / iGoogle) </li></ul><ul><li>Building a custom RSS </li></ul>eZ International Winter Conference 2010 Summary
  24. 24. Building a custom RSS (by keyword) : create your content class Gilles Guirand : info@gandbox.fr Building a custom RSS Full code exemple : http://www.gandbox.fr/Blogs/Technologies-Web/Un-flux-RSS-par-Keyword-ou-autre-sur-eZ-Publish Add your custom attributes if needed Set your 3 templates overrides : RSS Pagelayout Full view (items list) link view Text line Limit Text line Description Text line Title Datatype Attribute
  25. 25. Building a custom RSS (by keyword) : create your templates Gilles Guirand : info@gandbox.fr Building a custom RSS Full code exemple : http://www.gandbox.fr/Blogs/Technologies-Web/Un-flux-RSS-par-Keyword-ou-autre-sur-eZ-Publish Rss_pagelayout.tpl : Debug XML escape Rss_full.tpl : Full URL Path Keyword fetching Ezrssdate template operator
  26. 26. Building a custom RSS (by keyword) : create your templates Gilles Guirand : info@gandbox.fr Building a custom RSS Full code exemple : http://www.gandbox.fr/Blogs/Technologies-Web/Un-flux-RSS-par-Keyword-ou-autre-sur-eZ-Publish Rss_link.tpl : Full path : http://www.gandbox.fr Ezrssdate template operator : Pattern : Wed, 21 Jan 2010 15:30:00 +0000
  27. 27. Building a custom RSS (by keyword) : result Gilles Guirand : info@gandbox.fr Building a custom RSS Full code exemple : http://www.gandbox.fr/Blogs/Technologies-Web/Un-flux-RSS-par-Keyword-ou-autre-sur-eZ-Publish http://www.gandbox.fr/rss2/(tag)/eZ%20Publish
  28. 28. Any (french) questions ? Gilles Guirand : info@gandbox.fr Building a custom RSS Full code exemple : http://www.gandbox.fr/Blogs/Technologies-Web/Un-flux-RSS-par-Keyword-ou-autre-sur-eZ-Publish
  1. A particular slide catching your eye?

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

×