How to add new tabs to White Label

By default, Travelpayouts White Label contains two tabs: Airline tickets and Hotels. You can disable one of them in the White Label settings. In this article, you will learn how to add more tabs, for example, with an advertiser's search form or link to advertiser's website.

Please note that if you have multiple languages selected, the code must be added for each language.

Preparing for the addition of an extension

At first, add the jquery library connection code to make everything work correctly. Open the White Label settings and go to the Footer section.

Add the following code in the code input box:

<script
src="https://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous">
</script>

Please note! The jquery library connection code is added only once. If you add other White Label extensions, you do not need to re-insert the code.

mceclip0.png

Tab with a link to the advertiser's website

To add a tab that opens an advertiser's website by clicking on it, open the Footer section in the White Label settings and add the following code in the code input box (a new code is added after the existing one):

<script>
window.onload = function() {
$(".mewtwo-tabs_list").append('<li class="mewtwo-tabs-tabs_list__item mewtwo-tabs-tabs_list__item--count2 mewtwo-tabs-tabs_list__item"><a href="PUT_ADVERTISER_LINK_HERE"><span>Вкладка со ссылкой</span</a></li>');
};
</script>

Please note! Be sure to place a link to the advertiser's website in the href parameter.

As a result, you will have the following code in your website footer:

<script
src="https://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous">
</script>
<script>
window.onload = function() {
$(".mewtwo-tabs_list").append('<li class="mewtwo-tabs-tabs_list__item mewtwo-tabs-tabs_list__item--count2 mewtwo-tabs-tabs_list__item"><a href="https://c24.travelpayouts.com/click?shmarker=78606&promo_id=3201&source_type=link&type=click"><span>Вкладка со ссылкой</span</a></li>');
};
</script>

What it looks like:

tab_with_link.gif

Tab with the advertiser's widget

To add a tab that opens the advertiser's widget form by clicking on it, open the Header tab in the White Label settings and add the following code:

<div class="widget-block"><script src="HERE_IS_A_LINK_TO_THE_ADVERTISER_WIDGET" charset="utf-8" async="true"></script></div>

specify a link to the advertiser's widget in the src parameter. For instance,

https://c45.travelpayouts.com/content?promo_id=1655&shmarker=78606&locale=ru&button_color=FFA600&background_color=00AFDD&border_radius=0px&full_width=false&logo=false&tborder=true&hide_header=true&powered_by=false

Then open the Footer tab and add the following code:

<script>
window.onload = function() {
$('.mewtwo-tabs_list').append('<li class="mewtwo-tabs-tabs_list__item mewtwo-tabs-tabs_list__item--count3 mewtwo-tabs-tabs_list__item"><a href="#" class="widget-click"><span>Поезда</span</a></li>');
$('.widget-block').appendTo('.mewtwo-widget');
$('.mewtwo-tabs-tabs_list__item--flights').click(function(e){
e.preventDefault();
$('.widget-block').hide();
$('.mewtwo-flights').removeClass('remove-w');
$('.mewtwo-hotels').removeClass('remove-w');
$('.mewtwo-tabs-tabs_list__item--count3').removeClass('mewtwo-tabs-tabs_list__item--active');
});
$('.mewtwo-tabs-tabs_list__item--hotels').click(function(e){
e.preventDefault();
$('.widget-block').hide();
$('.mewtwo-flights').removeClass('remove-w');
$('.mewtwo-hotels').removeClass('remove-w');
$('.mewtwo-tabs-tabs_list__item--count3').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count2').addClass('mewtwo-tabs-tabs_list__item--active');
});
$('.widget-click').click(function(e){
e.preventDefault();
$('.widget-block').show();
$('.mewtwo-flights').addClass('remove-w');
$('.mewtwo-hotels').addClass('remove-w');
$('.mewtwo-tabs-tabs_list__item--count3').addClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count2').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count1').removeClass('mewtwo-tabs-tabs_list__item--active');
});
};
</script>
<style>
.widget-block{
display: none;
}
.mewtwo-widget section.remove-w{
display: none !important;
}
</style>

