// Bx Slider
function custom_scripts()
{
wp_register_script('bxslider', 'https://cdn.jsdelivr.net/bxslider/4.1.1/jquery.bxslider.min.js', array(), false, true);
wp_enqueue_script('bxslider');
}
add_action('wp_enqueue_scripts', 'custom_scripts');
function bxslider_init() { ?>
<script>
(function($){
$(document).ready(function() {
$(".image-ticker").show();
$('.image-ticker').bxSlider({
minSlides: 1,
maxSlides: 8,
slideWidth: 189,
slideMargin: 0,
ticker: true,
speed: 50000
});
});
})(jQuery)
</script>
<?php }
add_action ('wp_footer', 'bxslider_init');
<!-- MARKUP - Put Codeblock Class as 'slider-logos' -->
<div class="image-ticker" style="display:none">
<span class="logo-item"><img src="#"></span>
</div>
<!-- STYLE -->
<style>
.bx-wrapper {
max-width: 100% !important;
}
.logo-item {
text-align: center;
display: flex !important;
align-items: center;
margin: 0;
padding: 0 25px;
height: 80px;
width: auto !important;
}
.logo-item img {
width: auto;
height: auto;
max-width: 180px;
max-height: 80px;
}
.bx-viewport {
height: auto !important;
}
</style>
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter