EVOLVE'13 | Enhance | Responsive Design | Chis Leggett

•Download as PPTX, PDF•

0 likes•779 views

Evolve The Adobe Digital Marketing Community

Technology

1
ADOBE CQ ENHANCEMENTS FOR
RESPONSIVE DESIGN AND EDITORIAL
CONTROL

2
INTRODUCTION
• Christopher Leggett
• Senior Developer
• Velir
• 6 Years Web Development Experience

4
CQ ENHANCEMENTS
Focus For Enhancements
• Support Responsive Design
• Ease Content Entry
• Aim To Solve Common Needs
• Contribute To The CQ Community
https://github.com/Velir/AEM-Toolbox

5
CQ ENHANCEMENTS
Enhanced Image Servlet
• New Resizing Options
New Widgets
• Structured Multi List
• YouTube Search
Rich Text Editor Plugins
• New RTE Plugins
• How To Build Your Own

6
CQ ENHANCEMENTS
Enhanced Image Servlet
Existing Image Servlet

7
CQ ENHANCEMENTS
Enhanced Image Servlet
Existing Image Servlet Features

8
CQ ENHANCEMENTS
Enhanced Image Servlet
Resizing Considerations

9
CQ ENHANCEMENTS
Enhanced Image Servlet
Hard Width/Height Resizing

10
CQ ENHANCEMENTS
Enhanced Image Servlet
Max Width/Height and Min Width/Height Resizing

11
CQ ENHANCEMENTS
Enhanced Image Servlet
How To Use It

12
CQ ENHANCEMENTS
Enhanced Image Servlet
Skip Image Resizing With “.no” Selector
• Image Gallery

13
CQ ENHANCEMENTS
Enhanced Image Servlet

14
CQ ENHANCEMENTS
Enhanced Image Servlet
Demo

15
CQ ENHANCEMENTS
Structured Multi List Widget
CQ Widgets

16
CQ ENHANCEMENTS
Structured Multi List Widget
What’s Missing

17
CQ ENHANCEMENTS
Structured Multi List Widget
Carousel Component

18
CQ ENHANCEMENTS
Structured Multi List Widget
Cast Of Heroes

19
CQ ENHANCEMENTS
Structured Multi List Widget
Our Solution

20
CQ ENHANCEMENTS
Structured Multi List Widget
Vault XML Definition

21
CQ ENHANCEMENTS
Structured Multi List Widget
Demo

22
CQ ENHANCEMENTS
YouTube Search Widget

23
CQ ENHANCEMENTS
YouTube Search Widget
Demo

24
CQ ENHANCEMENTS
Rich Text Editor Plugins
Rich Text Editor

25
CQ ENHANCEMENTS
Rich Text Editor Plugins
Provided Plugins
• Basic Formatting (Bold, Italic, Underline)
• Justify (Left, Right, Center)
• Hyperlinks
• Lists
• Format (Wrapping Tag)
• Styling (CSS Class)
• Tables
• Source Editing
• Special Characters

26
CQ ENHANCEMENTS
Rich Text Editor Plugins
Additional Plugins
• Blockquote Plugin
• Formatting Plugin

27
CQ ENHANCEMENTS
Rich Text Editor Plugins
Demo

28
CQ ENHANCEMENTS
Rich Text Editor Plugins
What’s needed to build a plugin
• Plugin object (Extends CQ.form.rte.plugins.Plugin)
• UI objects (Extends CQ.form.rte.ui.TbElement)
• Command objects (Extends CQ.form.rte.commands.Command)

29
CQ ENHANCEMENTS
Rich Text Editor Plugins
Three Execution Paths
• UI Initialization
• Command Execution
• UI Updates

30
CQ ENHANCEMENTS
Rich Text Editor Plugins
UI Initialization

31
CQ ENHANCEMENTS
Rich Text Editor Plugins
Command Execution

32
CQ ENHANCEMENTS
Rich Text Editor Plugins
UI Updates

33
CQ ENHANCEMENTS
Christopher Leggett
Senior Developer
Velir
christopher.leggett@velir.com
Open Source
• https://github.com/Velir/AEM-Toolbox
.com

Viewers also liked

EVOLVE'14 | Keynote | Cédric Hüsler | Adobe

