How to add any banner or advertisement to White Label search results

Travelpayouts White Label has the ability to add various extensions like widgets, banners, affiliate links from advertisers. In this article, we will talk about how to add any code to the search results (between flights or hotels).

To display any text, a banner or, for example, an advertisement from Google in the White Label search results, go to the settings, open the Footer tab and paste the following code at the bottom:

<!-- START connect the library for processing jquery -->
<script
src="https://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous"></script>
<!-- END connect the library for processing jquery -->

<div id="append-block"></div>
<script>
$(function(){
$("div#append-block").click(function(){

//show blocks after loading
$("div.dpt-block-1").show();
$("div.dpt-block-2").show();
$("div.dpt-block-3").show();
$("div.dpt-block-4").show();

//check the fifth block in the flights search results, if we have it, display advertising after it, if not, display after the first block
if ($(".ticket:nth-child(5)").length > 0) {
$(".ticket--with-labels").before($("div.dpt-block-1"));
$(".ticket:nth-child(4)").after($("div.dpt-block-2"));
$(".layout-manager").append($("div.dpt-block-3"));
$(".ticket:nth-child(7)").after($("div.dpt-block-4"));
} else {
$(".ticket--with-labels").before($("div.dpt-block-1"));
$(".ticket:nth-child(1)").after($("div.dpt-block-2"));
$(".layout-manager").append($("div.dpt-block-3"));
$(".ticket:nth-child(1)").after($("div.dpt-block-4"));
}

//check the fifth block in the hotels search results, if we have it, display advertising after it, if not, display after the first block
if ($(".search-results-cards-wrapper-card:nth-child(5)").length > 0) {
$(".search-results-cards-wrapper-card:first-child").before($("div.dpt-block-1"));
$(".search-results-cards-wrapper-card:nth-child(4)").after($("div.dpt-block-2"));
$(".search_results-wrapper").append($("div.dpt-block-3"));
$(".search-results-cards-wrapper-card:nth-child(7)").after($("div.dpt-block-4"));
} else {
$(".search-results-cards-wrapper-card:first-child").before($("div.dpt-block-1"));
$(".search-results-cards-wrapper-card:nth-child(1)").after($("div.dpt-block-2"));
$(".search_results-wrapper").append($("div.dpt-block-3"));
$(".search-results-cards-wrapper-card:nth-child(1)").after($("div.dpt-block-4"));
}
});

//emulate a click to initiate the display of ads
setTimeout(function(){
$("div#append-block").click();
}, 9000);
});
</script>

<!--the first banner-->
<div class="dpt-block-1" style="display:none"><a href="#" style="width:100%; text-align:center; font-weight:bold; margin: 20px 0; display: block;">Link 1</a></div>

<!--the banner that shows after the third ticket-->
<div class="dpt-block-2" style="display:none"><a href="#" style="width:100%; text-align:center; font-weight:bold; margin: 20px 0; display: block;">Link 2</a></div>

<!--the banner on the right side-->
<div class="dpt-block-3" style="display:none"><p style="width:100%; text-align:center; font-weight:bold; margin: 20px 0; display: block;">The side banner text (it can be html)</p></div>

<!--the banner that appears after the fifth block-->
<div class="dpt-block-4" style="display:none"><a href="#" style="width:100%; text-align:center; font-weight:bold; margin: 20px 0; display: block;">Link 3</a></div>

To change the contents of a block, edit the code located between the div tags with the dpt-block classes:

<div class="dpt-block-1" style="display:none">
//Here you can place any code or text.
</div>

This is how you can place the banner code with a link to the advertiser's website:

<div class="dpt-block-1" style="display:none">
<a target="_blank" href="https://c45.travelpayouts.com/click?shmarker=78606&promo_id=1300&source_type=banner&type=click"><img src="https://c45.travelpayouts.com/content?promo_id=1300&shmarker=78606&type=init" alt="728x90" width="728" height="90"></a>
</div>

Was this article helpful?

Have more questions? Submit a request