Did you know that in Amped, you can easily copy and paste full elements from our AWESOME templates page?
In this article, we will walk you through the process of creating a split test using customized elements from our templates, from how to copy them into your evergreen design, customize them to your brand, and adjust your design to accommodate a new layout.
π₯ How to Copy Elements - Video
Choose a template
Copy assets into your design
Style & Customize to your brand
Update each step in the campaign
Preview & QA
π₯ Using a Template to Create a Split Test
Step 1: Choosing a template
Go to amped.io and click over to our template gallery.
Explore our template gallery to find the design that suits your needs!
Open any variation and click "Open in the editor to clone"
This brings you to an editor view of the template, where you can copy/paste layers in a "view only" state without starting a new campaign in your own account.
Step 2: Copying assets into your design
Checking that the desired layer is highlighted on the left-side layers panel, copy the selected elements using your keyboard shortcut β+C.
Switch tabs back to your evergreen campaign. Duplicate your chosen variation, rename it, and open.
In this new variation, paste the elements in the desired location using your keyboard shortcut β+V.
Make sure to move the layer manually in the left-side layers panel to it's proper place. In this case, a background accents container should be pasted at the bottom of the panel, sitting within the Overall Background Container but behind the Content Container, as to not cover any copy or forms.
Step 3: Styling & Customization
Itβs time to look around your design and see what parts of the design need to be deleted to reset the campaign. Out with the old, in with the new!
Check for any padding or margin on the Overall BG Container or Content Container that might need to be reset.
Select the layers of your newly pasted elements and navigate to the image editor on the right style panel. Click replace image and upload in your image.
Now that your image is in the design, adjust the pixel width or height of it on the top section of style panel-- starting with the image on mobile, and then moving on to desktop.
You'll want to check that the size, position, and rotation are all adjusted to look seamless with the rest of your campaign.
Repeat this process for the rest of your new elements.
Step 4: Update each step in the campaign
Make sure that your new images were copied with with their styles intact. If not, create a new style for each layer/image.
Using your keyboard shortcuts, copy and paste the customized elements into each step of your campaign.
Step 5: QA & Preview
Check if your image accent container or individual image layers have any animation settings on them.
If you want your image to animate, click open the animate tab on the right-side style panel, choose your animation type, duration, and delay-- then double check that your image container holding your images is set to "animate only once". This prevents the animation from occurring every step through the flow.
Preview your campaign to ensure everything looks right by clicking the 'Preview' button in the top left corner of the editor.
Once satisfied, publish your new split test!
Congratulations! You've successfully created a split test in Amped using template elements! π