Evolve The Adobe Digital Marketing Community

EVOLVE"13 | Maximize & Enhance | Accessibility | Kiran Kaja

Evolve The Adobe Digital Marketing Community

EVOLVE'15 | Enhance | Bob O'Conner & Kevin Nenning | Capturing Existing Cont...

Evolve The Adobe Digital Marketing Community

EVOLVE'15 | Keynote | Kyle Metcalf | Rackspace

Evolve The Adobe Digital Marketing Community

EVOLVE'13 | Keynote | Jess Moore

Evolve The Adobe Digital Marketing Community

EVOLVE'15 | Flash Brief | Cat Reusswig | Adventures in AEM Upgrades

Evolve The Adobe Digital Marketing Community

EVOLVE'15 | Enhance| Christian Meyer & Andreea Sandru | AEM User interfacecus...

Evolve The Adobe Digital Marketing Community

Envision a world where brands interact directly with their customers – delivering customized, contextually relevant, in-the-moment experiences ranging from offers, to messaging, to rich content. The problem today is not gaining access to data, but knowing how to optimize it for a successful CRM strategy. SapientNitro helps organizations bring customer engagement to a whole new level by utilizing marketing automation for full integration with the Adobe Marketing Cloud. With a data driven marketing approach, organizations will be able to provide personalized product recommendations, increase transaction value, customer satisfaction and customer retention. Client examples to include John Hancock and McDonald’s

EVOLVE'16 | Keynote | Vikalp Tandon | Meeting the CRM Challenge - Adding Valu...

Evolve The Adobe Digital Marketing Community

EVOLVE'14 | Enhance | John Fait | Add Analytics To Your AEM Apps

Evolve The Adobe Digital Marketing Community

EVOLVE'15 | Enhance | Sharat Radhakrishnan & Benjamin Delman | Autodesk

Evolve The Adobe Digital Marketing Community

EVOLVE'16 | Enhance | Gordon Pike | Rev Up Your Marketing Engine

Evolve The Adobe Digital Marketing Community

EVOLVE'16 | Deploy | Abhishek Dwevedi | Introduction to AEM and the Marketing...

Evolve The Adobe Digital Marketing Community

Viewers also liked (12)

EVOLVE'14 | Keynote | Cédric Hüsler | Adobe

EVOLVE"13 | Maximize & Enhance | Accessibility | Kiran Kaja

EVOLVE'15 | Enhance | Bob O'Conner & Kevin Nenning | Capturing Existing Cont...

EVOLVE'15 | Keynote | Kyle Metcalf | Rackspace

EVOLVE'13 | Keynote | Jess Moore

EVOLVE'15 | Flash Brief | Cat Reusswig | Adventures in AEM Upgrades

EVOLVE'15 | Enhance| Christian Meyer & Andreea Sandru | AEM User interfacecus...

EVOLVE'16 | Keynote | Vikalp Tandon | Meeting the CRM Challenge - Adding Valu...

EVOLVE'14 | Enhance | John Fait | Add Analytics To Your AEM Apps

EVOLVE'15 | Enhance | Sharat Radhakrishnan & Benjamin Delman | Autodesk

EVOLVE'16 | Enhance | Gordon Pike | Rev Up Your Marketing Engine

EVOLVE'16 | Deploy | Abhishek Dwevedi | Introduction to AEM and the Marketing...

Similar to EVOLVE'13 | Enhance | Responsive Design | Chis Leggett

WordPress 4.0 - What's New

WP Australia

Performance - When, What and How

Astrails

iFactory delivered this webinar on April 3rd as part of our iFactoryEd webinar series. In the higher ed web environment, there are often a wide variety of administrative users. While we want the creation and maintenance of content to be easy, we also want to guarantee that non-technical content creators cannot "break" the site. In this webinar, we illustrate a few configuration options to show how to safely allow users to provide site content. We also demonstrate how tests can be used to verify the site's continued smooth operation within a moving landscape of content and code updates. Topics covered: > Configuring some aspects of the Drupal admin to enable a wide variety of users to create content > Writing and running Selenium tests to challenge your site's functionality > Using Drupal's SimpleTest module to verify functionality of custom modules The presenter was Lisa Sawin, Solutions Architect for iFactory. This was part 1 of a 3 part series. For the full webinar visit our YouTube channel: youtube.com/ifactoryboston

