Question

我已经在论坛和Google上搜索了几天如何解决这个问题并且尚未找到解决方案。非常感谢任何帮助。

底线，我希望实现这一目标：

演讲者部分

使用Firebug检查元素，我已确定适用哪些类：

＆＃13;

<div class="et_pb_section  et_pb_section_8 et_pb_with_background et_section_regular">



  <div class=" et_pb_row et_pb_row_6">


    <div class="et_pb_column et_pb_column_4_4  et_pb_column_10">

      <div class="et_pb_blog_grid_wrapper">
        <div class="et_pb_blog_grid clearfix et_pb_module et_pb_bg_layout_  et_pb_cpt_loop_archive_0 et_pb_cpt_archive_grid" data-columns="">
          <div class="et_pb_row et_pb_row_cpt et_pb_row_4col">
            <div class="et_cpt_container_column et_pb_column et_pb_column_1_4  et_pb_column_0">
              <div class="et_pb_section  et_pb_section_10 et_section_regular">



                <div class=" et_pb_row et_pb_row_7">


                  <div class="et_pb_column et_pb_column_4_4  et_pb_column_11">

                    <div class="et_pb_module et-waypoint et_pb_image et_pb_animation_off desaturate et_pb_cpt_featured_image2_0 et_always_center_on_mobile et-animated">
                      <a href="http://meetingoftheminds.org/speaker/scot-rourke"><img src="http://meetingoftheminds.org/wp-content/uploads/2017/03/Scot-Rourke.jpg" alt="">
                      </a>
                    </div>
                    <div class="clearfix et_pb_module et_pb_bg_layout_light et_pb_text_align_left  et_pb_cpt_title_0">
                      <h2 itemprop="name" class="cpt_title page_title entry-title"><a href="http://meetingoftheminds.org/speaker/scot-rourke">Scot Rourke</a></h2>
                    </div>
                    <div class="clearfix et_pb_module  et_pb_acf_single_item_0">
                      <div class="sb_mod_acf_single_item clearfix">
                        <p>‎Chief Information and Transformation Officer, Technology, Innovation &amp; Performance</p>
                      </div>
                    </div>
                    <div class="clearfix et_pb_module  et_pb_acf_single_item_1">
                      <div class="sb_mod_acf_single_item clearfix">
                        <p>Cuyahoga County</p>
                      </div>
                    </div>
                  </div>
                  <!-- .et_pb_column -->
                </div>
                <!-- .et_pb_row -->

              </div>
              <!-- .et_pb_section -->
            </div>

＆＃13;

然后我尝试将其定制到我的PHP循环，但结果与预期完全不同。

以下是原始循环的片段：

<?php

// Get the connected posts
$my_connected_posts = Post_Connector::API()->get_children( "sessions-to-speakers", get_the_id() );
// Check
if ( count( $my_connected_posts ) > 0 ) {
    // Loop
    foreach ( $my_connected_posts as $my_connected_post ) {

        // Display the featured image, title with link, job, and company
        echo get_the_post_thumbnail( $my_connected_post, 'thumbnail') . "<br/>";
        echo "<a href='" . get_permalink( $my_connected_post->ID ) . "'>" . $my_connected_post->post_title . "</a>" . "<br/>";
        echo get_field("job", $my_connected_post) . "<br/>";
        echo get_field("company", $my_connected_post) . "<br/>"; 

        }

                    }

?>

原始循环在页面垂直向下显示帖子，如下所示：

已连接的帖子

这是修改后的循环的片段，使用＆＃34;扬声器部分＆＃34;类，似乎只是调整缩略图的大小：

<!-- Speaker Section -->
<div class="et_pb_section  et_pb_section_8 et_pb_with_background et_section_regular">
  <div class=" et_pb_row et_pb_row_6">
    <div class="et_pb_column et_pb_column_4_4  et_pb_column_10">
      <div class="et_pb_blog_grid_wrapper">
        <div class="et_pb_blog_grid clearfix et_pb_module et_pb_bg_layout_  et_pb_cpt_loop_archive_0 et_pb_cpt_archive_grid" data-columns="">
          <div class="et_pb_row et_pb_row_cpt et_pb_row_4col">

            <?php

// Get the connected posts
$my_connected_posts = Post_Connector::API()->get_children( "sessions-to-speakers", get_the_id() );
// Check
if ( count( $my_connected_posts ) > 0 ) {
    // Loop
    foreach ( $my_connected_posts as $my_connected_post ) {

// #speaker section
echo '<div class="et_cpt_container_column et_pb_column et_pb_column_1_4  et_pb_column_0"><div class="et_pb_section  et_pb_section_10 et_section_regular">';
    echo '<div class=" et_pb_row et_pb_row_7">';
        echo '<div class="et_pb_column et_pb_column_4_4  et_pb_column_11">';

        // Display the featured image, title with link, job, and company
echo '<div class="et_pb_module et-waypoint et_pb_image et_pb_animation_off desaturate et_pb_cpt_featured_image2_0 et_always_center_on_mobile et-animated">';
        echo get_the_post_thumbnail( $my_connected_post, 'thumbnail') . "<br/>";
echo '</div>';
echo '<div class="clearfix et_pb_module et_pb_bg_layout_light et_pb_text_align_left  et_pb_cpt_title_0">';
        echo "<a href='" . get_permalink( $my_connected_post->ID ) . "'>" . $my_connected_post->post_title . "</a>" . "<br/>";
echo '</div>';
echo '<div class="clearfix et_pb_module  et_pb_acf_single_item_0">';
echo '<div class="sb_mod_acf_single_item clearfix">';
        echo get_field("job", $my_connected_post) . "<br/>";
echo '</div>';
echo '</div>';
echo '<div class="clearfix et_pb_module  et_pb_acf_single_item_1">';
echo '<div class="sb_mod_acf_single_item clearfix">';
        echo get_field("company", $my_connected_post) . "<br/>"; 
echo '</div>';
echo '</div>';
echo '</div>';
echo '</div>'; 
echo '</div>'; 
        }

                    }

?>

使用PHP循环在网格中显示连接的帖子

0 个答案: