この記事にはプロモーションが含まれています。

【SWELL】特定の投稿タイプやページでアイキャッチ画像を非表示にする

【SWELL】特定の投稿タイプやページでアイキャッチ画像を非表示にする

ケケンタ

SWELLでサイト制作をしてるけど、特定の投稿タイプではアイキャッチ画像を表示しないようにしたいんだよな……

ケケンタ

アイキャッチ画像の設定は使いつつ、記事上では非表示にする方法って無いのかな……

今回はこのようなお悩みをお持ちの方に

SWELLで特定の投稿タイプでのみアイキャッチ画像を非表示にする方法

をご紹介します。

この記事でわかること
  • SWELLで特定のカスタム投稿タイプでのみアイキャッチ画像を非表示にする方法
  • SWELLで投稿ページや固定ページでのみアイキャッチ画像を非表示にする方法
  • SWELLで個別ページのアイキャッチ画像を非表示にする方法

この記事でご紹介する方法ではfunctions.phpを編集します。
作業の際は必ずバックアップをお取りいただき、自己責任のもとで作業を行ってください。

※SWELLでfunctions.phpを編集する方法がご不明な方はこちらをご覧ください(本ページ内の説明箇所に移動します)

目次

Web制作を仕事にしたいなら

こちらの記事で

Web制作コース独学プラン

についてご紹介しています。

 ̄ ̄ ̄

「仕事が忙しい」、「すぐに欲しい商品がある」という方、必見のサービス

 Amazon Prime 

by Amazon

日時指定便が「無料」で使えるので不在で商品を受け取れないという心配が無くなる

最短で注文した「翌日」に商品が届くので欲しいものがすぐ手に入る 
※ご注文の時間帯やお住まいの地域によります。

Amazonプライムの無料体験は「何度でも」利用可能

Amazonプライムの無料体験を何度も利用する方法

  • Amazonのカート画面で表示される「Amazon Primeの無料体験の案内」をクリック
  • 会員の自動更新を解除しておく=期限が来たら自動解約
  • 1~3ヶ月ぐらいするとAmazonのカート画面再度無料体験の案内が表示される

商品をカートに入れ、カート画面に行ったときに「無料体験の案内」が表示されていれば
1ヶ月間の無料体験を受け取ることが可能です。

ケケンタ

僕自身、過去に少なくとも3回は無料体験を利用しています。

※条件は不明ですが、解約後に一定期間が経過すると、再び「Amazon Prime無料体験の案内」が表示され、再度利用することが可能です。

特定のカスタム投稿タイプでアイキャッチ画像を非表示にする

まずは「特定のカスタム投稿タイプでアイキャッチ画像を非表示にする方法」ですが、以下のソースコードをfunctions.phpに追加します。

functions.phpに追加するソースコード

add_filter( 'swell_parts_post_thumbnail', function( $html, $post_id, $is_youtube ) {
    
    // 特定のカスタム投稿タイプのアイキャッチ画像を非表示にする
    if ( get_post_type( $post_id ) === 'カスタム投稿タイプのスラッグ' ) {
        return '';
    }

    // それ以外の場合は通常通りアイキャッチ画像を表示
    return $html;
}, 10, 3 );

4行目の「カスタム投稿タイプのスラッグ」には文字通りカスタム投稿タイプのスラッグを記述します。

実際の使用例

add_filter( 'swell_parts_post_thumbnail', function( $html, $post_id, $is_youtube ) {
    
    // 投稿タイプ「sample_post_type」の場合、アイキャッチ画像を非表示にする
    if ( get_post_type( $post_id ) === 'sample_post_type' ) {
        return '';
    }

    // それ以外の場合は通常通りアイキャッチ画像を表示
    return $html;
}, 10, 3 );
ケケンタ

たったこれだけの記述で「特定のカスタム投稿タイプ」でアイキャッチ画像を非表示にすることが可能です。

SWELLでfunctions.phpを編集する方法はこちら(本ページ内の説明箇所に移動します)

投稿ページや固定ページでアイキャッチ画像を非表示にする

