SlideShare ist ein Scribd-Unternehmen logo
1 von 3
This is a sample website. E.g. a blogpost provided by a static webserver, wordpress, or any other cms.   If the user is authorized, "Aloha Editor" is activated by adding a couple of javascript lines. The user can edit the content within the frontend, without page reload or entering a backend.
This is the source code of the website. The yellow marks show - the inclusion of the Aloha Editor. - the edit-enabling of two dom elements (the teaser content1 and the body content2)
This is a dummy implementation of a "save" button in the ribbon (see slides for screendesign):   A button is added to the ribbon. when called, the content of all editable dom elements is fetched (and automatically cleaned of any browser-quirks html or helper code), and can be stored to a backend (wordpress api, typo3, etc).

Weitere ähnliche Inhalte

Was ist angesagt?

Was ist angesagt? (6)

Mule velocity
Mule velocityMule velocity
Mule velocity
 
Mule management console installation
Mule management console installation Mule management console installation
Mule management console installation
 
Example mule
Example muleExample mule
Example mule
 
Magento2 Image Gallery
Magento2 Image GalleryMagento2 Image Gallery
Magento2 Image Gallery
 
User Guide
User GuideUser Guide
User Guide
 
Deploying and running in mule standalone
Deploying and running in mule standaloneDeploying and running in mule standalone
Deploying and running in mule standalone
 

Ähnlich wie Aloha Editor usage example

Useful Rails Plugins
Useful Rails PluginsUseful Rails Plugins
Useful Rails Pluginsnavjeet
 
Asp.Net 2.0 Presentation
Asp.Net 2.0 PresentationAsp.Net 2.0 Presentation
Asp.Net 2.0 Presentationsasidhar
 
WordPress Ann Arbor: WP Tips and Tricks
WordPress Ann Arbor: WP Tips and TricksWordPress Ann Arbor: WP Tips and Tricks
WordPress Ann Arbor: WP Tips and Tricksoneilldec
 
Building a Blogging System -- Rapidly using Alpha Five v10 with Codeless AJAX...
Building a Blogging System -- Rapidly using Alpha Five v10 with Codeless AJAX...Building a Blogging System -- Rapidly using Alpha Five v10 with Codeless AJAX...
Building a Blogging System -- Rapidly using Alpha Five v10 with Codeless AJAX...Richard Rabins
 
Selectionwidgetwhitepaper 140907120000-phpapp02
Selectionwidgetwhitepaper 140907120000-phpapp02Selectionwidgetwhitepaper 140907120000-phpapp02
Selectionwidgetwhitepaper 140907120000-phpapp02Nigel Abbott
 
Apache serversideincludes(ssi)inae mpages
Apache serversideincludes(ssi)inae mpagesApache serversideincludes(ssi)inae mpages
Apache serversideincludes(ssi)inae mpagesDeepak Bhardwaj
 
Philip Arthur Moore: Best Practices — On Breaking and Fixing WordPress Themes
Philip Arthur Moore: Best Practices — On Breaking and Fixing WordPress ThemesPhilip Arthur Moore: Best Practices — On Breaking and Fixing WordPress Themes
Philip Arthur Moore: Best Practices — On Breaking and Fixing WordPress ThemesPhilip Arthur Moore
 
6 Special Howtos for Drupal
6 Special Howtos for Drupal6 Special Howtos for Drupal
6 Special Howtos for DrupalWingston
 
Parallelminds.web partdemo
Parallelminds.web partdemoParallelminds.web partdemo
Parallelminds.web partdemoManishaChothe
 
Google AMP (Accelerated Mobile Pages)
Google AMP (Accelerated Mobile Pages)Google AMP (Accelerated Mobile Pages)
Google AMP (Accelerated Mobile Pages)Chitpong Wuttanan
 
Chanhao Jiang And David Wei Presentation Quickling Pagecache
Chanhao Jiang And David Wei Presentation Quickling PagecacheChanhao Jiang And David Wei Presentation Quickling Pagecache
Chanhao Jiang And David Wei Presentation Quickling PagecacheAjax Experience 2009
 
Step by step guide for creating wordpress plugin
Step by step guide for creating wordpress pluginStep by step guide for creating wordpress plugin
Step by step guide for creating wordpress pluginMainak Goswami
 
Top 8 hidden handy features of word press
Top 8 hidden handy features of word pressTop 8 hidden handy features of word press
Top 8 hidden handy features of word pressJohn057
 
11cadogan cms tutorial
11cadogan cms tutorial11cadogan cms tutorial
11cadogan cms tutorialSarasotaSummit
 
Accelerated Mobile Pages (AMP) in Magento
Accelerated Mobile Pages (AMP) in MagentoAccelerated Mobile Pages (AMP) in Magento
Accelerated Mobile Pages (AMP) in MagentoMagecom UK Limited
 
BP304 - Blog It Up, Baby! Extending the new IBM Lotus Domino Blog Template
BP304 - Blog It Up, Baby! Extending the new IBM Lotus Domino Blog TemplateBP304 - Blog It Up, Baby! Extending the new IBM Lotus Domino Blog Template
BP304 - Blog It Up, Baby! Extending the new IBM Lotus Domino Blog TemplateSean Burgess
 