Pay attention to the next part of the code:

 $('.mewtwo-tabs_list').append('<li class="mewtwo-tabs-tabs_list__item mewtwo-tabs-tabs_list__item--count3 mewtwo-tabs-tabs_list__item"><a href="#" class="widget-click"><span>TRAINS</span</a></li>');

Here you can change the text that will be displayed on the tab ('Trains' in the example).

What it looks like:

tab_with_widget.gif

Tab with the advertiser's White Label widget

If you place a regular widget, the search result will be displayed on the advertiser's website. At the same time, some advertisers have White Label widgets that allow you to view the result on the same page as the widget.

Please note! This section describes how to add a White Label widget instead of a regular widget. If you want to add several tabs with different widgets, skip to the next step.

To add a widget, open the Home tab in the White Label settings and add the following code:

<div class="widget-block"><script src="//c24.travelpayouts.com/content?promo_id=1498&shmarker=188189&width=960&background=%2300AFDD&foreground=%23eeeeee&section=%23ffed74&highlight=%23e5d568&auto_start=false&country=%D0%A2%D0%B0%D0%B8%D0%BB%D0%B0%D0%BD%D0%B4&tourists=2&powered_by=true" charset="utf-8"></script></div>

Open the Footer tab and add the following code:

<script>
window.onload = function() {
$('.mewtwo-tabs_list').append('<li class="mewtwo-tabs-tabs_list__item mewtwo-tabs-tabs_list__item--count3 mewtwo-tabs-tabs_list__item"><a href="#" class="widget-click"><span>Трансфер</span</a></li>');
$('.widget-block').appendTo('.mewtwo-widget');
$('.mewtwo-tabs-tabs_list__item--flights').click(function(e){
e.preventDefault();
$('.widget-block').hide();
$('.mewtwo-flights').removeClass('remove-w');
$('.mewtwo-hotels').removeClass('remove-w');
$('.mewtwo-tabs-tabs_list__item--count3').removeClass('mewtwo-tabs-tabs_list__item--active');
});
$('.mewtwo-tabs-tabs_list__item--hotels').click(function(e){
e.preventDefault();
$('.widget-block').hide();
$('.mewtwo-flights').removeClass('remove-w');
$('.mewtwo-hotels').removeClass('remove-w');
$('.mewtwo-tabs-tabs_list__item--count3').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count2').addClass('mewtwo-tabs-tabs_list__item--active');
});
$('.widget-click').click(function(e){
e.preventDefault();
$('.widget-block').show();
$('.mewtwo-flights').addClass('remove-w');
$('.mewtwo-hotels').addClass('remove-w');
$('.mewtwo-tabs-tabs_list__item--count3').addClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count2').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count1').removeClass('mewtwo-tabs-tabs_list__item--active');
});
};
</script>
<style>
.widget-block{
display: none;
}
.mewtwo-widget section.remove-w{
display: none !important;
}
</style>

Pay attention to the next part of the code:

$('.mewtwo-tabs_list').append('<li class="mewtwo-tabs-tabs_list__item mewtwo-tabs-tabs_list__item--count3 mewtwo-tabs-tabs_list__item"><a href="#" class="widget-click"><span>Transfer</span</a></li>');

Here you can change the text that will be displayed on the tab ('Transfer' in the example).

What it looks like:

tab_with_wl_widget.gif

How to add several tabs

The principle of adding several tabs is similar to the approach described above. You need to add a code call for the widget in the Header section of the White Label settings. Then, in the White Label footer, add the tabs output and the logic of switching between the tabs.

You can use the code, which is used here. Do not forget to replace the widget code with your own code.

Code for the Header:

<!-- START the first widget-->
<div class="widget-block" style="display:none;"><script src="https://c45.travelpayouts.com/content?promo_id=1655&shmarker=229849"></script></div>
<!-- END the first widget-->

