Advertisements in PowerApps Portal

Introduction: In this blog, we will understand how to add advertisements in PowerApps Portal.

You can create text or image-based ads and have them run in multiple placements throughout your site.

Steps to be followed:

Steps to create new Ad:

1. Go to “Portal Management App”
2. Go to Ads -> click on new to create a new ad

3. Enter following details

• Name: Name for ad
• Website: The associated website.
• Web Template: Enter a web template if you want to render an ad on that specific web template
• Release Date: Date after which the ad will be visible on the portal
• Expiration Date: Date after which the ad will be not visible
• Publishing State: Publishing State of the ad.

Add Redirect options if you want your ads to be clickable.

Whenever user will click on that ad it will redirect to that particular URL.

• Redirect URL: When the ad is clicked, the user will get navigated to that URL.
• Open In New Window: If true, then the ad will open in the new browser window when clicked.

you can add your HTML in content.

Title: If you enter the title, it will be rendered as a hyperlink that points to the Redirect URL.

Copy: Design your ad using HTML.

Ad Record:

4. Once the ad is created, we must create an ad Placement

Steps to create ad Placement

1. Go to “Ad Placements” -> Click on “+New”

2. Enter Following details

• Enter name, website.
• Enter web template if you want to render an ad on that specific web template (it is an optional field)

3. After creating ad placement, you must add the ad in that( which ad will be rendered in this placement)

Go to “Ads” tab and click on “Add Existing Ad”

4. Select the ad and click on Add

Once Ad and Ad placement records are created, we will write the below liquid code on the web template. This code will render the Ads on the portal.

Code:

{% include "ad" ad_placement_name:"Discount Ad Placement" %}

OR

{% include "ad" ad_name:"Discount Ad" ad_placement_name:"Discount Ad Placement" %}

• ad_name: name of your ad
• ad_placement_name: name of your ad placement

NOTE: you can write this liquid code on a web template or on the web page where you want to render the ad

After adding liquid code navigate to portal your ad should be visible now.

Additional Details:

If you want to display a static image as an ad you can use any one of the below options:

1. You can upload the image in a web file and add its URL in the image URL field.

• Image URL: The URL of the image that will be displayed by the ad. The image will be clickable and link to the redirect URL if one is given.
• Image Width: Width of the image.
• Image Height: Height of the image.
• Image Alt Text: Alt Text for the image.

OR

2. Upload image file as notes attachment to the Ad record, in this case, you don’t have to enter the Image URL it will automatically render that attached image as an ad.

After creating an ad record create Ad placement and add the liquid code as explained before.

Static Image Ad: