Prerequisites:

1. a product catalogue in XML, JSON, CSV, or API format
2. the DSP, SSP, or a recommendation system

Here is an example of the product catalog that we will be using in this tutorial. It has the product ID column, product description, product image, landing URL, etc.

Now, let’s create a BigTable connection for our product catalog. The BigTable is used when you have more than 100 products (it can even be used if you have 100 million products in your catalog).

Enter the product catalog URL (in our case, it will be the CSV file that is hosted on a website). Select CSV, refresh once per day (BannerNow will update all the product info daily). In the Advanced Settings, enter the Item Primary Key that matches the product ID column in your product catalog.

Our BigTable connection is now active, and it will automatically update the product data daily

Now, let’s create a Data Feed

Select BigTable as the source

Select the BigTable that we have just created

Select all the fields that will be used in the banner (like price, image, …)

Next, create a banner

Select a Bannerset

Select the Feed that we have just created

Next, bind all the items in your banner to the feed data

In this tutorial, we will be creating a banner that displays 2 different products.
For the first product, we will set Fixed Line to ON and the Row Number = 1

The same for the image, button, description and the landing URL:

And for the second product, simply set the Row Number = 2

Save the Banner and click Preview

In the Preview panel, you can input different product IDs to test the banner.
For example, entering 2,3 will load the products with ID 1 and ID 2 from the BigTable

Then click Publish

Next:

Select the Ad Network (in this tutorial, we’ll be using Google Ad Manager).
If you don’t need any Ad Network simply select the BannerNow from the Ad Networks list

In the Ad Tag generation panel, there is an additional input called Feed Items IDs where you can input the product IDs separated with the comma (,) or use the macros from the Ad Network.

For the Google Ad Manager, this macro will be %%PATTERN:key%% where the key can be replaced with the “product” if you’re targeting products or “segment” if you’re targeting a specific audience segment.
For another Ad Network, it will have a different format.

Next, copy/paste the Ad Tag in the Ad Network (DSP/SSP).
Here is a tutorial for the Google Ad Manager third-party Ad Tag publishing:

For the Google Ad Manager Unit, the setTargeting method needs to be added after addService():

googletag.defineSlot("/1234/adunit1/adunit2", [728, 90], "div-gpt-ad-123456789-0")
.addService(googletag.pubads())
.setTargeting("product", "5,8");

Obviously, the setTargeting method values should be dynamic (usually this is managed by the recommendation system), so simply update the Google Tag JavaScript code to use the product IDs from the recomendation system (or simply read the first-party cookies or the Local Storage where the product IDs that the user visited are stored).

Feel free to contact us if you you need any help with the retargeting setup.

Google Ad Manager step-by-step remarketing integration:

*These dynamic images can be integrated with feeds, ensuring that any feed updates automatically re-render the image.

To publish a banner as a dynamic image and track impressions:

Open the Banner: Select the banner you wish to publish as an image and click the “Publish” button.

Choose the sizes you want to publish and click Next.

Select the Bannernow (Static Image) Ad network.

Choose the image format (JPG, PNG, or Auto/WEBP). Enable the retina option if you require a 2x image size.

After publishing, copy the provided image URL.

You can now use this image URL on any webpage or ad network. For instance, you might create an HTML page with an <img src= /> tag that references the dynamic image generated by BannerNow.

Let’s do a test and reload our web page a few times.

Reloading the webpage multiple times will load the dynamic image accordingly.

o verify impression tracking, access the Reporting dashboard in BannerNow. The report will display the exact number of impressions, corresponding to the number of times the dynamic image was loaded. For example, if you reload the page 7 times, the report should show 7 impressions.

This functionality allows for effective monitoring of your dynamic images performance across various platforms.

For example, let’s imagine that you need to create a banner with 2 buttons and specify the hyperlinks for these buttons directly from the AdTag.

First, let’s prepare the banner to accept the dynamic landing urls.

For the first button enable the Landing URL/Hyperlink and input window.BN.urlParamsDecoded.a1

Here, a1 serves as a dynamic param that we will pass later from the AdTag.

For the second button add window.BN.urlParamsDecoded.d2 Landing URL/Hyperlink

The “d2” will be the dynamic param that we will pass later from the AdTag.

In the AdTag settings, assign values to your parameters:

a1 = https://bannernow.com

d2 = https://example.com

With this setup, clicking the first button directs users to https://bannernow.com, while the second button leads to https://example.com.

The Hyperlink append params can be used to add additional URL query params to the banner Landing URL/Hyperlink.

xample:

• Base URL: https://example.com
• Appended Parameters: ?utm_campaign=mycampaign1&utm_source=mysource1
• Resulting URL: https://example.com?utm_campaign=mycampaign1&utm_source=mysource1

This method enables you to gather insights into your campaign’s effectiveness and identify the most successful channels.

For more detailed information on URL parameters and tracking, refer to Google’s support resources.

Select the sizes you want to publish and click Next

Select the Income Access Ad network.

Copy the Ad Tag (Embed Code).

*If you have multiple banner sizes copy the embed codes one by one for each size.

In the Income Access network Navigate to Marketing Tools → Media Tools → Create Media.

Fill in all the Media Fields:
a. Media Name
b. Language
c. Media Status -> Change to PUBLISHED
d. Width and Height (of the banner)
e. Merchant 
f. Campaign selection 
g. Media Type -> Select HTML5 
h. HTML code -> Input the ad tag from Bannernow
i. Tag – Leave blank, or tag if needed. (I.e. Sportsbook, etc.) 
j. Save to save media

Api Access should be enabled in your Google AdManager account settings:

Publish your schedule placeholders directly to Google Ad Manager using the Direct integration option.

Api Access should be enabled in your Google AdManager account settings:

Publish your out-of-page advanced banners (interstitial, sticky, pushdown, bestfit) directly to Google Ad Manager using the Direct integration option.

Api Access should be enabled in your Google AdManager account settings:

Publish your banners directly to Google Ad Manager using the Direct integration option

Create new banner(s) and click the “Publish” tab.

In the Publish modal you will see the banner sizes you’ve chosen to publish.

Click Next button to move to the next step.

Select the “Google Ad Manager/ Doubleclick For Publishers [DFP]” Ad network.

Copy the Ad Tag (Embed Code). If you have multiple banner sizes copy embed codes one by one for each size.

In Google Ad Manager go to Delivery->Creatives and click “New Creative”

Select Advertiser and click on “Third party” creative format

Select ad unit size that corresponds to your banner (ex 728×90).

Paste the Ad Tag (Embed Code) that you have copied from Bannernow.

When copying embed code – make sure that quotes ” ” are not modified (for example if you will send this embed code to somebody via email – email client can display quotes in different format “ ” which will cause problems with displaying your banner).

Click Save and preview your banner. If banner preview is not working it could be because of wrong quotes format (“ ” instead of ” “) in embed code or because of the Safe Frame.

Create a new “Advanced Format” banner (Interstitial, Sticky, Pushdown, …) and click the “Publish” tab.

Select the “Google Ad Manager/ Doubleclick For Publishers [DFP]” Ad network.

Copy the Ad Tag (Embed Code)

In Google Ad Manager go to Delivery->Creatives and click “New Creative”

Select Advertiser and click on “Custom” creative format

Select “Out-of-page (Interstitial)” ad unit size.

Paste the Ad Tag (Embed Code) that you have copied from Bannernow.

Uncheck the Safe Frame option. Otherwise you will need to add a JavaScript code to your Google Ad Manager templates to communicate the Window resize event to the banner (please contact us at contact@bannernow.com) if you need any help with that.

When copying embed code – make sure that quotes are not modified (for example if you will send this embed code to somebody via email – email client can display quotes in different format which will cause problems with displaying your banner).

Click Save and preview your banner. If banner preview is not working it could be because of wrong quotes format (“ ” instead of ” “) in embed code or because of the Safe Frame.

The next steps will describe how to add “Out of page” creatives to your website. If you already know this please skip the following steps.

Go to Inventory->Ad Units and click “New Ad Unit”

Select “Out of page” type size.

Uncheck “AdSense” (Maximize revenue of unsold inventory with AdSense) if you don’t want to show ads from Google Ad Exchange network in your Out of page ad container/unit.

Click SAVE to save the Ad Unit.

Now go back to Ad Units page (Refresh the page if you don’t see newly created Ad unit). Click on the newly created Ad Unit.

Open “Tags” tab. Select “Google Publisher Tag” and click Continue.

Enable “Out-of-page” creative. Click Next.

Copy the codes to your website. Header code initializes out of page creative.

Document body code creates a container where the banner will be placed.

*If you already have the gpt.js script library embeded into your website header – paste the document header code without it.

Now your webiste is ready to display Out of page creatives.

You can create an Order with Line item the same way you do for other display ads sizes:

Select the out-of-page Ad Unit size that you have just created (it’s where your creatives will be displayed for this order/line item).

Assign creatives to your order line item (select existing creative that you have added in the first part of this tutorial):

Approve the order and the Advanced out-of-page banners will start displaying on your website

Start the order and the “Out-of-page” Advanced formats will start displaying on your website.

Google Ads or Google Display Network (GDN) is a broad collection of more than a million websites, smartphone apps, videos, and blogs, as well as other online destinations that display  Ads. This gives you an opportunity to reach more than 80% of internet users worldwide, in more than 100 countries and 30 languages.

Bannernow is a Google Certified External Vendor for serving 3rd party Ads on Google Ads. This means that HTML banners created in Bannernow are 100% compatible with Google Ads and therefore, can be published to your Google Ads campaigns. It also means that any Bannernow ads currently running within your Google Ads campaigns can be quickly modified via the Bannernow Editor, which automatically updates any changes to your Google Ads campaigns as soon as you click Publish.

Follow these steps to publish your creatives to Google Ads:

1. Set hyperlinks for all your ads directly in the BannerNow editor or dashboard.

2. Make sure your ad animation length is less than 30 seconds.

3. Set a contrast border for your ad.

4. Open the banner set within the BannerNow dashboard and click the Publish button.

5. Select any sizes that need to be published.

In the Ad network dropdown – select Google Display Network.

6. Download embed ad tags as .xlsx.

7. Open the downloaded .xlsx (Excel) file, then, fill the Campaign Name and Ad Group Name (from your Google Ads account). You can also change the Placeholder title, which refers to the title of the Display ad that will be visible in your Google Ads account after import.

8. Submit your .xlsx file with ad tags using the following form (Make sure you are logged in to your Google Ads account): https://support.google.com/google-ads/answer/6161966?visit_id=637509713062337933-3856143141&rd=1

• Campaign Type: Display Campaign (select Ad tag checkbox)
• Do you have a Google Account Manager (premium support): Yes or No
• Ad status: Live or Paused (what should be the status of your ads after approval)
• Submit an attachement: Select the .XLSX file that was downloaded from BannerNow (step 6)
• Have you attached any necessary tags or other required documents? – Yes

Please note that it can take some time before your ads will be manually approved by Google Ads approval team.