<!-- START the second widget-->
<div class="widget-block-st" style="display:none;"><script src="//c24.travelpayouts.com/content?promo_id=1498&shmarker=229849&width=1180&background=%23ffffff&foreground=%23eeeeee&section=%23ffed74&highlight=%23e5d568&auto_start=false&country=%D0%A2%D0%B0%D0%B8%D0%BB%D0%B0%D0%BD%D0%B4&tourists=2&powered_by=true" charset="utf-8"></script></div>
<!-- END the second widget-->

<!-- START the third widget-->
<div class="widget-block-tr" style="display:none;"><script src="https://c1.travelpayouts.com/content?promo_id=1486&shmarker=229849&theme=1&language=ru&powered_by=false" charset="utf-8" async></script></div>
<!-- END the third widget-->

<!-- START the fourth widget-->
<div class="widget-block-tur" style="display:none;">
<iframe src="https://exsy.com.ua/index221.html" style="min-width: 240px; width: 100%; height: 0px; overflow: hidden; border: none; min-height: 405px; position: absolute" seamless="" width="100%" height="100%" hspace="0" vspace="0" marginheight="0" marginwidth="0" scrolling="no" frameborder="0" allowtransparency="true" id="kw-search-form"></iframe>
</div>
<!-- END the fourth widget-->

<!-- START the fifth widget-->
<div class="widget-block-ex" style="display:none;">
<div id="powered_by_1498" class="wbe__containe">
<a target="_blank" href="https://c11.travelpayouts.com/click?shmarker=229849&promo_id=1751&source_type=link&type=click">Необычные экскурсии в Риме</a>,
<a target="_blank" href="https://c11.travelpayouts.com/click?shmarker=229849&promo_id=1750&source_type=link&type=click">Париже</a>,
<a target="_blank" href="https://c11.travelpayouts.com/click?shmarker=229849&promo_id=1749&source_type=link&type=click">Санкт-Петербурге</a>,
<a target="_blank" href="https://c11.travelpayouts.com/click?shmarker=229849&promo_id=1748&source_type=link&type=click">Москве</a>,
<a target="_blank" href="https://c11.travelpayouts.com/click?shmarker=229849&promo_id=1747&source_type=link&type=click">Барселоне</a>,
<a target="_blank" href="https://c11.travelpayouts.com/click?shmarker=229849&promo_id=1746&source_type=link&type=click">Праге</a>
</div>
</div>
<!-- END the fifth widget-->

Code for the Footer:

