2017-12-13 20 views
0

私は両方の投稿に前/次のリンクを設定しようとしています& wordpress内の製品。これは、私が働いているコードです:何の前/次のポストがない場合は、現在投稿がない場合は、ポストリンクを表示しない

<div class="navigation"> 
    <div class="prev"> 
    <span class="nav-label">‹</span> 
    <span class="nav-info-wrap"> 
     <span class="nav-info"> 
     <?php previous_post_link('%link', '%title', TRUE); ?><?php the_post_thumbnail(); ?> 
     </span> 
    </span> 
    </div> 
    <div class="next"> 
    <span class="nav-label">›</span> 
    <span class="nav-info-wrap"> 
     <span class="nav-info"> 
     <?php the_post_thumbnail(); ?><?php next_post_link('%link', '%title', TRUE); ?> 
     </span> 
    </span> 
    </div> 
</div> 

、リンクがありませんが、コンテナは、<div class="prev"></div>または<div class="next"></div>が依然としてあります。

前回または次の投稿がない場合は、前または次のリンクのコンテナ<div class="prev"></div>または<div class="next"></div>を完全に非表示にしたいのですが、私は現在どのように編集するかわかりません。

+0

[Aparently](https://developer.wordpress.org/reference/functions/previous_post_link/ ) 'previous_post_link'は単に' get_previous_post_link'をエコーし​​て、代わりにそれを呼び出して、結果が空のリンクであるかどうかを確認し、そうでない場合にのみエコーします。 – solarc

+0

@solarc、これは動作しません - それは完全に両方のリンクを完全に削除します。 – Trisha

+0

なぜ私の編集を拒否したのですか? – DaFois

答えて

0

あなたのコードデータベースからデータをフェッチしている間に、この

<?php if (have_posts()) : while (have_posts()) : the_post(); ?> 
    // code executed 
<?php endwhile; ?> 
<!-- pagination --> 
<div class="navigation"> 
    <div class="prev"> 
    <span class="nav-label">‹</span> 
    <span class="nav-info-wrap"> 
     <span class="nav-info"> 
     <?php previous_post_link('%link', '%title', TRUE); ?><?php the_post_thumbnail(); ?> 
     </span> 
    </span> 
    </div> 
    <div class="next"> 
    <span class="nav-label">›</span> 
    <span class="nav-info-wrap"> 
     <span class="nav-info"> 
     <?php the_post_thumbnail(); ?><?php next_post_link('%link', '%title', TRUE); ?> 
     </span> 
    </span> 
    </div> 
</div> 
<?php else : ?> 
<!-- No posts found --> 
<?php endif; ?> 
+0

助けてくれてありがとう - 答えに一層合うように質問を調整しました。私の現在のコードは、前/次の投稿がない場合はリンクを表示しませんが、問題である 'previous_post_link'と' next_post_link'コードを囲んでコンテナを隠しているわけではありません。 – Trisha

0

のように見えるはずですが、レコードを追跡することができます。たとえば、データベースレコードの主キーにauto_incrementが設定されているとします。最初のレコードは常に1で、最後のレコードは合計行数です。主キーが基準に一致する場合、ボタンを無効または非表示にすることができます。

<?php 
if ($post = get_post()){ 
    // $post has false if the post is last or fist. 
    } 

    ?> 
    <div class="navigation"> 
    <div class="prev"> 
    <span class="nav-label">‹</span> 
    <span class="nav-info-wrap"> 
     <span class="nav-info"> 
     <?php previous_post_link('%link', '%title', TRUE); ?><?php the_post_thumbnail(); ?> 
     </span> 
    </span> 
    </div> 
    <div class="next"> 
    <span class="nav-label">›</span> 
    <span class="nav-info-wrap"> 
     <span class="nav-info"> 
     <?php the_post_thumbnail(); ?><?php next_post_link('%link', '%title', TRUE); ?> 
     </span> 
    </span> 
    </div> 
</div> 
+0

これはうまくいかなかった – Trisha

0

私はここにスニペットを使用して、コードを少しアップ変更:https://gist.github.com/projoomexperts/e63152d5d8f3264f5a47

<div class="navigation"> 

    <div class="prev"><span class="nav-label">&lsaquo;</span><span class="nav-info-wrap"><span class="nav-info"> 
    <?php 
     $prevPost = get_previous_post(); 
     $prevThumbnail = get_the_post_thumbnail($prevPost->ID, array(150,150)); 
     $theTitle = get_the_title(); 
     $prevLink = get_permalink($prevPost->ID); 
    ?> 
    <?php if($prevPost){ ?> 
     <a href="<?php echo $prevLink; ?>"> 
      <?php print_r($theTitle); print_r($prevThumbnail); ?> 
     </a> 
    <?php } ?> 
    </span></span></div> 


    <div class="next"><span class="nav-label">&rsaquo;</span><span class="nav-info-wrap"><span class="nav-info"> 
    <?php 
     $nextPost = get_next_post();  
     $nextLink = get_permalink($nextPost->ID); 
    ?> 

    <?php if($nextPost) { ?> 
     <a href="<?php echo $nextLink; ?>"> 
      <?php 
      $nextThumbnail = get_the_post_thumbnail($nextPost->ID, array(150,150)); 
      $theTitle = get_the_title(); 
      print_r($nextThumbnail); print_r($theTitle); ?> 
     </a> 
    <?php } ?> 
    </span></span></div> 

</div> 

しかし、それはそうはJavaScriptを使用して、 "NAV-情報" divの間に空白を作成します。

<script> 
jQuery(function($){ 
    if($.trim($(".prev .nav-info").text())!=='') { 
      $(".next .nav-info").parent().parent().hide(); 
     } 
}); 
jQuery(function($){ 
    if($.trim($(".next .nav-info").text())!=='') { 
      $(".prev .nav-info").parent().parent().hide(); 
     } 
}); 
</script> 

これは私のすべての問題を解決しました:)

関連する問題