Slider met script

echo "<link rel='stylesheet' href='";
bloginfo('template_directory');
echo "/dias.css' media='screen' />";

echo "<section class='mt mt_m br br_l'>";

	echo "<div class='slider slider3'>";

		$args = array ( 'posts_per_page' => -1, 'cat' => 5, 'orderby' => 'rand', 'order' => 'ASC' );
		$myposts = get_posts( $args );
		
		foreach( $myposts as $post ) :	setup_postdata($post);

		echo "<a href=" . get_permalink( $post->ID ) . " rel='bookmark'><div class='contour'>";
		echo "<figure class='of-cv'><img loading='lazy' src='";
		the_post_thumbnail_url( 'blokken' );
		echo "' data-caption='";
		the_title();
		echo "' alt='";
		the_title();
		echo "' /></figure>";
		echo "<header class='contour contour-midden'>";
		the_title( '<h4>', '</h4>' );
		echo "</header>";
		echo "</div></a>";

		endforeach; 

	echo "</div>";
echo "</section>";

<script src='https://code.jquery.com/jquery-2.2.0.min.js' type='text/javascript'></script>
<script src="<?php bloginfo('template_directory'); ?>/js/carrousel.js" type='text/javascript' charset='utf-8'></script>

<script type='text/javascript'>
$(document).on('ready', function() {
	$('.slider3').slick({
		arrows: true,
		autoplay: true,
		autoplaySpeed: 5000,
		dots: false,
		infinite: true,
		slidesToShow: 3,
		fade: false,
		speed: 2500,
		responsive: [
			{
				breakpoint: 1024,
				settings: {
					slidesToShow: 2,
					slidesToScroll: 1,
				}
			},
			{
				breakpoint: 800,
				settings: {
					slidesToShow: 1,
					slidesToScroll: 1
				}
			}
		]
	});
});
</script>