- Developing User Guide overview
- Introduction for Developers
- Getting Started Developing AEM Sites - WKND Tutorial
- AEM Core Concepts
- Structure of the AEM Touch-Enabled UI
- Concepts of the AEM Touch-Enabled UI
- AEM Development - Guidelines and Best Practices
- Using Client-Side Libraries
- Developing and Page Diff
- Editor Limitations
- The CSRF Protection Framework
- Data Modeling - David Nuescheler’s Model
- Contributing to AEM
- Security
- Reference Materials
- Create a Fully-Featured Website (Classic UI)
- Designs and the Designer (Classic UI)
- Migration to the Touch UI
- Platform
- Sling Cheatsheet
- Using Sling Adapters
- Tag Libraries
- Templates
- Using the Sling Resource Merger in AEM
- Overlays
- Naming Conventions
- Creating a New Granite UI Field Component
- Query Builder
- Tagging
- Customizing Pages shown by the Error Handler
- Custom Node Types
- Adding Fonts for Graphic-Rendering
- Connecting to SQL Databases
- Externalizing URLs
- Creating and Consuming Jobs for Offloading
- Configuring Cookie Usage
- How to programmatically access the AEM JCR
- Integrating Services with the JMX Console
- Developing the Bulk Editor
- Developing Reports
- Components
- Core Components
- Style System
- Components Overview
- AEM Components - The Basics
- Developing AEM Components
- Developing AEM Components - Code Samples
- JSON Exporter for Content Services
- Enabling JSON Export for a Component
- Image Editor
- Decoration Tag
- Using Hide Conditions
- Configuring Multiple In-Place Editors
- Developer Mode
- Testing Your UI
- Components for Content Fragments
- Obtaining Page Information in JSON Format
- Internationalization
- Classic UI Components
- Headful and Headless in AEM
- Headless Experience Management
- Headless and AEM
- Headless Journeys
- Headless Developer Journey
- Understand Headless in AEM
- Learn about CMS Headless Development
- Getting Started with AEM Headless as a Cloud Service
- Path to your first experience using AEM Headless
- How to model your content as AEM Content Models
- How to access your content via AEM delivery APIs
- How to update your content via AEM Assets APIs
- How to put it all together
- How to go live with your headless application
- Optional - How to create single page applications with AEM
- Headless Content Architect Journey
- Headless Developer Journey
- Getting Started Guides
- Content Fragments
- Headless Delivery with Content Fragments and GraphQL
- Working with Content Fragments
- Enable Content Fragment Functionality for your Instance
- Content Fragment Models
- Managing Content Fragments
- Variations - Authoring Fragment Content
- Markdown
- Using Associated Content
- Metadata - Fragment Properties
- Structure Tree
- Preview - JSON Representation
- Delivery API
- Hybrid and SPA AEM Development
- Hybrid and SPA with AEM
- SPA Introduction and Walkthrough
- SPA WKND Tutorial
- Getting Started using React
- Implementing a React Component for SPA
- Getting Started using Angular
- SPA Deep Dives
- Developing SPAs for AEM
- SPA Editor Overview
- SPA Blueprint
- SPA Page Component
- Dynamic Model to Component Mapping for SPAs
- SPA Model Routing
- The RemotePage Component
- Editing an External SPA within AEM
- Composite Components in SPAs
- SPA and Server-Side Rendering
- Enabling JSON Export for a Component
- Launch Integration
- SPA Reference Materials
- Development Tools
- Development Tools
- AEM Modernization Tools
- Dialog Editor
- Dialog Conversion Tool
- Developing with CRXDE Lite
- Managing Packages Using Maven
- How to Develop AEM Projects Using Eclipse
- How to Build AEM Projects using Apache Maven
- How to Develop AEM Projects using IntelliJ IDEA
- How to use the VLT Tool
- How to use the Proxy Server Tool
- AEM Brackets Extension
- AEM Developer Tools for Eclipse
- AEM Repo Tool
- Personalization
- Extending AEM
- Extending AEM using Adobe Developer App Builder
- Customizing Page Authoring
- Customizing the Consoles
- Customizing Views of Page Properties
- Configuring your Page for Bulk Editing of Page Properties
- Customizing and Extending Content Fragments
- Content Fragments Configuring Components for Rendering
- Experience Fragments
- Extending Workflows
- Extending the Multi Site Manager
- Tracking and Analytics
- Cloud Services
- Creating Custom Extensions
- Forms
- Integrating Services with the JMX Console
- Developing the Bulk Editor
- Extending Classic UI
- Testing
- Best Practices
- Best Practices Overview
- AEM Development Guidelines and Best Practices
- Development Best Practices
- Content Architecture
- Software Architecture
- We.Retail Reference Implementation
- We.Retail Reference Implementation
- Trying out Content Fragments in We.Retail
- Trying out Core Components in We.Retail
- Trying out Editable Templates in We.Retail
- Trying out Responsive Layout in We.Retail
- Trying out the Globalized Site Structure in We.Retail
- Trying out Experience Fragments in We.Retail
- Coding Tips
- Code pitfalls
- OSGI Bundles
- JCR Integration
- Code Samples
- Troubleshooting Slow Queries
- Mobile Web
We.Retail Reference Implementation
Introduction
We.Retail is a reference implementation and sample content that illustrates the recommended way of setting up an online presence with Adobe Experience Manager.
We.Retail makes use of the latest AEM technologies such as HTL, responsive layouts, editable templates, core components, and much more.
While it illustrates a retail vertical, the way the site is setup can be applied to any vertical, and only the product catalog and cart features are retail-specific.
Features
As AEM’s standard reference implementation, We.Retail showcases some of the most powerful features of AEM.
| Feature | Description | Interested? |
|---|---|---|
| Globalized site structure | We.Retail includes language masters which are live-copied into country-specific sites. | Try it! |
| Responsive layout | All pages feature responsive layout to adapt dynamically to screen and device size. | Try it! |
| Editable templates | All pages are based on editable templates, allowing non-developers to adapt and customize the templates. | Try it! |
| HTML Template Language | All components are based on HTL | |
| eCommerce capabilities | Features a product catalog | |
| Communities sites | Allowing visitors to join in community discussions, read blogs, and much more | |
| Core Components | All components are based on the new core components and are more usable and user-configurable out-of-the-box | Try it! |
| Content Fragments | The We.Retail Experiences section showcases the power of reusing content via content fragments. | Try them! |
| Experience Fragments | An Experience Fragment is a group of one or more components including content and layout that can be referenced within pages. | Try them! |
Getting Started
We.Retail is delivered as AEM’s sample content. In order to use, simply start AEM as you normally would, making sure that sample content is not disabled.
We.Retail should not be installed on production instances. Production instances should be started in nosamplecontent runmode.
We.Retail is based on the latest AEM technology and therefore does not support classic UI authoring.
Latest Version
Although We.Retail is distributed with the AEM release, updates to the content and its features may be made after the release. Therefore it is possible to download the latest release from GitHub and then upload and install it as a package on your AEM instance.
First Steps
-
Once AEM is started (and/or We.Retail is installed), the site We.Retail is available in the sites console.
-
For example the following page can be opened and it should look as displayed in the appendix below:
https://<server name>:<port number>/editor.html/content/we-retail/language-masters/en.html
We.Retail & Geometrixx
Geometrixx and its many incarnations served as sample content in earlier versions of AEM. Since version 6.3, We.Retail has been the sample content delivered with AEM and serves as the new standard reference implementation.
We.Retail is technically more robust and exploits the latest AEM technology to be more flexible and scalable, while also demonstrating the newest features of the product.
Feature Comparison
The following table gives an overview of major features that are available in We.Retail as compared to Geometrixx.
- Available means that examples of the feature are found in the sample content.
- Not available means that examples of the feature are not available in the sample content, but does not mean that the feature itself is not.
| Feature | We.Retail | Geometrixx |
|---|---|---|
| Globalized site structure | Language masters live-copied into country-specific sites | Not available |
| Content Fragments | Available | Not available |
| Experience Fragments | Available | Not available |
| Responsive Layout | For all pages | Only Geometrixx Media |
| Editable Templates | For all pages | Not available |
| HTL | All components | Limited |
| Targeting | For all pages | Only Geometrixx Outdoors |
| Screens | Available | Not available |
| Mobile | Not available | Available |
| Manuscripts | Not available | Available |
| Carousel, download, chart components | Not available | Available |
| Column control | Replaced by layout container | Available |
| Forms | Not available | Available |
| Campaign | No email samples | Available |
This list strives to be complete, but should not be considered exhaustive.
Contribute
We.Retail has been released as an open-source project and the latest version of the source code can be downloaded from GitHub.
CODE ON GITHUB
You can find the code of this page on GitHub
- Open aem-sample-we-retail project on GitHub
- Download the project as a ZIP file
The latest release can also be downloaded directly as an installable package.
If you encounter problems, please file GitHub issues.
Feel free to fork or to contribute with pull requests.
Preview
Preview of the We.Retail welcome page:
Business.Adobe.com resources
Resources
Adobe Account