<script>
window.onload = function() {
//menu
$(".main-navigation__dropdown").click(function(e) {
e.preventDefault();
if ($(this).hasClass('dropdown_opened')) {
$(this).removeClass('dropdown_opened');
} else {
$(this).addClass('dropdown_opened');
}
});
//hide menu
$(document).click( function(event){
if( $(event.target).closest('.main-navigation__dropdown').length)
return;
$('.main-navigation__dropdown').removeClass('dropdown_opened');
event.stopPropagation();
});
//slick slider
$('.header__slider').slick();


$('.mewtwo-tabs_list').append('<li class="mewtwo-tabs-tabs_list__item mewtwo-tabs-tabs_list__item--count3 mewtwo-tabs-tabs_list__item"><a href="#" class="widget-click"><span>Ж/д билеты</span</a></li><li class="mewtwo-tabs-tabs_list__item mewtwo-tabs-tabs_list__item--count4 mewtwo-tabs-tabs_list__item"><a href="#" class="widget-click-st"><span>Страховка</span</a></li><li class="mewtwo-tabs-tabs_list__item mewtwo-tabs-tabs_list__item--count5 mewtwo-tabs-tabs_list__item"><a href="#" class="widget-click-tr"><span>Трансферы</span</a></li><li class="mewtwo-tabs-tabs_list__item mewtwo-tabs-tabs_list__item--count6 mewtwo-tabs-tabs_list__item"><a href="#" class="widget-click-tur"><span>Туры</span</a></li><li class="mewtwo-tabs-tabs_list__item mewtwo-tabs-tabs_list__item--count7 mewtwo-tabs-tabs_list__item"><a href="#" class="widget-click-ex"><span>Экскурсии</span</a></li>');
$('.widget-block').appendTo('.mewtwo-widget');
$('.widget-block-st').appendTo('.mewtwo-widget');
$('.widget-block-tr').appendTo('.mewtwo-widget');
$('.widget-block-tur').appendTo('.mewtwo-widget');
$('.widget-block-ex').appendTo('.mewtwo-widget');
$('.mewtwo-tabs-tabs_list__item--flights').click(function(e){
e.preventDefault();

$('.sob__all').hide();
$('.sob__avia').show();

$('.widget-block').hide();
$('.widget-block-st').hide();
$('.widget-block-tr').hide();
$('.widget-block-tur').hide();
$('.widget-block-ex').hide();
$('.mewtwo-flights').removeClass('remove-w');
$('.mewtwo-hotels').removeClass('remove-w');
$('.mewtwo-tabs-tabs_list__item--count3').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count4').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count5').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count6').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count7').removeClass('mewtwo-tabs-tabs_list__item--active');
});
$('.mewtwo-tabs-tabs_list__item--hotels').click(function(e){
e.preventDefault();

$('.sob__all').hide();
$('.sob__otel').show();

$('.widget-block').hide();
$('.widget-block-st').hide();
$('.widget-block-tr').hide();
$('.widget-block-tur').hide();
$('.widget-block-ex').hide();
$('.mewtwo-flights').removeClass('remove-w');
$('.mewtwo-hotels').removeClass('remove-w');
$('.mewtwo-tabs-tabs_list__item--count7').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count6').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count5').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count4').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count3').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count1').removeClass('mewtwo-tabs-tabs_list__item--active');
$('mewtwo-tabs-tabs_list__item--hotels').addClass('mewtwo-tabs-tabs_list__item--active');
});
$('.widget-click').click(function(e){
e.preventDefault();

$('.sob__all').hide();
$('.sob__zd').show();

$('.widget-block').show();
$('.widget-block-st').hide();
$('.widget-block-tr').hide();
$('.widget-block-tur').hide();
$('.widget-block-ex').hide();
$('.mewtwo-flights').addClass('remove-w');
$('.mewtwo-hotels').addClass('remove-w');
$('.mewtwo-tabs-tabs_list__item--count3').addClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count7').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count6').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count5').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count4').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count2').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count1').removeClass('mewtwo-tabs-tabs_list__item--active');
});
$('.widget-click-st').click(function(e){
e.preventDefault();

$('.sob__all').hide();
$('.sob__str').show();

$('.widget-block').hide();
$('.widget-block-st').show();
$('.widget-block-tr').hide();
$('.widget-block-tur').hide();
$('.widget-block-ex').hide();
$('.mewtwo-flights').addClass('remove-w');
$('.mewtwo-hotels').addClass('remove-w');
$('.mewtwo-tabs-tabs_list__item--count4').addClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count7').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count6').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count5').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count3').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count2').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count1').removeClass('mewtwo-tabs-tabs_list__item--active');
});
$('.widget-click-tr').click(function(e){
e.preventDefault();

$('.sob__all').hide();
$('.sob__tr').show();

$('.widget-block').hide();
$('.widget-block-st').hide();
$('.widget-block-tr').show();
$('.widget-block-tur').hide();
$('.widget-block-ex').hide();
$('.mewtwo-flights').addClass('remove-w');
$('.mewtwo-hotels').addClass('remove-w');
$('.mewtwo-tabs-tabs_list__item--count5').addClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count7').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count6').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count4').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count3').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count2').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count1').removeClass('mewtwo-tabs-tabs_list__item--active');
});

