WordPressテーマLightningでは、カテゴリー一覧やアーカイブページでの記事一覧は抜粋や本文の文章の一部しか表示されません。
これを抜粋や記事の一部ではなく本文すべてを表示させるようにカスタマイズする方法をご紹介します。
LightinigG2とG3それぞれの対応方法をご紹介します。
世代の確認
Lightningの世代によって方法が異なります。
まずは、Lightningの世代を確認しましょう。
Lightning機能設定を選択します。
世代設定を確認します。Generation2はG2を、Generation3はG3を表しています。
Generation2は旧世代です。2021年5月までにLightningテーマを使用している方はLightningG2である可能性が高いです。
2021年5月以降にLightningテーマを使用した方はLightningG3である可能性が高いです。
LgithinigG3で記事すべてを表示する方法
/*-------------------------------------------*/
/*Lightning G3 投稿一覧ページで本文すべてを表示させる */
/* 対象カテゴリーはメッセージのみ */
/*-------------------------------------------*/
function my_custom_lightning_extend_loop($extend) {
if (is_category('message')) {//指定のカテゴリースラッグ
$extend = true;
}
return $extend;
}
add_filter('lightning_is_extend_loop', 'my_custom_lightning_extend_loop');
function my_custom_loop_action() {
if (have_posts()) :
while (have_posts()) : the_post();
// ここで本文全体を表示
lightning_get_template_part( 'template-parts/entry', get_post_type() );
echo '<hr class="my-5">';
endwhile;
else :
echo '<p>投稿がありません</p>';
endif;
}
add_action('lightning_extend_loop', 'my_custom_loop_action');
こちらのコードは全投稿一覧ではなく、特定のカテゴリーにのみに制限しています。
if (is_category('message')) {//指定のカテゴリースラッグ
このis_categoryの中身を特定のカテゴリーのスラッグに変更しましょう。
また、先ほどのコードのみでは投稿ページ本文がそのまま表示されますのでもう少し改造します。
以下のコードも追加でfunctions.phpに貼り付けます。
/*-------------------------------------------*/
/*Lightning G3 投稿一覧ページで本文すべてを表示させる */
/* 本文下部にあるカテゴリーは非表示にする */
/*-------------------------------------------*/
function my_lightning_is_entry_footer($extend) {
if (is_category('message')) {//指定のカテゴリースラッグ
$extend = false;
}
return $extend;
}
add_filter('lightning_is_entry_footer', 'my_lightning_is_entry_footer');
こちらのコードも加えることで、投稿ページ下部にあるカテゴリーの行を非表示にします。
同様にis_categoryの中身を先ほどと同じスラッグに変更しましょう。
必要な方のみこのコードをご使用ください。
19行目の、
echo '<hr class="my-5">';
は水平方向の罫線(横方向の線)を表示させます。
不要な場合は削除してください。
LgithinigG2での記事すべてを表示する方法
/*-------------------------------------------*/
/* Lightning G2 抜粋をやめて本文すべてを表示させる */
/*-------------------------------------------*/
function my_custom_lightning_extend_loop($extend) {
$extend = true;
return $extend;
}
add_filter('is_lightning_extend_loop', 'my_custom_lightning_extend_loop');
function my_custom_loop_action() {
if (have_posts()) :
while (have_posts()) : the_post();
get_template_part( 'template-parts/post/article', $postType['slug'] );// ここで本文全体を表示
echo '<hr class="my-5">';
endwhile;
else :
echo '<p>投稿が見つかりません</p>';
endif;
}
add_action('lightning_extend_loop', 'my_custom_loop_action');
こちらのこちらのコードをfunctions.phpに貼り付けましょう。
15行目の、
echo '<hr class="my-5">';
は水平方向の罫線(横方向の線)を表示させます。
不要な場合は削除してください。
LightningG2を使用している場合の別方法
LightningG2限定で、テーマ専用のウィジェットパーツが用意されています。
こちらを使用するとfunctions.phpを変更しなくても本文の内容を表示させることができます。
手順は以下です。
外観→ウィジェットからウィジェットページへ移動
表示させたい場所のウィジェットエリアを選択してすべて表示を選択
ウィジェットグループにあるLTGコンテンツエリア投稿ウィジェットを選択
表示形式の「日付/カテゴリー/タイトル/内容」を選択する
以上の簡単な手順で記事本文を表示させることができます。
表示したい場所のウィジェットエリアがない場合は、ウィジェットエリアを自作する方法があります。
こちらの記事を参考にウィジェットエリアを作成しましょう。
例えば、LightningG3ですとウィジェットの作成する際に以下のコードがあります。
このコードは記事で紹介したコードと同じです。
function my_lightning_widgets_init_home_bottom() {
register_sidebar(
array(
'name' => __( 'トップページコンテンツエリア下部', 'lightning' ),
'id' => 'home-content-bottom-widget-area',
'before_widget' => '<div class="widget %2$s" id="%1$s">',
'after_widget' => '</div>',
'before_title' => '<h2>',
'after_title' => '</h2>',
)
);
}
add_action( 'widgets_init', 'my_lightning_widgets_init_home_bottom' );
このときの関数名my_lightning_widgets_init_home_bottom
を変更します。
my_lightning_widgets_init_home_bottom
は2箇所あります。
関数名は分かりやすい名前にしましょう。
次に、ウィジェットエリアの名前を変更します。
'name' => __( 'トップページコンテンツエリア下部', 'lightning' ),
この箇所の日本語になっている所を分かりやすい名前に変更します。
そして、IDも変更する必要があります。
'id' => 'home-content-bottom-widget-area',
ここも分かりやすい名前に変更しておきましょう。
続いて、ウィジェットを表示させるための関数も変更しましょう。
function my_lightning_widgets_add_home_bottom() {
if ( is_front_page() ) {
if ( is_active_sidebar( 'home-content-bottom-widget-area' ) ) {
dynamic_sidebar( 'home-content-bottom-widget-area' );
}
}
}
add_action( 'lightning_main_section_append', 'my_lightning_widgets_add_home_bottom' );
この2行目のis_front_page()
を特定の固定ページのスラッグやIDにすると特定のページにのみ表示されます。
3行目、4行目の'home-content-bottom-widget-area'
は先ほどのウィジェットエリア用のID名ですので、同じID名を入力します。
このように応用すると、ウィジェットの可能性が広がります。
WordPressって素晴らしい♪
まとめ
一覧ページで抜粋ではなく本文全体を表示させたいという需要は少なそうですが紹介してみました。
こちらの方法を使えば、抜粋と違って記事に設定した文字の大きさや色の変更も反映されます。
通常のLightningテーマと差をつけたい方は導入するのもありかもしれません。