お客さんに納品時便利なプラグイン(WordPress)「教えてマリオ」

マリオデザイン

マリオデザインスタッフブログ「教えてマリオ」

ホーム>>教えてマリオトップ>>お客さんに納品時便利なプラグイン(WordPress)

このブログはマリオデザインアルバイトスタッフがこれからWEbを勉強してみたいと思われている方や会社でホームページの更新業務を担当されているがよく意味が分からないという方のために、ホームページ作成の基礎を綴っていくものです。 難しい言葉を使わず(使えない)噛み砕いた言葉で書いていくので、参考になればと思います。
*勉強中の為、間違った解釈を説明すると思いますので、ご指摘コメントもお待ちしておいります。

お客さんに納品時便利なプラグイン(WordPress)

今回はワードプレスでお客さんに自分で更新してもらうときに便利なプラグインを紹介したいと思います。納品する場合、すこしでもお客さんに使いやすくわかりやすいようにカスタマイズしたいと思います。

目次
  1. Custom Field Templateをつかう
  2. Custom Field Templateで準備したものを表示させる
  3. WPLiteとRole Managerプラグインでより使いやすく
1.Custom Field Templateをつかう

お客さんに更新してもらう際に使うのがカスタムフィールドです。しかしカスタムフィールドを使いこなすのは難しくすこし頭を使わなければいけません。このカスタムフィールドを簡単にしかもお客さんにより使いやすくできるのがプラグインのCustom Field Templateです。はっきりいってめちゃくちゃ便利です。このプラグインは使い方も簡単で、しかも思い通りの場所をお客に修正してもらえるようにできるようになります。

使い方を説明します。

まずプラグインをインストールして有効化します。

すると設定の中にカスタムフィールドテンプレートという項目が追加されます。それをクリックすると下記のような画面が初期値で出てきます。 カスタムフィールドテンプレートの画面



簡単に説明するとこんな感じです。



カスタムフィールドテンプレートの画面説明



初期の段階ですでにテンプレートタイトルとテンプレートコンテントに記述されているので使うときは消して使っていきます。初期値はTEMPLATE#0とTEMPLATE#1の2つが出ていますが2つだけでなく2つ埋めれば自動的に次のTEMPLATE#2が出てきて勝手に増えていくので何個でも使用できます。

ではテンプレートコンテントの書き方を説明します。

書き方は簡単でHTMLで使うフォームタグを少し書き方を変えた感じです。フォームタグがわからない方は以前お問い合わせフォームの作り方で説明しておりますのでそちらをご覧になってください。

では初期値を見て説明します。こんな感じです。

カスタムフィールドテンプレートの画面詳細説明



?がありますがすいません、微妙なところは?をつけています。

では実践風で設定したいと思います。今回は最新情報をお客さんに更新してもらう感じで設定してみたいと思います。

最新情報をお客さんに更新してもらいます。最新情報は画像と文章を毎回入れるとお客さんと打ち合わせで決まったとします。

完成はこんな感じ



完成見本

ではカスタムフィールドテンプレートの設定をします。こんな感じです。


カスタムフィールドテンプレートの設定 上記はカスタム投稿の最新情報(news)(ラベルが最新情報)のときだけカスタムフィールドテンプレートを表示させる設定です。 カスタム投稿の作り方は今回は割愛させてもらいます。

上記で設定は終わりです。カスタム投稿の最新情報をクリックするとこんな感じです。 完成画面


これで設定は完成です。これならお客さんも迷わず簡単に更新できると思います。 しかしまだ要らない画面が多すぎるのでもっとお客さんが使いやすくする方法を後述します。


2.Custom Field Templateで準備したものを表示させる

次はお客さんに投稿してもらったものを表示させたいと思います。

表示させる方法は次のとおりです。

画像以外の場合は

<?PHP echo get_post_meta($post->ID,"ここに[ ]で囲った任意の名前",true);?>

で表示されます。 簡単ですね。

次は画像の場合です。表示方法は色々あるみたいですが、今回は下記の方法を説明します。

まず任意の変数に画像のパスを入れます。

<?PHP $news_image = wp_get_attachment_image_src( get_post_meta($post->ID, ‘ここに[ ]で囲った任意の名前’, true),’full’ ); ?>

次にIMGのsrc=に上記変数をechoで出力させればOKです。

<img src="<?PHP echo $news_image [0]; ?>" width="250" height="250"/>

で表示されます。

では今回の場合で説明するとCSSでフロートを命令したleftに画像を表示させrightに文章を表示させます。こんな感じです

<div id="left">

<?PHP $news_image = wp_get_attachment_image_src( get_post_meta($post->ID, ‘最新情報の画像を選択してください’, true),’full’ ); ?>

<img src="<?PHP echo $news_image [0]; ?>" width="250" height="250"/>

</div >

<div id="right">

<?PHP echo get_post_meta($post->ID,"最新情報の文章を記入してください",true);?>

</div >

上記で完成です。見ずらくてすいません。


3.WPLiteとRole Managerプラグインでより使いやすく

最後によりお客さんにストレスを感じさせないプラグインを紹介します。今回は使い方は割愛させていただきます。

まずはWPLiteです。このプラグインは管理画面の使わないものを非表示にするプラグインです。お客さんに外観やユーザーやツールなど使わないものを非表示にできます。ひとつ注意点ですがダッシュボードを非表示にするとエラーが出ますので気おつけてください。

そして最後にRole Managerです。このプラグインはユーザーごとにできることを細かく制限できるプラグインです。間違って消したりしないように設定できます。



以上で今回の投稿を終わりにしたいと思います。何かほかによいプラグインをご存知の方がいらっしゃったらご教授ください。


このエントリーをはてなブックマークに追加

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

TRACKBACK_URL