Fragment status and lifecycle

The fragment status determines its availability for use in an email or email template, and the changes that you can make to it.

StatusDescription
Draft

When you create a fragment, it is in draft status. It remains in this status as you define or edit the visual content until you publish it for use in an email or email template. Available actions:

  • Edit all details
  • Edit in visual designer
  • Publish
  • Duplicate
  • Delete
Published

When you publish a fragment, it becomes available for use in an email or email template. A published fragment content cannot be modified in the visual designer. Available actions:

  • Edit description
  • Add to an email or template
  • Create draft version
  • Duplicate
  • Delete (if not in-use)
Published with draft

When you create a draft from a published fragment, the published version remains available for use in an email or email template, and the draft content can be modified in the visual designer. If you publish the draft version, it replaces the current published version and the content is updated in the emails and email templates where it is in use. Available actions:

  • Edit description
  • Add to an email or template
  • Edit draft version in visual designer
  • Publish draft version
  • Duplicate
  • Delete (if not in-use)

Fragment status lifecycle

IMPORTANT
Fragment status was introduced in the Journey Optimizer B2B Edition August release. All fragments created before this release have the Draft status, even if they are used in an email or template. If you make any change to these fragments, you must publish the fragment to propagate the changes.

Filter the fragments list

To search for a fragment by name, enter a text string into the search bar for a match. Click the Filter icon ( Show or hide filters icon ) to show the available filter options and change the settings to filter the displayed items according to your specified criteria.

Filter the displayed fragments

Customize the column display

Customize the columns that you want to display in the table by clicking the Customize table icon ( Customize table icon ) at the top right.

In the dialog, select the columns to display and click Apply.

Select the columns that you want to display

Create fragments

You can create new visual fragments in Journey Optimizer B2B Edition by clicking Create fragment at the top right.

  1. In the Create fragment dialog, enter a useful Name and Description (optional).

    Fragment requirements:

    • Name - Maximum of 100 characters, must be unique, case-insensitive

    • Description - Maximum of 300 characters

    • Alpha, numeric, and special characters are allowed

    • Reserved characters are not allowed: \ / : * ? " < > |

    Create fragment dialog

  2. Click Create.

    The visual designer opens with an empty canvas.

  3. Use the content design tools to create the visual fragment content:

  4. Click Save at any time to save the draft fragment.

  5. When you are ready to make the fragment available for use in an email or email template, click Publish.

Add structure and content

  1. To start your content design, drag an item from the Structures and drop it onto the canvas.

    Add as many items from Structures as you need and edit the settings for each in the pane on the right.

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

    Drag a structure onto the canvas and adjust the settings

    Each column size cannot be less than 10% of the total width of the structure component. Only empty columns can be removed.

  2. Expand the Contents section and add as many elements as you need into one or more structure components.

    Drag a content element onto the canvas and adjust the settings

  3. If needed, you can make additional customizations for each component in the Settings or Style tabs.

    For example, you can change the text style, padding, or margin of each component.

  4. To add conditional content and adapt the content to the targeted profiles based on conditional rules, select a content component and click the Enable conditional content icon in the component toolbar.

    For more informantion, see Conditional content.

Add assets

In the visual content editor, select the Assets icon ( Show Assets ) that is displayed on the left.

NOTE
If you have a subscription for Experience Manager Assets as a Cloud Service along with the default Adobe Marketo Engage Design Studio, you choose the image source at the time of creation for an email, email template, or visual fragment. You can also select the image source before you open the visual designer for editing.

The following example outlines steps to add assets to the template content:

  1. To open the assets library, click the Assets icon.

    From the asset selector, you can directly select assets stored in the source library.

  2. Add a new asset by dragging and dropping the image asset into a structure component.

    Drag a Marketo Engage asset onto the canvas and adjust the settings

    For more information about using assets from your source type, see Add assets to your content.

  3. Replace an existing image asset by selecting it on the canvas and click Select an asset in the image source tools.

    Select an asset from the source library

