Note: Email Studio uses Image API to dynamically display content. For more details on Image API, please take a look at the Image API documentation.

If you're a brand marketer looking to activate curated content in your email marketing campaigns, Email Studio is the right tool for you. Email Studio allows you to generate an HTML/CSS snippet with a click of a button, and you can simply copy & paste the code into your email template editor. The code snippet is also mobile responsive out-of-the-box, which helps you quickly embed the content without any additional coding.

If you're looking to develop your own HTML and CSS, but want to retrieve dynamic content from Social Native, you have the option of using the Image API to embed content in your email templates. Unlike the RESTful API, the Image API allows you to retrieve curated content from your Social Native Media Library without having to develop code to parse JSON responses from the standard RESTful API.

The Email Studio can be found by clicking the "Email" navigation item under the "Activate" tab in the UGC Solution platform, or by visiting this URL directly: https://www.photorank.me/admin/email

The tool is split into two main sections:

First, select the appropriate parameters (see the next section for details on different configuration options provided) on the left side of the tool.

Use device toggles on the top-right corner of the tool to preview the code in mobile, tablet, and desktop device widths.

Select the desired Clickthrough Link option, then enter in either a Fallback URL or a Landing Page URL (see Clickthrough link section for more details on this functionality).

Once you're ready to grab the code, click the "Get Code" button.

In the overlay, copy the code into your clipboard by clicking the "Copy code" button. Then, go ahead and paste the code from your clipboard into the editor of your choice.

You can also toggle between Responsive HTML/CSS and Non-responsive HTML code. This is helpful when you want to apply your own CSS styling for more complex display requirements.

Here you can find details and descriptions of all of the different customization options that you can pick and choose from.

To display product or category specific UGC in email campaigns (i.e., cart abandonment or post-purchase emails), you can amend the image URLs generated by the Email Studio.

Let's say you want to pull in product-specific content. First, click the "Get code" button to open the code snippet overlay (we're using Non-responsive code to keep the code simple).

Copy the code into your editor of choice, then in the code snippet, look inside the `src` attribute of the <img> tags. Add the parameters `&filter=product_id&filter_value=#{{product_id}}` to the end of the URL (highlighted in red)

If you look at the code above, you can see that the parameter value for `filter_value` is `#{{product}}`. Replace this with the appropriate product ID variable within the email platform.

The result should be that when the email goes out to the users, the `filter_value` parameter value is replaced with the product information pertaining to the dynamic data inside the email template.

Note: Please be aware that by implementing stream/product/category specific UGC in your email campaigns, there may be a question of coverage as some products may not have enough UGC to fill the slots, or some will have none. In cases like these, the Image API displays the last image repeatedly. Alternatively, you can use the Fallback Image URL feature to display a placeholder image in place of the repeated image.

Under Clickthrough link section in the sidebar, you can configure the clickthrough logic of the images you want to display in your email.

Dynamic Routing feature allows you to link the images to the stream or product URL associated with the images. This is helpful for email marketers to implement a click-through experience without having to layer additional data on within the template inside the email platform (i.e., having to supply dynamic URLs from the ESP to the href attribute of the <a> tag that wraps the <img> tag).

When users click on the images, Social Native will dynamically route users to the product page URLs based on the product tagged to the images. If the image is tagged to multiple products, then first product tagged will be used. In cases where images are not tagged to any active products, the Fallback URL will be used instead.

You can also use the Fixed Landing Page option if you wish to link the images to a static URL of your choice.

If you are experiencing any issues or have further questions, please contact our Support team.