Básicamente me gustaría saber cómo puedo añadir el efecto lightbox a unas imágenes creadas en Advanced Custom Fields. He estado buscando distintas maneras, pero no he conseguido que funcione ninguna. Me gustaría poder implementarlo en el código de la plantilla. O bien, aplicarle un script para que las imágenes más pequeñas aparezcan en el lugar de otra imagen mayor (por ejemplo: https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_tab_img_gallery)
Ésta es la URL: http://acciwagen.com/vehiculos/coche-1/
Éste es el código:
<?php
$image = get_field('primera_imagen');
if( !empty($image) ): ?>
<img class="card-img-top2" src="<?php echo $image['url']; ?>" alt="<?php echo
$image['alt']; ?>" onclick="myFunction(this);" />
<?php endif; ?>
<?php
$image1 = get_field('segunda_imagen');
if( !empty($image1) ): ?>
<img class="card-img-top2" src="<?php echo $image1['url']; ?>" alt="<?php
echo $image1['alt']; ?>"/>
<?php endif; ?>
<?php
$image2 = get_field('tercera_imagen');
if( !empty($image2) ): ?>
<img class="card-img-top2" src="<?php echo $image2['url']; ?>" alt="<?php
echo $image2['alt']; ?>"/>
<?php endif; ?>
<?php
$image3 = get_field('cuarta_imagen');
if( !empty($image3) ): ?>
<img class="card-img-top2" src="<?php echo $image3['url']; ?>" alt="<?php
echo $image3['alt']; ?>"/>
<?php endif; ?>
Gracias de antemano, un saludo.
Edito
El functions.php está así:
function my_scripts() {
wp_enqueue_script( 'script', get_template_directory_uri() . '/js/script.js');
}
add_action( 'wp_enqueue_scripts', 'my_scripts' );