Design content from scratch content-from-scratch

Use Adobe Journey Optimizer Designer to easily define the structure of your contents. By adding and moving structural elements with simple drag-and-drop actions, you can design the shape of your contents within seconds.

To start building your content, follow the steps below:

  1. From the Designer home page, select the Design from scratch option.

  2. Start designing your content by drag and dropping Structures into the canvas to define the layout of your email.

    note note
    Stacking columns is not compatible with all email programs. When not supported, columns will not be stacked.
  3. Add as many Structures as needed and edit their settings in the dedicated pane on the right.

    Select the n:n column component to define the number of columns of your choice (between 3 and 10). You can also define the width of each column by moving the arrows at the bottom of each column.

    note note
    Each column size cannot be under 10% of the total width of the structure component. You cannot remove a column that is not empty.
  4. Expand the Contents section and add as many elements as you need into one or more structure components. Learn more about content components

  5. Each component can be further customized using the Settings or Style tabs in the right menu. For example, you can change the text style, padding or margin of each component. Learn more about alignment and padding

  6. From the Asset picker, you can directly select assets stored in the Assets library. Learn more about asset management

    Double-click the folder which contains your assets. Drag and drop them into a structure component.

  7. Insert personalization fields to customize your content from profiles attributes, audience memberships, Contextual attributes, and more. Learn more about content personalization

  8. Click Enable condition content to add dynamic content and adapt the content to the targeted profiles based on conditional rules. Get started with dynamic content

  9. Click the Links tab from the left pane to display all the URLs of your content that will be tracked. You can modify their Tracking Type or Label and add Tags if needed. Learn more about links and tracking

  10. If needed, you can further personalize your email by clicking Switch to code editor from the advanced menu. This allows you to edit the email source code, for example to add tracking or custom HTML tags. Learn more about the code editor

    note caution
    You cannot revert back to the visual designer for this email after switching to the code editor.
  11. Once your content is ready, click the Simulate content button to check rendering. You can choose the desktop or mobile view. Detailed information on how to select test profiles and preview your content is available in the Content Management section.

  12. When your content is ready, click Save.