Booking関連TablePress関連WordPressのSEO対策WordPressのPHPMenuSidebarPrevNextSearchホーム>WordPressのPHPカスタムフィールドを出力する方法(テキスト・画像・ファイル)カスタムフィールドを出力するにはPHPのコードを記述する必要があります。Fieldsプラグインで作成した定番のカスタムフィールドを画面に表示する例で説明します。具体的には3種類のカスタムフィールドを取り上げます。ファイルをアップロードするフィールド表示イメージは次のようになります。イベント情報の記事の中で3種類のカスタムフィールドを使っています。Fieldsプラグインを使って次のようなカスタムフィールドを準備しました。作成したカスタムフィールド(テキスト・画像・ファイル)それぞれのフィールドの用途は次のとおりです。投稿の編集画面では次のように入力したりファイルをアップロードします。Fieldsプラグインで作成したカスタムフィールドを画面に表示するにはthe_fieldという命令を使って次のように記述する方法があります。?>「カスタムフィールド名」を実際のカスタムフィールド名に変更します。「event_copy」という名のカスタムフィールド「キャッチコピー」の場合は次のようになります。?>どのテンプレートに入力するのかはテーマによって異なりますが、個別記事であればsingle.phpが定番です。カスタム投稿の場合はsingle-カスタム投稿タイプ.phpが良いかもしれません。これで、カスタムフィールドの内容が画面に表示されます。編集画面で入力したカスタムフィールドと、ブラウザ表示は次のように対応しています。Fieldsプラグインで作成したカスタムフィールドを表示するための命令です。Fieldsプラグインを使わない場合など、他の書き方がいくつかありますが、話が長くなるので説明は省略します。画像フィールドの出力(画像の表示)画像のカスタムフィールドもthe_fieldを使って画面に表示することができます。その前に、画像フィールドでURLを表示する設定になっているか確認しましょう。Fieldsのカスタムフィールドの編集画面を開きます。画像フィールドの設定画面を開く画面を下にスクロールして「返り値」を「画像URL」に設定します。画像フィールドの返り値を「画像URL」に設定を変更した場合は、「更新」ボタンをクリックして設定を完了します。続いて、カスタムフィールドを出力するテンプレートに次のように入力してみましょう。「event_image」は実際のカスタムフィールド名に変更してください。?>これで、画像フィールドの内容(画像のURL)が画面に表示されます。画面フィールドの内容が表示されるここでは、画像URLを表示することが目的ではないのでimgタグを使ってレイアウトします。紛らわしいですが、上記のthe_fieldの1行をimgタグのsrc属性の中に入れるイメージです。?>">これで、画像URLではなく画像が表示されるようになります。URLではなく画像が表示されるファイルフィールドの出力(リンクの表示)ファイルをアップロードするフィールドの場合も上記のテキストフィールドや画像フィールドと同じようにthe_fieldを使うことができます。その前に、画像フィールドと同じように設定を確認しましょう。Fieldsのカスタムフィールド設定画面を開きます。ファイルフィールドの設定画面を開く画面を下にスクロールしてファイルフィールドの「返り値」を「ファイルURL」に設定します。ファイルフィールドの「返り値」を「ファイルURL」に設定を変更した場合は、「更新」ボタンをクリックします。続いて、カスタムフィールドを出力するテンプレートに次のように入力してみましょう。「event_flyer」は実際のカスタムフィールド名に変更してください。?>これで、アップロードしたファイルのURLが表示されます。アップロードしたファイルのURLが表示されるファイルのURLを表示することが目的ではないので、クリックしたらファイル(この例ではPDF)が開くようにリンクとしてレイアウトしましょう。target="_blank">チラシはこちら</a>これで、アップロードしたファイルがリンクとして表示され、クリックするとファイルが開くようになります。アップロードしたファイルへのリンクが表示される3種類のカスタムフィールドのまとめここまでに使った3種類のカスタムフィールドをまとめておきます。the_fieldの表示内容をリンクにレイアウト作成したコードの例は次のようになります。target="_blank">チラシはこちら</a></p>表示結果は次のようになります。Fieldsプラグインで作ったカスタムフィールドの内容を出力することができます。画像フィールドやファイルフィールドのようにそのまま出力しても意味がない項目もあるので、用途に応じてHTMLタグを使ってレイアウトを整える必要があります。この記事ではカスタムフィールドを出力するために最も手軽な方法を紹介しました。他にいくつもの方法があるので、画像フィールドやファイルフィールドは出力がうまくいかないこともあります。コードを簡略化するため、あえて必要な処理を省略した部分もあります。足りない部分の仕上げはWordPress個別サポートで対応いたしますので、よろしければご相談ください。WordPressのPHPカスタムフィールド【電子書籍】WordPress入門テキスト(ホームページの作り方)Lightning+ブロックエディタを使ってホームページを作る手順を説明しています。Unlimited(読み放題)対応です。Pro」の紹介WordPressでお困りのときはご相談を細かい質問からCSSやPHPのカスタマイズ、トラブル対応まで、この記事を書いた西沢直木が対応します。最短で本日中に問題解決できます見積もり無料・料金は終了後の後払いです銀座教室・スカイプ・出張またはメールで対応しますWordPress個別サポートについて詳しくはこちらトラブル解決でお急ぎのときはお急ぎのときはWordPressメールサポートで対応します。2019年11月30日WordPressでホームページを作成する手順を紹介します。WordPress初心者の方でも迷わないようにすべての手順について画面を掲載しています。短時間でホームページのたたき台を作っていきます。「最近、ホームページのアクセスが減ってるかも?」が気になるとき、対策が必要になりますが、どのページのアクセスが減っているのか、増えているのかチェックできた方が効率的に対処できるはずです。「WordPressの表示速度が遅い」とか「ダッシュボードの動きが重苦しい」など、WordPressの高速化でお悩みの方もいるかと思います。遅いサイトは検索順位や集客にも影響するので死活問題です。2019年9月13日ご存じのようにBizVektorがアップデート終了とのことで、新たに使えるテーマを探している方も多いと思います。消費税の増税や各種商品の値上がりが気になる今日この頃ですが、そういえばWordPressを設置しているレンタルサーバーの料金も気になりますよね。...カスタムフィールドの編集にビジュアルエディタを使う方法カスタムフィールドは便利ですが初期設定の入力欄は使いづらいかもしれません。ImagesWordPressでカテゴリーページに別々の画像を表示したいこともあります。ver.7対応)WordPressでホームページを作成する手順を紹介します。