---
title: Web Template for Facebook
slug: docs/web-template-for-facebook
docTags: 
createdAt: 2024-07-09T06:42:49.485Z
---

# Introduction

![](https://api.archbee.com/api/optimize/bAgVaanSi1tFmfc8PghaH/ZA3vDWj_CXH-d_ZfKm1XC_screenshot-2024-07-10-at-125212-pm.png)

The Facebook Web template is built on DSN's image and banner components. It allows users to modify offer images depending on different brands and customers, redirecting them to the actual DSN web project when they click on offer images.

This will help SCs carry out the demo smoothly without leaving the DSN space. To give the custom demos more power, we added a personalization feature to incorporate the relevant storyline persona.

## Prerequisite

One should be ready with brand offer images that match the look and feel of the Facebook platform. They just need to upload their images to web templates, and the CTA link should be added under the banner/image component of the offer to redirect to the actual web project.

## Personalization

Currently, we offer only **name** personalization in the Facebook Web template. To change personalization according to your demo persona, please check the execution steps.

## Execution Steps

1. Go to the [DSN Projects](https://dsn.adobe.com/projects) and click on new project.
2. Select **Social Websites** > **Facebook**
3. Please provide a project name and DR for the opportunity.
4. Go to the **created project** select the primary screen and open i&#x6E;**&#x20;edit mode**.
5. Select the **offer image** you want to change, **drag** your offer image inside the upload component, and add an **external link** to the actual DSN web project.
6. **Personalization** - Go and click on **the profile image** component and you will see a parameter **name&#x20;**&#x69;n the image URL change the **parameter value** as per your demo storyline persona.
7. Similarly following the above step you can edit the **name parameter value** on the Status Image URL.

## Notes

1. Templates are only for redirection from offers and cannot be used for standalone web projects. Therefore, the profile viewer is not activated.&#x20;
2. [Click here](https://adobe.sharepoint.com/\:v:/s/Campaignpod/EQleiEQFIWtEjzMesuRc9pQBYXJR5fJKnQUYbTRQHZMfCw?e=TjUWiA) for a how-to video.

