1

私はWordpressループを使用しています。次に、投稿に基づいた詳細情報を含むモーダルポップアップが表示されます。

私が現在得ているのは、「続きを読む」ボタンをクリックすると、ループの最初のアイテムが読み込まれるということです。IDをモーダルに渡す必要があると思われます。適切な情報を読み込むには、投稿のIDに基づいて別のクエリが実行される可能性があります。

誰かがこれを達成しましたか?

私のコードは次のとおりです:

ファーストループ

<div class="team">
                    <?php
                    $args = array( 'post_type' => 'team_member' );
                    $loop = new WP_Query( $args );
                    while ( $loop->have_posts() ) : $loop->the_post();
                    ?>
                    <div class="team_member">
                    <?php the_post_thumbnail('team_member'); ?>
                    <?php the_title(); ?>
                    <a data-toggle="modal" href="#myModal">
                        <img src="<?php bloginfo( 'template_url' ); ?>/assets/img/content/team_read_more.png" alt="Read More" style="border:none;">
                    </a>
                    </div>
                    <?php endwhile; ?>                  
                </div>

モーダルループ

<div class="modal hide fade" id="myModal">
                <div class="modal-header">
                  <button data-dismiss="modal" class="close">×</button>
                  <h3><?php the_title(); ?></h3>
                </div>
                <div class="modal-body">
                    <p><?php the_post_thumbnail('team_member'); ?></p>
                    <p><?php the_content(); ?></p>
                    <p><a href="mailto:<?php echo get_post_meta($post->ID, 'email_address', true);?>">
                        <img src="<?php bloginfo( 'template_url' ); ?>/assets/img/content/e_mail_link.png" alt="E-Mail Me" style="border:none;">
                       </a>
                    </p>
                </div>
              </div>

ありがとう

4

1 に答える 1

1

最初のループで:

<a data-toggle="modal" href="#myModal">

myModal は、モーダルの html 要素の ID への参照です。

 <div class="modal hide fade" id="myModal">

したがって、複数のモーダルが必要な場合は、ワードプレスの投稿 ID を各要素に追加するだけです。

使用する :

<a data-toggle="modal" href="#myModal-<? the_ID(); ?>">

 <div class="modal hide fade" id="myModal-<? the_ID(); ?>">
于 2012-05-10T12:09:57.837 に答える