Skip to main content

Edit subscription form items

Abstract

Learn how to design a layout for your subscription form using items.

Sitecore Send lets you design a subscription form in the subscription form editor. You can choose between the predefined templates in the template library. The template structure contains one or more slots and supports specific items such as image, spacer, text, form, and timer. The Items tab shows the default items in their corresponding slots. You can edit, move, and delete items in your selected template. You cannot add new items that are not available on the form.

To edit an image item:

  1. In the editing area, click the image to display the Image settings in the right pane.

  2. You can change the following settings:

    • Change the background color, border width and color, alignment, padding, image height and width, and border radius.

    • Set a URL link and enter an alternative text (Alt text) to be displayed if the image cannot be displayed.

    • Crop your image and adjust its size.

    • Change your image.

    • Remove your image.

  3. To resize the image manually, click ResizeImage.png in the image corner and drag it to increase or decrease its size in the container.

To edit a text item:

  1. In the editing area, click the text item to display the Text settings in the right pane.

  2. You can change the background color, border width, color, and radius, and padding.

  3. If you want to use custom fonts, add a custom font in the editor settings and use it in your subscription form.

  4. In the Text field, enter your text.

  5. You can use the editing options, as well as:

    • Upload file - click Settings, then Icon_upload_file.png to upload a file. Drag and drop or browse to add a new file, or select a recent file from the list. To remove a file, click Remove_file_icon.png.

      Note

      You can upload a file of maximum 20MB.

    • Spellcheck - click Settings, then Spellcheck.png to set the dictionary language for spell check.

    • Source code - click Icon_SourceCode.png to open a dialog where you can edit the HTML code of your text. You can use this, for example, when you manually change the font weight.

    • Insert link - click Content, then select the part of the text that you want to use as a link. Click Icon_Link.png or press Ctrl+L on your keyboard and fill out the details in the Insert/Edit Link dialog.

    Note

    When pasting text, we recommend that you paste in plain text format (use CTRL+Shift+V) to avoid any problems displaying the text properly or fixing unwanted formatting.

The spacer item adds space or a line between items on your subscription form.

To edit a spacer item:

  1. In the editing area, click the spacer item to display the Spacer settings in the right pane.

  2. You can change the background color, shadow settings, height (in pixels), and border settings.

To edit a form item:

  1. In the editing area, click the form item to display the Form settings in the right pane.

  2. You can change the background color, shadow settings, form width, type, and alignment, border color, and padding.

  3. Additionally, you can set:

    • On Submit - select the action you want to launch when a visitor subscribes to your list.

    • Select Mailing List - select the mailing list you want to use for your form.

      Note

      If you make any changes to the selected email list's custom fields, the form does not automatically reflect the changes. You must re-select the email list for the form item to get the updates.

    • Edit Custom Fields - click to use existing custom fields or create new custom fields.

  4. In the Field Styles, Label Styles, Placeholder Styles, and Button Styles drop-down menus, specify the appropriate styles.

  5. To let a customer spin a wheel to get a coupon code in return for submitting their email address, in the Wheel of fortune drop-down menu, select the Enable wheel check box, and set the padding and wheel size.

  6. Click Edit slices and in the Slices dialog define the type, label, coupon code, color and probability. Then click Save.

  7. To protect your site from spam and abuse, expand ReCaptcha Settings and select the Enable ReCaptcha check box, then set the appropriate alignment and margins.

  8. In the GDPR Checkbox drop-down menu, in the Label field, edit the default message and in the Legal text field, add a legal text.

Countdown timers add a timer item to the email template, that shows how much time remains for the recipient to respond. This can help to add urgency to a subscription form.

To edit a timer item:

  1. On the subscription form editor page, in the left pane under Items, click Timer.

  2. Drag and drop the timer item to an empty (full width) layout.

  3. Click the timer item to display the Timer settings in the editor's right pane and specify the display details of your timer. You can set the following:

    • Theme - the options are Plain and Boxes. The Boxes theme adds adjustable boxes inside the timer (days, hours, minutes, seconds). You can select a box color, box radius, border color, and border width.

    • Expiration Date - choose the date and time for your timer to expire.

      Note

      The timer expiration date and time is based on your time zone and expires at the same time for all users. For example, if you set your timer to expire in 5 hours, it expires for everyone, regardless of their time zone, in 5 hours.

    • Font Family - choose the font types for the label letters and counter numbers of the timer.

    • Label Color - choose a color for the labels under each counter.

    • Timer Color - choose a color for the numbers on the counters.

  4. Click Generate Timer.

To move an item:

  1. In the editing area of the campaign editor, hover your mouse over a item to display the Actions menu:

  2. Click Icon_MoveElement.png and drag the item to a different row in the editing area.

You can delete items from a subscription form.

To delete an item:

  • On the Items tab, deselect the item check box. The item is removed from your design.

Or

  • In the editing area, click the item you want to delete, then in the Action menu, click Icon_DeleteElement.png.

Note

After you have deleted an item, you can add it again. To add it, select the item check box.