Al entrar a esa página se muestran los servicios y debajo de cada una sale un mensaje que dice «conoce servicios», al darle click salen los servicios con un botón, lo que necesito es que los del último servicio manden a un enlace en específico, es lo que tengo en el que dice «Ir a sitio», adjunto el código de esa página
<?php
get_header();
?>
<style>
.swiper-container {
width: 100%;
height: 100%;
}
.swiper-slide {
text-align: center;
font-size: 18px;
background: #fff;
/* Center slide text vertically */
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
}
</style>
<div class="page nosotros">
<?php while (have_posts()) : the_post();?>
<div style="overflow: hidden" class='wow fadeIn mb-4 mb-md-0'>
<div class="container">
<section class="section-1 d-flex align-items-center mb-4 mb-md-0">
<?php
$page = get_page_by_path( __('servicios','grupo-regio') );
$imagenes = [wp_get_attachment_image_src(get_post_thumbnail_id($page->ID),'header')[0]];
$pagesGaleria = get_field('pages_galeria',$page->ID);
if($pagesGaleria){
foreach($pagesGaleria as $pg) {
$imagenes[]=$pg['sizes']['header'];
}
}
?>
<?php include 'header-slider.php' ?>
<div class="col-md-5">
<h1><?php echo $page->post_title ?></h1>
<div><?php echo $page->post_content ?></div>
</div>
</section>
</div>
</div>
<div class="container">
<?php
$terms = get_terms( array(
'taxonomy' => 'servicios',
'hide_empty' => false,
));
$i = 0;
foreach ($terms as $term) {
if($term->parent=='0' && $term->term_id && !in_array($term->slug, array('papeleria-operativo', 'papeleria-corporativa'))){
$servicios = array_filter($terms, function($v, $k) use ($term) {
return $v->parent === $term->term_id;
}, ARRAY_FILTER_USE_BOTH);
?>
<section class="section-2" id='<?php echo $term->slug; ?>'>
<div class="row servicio-detalle">
<div class="col <?php echo $i%2 === 0?'order-md-1':'offset-md-1' ?>">
<img class="img-fluid"
src="<?php echo get_field('servicios_imagen', 'servicios_' . $term->term_id) ?>" />
</div>
<div class="col-md-5 align-self-center <?php echo $i%2 === 0?'offset-md-1':'' ?>">
<h2><?php echo $term->name ?></h2>
<div><?php echo $term->description ?></div>
<div>
<a class="collapsed" onclick="toggleSlider(this,'#slider-<?php echo $term->term_id ?>')">
<?php if(ICL_LANGUAGE_CODE == 'es'){ ?>
Conoce nuestros servicios de <?php echo $term->name ?>
<?php } else {?>
Our <?php echo $term->name ?> services
<?php } ?>
<i class="fa fa-chevron-up" aria-hidden="true"></i> </a>
</div>
</div>
</div>
<div>
<div id="slider-<?php echo $term->term_id ?>" class="swiper-container collapse">
<div class="swiper-wrapper">
<?php foreach($servicios as $servicio){ ?>
<div class="swiper-slide">
<div class="servicio-item d-flex justify-content-center"
style="background-image: url(<?php echo get_field('servicios_imagen', 'servicios_' . $servicio->term_id) ?>">
<div class="servicio-info align-self-end">
<h3 class="mb-3"><?php echo $servicio->name ?></h3>
<div>
<?php echo $servicio->description ?>
</div>
<a href="<?php echo get_field( 'servicios_enlace' , 'servicios_' . $servicio->term_id ); ?>">
<?php _e('Ir a Sitio','grupo-regio') ?></a>
<br>
<a onclick="showProductos(this)" href="#servicios=<?php echo $servicio->term_id ?>"
class="btn btn-outline-warning"><i class="fa fa-long-arrow-right"
aria-hidden="true"></i> <?php _e('Ver ejemplos','grupo-regio') ?> </a>
</div>
</div>
</div>
<?php } ?>
</div>
</div>
</div>
</section>
<?php
$i++;
}
}
?>
</div>
<?php endwhile; ?>
</div>
<?php include('modal_productos.php') ?>
<?php get_footer(); ?>
<script>
var crearSlider = function (id) {
//var id = "#slider-" + i;
var slider = document.querySelectorAll(id + " .swiper-slide");
var config = {
slidesPerView: 2,
spaceBetween: 14,
breakpoints: {
767: {
slidesPerView: 1
}
},
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
}
};
let n = slider.length;
var btns = '<div class="swiper-button-next"></div><div class="swiper-button-prev"></div>';
let navigation = '<div class="d-block d-md-none">' + btns + '</div>';
if (n > 2) {
if(n == 3){
config.slidesPerView = 3;
}else{
config.slidesPerView = 4;
}
config.breakpoints = {
1023: {
slidesPerView: 2
},
767: {
slidesPerView: 1
}
}
navigation = btns;
} else if (n == 1) {
config.slidesPerView = 1;
navigation = '';
}
document.querySelector(id).innerHTML += navigation;
window[id] = new Swiper(id, config);
}
var toggleSlider = function (self, slider) {
if (!window[slider]) {
$(slider).on('shown.bs.collapse', function () {
crearSlider(slider);
});
}
if (self.className.length) {
self.className = '';
} else {
self.className = 'collapsed';
}
$(slider).collapse('toggle');
};
</script>
este es el que hace lo de la descripción y donde están los botones que deseo cambiar
<div id="slider-<?php echo $term->term_id ?>" class="swiper-container collapse">
<div class="swiper-wrapper">
<?php foreach($servicios as $servicio){ ?>
<div class="swiper-slide">
<div class="servicio-item d-flex justify-content-center"
style="background-image: url(<?php echo get_field('servicios_imagen', 'servicios_' . $servicio->term_id) ?>">
<div class="servicio-info align-self-end">
<h3 class="mb-3"><?php echo $servicio->name ?></h3>
<div>
<?php echo $servicio->description ?>
</div>
<a href="<?php echo get_field( 'servicios_enlace' , 'servicios_' . $servicio->term_id ); ?>">
<?php _e('Ir a Sitio','grupo-regio') ?></a>
<br>
<a onclick="showProductos(this)" href="#servicios=<?php echo $servicio->term_id ?>"
class="btn btn-outline-warning"><i class="fa fa-long-arrow-right"
aria-hidden="true"></i> <?php _e('Ver ejemplos','grupo-regio') ?> </a>
</div>
</div>
</div>
<?php } ?>
</div>
</div>
el problema es que al modificar algo se modifica en todos, y solo necesito que sea en los últimos dos
¿Hay alguna manera de hacerlo?, esta parte no está administrable en el panel