WordPress的帖子最後的帖子

我怎樣才能創建一個網格像圖片？對於節目的最後一個職位WordPress的帖子最後的帖子

<?php if (have_posts()) : ?> 
<?php while (have_posts()) : the_post(); ?> 
<?php the_content(); ?> 
<?php endwhile; ?> 
<?php endif; ?> 
<?php wp_reset_query(); ?> 
<?php $latest_post = get_posts('numberposts=4'); ?> 
<?php foreach($latest_post as $post) : setup_postdata($post); ?> 
<?php the_title(); ?><br /> 
<?php the_content(); ?> 
<?php endforeach; ?> 
<?php wp_reset_query(); ?>

來源

2016-11-17 Leon

一種選擇是使用PHP來交換圍繞圖像的基礎上的增量是否是奇數還是偶數，比如位置：

$i = 0; 

while (have_posts()) : the_post(); 

    if ($i % 2 == 0) { 
     // Display two columns with image on left 
    } 
    else { 
     // Display two columns with image on right 
    } 

    $i++; 

endwhile;

如果你從頭開始構建你的主題，我會建議使用網格框架來處理你的列，否則看看你正在使用的主題是否已經有一個網格框架。

編輯：

也有這樣做，而不必實際改變頁面的標記方式。例如：

Swapping columns (left/right) on alternate rows

在這種情況下，你可以生成你的帖子沒有標記的if語句，只需使用CSS來交換圖像/視頻的位置。

來源

2016-11-18 00:02:15

可以使用masonry技術，或者你可以試試這個plugin

來源

2016-11-18 00:56:47 Wedangsusu

在你上面的代碼，你開了WordPress的內容循環。我不知道爲什麼你必須開火兩個循環，雖然他們都會工作。首先將打印最近發佈的帖子，具體取決於您通過WordPress儀表板中的設置 - >閱讀標籤選擇的每頁帖子數，第二個帖子將再次列出前4個最近的帖子。我使用第一個循環來告訴你如何創建像網格一樣的附加圖像。

下面是你必須做的PHP/HTML修改：

<?php $count = 1; if (have_posts()) : ?> 
<?php while (have_posts()) : the_post(); ?> 

    <div class="one-half <?php if($count++ % 2 == 0): echo 'last-col'; endif; ?>"> 

     <?php 
      // the function below will print the featured image attached to the post 
      the_post_thumbnail('your-featured-image-sizename'); ?> 

    </div> 
    <!-- one-half --> 
    <div class="one-half"> 

     <span class="post_stamp"><?php the_time('j m Y'); ?></span> 
     <span class="post_cat"><?php the_category(', '); // This will print News if you filled the post under News Category ?></span> 
     <h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3> 
     <?php the_excerpt(); // Insteading of printing the whole content this function will print exceprt only ?> 

    </div> 
    <!-- one-half --> 
    <div class="clearfix"><!-- --></div> 

<?php endwhile; ?> 
<?php endif; ?> 
<?php wp_reset_query(); ?>

你將不得不把下面給出的鏈接到你的樣式文件：

<style> 

    .one-half{width: 50%; float: left;} 
    .last-col{float: right;} 
    .clearfix{clear: both; overflow: hidden;} 

</style>

作出上述改變後您的帖子將顯示爲附加圖片。好運（y）

來源

2016-11-18 01:17:35 Vineet

WordPress的帖子最後的帖子

回答

相關問題