$('.widget-click-tur').click(function(e){
e.preventDefault();

$('.sob__all').hide();
$('.sob__tur').show();

$('.widget-block').hide();
$('.widget-block-st').hide();
$('.widget-block-tr').hide();
$('.widget-block-tur').show();
$('.widget-block-ex').hide();
$('.mewtwo-flights').addClass('remove-w');
$('.mewtwo-hotels').addClass('remove-w');
$('.mewtwo-tabs-tabs_list__item--count6').addClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count7').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count5').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count4').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count3').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count2').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count1').removeClass('mewtwo-tabs-tabs_list__item--active');
});

$('.widget-click-ex').click(function(e){
e.preventDefault();

$('.sob__all').hide();
$('.sob__ex').show();

$('.widget-block').hide();
$('.widget-block-st').hide();
$('.widget-block-tr').hide();
$('.widget-block-tur').hide();
$('.widget-block-ex').show();
$('.mewtwo-flights').addClass('remove-w');
$('.mewtwo-hotels').addClass('remove-w');
$('.mewtwo-tabs-tabs_list__item--count7').addClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count6').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count5').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count4').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count3').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count2').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count1').removeClass('mewtwo-tabs-tabs_list__item--active');
});

$('.btn__slider_one').click(function(e){
e.preventDefault();
$('.widget-click-st').click();
});

$('.btn__slider_two').click(function(e){
e.preventDefault();
$('.widget-click-tur').click();
});

$('.header_link_tur').click(function(e){
e.preventDefault();
$('.widget-click-tur').click();
});
$('.header_link_ex').click(function(e){
e.preventDefault();
$('.widget-click-ex').click();
});
$('.header_link_tr').click(function(e){
var link = $(this);
var target = link.attr("target");
window.open(link.attr("href"), target);
});
$('.header_link_zd').click(function(e){
e.preventDefault();
$('.widget-click').click();
});
$('.header_link_avia').click(function(e){
e.preventDefault();

$('.sob__all').hide();
$('.sob__avia').show();
$('.widget-block').hide();
$('.widget-block-st').hide();
$('.widget-block-tr').hide();
$('.widget-block-tur').hide();
$('.widget-block-ex').hide();
$('.mewtwo-flights').removeClass('remove-w');
$('.mewtwo-hotels').removeClass('remove-w');
$('.mewtwo-flights').removeClass('mewtwo-tabs-container--hidden');
$('.mewtwo-flights').removeClass('mewtwo-tabs-container--transparent');
$('.mewtwo-hotels').addClass('mewtwo-tabs-container--hidden');
$('.mewtwo-hotels').addClass('mewtwo-tabs-container--transparent');
$('.mewtwo-tabs-tabs_list__item--flights').addClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--hotels').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count3').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count4').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count5').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count6').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count7').removeClass('mewtwo-tabs-tabs_list__item--active');
});
$('.header_link_otel').click(function(e){
e.preventDefault();

$('.sob__all').hide();
$('.sob__otel').show();
$('.widget-block').hide();
$('.widget-block-st').hide();
$('.widget-block-tr').hide();
$('.widget-block-tur').hide();
$('.widget-block-ex').hide();
$('.mewtwo-flights').removeClass('remove-w');
$('.mewtwo-hotels').removeClass('remove-w');
$('.mewtwo-hotels').removeClass('mewtwo-tabs-container--hidden');
$('.mewtwo-hotels').removeClass('mewtwo-tabs-container--transparent');
$('.mewtwo-flights').addClass('mewtwo-tabs-container--hidden');
$('.mewtwo-flights').addClass('mewtwo-tabs-container--transparent');
$('.mewtwo-tabs-tabs_list__item--hotels').addClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--flights').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count7').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count6').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count5').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count4').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count3').removeClass('mewtwo-tabs-tabs_list__item--active');
$('.mewtwo-tabs-tabs_list__item--count1').removeClass('mewtwo-tabs-tabs_list__item--active');
});
};
</script>

Styles for tabs

You can change the style and number of tabs as you like. If you lack knowledge of HTML, CSS and JS, find a freelance developer who can help you.

File with a set of styles from kit.travel: style.css.

Was this article helpful?

Have more questions? Submit a request