ワードプレス納品時クライアント用管理画面の設定 | 福岡のホームページ制作はマリオ君にお任せ

為にならないブログ

見出しおじさん

BLOG

ワードプレス納品時クライアント用管理画面の設定

2023年08月21日

ワードプレス納品時クライアント用管理画面の設定

本日は一応Web制作会社であるマリオ君がお客様へワードプレスを納品するときにしている設定をご説明させていただきたいと思います。

基本的にホームページの管理はマリオ君に依頼していただいておりますので、お客様には投稿に専念していただけるよう、余計な情報を削除した状態でお渡ししております。

こんな方に向いている記事

  • 納品時どのようにしてるか気になる
  • 一応みてやるか
  • 記事は若干いい加減でもいい
  • 少しでも為になれば

下記5項目で説明していきます。

  • ログイン画面カスタマイズ
  • ユーザーの新規作成
  • 使わないメニューの削除
  • ヘッダーを整理
  • 投稿しやすくカスタマズ

ログイン画面カスタマイズ

ログイン画面変更前

まずはログイン画面です。

ワードプレスのデフォルトの管理画面はWのロゴが大きく入っています。業界内では一番有名なワードプレスですが、お客様からしたら何のことかわからないし、「Wって何って?」なりますので、オリジナルのロゴに変更いたします。

また、ロゴをクリックした際、デフォルトはワードプレスのサイトにリンクされていますので、こちらも、お客様がクリックした際、「何のサイト?」ってなっちゃいますので、自社サイトへのリンクに変更します。

あとは管理画面のファビコンをオリジナルにして、使わない言語切り替えを消します。

ファビコンをオリジナルに

お客様しか見ないし、SEOにも関係ありませんが、こだわりとして、管理画面のファビコンもオリジナルに設定して納品しております。

管理画面のファビコンをオリジナルにする方法は下記に詳しく書いておりますの設定方法が気になる方は下記記事をご覧ください。

Wのロゴをオリジナルに変更

ログイン画面のWのロゴをオリジナルに変更する方法はfunctions.phpに下記をコピーして、オリジナルのロゴをアップロードして簡単に変更できます。

///////////////////////////////ログイン画面カスタマイズのロゴ変更
//サイズは326x82
function my_custom_login_logo() {
  echo '<style type="text/css">
h1 a { background-image:url('.get_bloginfo('template_directory').'/img/login_logo.png) !important; width:320px !important; height:82px !important; background-size: 320px 82px !important; }     </style>';
}
 add_action('login_head', 'my_custom_login_logo');
///////////////////////////////ログイン画面カスタマイズのロゴ変更

変更する場所は5行目の/img/login_logo.pngの部分です。
こちらは環境にあったパスに変更とお好きなファイル名に変更してください。
上記の場合はimgフォルダの中に320×82のサイズで制作したlogin_logo.pngを格納しています。

Wのロゴをクリックした先を自社サイトに変更

こちらも下記をfunctions.phpにコピぺで簡単に変更できます。

///////////////////////////////ログイン画面のロゴからのリンク自社サイトへ
function custom_login_logo_url() {
	return get_bloginfo( 'url' );
}
add_filter( 'login_headerurl', 'custom_login_logo_url' );
///////////////////////////////ログイン画面のロゴからのリンク自社サイトへ
言語切り替えを削除

言語切り替えも下記をfunctions.phpにコピぺで簡単に消すことができます。

///////////////////////////////ログイン言語切り替え消す
add_filter('login_display_language_dropdown', '__return_false');
///////////////////////////////ログイン言語切り替え消す

以上がログイン画面の設定です。上記をすべて設定するとこんな感じになります。

ログイン画面オリジナルに変更

ユーザーの新規作成

お客様に納品するときはメインのログインパスワードはお渡しせずに、編集者もしくは投稿者でユーザーを追加してお渡ししております。
ユーザには権限がそれぞれ付与されており、ユーザーによってできることが変わってきます。