Drupal: Mitigating Risk with Multiple Content Creators

iFactory

Project Tools in Web Development

kmloomis

Continuous DB Changes Delivery With Liquibase

Aidas Dragūnas

Jagger release 2.0

Grid Dynamics

Sql dba training&classes

sssql

Thinking of upgrading your website to Drupal 8 or using Drupal 8 for a new project? In this webinar, we'll talk about the benefits of Drupal 8 and the killer features that will make you want to upgrade. We'll also discuss challenges of upgrading, major changes from previous versions of Drupal, and the steps you'll have to go through during the upgrade process. This webinar covers: Knowledge of the benefits of Drupal 8 Overall understanding of the upgrade process An overview of which contributed moduels and themes are ready for Drupal 8 Some ideas for migrating your content and configuration Tools and resources to use during your upgrade

Upgrading to Drupal 8: Benefits and Gotchas

Suzanne Dergacheva

AD1545 - Extending the XPages Extension Library

paidi_ed

New Web Revolution - html5 and css3

Nitish Surelia

Ravi Tadwalkar as SM/DevOps/management/Coach

Ravi Tadwalkar

Dev/Test scenarios in DevOps world

Davide Benvegnù

Extended support for SQL Server 2005 ends on April 12, 2016. This means that if you are still running SQL Server 2005 after April 12, 2016, you will no longer receive security updates. Now is the time to upgrade to SQL Server 2014 and Azure SQL Database to achieve breakthrough performance, maintain security and compliance, and optimize your data platform infrastructure. Join Rodney Landrum, Senior SQL Server Consultant and Microsoft MVP and Michael McCracken, HOSTING Director of Advanced Solutions, as they discuss key benefits to moving to a SQL Server 2014 and key considerations to take into account when migrating your databases.

Don’t Get Caught with An Out of Support MS SQL Server…

Hostway|HOSTING

Git Going w/ Git

heyMP

Application Deployment at UC Riverside

Michael Kennedy

CarTrawler's Feature Team Architecture and Development Process Showcase by Lu...

Lucas Sacramento

End_to_End_DevOps.pptx

CristianoSouza80853

DNN Launch Webinar: DNN Platform 8.0 and Evoq 8.3

DNN

Next Generation Architecture Showcase July 2019

Alan Pearson Mathews

Adopting Continuous Integration in an Ops Group

colleenfry

Similar to EVOLVE'13 | Enhance | Responsive Design | Chis Leggett (20)

WordPress 4.0 - What's New

Performance - When, What and How

Drupal: Mitigating Risk with Multiple Content Creators

Project Tools in Web Development

Continuous DB Changes Delivery With Liquibase

Jagger release 2.0

Sql dba training&classes

Upgrading to Drupal 8: Benefits and Gotchas

AD1545 - Extending the XPages Extension Library

New Web Revolution - html5 and css3

Ravi Tadwalkar as SM/DevOps/management/Coach

Dev/Test scenarios in DevOps world

Don’t Get Caught with An Out of Support MS SQL Server…

Git Going w/ Git

Application Deployment at UC Riverside

CarTrawler's Feature Team Architecture and Development Process Showcase by Lu...

End_to_End_DevOps.pptx

DNN Launch Webinar: DNN Platform 8.0 and Evoq 8.3

Next Generation Architecture Showcase July 2019

Adopting Continuous Integration in an Ops Group

More from Evolve The Adobe Digital Marketing Community

Evolve 19 | Sarah Xu & Kanika Gera | Adobe I/O - Why You Need it to Execute o...

Evolve The Adobe Digital Marketing Community

Evolve 19 | Upen Manickam & Amanda Gray | Adventures in SPA with AEM 6.5

Evolve The Adobe Digital Marketing Community

Evolve 19 | Ameeth Palla | Adobe Asset Link - Use Cases and Pitfalls to Avoid

Evolve The Adobe Digital Marketing Community

AEM is content-centric, so is the future of building commerce experiences. In this session, you will be shown how to build modern commerce experiences with AEM. The demo will explain how authors create/configure multiple (industry-independent) stores, configure the commerce environment for each store and manage all the commerce content and features, without writing a line of code. The second part will demonstrate how developers create templates, components, and functionality to build a compelling Web/User/Commerce Experience.