5 年後還是新手 - WordPress Plugin 開發大冒險 - GOTY
5 年後還是新手 - WordPress Plugin 開發大冒險 - GOTY5 年後還是新手 - WordPress Plugin 開發大冒險 - GOTY
5 年後還是新手 - WordPress Plugin 開發大冒險 - GOTYWilliam Chong
 
Java applet basics
Java applet basicsJava applet basics
Java applet basicsSunil Pandey
 

Ähnlich wie Aloha Editor usage example (20)

Useful Rails Plugins
Useful Rails PluginsUseful Rails Plugins
Useful Rails Plugins
 
Asp.Net 2.0 Presentation
Asp.Net 2.0 PresentationAsp.Net 2.0 Presentation
Asp.Net 2.0 Presentation
 
WordPress Ann Arbor: WP Tips and Tricks
WordPress Ann Arbor: WP Tips and TricksWordPress Ann Arbor: WP Tips and Tricks
WordPress Ann Arbor: WP Tips and Tricks
 
Building a Blogging System -- Rapidly using Alpha Five v10 with Codeless AJAX...
Building a Blogging System -- Rapidly using Alpha Five v10 with Codeless AJAX...Building a Blogging System -- Rapidly using Alpha Five v10 with Codeless AJAX...
Building a Blogging System -- Rapidly using Alpha Five v10 with Codeless AJAX...
 
Selectionwidgetwhitepaper 140907120000-phpapp02
Selectionwidgetwhitepaper 140907120000-phpapp02Selectionwidgetwhitepaper 140907120000-phpapp02
Selectionwidgetwhitepaper 140907120000-phpapp02
 
Hippo CMS - A first look
Hippo CMS - A first lookHippo CMS - A first look
Hippo CMS - A first look
 
Apache serversideincludes(ssi)inae mpages
Apache serversideincludes(ssi)inae mpagesApache serversideincludes(ssi)inae mpages
Apache serversideincludes(ssi)inae mpages
 
Philip Arthur Moore: Best Practices — On Breaking and Fixing WordPress Themes
Philip Arthur Moore: Best Practices — On Breaking and Fixing WordPress ThemesPhilip Arthur Moore: Best Practices — On Breaking and Fixing WordPress Themes
Philip Arthur Moore: Best Practices — On Breaking and Fixing WordPress Themes
 
6 Special Howtos for Drupal
6 Special Howtos for Drupal6 Special Howtos for Drupal
6 Special Howtos for Drupal
 
Parallelminds.web partdemo
Parallelminds.web partdemoParallelminds.web partdemo
Parallelminds.web partdemo
 
Google AMP (Accelerated Mobile Pages)
Google AMP (Accelerated Mobile Pages)Google AMP (Accelerated Mobile Pages)
Google AMP (Accelerated Mobile Pages)
 
Chanhao Jiang And David Wei Presentation Quickling Pagecache
Chanhao Jiang And David Wei Presentation Quickling PagecacheChanhao Jiang And David Wei Presentation Quickling Pagecache
Chanhao Jiang And David Wei Presentation Quickling Pagecache
 
Step by step guide for creating wordpress plugin
Step by step guide for creating wordpress pluginStep by step guide for creating wordpress plugin
Step by step guide for creating wordpress plugin
 
Top 8 hidden handy features of word press
Top 8 hidden handy features of word pressTop 8 hidden handy features of word press
Top 8 hidden handy features of word press
 
11cadogan cms tutorial
11cadogan cms tutorial11cadogan cms tutorial
11cadogan cms tutorial
 
Accelerated Mobile Pages (AMP) in Magento
Accelerated Mobile Pages (AMP) in MagentoAccelerated Mobile Pages (AMP) in Magento
Accelerated Mobile Pages (AMP) in Magento
 
BP304 - Blog It Up, Baby! Extending the new IBM Lotus Domino Blog Template
BP304 - Blog It Up, Baby! Extending the new IBM Lotus Domino Blog TemplateBP304 - Blog It Up, Baby! Extending the new IBM Lotus Domino Blog Template
BP304 - Blog It Up, Baby! Extending the new IBM Lotus Domino Blog Template
 
5 年後還是新手 - WordPress Plugin 開發大冒險 - GOTY
5 年後還是新手 - WordPress Plugin 開發大冒險 - GOTY5 年後還是新手 - WordPress Plugin 開發大冒險 - GOTY
5 年後還是新手 - WordPress Plugin 開發大冒險 - GOTY
 
TopicHero Descriptions Tutorial
TopicHero Descriptions TutorialTopicHero Descriptions Tutorial
TopicHero Descriptions Tutorial
 
Java applet basics
Java applet basicsJava applet basics
Java applet basics
 

Aloha Editor usage example

  • 1. This is a sample website. E.g. a blogpost provided by a static webserver, wordpress, or any other cms.   If the user is authorized, "Aloha Editor" is activated by adding a couple of javascript lines. The user can edit the content within the frontend, without page reload or entering a backend.
  • 2. This is the source code of the website. The yellow marks show - the inclusion of the Aloha Editor. - the edit-enabling of two dom elements (the teaser content1 and the body content2)
  • 3. This is a dummy implementation of a "save" button in the ribbon (see slides for screendesign):   A button is added to the ribbon. when called, the content of all editable dom elements is fetched (and automatically cleaned of any browser-quirks html or helper code), and can be stored to a backend (wordpress api, typo3, etc).