のーんびりとWebプログラム: WordPress（ワードプレス）のカスタムフィールドのプラグイン「Advanced Custom Fields」を試してみました。

2012/10/14

WordPress（ワードプレス）のカスタムフィールドのプラグイン「Advanced Custom Fields」を試してみました。

WordPress（ワードプレス）のカスタムフィールドのプラグイン「Advanced Custom Fields」を試してみました。

http://www.advancedcustomfields.com/

Advanced Custom Fieldsがとても使いやすそうだったので、試してみました。WordPress3.4.2をXREAのサーバにインストールしてみます。

インストールを完了して、管理画面にアクセスすると、CSSが効いていませんでした。

下記の記載を見つけました。

管理画面で、CSSが効かない
http://ja.forums.wordpress.org/topic/1927

「XREAでダッシュボードのレイアウトが崩れるのは、
Apacheのmod_layoutが原因のようです。

ダッシュボードのCSSはwp-admin/load-style.phpで動的に生成されるのですが、通常text/cssとして送信される情報が、mod_layoutでtext/htmlとして送信されています。なので、FirefoxではCSSとして扱わないので、表示が崩れているようです。

解決策としては、wp-adminディレクトリの.htaccessに

 <files load-styles.php="load-styles.php">
LayoutIgnoreURI *.php
 </files>

を追加したら正常表示されました。」とあります。

教えていただいた通り、wp-adminの階層に、上記の.htaccessを設置することで正常表示されました。

XREAのサーバでは、上記の　.htaccessに加えて追記しておく必要がある記載があります。

下記のサイトを参考にさせていただきました。
CoreserverでWordPressを使う際のエラー対処

「テーマテンプレートをインストールするときなどに、エラーメッセージ

『ダウンロードに失敗しました。ファイルストリーミングの送り先となるディレクトリが存在しないか、書き込み不可になっています。』

が出ることがあります。

XREAのサーバにて、PHPがセーフモードで動作していることが原因です。

XREAは PHP を CGI モードで動かすことができるので、必要なファイルは CGI モードで動作するようにすることで、PHP のセーフモードの制限を回避します。」とありました。

下記の内容を上記の.htaccessに追記しておきます。

 <files async-upload="async-upload" php="php" plugin-install="plugin-install" plugins="plugins" update-core="update-core" update="update">
AddHandler application/x-httpd-phpcgi .php
 </files>

Advanced Custom Fieldsをインストールします。

Advanced Custom Fieldsのインストールが完了すると、「カスタムフィールド」のメニューが追加されます。

カスタムフィールドの管理画面にて、フィールドグループの「新規追加」ボタンを押します。

試しに、旅行の記録をする専用のフィールドを用意することにします。管理する項目として、旅行先（テキスト）、日付（デイトピッカー）、写真（画像）を追加します。上記のキャプチャーは、それぞれの項目を作成した後のものです。「新規追加」を押すと、項目の詳細を設定する画面が表示されます。

次に、カスタムフィールドの内容を編集画面でのどの位置に表示するかの設定をします。投稿のカテゴリーに新規のカテゴリー「旅行記録」を作成して、その「旅行記録」カテゴリーを選択した時に、作成したカスタムフィールドの内容が表示されるようにします。

フィールドの設定が完了したら、「更新」ボタンを押して、反映をします。

編集画面での動作を確認します。

通常の投稿画面を表示して、新たに作成したカテゴリー「旅行記録」をチェックします。

旅行記録として用意したカスタムフィールドのフォーム要素が表示されます。確認用の投稿をしてみます。

必要な情報を記載、画像添付をして、公開します。但し、ブログに表示する用の記載をしていないため、公開されているページには、どこにもカスタムフィールドの内容は記載されていません。

表示用の記載を追記します。

テーマはデフォルトの「Twenty Eleven 」です。投稿記事にカスタムフィールドの内容を表示するようにしたので、表示用の記載を追記するファイルは、content-single.php　になります。

content-single.php　に下記の内容を追記します。

  <?= "旅行の行き先"; ?>
  <?php the_field('travel_destination',$post->ID); ?>

  <?= "旅行に行った日"; ?>
  <?php the_field('travel_date',$post->ID); ?>
   
  <?php if( get_field('travel_picture') ):?>
  <img src=" <?php the_field('travel_picture'); ?>" alt="" />
  <?php endif; ?>

表示を確認します。