編集者と投稿者の使い分けはお客様が複数で投稿されるか、管理者を設けるかで使い分けております。
複数で投稿される場合は、責任者を決めていただき、その方に編集者のログイン情報をお渡しし、その他の方に投稿者のログイン情報をお渡ししていただいております。

大きな違いは編集者は、他者が書いた記事を編集・削除できますが。投稿者は自分の書いた記事のみ編集することしかできません。

こちらは、クライアント様との打ち合わせの上で設定するといいと思います。

ユーザーの追加方法はとても簡単で、ワードプレス管理画面のユーザから新規追加で必要項目を入力し、権限グループを選ぶだけで簡単に作成することがきます。

新規ユーザー追加方法

使わないメニューの削除

必要のないメニュー

ユーザーの権限を編集者でお客様に渡してもまだ必要のない項目が表示されています。
ダッシュボード・メディア・固定ぺージなどなど消す必要があります。
ワードプレスの管理画面左側のメニューはfunctions.phpで簡単に削除?非表示にすることができますので、お客様に必要のないメニューを消していきます。

/////////////////////////// 管理者別にメニューを非表示にする

//管理者 - administrator
//編集者 - editor
//投稿者 - author
//寄稿者 - contributor
//購読者 - subscriber

function remove_menus () {
 if (!current_user_can('administrator')) { //管理者以下の場合は下記を非表示
 remove_menu_page('edit.php?post_type=mw-wp-form'); //mw-wp-formを非表示
 //remove_menu_page('edit.php?post_type=works'); //カスタム投稿の場合は=の後に消したいカスタム投稿のスラッグ
 //remove_menu_page('wpcf7'); //Contact Form 7
 global $menu;
 unset($menu[2]); // ダッシュボード
 unset($menu[4]); // メニューの線1
 //unset($menu[5]); // 投稿
 unset($menu[10]); // メディア
 unset($menu[15]); // リンク
 unset($menu[20]); // 固定ぺージ
 unset($menu[25]); // コメント
 unset($menu[59]); // メニューの線2
 unset($menu[60]); // テーマ
 unset($menu[65]); // プラグイン
 unset($menu[70]); // プロフィール
 unset($menu[75]); // ツール
 unset($menu[80]); // 設定
 unset($menu[90]); // メニューの線3
 }
 }
add_action('admin_menu', 'remove_menus');
/////////////////////////// 管理者別にメニューを非表示にする

上記をfunctions.phpにコピーで消すことができます。
カスタム投稿を削除したい場合は現在非表示にしてある12行目の部分の=(イコール)の後の部分を消したいカスタム投稿のスラッグをいれれば消すことができます。
10行目で権限を指定しています。権限の指定方法は3~7行目の英字部分をいれることで指定できます。

上記をコピーした後に編集者等でログインした後のメニューはこんな感じです。

メニューがすっきり

制作実績と最新情報はカスタムポストタイプで制作するときに、ラベルで設定しているので、何に使うかすでにわかりやすくなっていますが、投稿は少しわかりずらいですね。

今回の例ではマリオ君は投稿をブログで使用しているので、投稿の文字列をブログに変更します。
変更方法は下記をfunctions.phpに貼り付けてお好きな文字に変更してください。

/////////////////////////// 投稿を任意の文字列に変更
//左メニューの投稿を変更
function change_post_menu_label() {
 global $menu;
 global $submenu;
 $name = 'ブログ';
 $menu[5][0] = $name;
 $submenu['edit.php'][5][0] = $name.'一覧';
 $submenu['edit.php'][10][0] = $name.'新規作成';
}
add_action( 'admin_menu', 'change_post_menu_label' );
//投稿画面メニュー投稿を変更
function Change_objectlabel() {
  global $wp_post_types;
  $name = 'ブログ';
  $labels = &$wp_post_types['post']->labels;
  $labels->name = $name;
  $labels->singular_name = $name;
  $labels->add_new = _x('追加', $name);
  $labels->add_new_item = $name.'の新規追加';
  $labels->edit_item = $name.'の編集';
  $labels->new_item = '新規'.$name;
  $labels->view_item = $name.'を表示';
  $labels->search_items = $name.'を検索';
  $labels->not_found = $name.'が見つかりませんでした';
  $labels->not_found_in_trash = 'ゴミ箱に'.$name.'は見つかりませんでした';
}
add_action( 'init', 'Change_objectlabel' );
//ページ上部+新規の中の投稿を変更
function rename_admin_bar_menus($wp_admin_bar) {
  $name = 'ブログ';
  $new_post_node = $wp_admin_bar->get_node('new-post');
  $new_post_node->title = $name;
  $wp_admin_bar->add_node($new_post_node);
}
add_action('admin_bar_menu', 'rename_admin_bar_menus', 75);

///////////////////////////  投稿を任意の文字列に変更

変更するところは基本的に5行目と14行目と31行目のみでよいかと思います。もう少し細かく設定したい場合は7行目8行目の文字を変更したり変数の$nameの場所を移動したりしてみてください。

こちらの設定でこんな感じに。
よりわかりやすくなりました。

ヘッダーを整理

まだぺージ上部の黒のバーの部分にお客様に必要のないものがあります。
+新規の部分には先ほど消したメディアや固定ぺージなどの項目が残っています。

このままでは、何かのタイミングでお客様がさわって「これ何?」て必ずお問い合わせがきますのでこちらも削除したいと思います。左端のワードプレスのロゴやコメントや右端のこんにちは〇〇さんの部分も消します。
こちらもfunctions.phpにコピーで簡単に消すことができます。

///////////////////////////ログイン時の上のバーの中身けす
function remove_admin_bar_menus( $wp_admin_bar ) {
if (!current_user_can('administrator')) { //管理者以下の場合は下記を非表示
$wp_admin_bar->remove_menu( 'wp-logo' ); //ロゴ
$wp_admin_bar->remove_menu( 'comments' ); //コメント
$wp_admin_bar->remove_menu( 'new-content' ); //新規
$wp_admin_bar->remove_menu( 'customize' ); //カスタマイズ
$wp_admin_bar->remove_menu( 'my-account' ); //こんにちは、[ユーザー名]さん 
}
}
add_action( 'admin_bar_menu', 'remove_admin_bar_menus', 999 );
///////////////////////////ログイン時の上のバーの中身けす

こちらをいれるとこんな感じになります。

ページ上部がすっきり

凄くすっきりしました。これで間違ってクリックされる心配がなくなりました。

しかし一つ問題があります。

右端にあった、こんにちは〇〇さんを消してしまったので、ログアウトがなくなってしまったので、ログアウトを追加したいと思います。
functions.phpに下記を追加

///////////////////////////管理画面上部にログアウト追加
function logout_link() {
global $wp_admin_bar;
$wp_admin_bar->add_menu(array(
	'id' => 'logout_link',
	'title' => __('ログアウト'),
	'href' => wp_logout_url()
	));
}
add_action('wp_before_admin_bar_render', 'logout_link');
///////////////////////////管理画面上部にログアウト追加

上記をコピペでログアウトボタンが出てきます。

ログアウトボタン復活

こちらは、正直かなり苦戦した思い出があります。

もともとは、こんにちは〇〇さんについているプロフィールへのリンクをとりたかったのですが、リンクの変更・削除方法がわからず、こんにちは〇〇さんを消してしまうとログアウトも消えてしまうしどうしようかと苦戦した記憶があります。

ログアウトボタンを追加する発想にたどり着くまでかなりの時間を使ったと思います。

さて以上で管理画面はかなりきれいになりました。

次はページ下部のWordPress のご利用ありがとうございますを消します。
こちらもワードプレスへのリンクが付いていますので、クリックした際にお客様から
「これ何?」って来ないように消しておきます。

