wordpress短代碼中的自舉偏移量（簡碼參數）

前幾天我學習了關於WordPress短代碼。現在我可以構建任何基本的短代碼。我試圖在我的短代碼中實現bootstrap。我創建了一個這樣的短代碼 - [custom_post col="4" post_per_page="5"]，它工作正常。wordpress短代碼中的自舉偏移量（簡碼參數）

我在執行列偏移時遇到問題。假設有人想要創建2列布局，並且引導程序類col-sm-3也要偏移到左側3列，所以col-sm-offset-3。簡碼應該看起來像這樣[custom_post col="3" offset="3" post_per_page="5"]。

在下面的代碼中，我使用了offset參數，但它不工作。作爲循環中的列，因此它需要與每列進行偏移。在我們的例子中，我們有2列（col-sm-3），所以偏移發生在這兩列的前面，而不僅僅是第一列。

那麼如何在短代碼中正確設置偏移？

這裏是我的示例代碼：

function CustomPost_Shortcode($atts, $content = NULL) { 
    extract(shortcode_atts(array(

     'col' => '', 
     'offset' => '', 
     'post_per_page' => ''  
    ), $atts)); 

    $args = array('post_type' => 'CustomPost', 'post_per_page' => $col); 

    $query = new WP_Query($args); 
    $list = ""; 
    while ($query->have_posts()) : $query->the_post();  
     $list .='<div class="col-sm-'.$col.' col-sm-offset-'.$offset.'> 

        <h4 class="item-header"><a href="'.get_the_permalink(). '">'.get_the_title().'</a></h4> 

        <div class="post-image"> 
         '.get_the_post_thumbnail().' 
        </div> 

        <div class="post-content"> 
         <p>' . get_the_excerpt().'</p> 
         <p><a href="' . get_the_permalink().'">Read More</a></p> 
        </div> 
        </div>'; 
    endwhile; 
    wp_reset_query(); 
    return $list; 
} 

add_shortcode('custom_post', 'CustomPost_Shortcode');

來源

2016-11-07 Amirul Islam

能不能請你下面的代碼來獲得結果。

簡碼：

[custom_post col="3" offset="3" post_per_page="5"]

代碼：

function CustomPost_Shortcode($atts, $content = NULL) { 
    extract(shortcode_atts(array(
     'col' => '', 
     'offset' => '', 
     'post_per_page' => ''  
    ), $atts)); 

    $args = array('post_type' => 'post', 'posts_per_page' => $post_per_page); 

    $query = new WP_Query($args); 
    $list = ''; 
    while ($query->have_posts()) : $query->the_post();  
     $list .='<div class="col-sm-'.$col.' col-sm-offset-'.$offset.'"> 

        <h4 class="item-header"><a href="'.get_the_permalink(). '">'.get_the_title().'</a></h4> 

        <div class="post-image"> 
         '.get_the_post_thumbnail().' 
        </div> 

        <div class="post-content"> 
         <p>' . get_the_excerpt().'</p> 
         <p><a href="' . get_the_permalink().'">Read More</a></p> 
        </div> 
        </div>'; 
    endwhile; 
    wp_reset_query(); 
    return $list; 
} 

add_shortcode('custom_post', 'CustomPost_Shortcode');

來源

2016-11-07 10:10:14

謝謝。 $ list =「」;聲明是我的代碼的一部分，但在發佈之前我以某種方式刪除了它。還是一樣的結果。實際上偏移正在工作，但沒有正確的方式。作爲循環中的列div，所以偏移量與每列一起發生，而不是隻與第一列相關。所以在結果中，每列之前都會顯示一個空格（偏移量）。 –

意味着你需要在第一，第三，第五等地方抵消嗎？ –

不，我想以自然的方式偏移。只在第一列之前。 *我的英語道歉，這不是我的母語。 –

設置$offset到0，像這樣...

function CustomPost_Shortcode($atts, $content = NULL) { 
    extract(shortcode_atts(array(
     'col' => '', 
     'offset' => '', 
     'post_per_page' => ''  
     ), $atts)); 

    $args = array('post_type' => 'CustomPost', 'post_per_page' => $col); 

    $query = new WP_Query($args); 
    $list = ""; 
    while ($query->have_posts()) : $query->the_post();  
     $list .='<div class="col-sm-'.$col; 
     if ($offset > 0) { 
      $list .= ' col-sm-offset-'.$offset; 
      $offset = 0; 
     } 
     $list .= '"> 

       <h4 class="item-header"><a href="'.get_the_permalink(). '">'.get_the_title().'</a></h4> 

       <div class="post-image"> 
        '.get_the_post_thumbnail().' 
       </div> 

       <div class="post-content"> 
        <p>' . get_the_excerpt().'</p> 
        <p><a href="' . get_the_permalink().'">Read More</a></p> 
       </div> 
       </div>'; 
    endwhile; 
    wp_reset_query(); 
    return $list; 
} 

add_shortcode('custom_post', 'CustomPost_Shortcode');

來源

2016-11-08 12:35:53 Vino

wordpress短代碼中的自舉偏移量（簡碼參數）

回答

相關問題