In this training, we are excited to show how the drag and drop experience empowers you to rapidly and intuitively create engaging digital experiences
In this video, we’ll cover
How to tell if a page supports drag and drop
The content blocks you’ll use to create experiences
What to expect when you create your page
Modifying your page
When to work with a developer
Traditionally, Digital experiences required writing complex code and using custom defined templates.
With Crownpeak’s Drag and Drop experience, components are created and added to your Component Library as reusable content blocks, without using any Crownpeak API code, and intuitively dragged and dropped directly into your Digital Experience.
Drag and Drop Pages
Here’s how to tell if your page supports this feature
From View in the top menu, select Arrange Workspace > Editor to add the Content block and DAM panels to your workspace.
Open your page
If the page supports drag and drop, Content Blocks Panel will become enabled
In Preview mode, you’ll see this message to switch to Inline mode for access to the component.
In Inline mode, the blocks will become active – see the blue highlights?
A moment about the Content Blocks Panel
This is one of the draggable panels in V3.
It centralizes the management of
Basic Components – these are the building blocks for advanced components
Advanced Components which are defined by you and your development team to provide content editors with a common interface to rapidly modify a page based on zones, also specified by the customer.
What to expect
Now that you have confirmed your page supports drag and drop, let’s create an experience
Make sure you are in Inline mode to display Zones
The editor workspace puts the Content blocks panel over here on the right, but remember you can drag this or any panel into one of these locations [[show options on screen]] for your best experience
Please note your options on the Basic and Advanced Components tabs
On the Advanced Components Tab
You’ll see the component name is displayed
As well as the available Zones, which are displayed under Name
This is the governance feature built into Drag and Drop – your developer can specify which components are valid for each zone
Begin dragging Components onto your page
You see the available zones light up
Un-available zones are greyed out
And the zone names displayed
Once in an available zone
A blue bar appears to show which zone this component will be dropped into
It’s that easy
Fill in the available zones to create unique experiences
And thenmanage content as you would in any other page – either from the Inline mode
Orin Form mode.
Hover over the component to see the options. The cog in the middle will take you to the form mode
Editing the experience
If you go back to inline mode, you can see that changing an experience is as simple as creating one
Hover over a Component again
Grab the component to drag up or down and modify the experience
Or use the X to delete a component
Now that this zone is blank again, you can select another component to complete the page
When to work with a developer
Once you start creating experiences in Drag and Drop, you might find that you don’t have the components you need to create the pages you desire. This is easy to fix, but this might require a developer who can create and add components to your Component Library as reusable content block(s).
Also, if you don’t have any pages that support drag and drop on your site, work with your development team to get them created for you.
Keep in mind, no Crownpeak Template API code is required, but HTML and CSS knowledge is needed.
If you are a developer who wants more information creating these components, please check the CMS KnowledgeBase for articles including this one on creating advanced components.
If you are not a developer and interested in playing with drag and drop in a safe training environment, contact support for access to the training and demos instance.
In summary, once you confirm your page is supportedby drag and drop, use the content blocks panel to create experiences for your site. Work with your development team to add drag and drop pages to your existing site.
Contact Support or Customer Success if you have questions or need any help.