Tutorial: How to publish a promotion on a WordPress website with Widgets

Easypromos Widgets allow you to integrate a promotion directly into a website, so users can access and participate in it without having to leave the website.

In this tutorial, we explain how to publish an Easypromos promotion on a website created with WordPress.

Note: This tutorial specifically explains how to integrate a promotion in WordPress. To consult all the information about the Easypromos Widgets system, you can consult the Tutorial: How to embed and present the promotion on any website with Widgets.

These are the contents of the tutorial:

1. Access your promotion's Widgets

2. Configure the Widget properties

3. Insert the Widget code in WordPress

1. Access your promotion's Widgets

Below, we explain the steps you need to follow to embed the promotion on your WordPress website with the Widget.

1. Once you have created your promotion, click the "Insert widget" option, which you will find below the promotion's main link:

2. Next, enter the URL of the website where you plan to insert the Widget:

3. Next, you will find all the Widgets available for integrating the promotion on your website. 

4. Click the Widget you want to use to present the promotion and follow the steps below to configure the Widget properties.

2. Configure the Widget properties

Below, we detail the different configuration options depending on the selected Widget.

2.1. Widget "Embed your promotion"

You can customize the Widget dimensions (width and height) to adjust it to the available space on your website. Next, copy the iframe code and paste it into your website.

The Widget has the following characteristics:

• The Widget will automatically calculate the iframe height for optimal display according to the promotion page being viewed.
• Optimal display means not showing a scroll bar in the iframe and avoiding blank spaces below the page.
• Information popups within the promotion (sharing, legal terms, my networks) are optimally positioned in the visible area of the iframe.

2.2. Widget Link

The Widget Link can be customized with the following options:

• Width and Height: These will be the dimensions of the modal window where the promotion will be presented, so you can adjust it to the available space on your website.
• Title: You can customize the tab text. Write a short, attention-grabbing title.
• Open as: You can decide how to open the tab, either in a modal window or in a new browser window.

2.3. Widget Popup

The Widget Popup can be customized with the following options:

• Wait time: This option allows you to control when the popup Widget appears when accessing the page. You can configure it to appear as soon as the page loads or set a wait time of between 5 and 30 seconds.
• Frequency: This option allows you to control how often the popup Widget will appear to returning visitors to the page.

3. Insert the Widget code in WordPress

Once you have configured the Widget you want to use to present the promotion on your website, the next step is to copy the Widget code provided by Easypromos, which is the code you should use in your website's Editor to present the promotion:

Once you have the Widget code, access your WordPress website's administration panel and edit the page or post where you want to display the promotion.

These are the steps you need to follow in the WordPress editor:

1. Add a new block by clicking the "+" button.

2. Search for the "Custom HTML" block and select it to add it to the page.

3. Next, click "Edit HTML" and, in the "HTML" tab, paste the Widget code you copied from Easypromos into the block:

4. Once you have pasted the code, click the "Update" button, and the Widget code will be configured correctly.

Note: It is not possible to preview the promotion directly from the Editor; instead, you will see a gray box. You will need to check it by opening a preview page.

Below, you can see a screenshot of the final result of a Spin the wheel promotion embedded in a WordPress page: