Discussion :

[TBA_78]

Bonjour,

J'ai créé un carousel Bootstrap pour mon thème perso et en cliquant sue une image du carousel, on doit se rendre vers l'url récupérée dans un champ personnalisé mais cela ne fonctionne que sur la première image au chargement de la page.

je crée et récupère mon champ de cette façon:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
/*Ajout du champ personnalisé pour l'url*/ 
add_action('wp_insert_post', 'wpc_champs_personnalises_defaut');
function wpc_champs_personnalises_defaut($post_id) {
	if ( $_GET['post_type'] != 'page' ) {
		add_post_meta($post_id, 'url', 'http://', true);
	}
	return true;
}

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
<?php $url = get_post_meta( $post->ID, 'url', true );?>
<a href="<?php echo "http://".$url; ?>" target="_blank" title="<?php the_title_attribute(); ?>">
<?php the_post_thumbnail('taille-carousel');?>
</a>

Voici mon carousel complet:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
 
<section>
	<div class="row mb-5 justify-content-center" style="width:1110px !important">
		<!-- CAROUSEL BOOTSTRAP -->
		<?php
		$args = array(
			'post_type' => 'post',
			'post_status'=>'publish',
			'category_name' => 'realisations',
			'posts_per_page'=>-1
		);
		$the_query = new WP_Query ( $args ); 
		?>
		<div class="col-lg-12 colCarousel">
			<div id="ExampleCarouselID" class="carousel slide shadow" data-ride="carousel" data-interval="7000">
				<a class="carousel-control-prev" href="#ExampleCarouselID" role="button" data-slide="prev">
					<span class="arrowCarousel ti-angle-double-left" aria-hidden="true"></span>
					<span class="sr-only">Previous</span>
				</a>
				<a class="carousel-control-next" href="#ExampleCarouselID" role="button" data-slide="next">
					<span class="arrowCarousel ti-angle-double-right" aria-hidden="true"></span>
					<span class="sr-only">Next</span>
					<?php rewind_posts(); ?>
					<div class="carousel-inner"> 
						<?php if ( $the_query->have_posts() ) : while ( $the_query->have_posts() ) : $the_query->the_post();
							$thumbnail_id   = get_post_thumbnail_id();
							$thumbnail_meta = get_post_meta( $thumbnail_id, '_wp_attatchment_image_alt', true );
							?>
							<div class="carousel-item <?php if ($the_query->current_post == 0) : ?> active"> 
							<?php endif; ?>
							<?php if (has_post_thumbnail()) : ?>
								<?php $url = get_post_meta( $post->ID, 'url', true );?>
								<a href="<?php echo "http://".$url; ?>" target="_blank" title="<?php the_title_attribute(); ?>">
									<?php the_post_thumbnail('taille-carousel');?>
								</a>
							<?php endif; ?>
							<div class="carousel-caption text-center">
								<h1><?php the_title(); ?></h1>
								<p><?php the_content();?></p>
							</div>
						</div><!-- /.carousel-item -->
						<!-- end second loop -->
					<?php endwhile;	endif; ?>
				</div><!-- /.carousel-inner -->
			</div><!-- /.carousel-slide -->
		</div><!-- COL -->
	</div><!-- ROW -->
</section>

J'ai publié un exemple ici: https://www.web-connect.fr/test/

On peut s'apercevoir déjà dans la source que c'est bon pour la première occurrence mais pas pour la seconde.

Je pense que cela vient de la façon dont je récupère la valeur de mon champ personnalisé mais je me demande si Bootstrap carousel est vraiment adapté pour ça.

Je précise que sur mes boutons dans le carousel cela fonctionne bien mais c'est quand on clique sur les images.

Je vous remercie de votre aide

[darkstar123456]

Bonjour,

Attention avec la variable $post, c'est une variable définie "globale" par WP.
Bien que dans ton cas, cela devrait malgré fonctionner vu que tu appelles bien la méthode the_post()Utilise plutôt get_the_ID() à la place

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
// Remplacer :
$url = get_post_meta( $post->ID, 'url', true );
// Par :
$url = get_post_meta( get_the_ID(), 'url', true );

NB : Il manque un wp_reset_query(); après ta boucle

[darkstar123456]

Ton vrai problème est qu'il y a une erreur HTML à mon avis.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<a class="carousel-control-next" href="#ExampleCarouselID" role="button" data-slide="next">

Ce lien n'est jamais fermé.... donc quand tu veux "ouvrir" un nouveau <a> il ne fait rien

[TBA_78]

Merci pour cette erreur, j'ai corrigé mais cela ne venait pas de ça.

[mathieu]

quand on regarde le code source de la page, mon navigateur affiche une balise "p" mal placée.
essayez d'enlever les balises "p" autour de l'appel à "the_content"

[Invité]

Bonjour,

1- il manque </a> après Next :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
					<span class="sr-only">Next</span>
				</a>

2- Une balise </p< en trop :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
<a class="btnCarousel" href="........." target="_blank" rel="noopener noreferrer"><span>Visitez le site <i class="icofont-arrow-right"></i></span></a>
</p>

3- mauvaise fermeture :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
<div class="carousel-item <?php if ($the_query->current_post == 0) : ?> active"> 
							<?php endif; ?>

->

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<div class="carousel-item <?php if ($the_query->current_post == 0) : ?> active"<?php endif; ?>>

Il faut être plus RIGOUREUX.