About

WordPressの管理画面をカスタマイズしよう!

Share on FriendFeed
[`tweetmeme` not found]

最近趣味で「コミサ」というwebサイトを作ったのですが、これが会員サイトのため、一般の人にWordpressの管理画面がすごい使いにくいという事態に陥りました。
そこで、一般の人に使いやすい管理画面にすべくいろいろ?やったのでまとめました。

まずはサイドバーを消そう

WordPressの左側にはこんな感じのナビゲーションバーがありますが、これがややこしい!ということで消しましょう。
最初は項目を減らしていたのですが、自作メニュー(下記記述)を作ったほうがいいということになりました。

消し方

CSS先輩の出番です。


#wphead,
#adminmenuback,
#adminmenu,
#contextual-help-link-wrap,
#screen-options-link-wrap{
	display:none;
}	

これを書くと見事に消えてくれます。

オリジナルメニュー

左のメニューを消したことにより、今度は「じゃあどうやって投稿するの?」という問題が起こります。

それを解決するのがオリジナルメニューです。
出す方法は「adminmenu」という関数をフックします。

名称未設定-2

簡単に言うと、独自メニューのHTMLを「include TEMPLATEPATH . ‘/libs/admin-header-menu.php’;」のadmin-header-menu.phpというファイルに記述して、それを管理画面に読み込むという処理をします。

以下をfunctions.phpに追加します。
この記述で、オリジナルメニューを追加する・オリジナルメニューのHTML(admin-header-menu.php)を読み込むという処理をしています。

//独自メニューを追加
function original_header_menu_output(){
	echo'</ul></div>';
include TEMPLATEPATH . '/libs/admin-header-menu.php';
	echo'<div><ul>';
}
add_action('adminmenu','original_header_menu_output');

以下を「admin-header-menu.php」などと名前を付けたファイルに記述します。
これは本当に何でもいいです。

<div class="userCustom">
<div class="icon-index icon32"><br></div>
<h2>メニュー</h2>

<ul id="useradmin_menu" class="cf">
	<li><a href="/wp-admin/"><img src="/wp-content/themes/comisa/images/admin/img_home_off.png" width="89" height="78" alt="ホーム" /></a></li>
   	<li><a href="/wp-admin/post-new.php?post_type=webmanga"><img src="/wp-content/themes/comisa/images/admin/img_post_off.png" width="89" height="78" alt="Web漫画" /></a></li>
   	<li><a href="/wp-admin/edit.php?post_type=webmanga"><img src="/wp-content/themes/comisa/images/admin/img_ediaall_off.png" width="89" height="78" alt="記事一覧" /></a></li>
   	<li><a href="/wp-admin/admin.php?page=hepl"><img src="/wp-content/themes/comisa/images/admin/img_help_off.png" width="89" height="78" alt="ヘルプ" /></a></li>
</ul>
</div>	

HTMLを記述したら、CSSを記述して見た目を整えてください。

オリジナルページを作成する

下記の画像はヘルプというページを見ている様子です。
通常Wordpressにはこのようなページはありません。

ではどのように追加したのでしょうか、気になりますよね?

名称未設定-2_04

admin_menuをフックします

フックの仕組みはおいておいて、下記の記述をfunctions.phpに記述します。
そして、ヘルプページの中身をhelp.phpに記述して保存してください。

これだけで、管理画面にヘルプというコンテンツが追加されます。

先ほどサイドバーを消してしまったので表示はされませんが、URLは存在しますので、先ほど作ったオリジナルメニューのリンクに指定してあげます。
おそらくURLは「/wp-admin/admin.php?page=hepl」だと思います。

page=helpのhelpは「add_menu_page(‘ヘルプ’, ‘ヘルプ’,0, ‘hepl’, ‘create_custom_menu_page’, ”, 50);」のhelpなので、ここを変更してURLを自由に変更できます。

//ヘルプページ作成
// admin_menu にフック
add_action('admin_menu', 'register_custom_menu_page');
function register_custom_menu_page() {
    // add_menu_page でカスタムメニューを追加
    add_menu_page('ヘルプ', 'ヘルプ',0, 'hepl', 'create_custom_menu_page', '', 50);
}
function create_custom_menu_page() {
    // カスタムメニューページを読み込む
    require TEMPLATEPATH.'/libs/help.php';
}	

CSSの記述場所

先ほどからCSSを書いてください、とあったのですが、記述場所を紹介していませんでした。
記述場所はまず、functions.phpに以下の記述を書いて、管理画面用のCSSをインクルードするようにします。

この記述をすることで、パスのCSSを官吏画面だけに読み込むようにできます。

function wp_custom_useradmin_css() {
global $current_user; get_currentuserinfo(); 
	echo "\n" . '<link rel="stylesheet" type="text/css" href="' .get_bloginfo('template_directory'). '/styles/custom-useradmin-css.css' . '" />' . "\n";
}
add_action('admin_head', 'wp_custom_useradmin_css', 100);	

あとは、「/styles/custom-useradmin-css.css」に管理画面用のCSSを書くだけです。

ざっくり書いたのでわかりにくいかもしれませんが、コメントなどいただければ追記するかもしれません。
ではー!

関連記事

no image

WordPressのアイキャッチのサイズを追加しても変更されないのは大体再生成すれば直る件

functions.phpでアイキャッチのサイズを変更する方法といえば...

記事を読む

bbpressのトピックスURLがループ内ですべて同じになってしまう場合の解消法

こんにちは。 今日はWordpressのプラグイン、bbpressの...

記事を読む

no image

げっ「WP SyntaxHighlighter」が動かない!思ったらプラグインを見直そう

結論から言うとこの2つのプラグインが干渉していたかもしれません。 ...

記事を読む

no image

WPの投稿ステータスをデフォルトで「非公開」にするイケてるプラグイン

そのまんまです。はい。リンク先見てもらえたらいいと思います。 まぁお...

記事を読む

新着記事

no image

WordPressのアイキャッチのサイズを追加しても変更されないのは大体再生成すれば直る件

functions.phpでアイキャッチのサイズを変更する方法といえば...

記事を読む

bbpressのトピックスURLがループ内ですべて同じになってしまう場合の解消法

こんにちは。 今日はWordpressのプラグイン、bbpressの...

記事を読む

無料でデータベースも使えるサーバを紹介します!

最近趣味でサイトを運営したいなーと思った際に、このドメイン(ousia...

記事を読む

no image

YouTubeの動画をサイトに埋め込むと重い!という人のための解決方法

件名のとおりなのですが、ブログやサイトにyoutubeの動画を埋め込む...

記事を読む

コメント/トラックバック

トラックバック用URL:

コメントフィード




管理人にのみ公開されます

no image
WordPressのアイキャッチのサイズを追加しても変更されないのは大体再生成すれば直る件

functions.phpでアイキャッチのサイズを変更する方法といえば...

bbpressのトピックスURLがループ内ですべて同じになってしまう場合の解消法

こんにちは。 今日はWordpressのプラグイン、bbpressの...

WordPressの管理画面をカスタマイズしよう!

最近趣味で「コミサ」というwebサイトを作ったのですが、これが会員サイ...

無料でデータベースも使えるサーバを紹介します!

最近趣味でサイトを運営したいなーと思った際に、このドメイン(ousia...

no image
YouTubeの動画をサイトに埋め込むと重い!という人のための解決方法

件名のとおりなのですが、ブログやサイトにyoutubeの動画を埋め込む...

→もっと見る

PAGE TOP ↑