Evolve 19 | Giancarlo Berner | JECIS 2 - The Beginning of a New Era in Buildi...

Evolve The Adobe Digital Marketing Community

Evolve 19 | Paul Legan & Kristin Jones | Anatomy of a Solid AEM Implementatio...

Evolve The Adobe Digital Marketing Community

The roles of the Product Owner, Business Analyst and/or Subject Matter Expert are crucial to the success of an AEM project, especially at critical times. From the development team’s perspective leveraging these resources during kickoff can set the project up for success. Hear more about the right resourcing and preparation for kickoff can enable development teams to start a project off right and to avoid costly changes (scope increase or rework) later in the project.

Evolve 19 | Rabiah Coon & Rebecca Blaha | Rockstar Kickoffs for AEM Projects

Evolve The Adobe Digital Marketing Community

In this session, attendees will learn about key take-aways from a recent interactive round table hosted by Translations.com and Adobe with their shared customers, Lavazza, Western Digital, Lufthansa, and Honeywell. As the $800M leader of their industry, Translations.com will also share trends in translations they are seeing across their 95+ Adobe Experience Manager customers. Bring your burning localization related questions to this interactive session.

Evolve19 | Nick Panagopoulos | World Focus: Translation Tips and Trends

Evolve The Adobe Digital Marketing Community

When Furniture Row decided to leave their digital assets management provider to go to AEM, they began a multi-phased journey that has resulted in the transition of their eCommerce platform and content management system. They recently launch a newly redesigned DenverMattress.com site which introduces a headless implementation of AEM sites, a new authoring experience for their content team, and an upgrade from a freestanding instance of Scene7 Classic to Dynamic Media integrated with AEM Assets. Hear from the implementation team and learn more about Furniture Row’s digital evolution.

Evolve 19 | Rabiah Coon, Sabrina Schmidt & Noah Linge | Industry Focus | Furn...

Evolve The Adobe Digital Marketing Community

Today’s customers expect relevant and personalized engagement with brands – or they go elsewhere. In this session, Carl will lay out some of the hurdles involved in crafting a customer- and loyalty-forward data management and architectural strategy. Using examples from specific client engagements, he will outline approaches to building an actionable data and technology stack on which teams can build and extend personalized interactions.

Evolve 19 | Carl Madaffari | Best Practices | From Customer Data to Customer ...

Evolve The Adobe Digital Marketing Community

Evolve 19 | Kevin Campton & Sharat Radhakrishnan | Industry Focus | Autodesk ...

Evolve The Adobe Digital Marketing Community

Evolve 19 | Gina Petruccelli | Let’s Dig Into Requirements

Evolve The Adobe Digital Marketing Community

Evolve 19 | Dave Fox | Retaining Niche Talent in a Highly Competitive Environ...

Evolve The Adobe Digital Marketing Community

Evolve 19 | Paul Legan | Going Beyond Metadata: Extracting Meaningful Informa...

Evolve The Adobe Digital Marketing Community

Evolve19 | Giancarlo Berner & Brett Butterfield | AI & Adobe Sensei

Evolve The Adobe Digital Marketing Community

Evolve 19 | Gordon Pike | Prepping for Tomorrow - Creating a Flexible AEM Arc...

Evolve The Adobe Digital Marketing Community

Evolve 19 | Jayan Kandathil | Running AEM Workloads on Microsoft Azure

Evolve The Adobe Digital Marketing Community

Evolve 19 | Amol Anand & Daniel Gordon | Author in AEM Once - Deliver Everywhere

Evolve The Adobe Digital Marketing Community

Evolve 19 | Benjie Wheeler | Intro to Adobe Experience Manager 6.5

Evolve The Adobe Digital Marketing Community

Evolve 19 | Bruce Swann | Adobe Campaign - Capabilities, Roadmap, and Fit wit...

Evolve The Adobe Digital Marketing Community

Evolve 19 | Pete Hoback & Francisco Fagalde | AEM QA, UAT, & Go Live

Evolve The Adobe Digital Marketing Community

More from Evolve The Adobe Digital Marketing Community (20)