WordPressには様々な「ページ判定ができるテンプレートタグ」が用意されており、その中には

  • 投稿ページ
  • 固定ページ

を判定できるものもあります。

それらを利用することで、先ほどと同様にアイキャッチ画像を好きなページで非表示にすることが可能です。

具体例(投稿ページでアイキャッチ画像を非表示)

add_filter( 'swell_parts_post_thumbnail', function( $html, $post_id, $is_youtube ) {
    
    // 投稿ページの場合、アイキャッチ画像を非表示にする
    if ( is_single() ) {
        return '';
    }

    // それ以外の場合は通常通りアイキャッチ画像を表示
    return $html;
}, 10, 3 );

具体例(固定ページでアイキャッチ画像を非表示)

add_filter( 'swell_parts_post_thumbnail', function( $html, $post_id, $is_youtube ) {
    
    // 固定ページの場合、アイキャッチ画像を非表示にする
    if ( is_page() ) {
        return '';
    }

    // それ以外の場合は通常通りアイキャッチ画像を表示
    return $html;
}, 10, 3 );

個別ページを指定したい場合(カスタム投稿タイプかどうかに関係なく)

また、もしも「個別ページを指定したい」という場合には以下のソースコードで同様にアイキャッチ画像の出力を制御することが可能です。

add_filter( 'swell_parts_post_thumbnail', function( $html, $post_id, $is_youtube ) {
    
    // 特定のページのアイキャッチ画像を非表示にする
	global $post;
  	$slug = $post->post_name;
    if ( $slug === 'アイキャッチ画像を非表示にしたいページのスラッグ' ) {
        return '';
    }

    // それ以外の場合は通常通りアイキャッチ画像を表示
    return $html;
}, 10, 3 );

4行目の「カスタム投稿タイプのスラッグ」にはアイキャッチ画像を非表示にしたいページのスラッグを記述します。

実際の使用例

add_filter( 'swell_parts_post_thumbnail', function( $html, $post_id, $is_youtube ) {
    
    // スラッグが「sample_post」のページのアイキャッチ画像を非表示にする
	global $post;
  	$slug = $post->post_name;
    if ( $slug === 'sample_post' ) {
        return '';
    }

    // それ以外の場合は通常通りアイキャッチ画像を表示
    return $html;
}, 10, 3 );

SWELLの子テーマのfunctions.phpにソースコードを追加する方法

まずは管理画面の「外観」→「テーマファイルエディタ」をクリックします。

外観→テーマファイルエディタ

すると以下のような画面が表示されるので、右側にある「Theme Functions(functions.php)」をクリックします。

SWELLで外観→テーマファイルエディタをクリックした直後の様子

このとき、念のため右上の「編集するテーマを選択」が「SWELL CHILD」になっていることをご確認下さい。
※もしなっていなければ、「SWELL CHILD」を選び、「選択」ボタンをクリックして下さい。

続いて、エディタの末尾にソースコードを追加します。

SWELLでのfunctions.phpの編集個所
ケケンタ

ソースコードを追加したら、最後に画面左下の「ファイルを更新」をクリックして完了です。

SWELLには様々なフィルター・アクションフックが用意されている

ケケンタ

以上が特定の投稿タイプや特定のページでのみアイキャッチ画像を非表示にする方法でした!

実はSWELLには独自のフィルターフックやアクションフックが用意されています。

フィルターフックやアクションフックについて

WordPress独自の機能のひとつで、フックに対して処理を登録することが可能
今回はアイキャッチ画像を表示するためのフック(swell_parts_post_thumbnail)に対して「コードを上書きする記述」を登録し、特定ページでアイキャッチ画像が表示されなくなるようにしました。

元々カスタマイズ性に優れているSWELLですが、こうしたフックを利用することでさらにできることの幅が広がります。

この記事をご覧になった方も、もしご興味があればご自身でSWELLの各フックについて調べてみるのもおもしろいかもしれません。

ケケンタ

この記事がお役に立ったなら何よりです!
最後までご覧いただきありがとうございました!

SWELLのその他の記事はこちら

SWELL記事一覧

今回ご紹介した内容のテーマ

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

コメント

コメントする

CAPTCHA


目次