web-dev-qa-db-fra.com

Postes WordPress ouverts dans Bootstrap Modal

Je cherche de l'aide pour ouvrir des publications WordPress dans Bootstrap Modal.

À l'heure actuelle, j'ai une page d'accueil avec une grille qui tire les messages.

Je l'ai configuré pour que chaque message soit dans une boîte carrée et lié pour ouvrir la fenêtre Bootstrap Modal.

La fenêtre modale doit extraire les données de la publication sur laquelle vous cliquez.

À ce stade, il n’ouvre que le dernier message de la page, quel que soit le message sur lequel vous cliquez.

Je suppose que je dois indiquer à la fenêtre du modèle quelle publication a été cliquée pour extraire les données correctes, mais je suis perdue.

Toute aide serait appréciée.

Voici mon code actuel:

    <?php get_template_part('templates/page', 'header'); ?>
<?php if (!have_posts()) : ?>

<div class="alert">
  <?php _e('Sorry, no results were found.', 'roots'); ?>
</div>
<?php get_search_form(); ?>
<?php endif; ?>
<div class="row">
  <?php while (have_posts()) : the_post(); ?>
  <?php
$src = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), array( 5600,1000 ), false, '' );
?>
  <a href="#myModal" data-toggle="modal">
  <div class="span2" style="background: #09F url(<?php echo $src[0]; ?>) center no-repeat !important;">
    <?php get_template_part('templates/content', get_post_format()); ?>
  </div>
  </a>




  <div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-header">

      <h3 id="myModalLabel">
        <?php the_title(); ?>
      </h3>
    </div>
    <div class="modal-body">
      <p><?php the_post_thumbnail(); ?></p>
    </div>
    <div class="modal-footer">
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    </div>
  </div>


  <?php endwhile; ?>
posts
1
minemind

Ceci a été répondu et voici comment cela a été fait:

La grille et la fenêtre modale sont en boucle. J'ai simplement ajouté -<? the_ID(); ?> au bot <a href> qui appelle la fenêtre modale. et au <div id> pour la fenêtre modale qui transmet en quelque sorte l'ID de la publication à la fenêtre, lui permettant ainsi de récupérer les bonnes informations pour la publication.

    <div class="container" style="margin-top:20px; min-height:500px;" >
  <div class="row">
    <?php 
   $labels = new WP_Query(array(
    'post_type' => 'slider', 
    'posts_per_page' => 1000
    )); 
   while ( $labels->have_posts() ) : 
   $labels->the_post();
  ?>
    <?php
$src = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), array( 5600,1000 ), false, '' );
?>
    <a href="#myModal-<? the_ID(); ?>" data-toggle="modal" >
    <div class="span2" style="background: #09F url(<?php echo $src[0]; ?>) center no-repeat !important;">
      <?php the_title();?>
    </div>
    </a>




    <div id="myModal-<? the_ID(); ?>" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
      <div class="modal-header">
        <h3 id="myModalLabel">
          <?php the_title();?>
        </h3>
        <p>
          <?php the_content();?>
        </p>
      </div>
      <div class="modal-body">
        <?php the_post_thumbnail(); ?>
      </div>
      <div class="modal-footer">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
      </div>
    </div>
1
minemind