Повторитель ACF и Flexslider не работают

Question

Повторитель ACF и Flexslider не работают

По некоторым причинам мои изображения не отображаются, и я не могу понять это. Я также получаю эту ошибку при проверке страницы, $ (…). Onload не является функцией.
Вот весь код, связанный с ползунком, может быть, вы заметите что-то не так. Спасибо

<head>
<link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>/css/flexslider.css">
<script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/jquery.flexslider-min.js"></script>
<script type="text/javascript" charset="utf-8">
$(window).onload(function() {
$('.flexslider').flexslider({
animation: "slide"});
});

</script>
</head>

<div class="conatainer-fluid">
<div class="row">
<div class="col-md-12">
<?php if(get_field('slider')): ?>
<div class="flexslider">
<ul class="slides">
<?php while(has_sub_field('slider')): ?>
<li><img class="img-responsive" src="<?php the_sub_field('image'); ?>" alt="Welcome to StairWorld" /></li>
<?php endwhile; ?>
</ul>
</div>
<?php endif; ?>
</div>
</div>
</div>

0

advanced-custom-fields flexslider html php wordpress

Решение

Другие решения

Я рекомендую взглянуть на https://www.advancedcustomfields.com/resources/gallery/

Это отличный учебник, как это сделать.

<?php

$images = get_field('gallery');

if( $images ): ?>
<div id="slider" class="flexslider">
<ul class="slides">
<?php foreach( $images as $image ): ?>
<li>
<img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" />
<p><?php echo $image['caption']; ?></p>
</li>
<?php endforeach; ?>
</ul>
</div>
<div id="carousel" class="flexslider">
<ul class="slides">
<?php foreach( $images as $image ): ?>
<li>
<img src="<?php echo $image['sizes']['thumbnail']; ?>" alt="<?php echo $image['alt']; ?>" />
</li>
<?php endforeach; ?>
</ul>
</div>

Пожалуйста, не забудьте скачать и подключить файлы flexslider.
https://woocommerce.com/flexslider/

<!-- Place somewhere in the <head> of your document -->
<link rel="stylesheet" href="flexslider.css" type="text/css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script src="jquery.flexslider.js"></script>

Также включите это в шапку:

<!-- Place in the <head>, after the three links -->
<script type="text/javascript" charset="utf-8">
$(window).load(function() {
$('.flexslider').flexslider();
});
</script>

-1

Источник

Accepted Answer

Я понял, что мне пришлось изменить $ (window) .onload на $ (document) .ready

0