WordPress のご利用ありがとうございます削除

functions.phpに下記をコピー

///////////////////////////【管理画面】WordPress のご利用ありがとうございます。を削除 
add_filter('admin_footer_text', 'custom_admin_footer');
  function custom_admin_footer() {
}
///////////////////////////【管理画面】WordPress のご利用ありがとうございます。を削除

こちらで消えました。

次に右上部にある表示オプションとヘルプを消します。

表示オプション・ヘルプを消す

こちらもfunctions.phpに下記をコピーします。

/////////////////////////// 管理画面の表示オプション・ヘルプ非表示に
function my_admin_head(){
if (!current_user_can('administrator')) {
echo '<style type="text/css">#contextual-help-link-wrap,#screen-options-link-wrap{display:none;}</style>';
}
}
add_action('admin_head', 'my_admin_head');
/////////////////////////// 管理画面の表示オプション・ヘルプ非表示に

こちらで表示上でほぼお客様が触った疑問がわくものは消せました。

最後にあと一つ

ダッシュボードは先ほど消したのですが、ログインした時のみダッシュボードの中身が表示されて、ワードプレスのニュースやイベントが表示されてしまいます。こちらも消していきます。

こちらもfunctions.phpに下記をコピーします。

/////////////////////////////ダッシュボードにある項目を消す
function remove_dashboard_widget() {
	 if (!current_user_can('administrator')) { 
  remove_meta_box( 'dashboard_right_now', 'dashboard', 'normal' ); //概要
  //remove_meta_box( 'dashboard_activity', 'dashboard', 'normal' ); //アクティビティ
  remove_meta_box( 'dashboard_quick_press', 'dashboard', 'side' ); //クイックドラフト
  remove_meta_box( 'dashboard_primary', 'dashboard', 'side' ); //WordPressイベントとニュース
	 }
}
add_action('wp_dashboard_setup', 'remove_dashboard_widget' );
/////////////////////////////ダッシュボードにある項目を消す

何もないと寂しいので、アクティビティのみ残しています。

投稿しやすくカスタマズ

こちらで最後になります。
投稿しやすく投稿画面をカスタマイズします。
マリオ君は基本的にブログはフリースペースでブロックを使っていただいて投稿してもらい、施工事例や施術事例などは、カスタムフィールドを使用して、枠組みを事前にうち合わせで作って、枠の中に必要な情報を入れていただくようにしています。

投稿のフォーマットを決めることで、投稿を促進し更新のストレスを軽減することができます。

アドバンスカスタムフィールドを使い、投稿しやすくする方法は下記に詳しく書いておりますので、気になる方はご覧ください。

その他にはブロックに線をいれて、段落をわかりやすくしております。
ブロックに線を入れる方法は下記をご覧ください。

また、h3~h4までにCSSで見出しの設定をして、自動的に装飾が付くように設定して納品しております。

ブロックパターンもご要望があれば設定しておりますが、あまりできることを増やしすぎると、初めはいいのですがだんだん更新するのが難しくなるので、シンプルにして更新してもらうことに重きをおいた設定にしております。

以上になります。

いかがでしたでしょうか。一応Web制作会社のマリオ君がお客様にワードプレスを納品するときの設定をご紹介させていただきました。

余計な情報が入らないようシンプルにすることで、投稿に専念していただく仕様となっています。

少しでも参考になれば幸いです。

ここがチェケラ

ポイントです

POINT

疑問になりそうなところはすべて消してシンプルに

それではまた。

カテゴリー

気になったら
連絡してね!

すいません

お電話は出れないことが多いので
ラインでもしもし・メールでもしもしが推奨です。

お時間をとらせていただきゆっくり
お電話させていただきます。

©Copy Rights MARIOKUN.All Rights Resarved.
Page Top
お問い合わせ

どうぞおじさん

作業中はお電話は出れないことが多いのでライン・メールでもしもしが推奨です。

お電話は出れないことが多いの折り返し致します。