副業で稼ぐ仕組みの作り方

【WordPress】lightning proでカスタムフィールドを表示させる

投稿日:2020年3月14日 更新日:

lightning proと言うWordpressの有料テーマがありカスタムフィールドを表示させてみました。

はじめに

今までWordpressのテーマ修正やカスタマイズ、作成など色々としてきましたが初めて躓きました。
今回は非常に勉強になった事もたくさんあるのでご依頼者様に感謝です。

注意事項

私が修正依頼を受けたのは
Theme Name: lightning pro
Version:3.2.2
です。
Version違いだと収納場所などが違う場合があります。

Lightning Proの投稿一覧ページに表示させる

カスタマイズ前

カスタマイズ後

lightning proと言うWordpressの有料テーマの投稿一覧ページの場合、カスタムフィールドを表示させるカスタマイズ方法は以下の通りとなります。

/wp-content/themes/lightning-pro/inc/media-posts/package/views/class-loop-post-view.php

日付を取得しているのはこのコード

87行目辺り

$media_post_item .= '<span class="published media_post_date">' . esc_html( get_the_date() ) . '</span>';

非表示させたい場合は

//$media_post_item .= '<span class="published media_post_date">' . esc_html( get_the_date() ) . '</span>';

コードの最初に「//」と入れると非表示にする事が出来ます。

カスタムフィールドの値を表示させる

global $wp_query;
$postID = $wp_query->post->ID;
$media_post_item .= get_post_meta($postID, 'カスタムフィールド名', true);

このコードを好きな場所(日付コードの下など)に入力すると表示されます。

金額などの数字のみの場合

global $wp_query;
$postID = $wp_query->post->ID;
$value = get_post_meta( get_the_ID(), 'カスタムフィールド名', true );
if( $value ){
$value = number_format($value);
$media_post_item .= $value.'円';
}

こういった形にすると、カスタムフィールドには

10000

と入力しても

10,000

と表示されるので見やすくなります。

複数表示させる場合

global $wp_query;
$postID = $wp_query->post->ID;			
$media_post_item .= get_post_meta($postID, 'カスタムフィールド名1', true);
$media_post_item .= get_post_meta($postID, 'カスタムフィールド名2', true);
$media_post_item .= get_post_meta($postID, 'カスタムフィールド名3', true);

これで複数のカスタムフィールドを取得、そして表示が可能となります。

Lightning Proの投稿詳細ページに表示させる

カスタマイズ前

カスタマイズ後

lightning proと言うWordpressの有料テーマの投稿詳細ページの場合、カスタムフィールドを表示させるカスタマイズ方法は以下の通りとなります。

/wp-content/themes/lightning-pro/functions.php

カスタムフィールドの値を挿入させる

function my_add_field( $content ){
if( is_single() ){

$value = get_post_meta( get_the_ID(), 'カスタムフィールド名', true );
if( $value ){
$content .= $value;
}
}
return $content;
}
add_filter( 'the_content', 'my_add_field' );

こちらで本文の下に表示が可能です。

数字を取得する際

function my_add_field( $content ){
if( is_single() ){
$value = get_post_meta( get_the_ID(), 'カスタムフィールド名', true );
if( $value ){
$value = number_format($value);
$content .= $value;
}
}
return $content;
}
add_filter( 'the_content', 'my_add_field' );

こういった形にすると、カスタムフィールドには

10000

と入力しても

10,000

と表示されるので見やすくなります。

複数取得する場合

function my_add_field( $content ){
if( is_single() ){
// カスタムフィールドの値を取得
$value1 = get_post_meta( get_the_ID(), 'カスタムフィールド名1', true );
$value2 = get_post_meta( get_the_ID(), 'カスタムフィールド名2', true );
$value3 = get_post_meta( get_the_ID(), 'カスタムフィールド名3', true );
if( $value1 && $value2 && $value3 && $value4 ){
// 本文の後にカスタムフィールドの値を追加
$content .= $value1;
$content .= $value2;
$content .= $value3;
}
}
return $content;
}
add_filter( 'the_content', 'my_add_field' );

これで本文の後にカスタムフィールドが複数表示されるようになります。

以上で【Wordpress】lightning proでカスタムフィールドを表示させるの説明を終了致します。

さいごに

lightning proはカスタマイズに向かない

今回lightning proと言うテーマを修正やカスタマイズをさせて頂きましたが、構造上カスタマイズには向かないみたいです。
コミュニティなどを拝見させて頂きましたが、カスタマイズをしている方の投稿も少ないので少し困りました。
ただ、自分自身でコードを入力する予定の無いかたには良いかもしれませんね。

-副業で稼ぐ仕組みの作り方
-, ,

執筆者:


comment

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

関連記事

contact form 7を全ページに表示させ記事と連携させる方法

コンタクトフォーム7を使って記事や固定ページと連携させる方法をご紹介いたします。

SEO対策用文字数カウントを作ってみた

文字数を計算する時にわざわざ計算ボタンを押さなくても自動でカウントしてくれるようなシステムを制作致しました。

ワードプレスでお問い合わせを作る。Contact Form 7

ホームページの制作やブログの制作で必ず必要なのがお問い合わせフォームの設置です。ワードプレスのプラグインには簡単に設定できるContact Form 7がございます。

no image

副業するなら情報を売ろう

もしも、副業をするなら一番お勧めの方法は情報を売る事です。お勧めの理由はPC一台あれば出来ると言うところがポイントです。

もしもドロップシッピングの登録方法

無料でドロップシッピングがはじめられるもしもドロップシッピングの登録方法です。

人気の副業記事(24時間で更新)