As you work with the content in the visual designer, you can access the layers/containers and elements using the Navigation tree. Click the Navigation icon to display the tree to the left of the canvas.

Access the content layers

The following example outlines steps to adjust padding and vertical alignment inside a structure component composed of columns.

  1. Select the column in the structure component directly in the canvas or using the Navigation tree displayed at the left.

  2. From the column toolbar, click the Select a column tool and choose the one that you want to edit.

    You can also select it from the structure tree. The editable parameters for that column are displayed in the Settings and Styles tabs on the right.

    Column components displayed in the visual designer

  3. To edit the column properties, click the Styles tab on the right and change them according to your needs:

    • For Background, change the background color as needed.

      Clear the check box for a transparent background. Enable the Background image setting to use an image as the background instead of a solid color.

    • For Alignment, select the Top, Middle, or Bottom icon.

    • For Padding, define the padding for all sides.

      Select Different padding for each side if you want to fine tune the padding. Click the Lock icon to break synchronization.

    • Exapnd the Advanced section to define inline styles for the column.

    Change the styles for the selected column

  4. If needed, repeat these steps to adjust the alignment and padding for the other columns in the component.

  5. Save your changes.

Personalize content

Journey Optimizer B2B Edition uses an inline simple syntax that allows you to create expressions with personalized content enclosed by double curly braces {}. You can add multiple expressions in the same content or field without restrictions.

Examples:

  • Hello {{profile.person.name.firstName}} {{profile.person.name.lastName}}

  • Hello {{profile.person.name.fullName}}

When processing the message (email and SMS), Journey Optimizer B2B Edition replaces the expression with the data contained in the Experience Platform database. So, the first example becomes Hello John Doe.

The following example outlines steps to personalize content using lead/account attributes and system tokens.

  1. Select the text component and click the Add personalization icon in the toolbar.

    Click the Personalize icon

    This action opens the Edit Personalization dialog.

  2. Click + or to add a token to the blank space.

    Construct personalized text using tokens

  3. Click Save.

Edit linked URL tracking

  1. Click the Links icon on the left to display all the URLs of your content to be tracked.

  2. If needed, click the Edit (pencil) icon and modify the Tracking Type or Label.

    You can also add Tags for a link.

Click More to access template actions

View fragment details

Click the name of any fragment in the list page to open the fragment details page. You can choose to edit the fragment, rename the fragment, or update the fragment description. Make updates and click outside of the name or description field to auto-save changes.

NOTE
If a published fragment is in use by an email or email template, you cannot change the name or edit the content. You can create a draft version if you want to make changes to the fragment.

View details for a published fragment

Click Edit fragment to open the fragment in the visual content editor.

Exit the view at any time by clicking the Back arrow at the top left, which returns you to the Fragments list page.

View fragment used-by references

Within the fragment details page, click the Used By tab to view details of where the fragment is currently used within Journey Optimizer B2B Edition, across emails, email templates, and fragments.

IMPORTANT
Any fragment that is currently in use by any email or email template cannot be deleted.

References are displayed according to category: Email or Email template. Emails in Journey Optimizer B2B Edition are embedded and authored within account journeys, so the parent journey of the email that uses the fragment is displayed in references.

Used by references for the fragment

Click the link to open the corresponding email or email template where the fragment is used.

Delete fragments

Any fragment that is currently in use by any email or email template cannot be deleted, so ensure that you check the used-by references before initiating a fragment removal. Also, a removal cannot be undone, so check before initiating a delete action.

You can delete a fragment using either of the following methods:

  • From the fragment details on the right, click Delete.
  • From the Fragments listing page, click the ellipsis next to the fragment and choose Delete.

This action opens a confirmation dialog. You can abort the process by clicking Cancel, or click Delete to confirm deletion.

Delete fragment dialog

If the fragment is currently in use, the action opens an informational dialog that alerts you that it cannot be deleted. Click OK, which aborts the delete action.

Delete fragment dialog - cannot delete in-use fragment