bxSliderをWordPressに導入してキャプションをページのタイトルにする
PR
このサイトの上部に導入しているbxsliderを
キャプションを有効にした時に、ページのタイトルを表示するようにする方法
bxSlider×WordPressでスライドのキャプションをアイキャッチが登録されているページのタイトルにしてさらに文字数を制限する
いきなりコードを書きます
<div class="bxslider">
<?php query_posts('showposts=12&orderby=desc');?>
<?php if(have_posts()):while(have_posts()):the_post();?>
<a href="<?php the_permalink() ?>">
<?php $title= mb_substr($post->post_title,0,25); the_post_thumbnail(('medium'),array( 'alt' =>$title, 'title' => $title."・・")); ?>
</a>
<?php endwhile;endif;?>
</div>
これは、実際に上にあるものと同じコードです
bxSliderでは通常対象とするものをulとしてそこにクラスをつけることが多いのですが
キャプションの上もリンクにしたかったので、divに変えてul、liをなくしました
ul、liがある場合は <li><a><img></a><li>で実際には
<li><a><img></a></li><span>caption </span>×枚数という形になります
ul、liを無くすと <a><img><span>caption</span></a>×枚数となるので全体にリンクがかかります
そして imgのtitleをbxsliderは読み込んでキャプションとして表示しますので
imgのtitleを記事のtitleに差し替えればOK
ついでに、キャプションが画面を覆い尽くしてはアイキャッチの意味が無いので
文字数制限もつけました
post_title,0,25 というところの25が文字の上限です
the_post_thumbnail((‘medium’),array( ‘alt’ =>$title, ‘title’ => $title.”・・”));
サムネイルにtitleを追加して内容は $title.”・・” としてタイトルのあとに一応省略を付け足しました
PR
短縮URL:
COMMENT