WordPressで更新者が少しでも使いやすい・更新しやすいと感じてくれる管理画面をつくるヒントやカスタマイズ - NxWorld
個人的に普段から対応することが多いものを中心に、更新者（クライアント）が少しでも使いやすい・更新しやすいと感じてくれるようなWordPressの管理画面をつくるためのヒントやカスタマイズを紹介します。 サイト構成や更新者のスキルなどにもよると思うので全部が全部やるべきということでもないですが、紹介しているものをいくつか組み合わせるだけで不要なものはすべて取り除いたシンプルな管理画面にできたり、少し手を加えるだけでもデフォルトに比べて大幅に使いやすくすることも可能です。 管理画面に任意のCSSやJavaScriptを適用する CSSであればフロントのデザインに近い感じで管理画面を装飾したりデフォルトのレイアウトを使いやすい形に調整するなど、JavaScriptであればデフォルトにはない動きをちょっと付けたり逆にデフォルトで実装されている動きを無効化するといったように、管理画面をカスタマイズす
WordPressの使い方：管理画面へのログインとダッシュボード、ブログの表示確認 | WordPressやWebデザインなど紹介 Ocadweb
このページでは以下についてご説明します。 管理画面へのログイン ダッシュボードについて ブログの表示確認 管理画面からのログアウト WordPressの管理画面へのログイン方法 インストールしたときは順番に進めていくことでログイン画面に辿り着くことができましたが、通常はログイン画面のURLを入力して表示することになります。 入力するURLは以下になります。 http://ドメイン名/インストールしたディレクトリ/wp-login.php ※インストールしたディレクトリ：本サイトを参考にインストールした場合は「wordpress」になります。 ログイン画面のURLはブックマークしておくといつでも簡単に表示できるようになります。 URLを入力して「enter」キーを押すとログイン画面が表示されます。 「ログイン状態を保存する」にチェックをしてログインすると10日間は再度ログインしなくても自動的
超クールなイマドキのダッシュボードのUIデザインまとめ | SHINGO IRIE
プログラマといえど、管理者が使うものといえど、美しい機能美でまとめられたダッシュボードをつくりたいものです。今回は、参考になりそうな美しいダッシュボードを集めてみました。 クールなダッシュボードデザイン集このくらいシンプルなのが好みです。 Gear Admin UI v2 Analytics系。数字の比較や計算が多いものに向いてそう。 Some Analytics 比較的オーソドックスに使えそう。最近、わりとこういうダッシュボードデザインが多いですね。 Dashboard Web App Product UI Design: Job Summary グラフの見せ方が個性的。 To-Do Dashboard サーバーのダッシュボード。 Server Dashboard カラーを統一するのも綺麗にみえます。 Dashboard Overview Screen トップメニューにすることで、画面を
【CSSフレームワーク】Bootstrap3の管理画面用テンプレートまとめ【全部無料】
更新：2017/10/22 こんにちは。Webデザインはあまり得意ではないケーです。 デザインが苦手なエンジニアでもレスポンシブ対応済みのページを割りと簡単に用意できるのがCSSフレームワークです。 そんなCSSフレームワークの中で最も有名なのがBootstrap（ブートストラップ）で、Twitter社が開発・提供、オープンソースで公開されているフロントエンドツール。 Bootstrapでも管理画面用のテンプレートというのがあるんですが、毎回テンプレ探しを繰り返しているのでまとめておきたいと思います。 SB Admin 2 SB Admin 2はブロックごとのパネルがスマートで気に入っています。シンブル好みの方にオススメ。 | ライセンス MIT License デモ http://blackrockdigital.github.io/startbootstrap-sb-admin-2/p
WPでsuuumoのような不動産サイトの管理画面を作る - kurubusi.net
今回は、WordPressでsuumoの様な不動産サイトを作ることを目標として、連載を書いていこうと思います。 不動産サイトや中古車販売のようなサイトは、専用のプラグインなども販売されていますが、実は有名なプラグインを有効に利用すると、もっと使いやすいものが意外と簡単に作れるものです（面倒くさい部分はあるけど…）。 要はどういうプラグインを使ってどのように組み合わせれば不動産サイトが出来るかどうか、使えるプラグインを知っているか知らないかが重要です。 プラグインの使い方や・プラグインの紹介をしているサイトは沢山ありますが、具体的に、例えば不動産サイトを作るためにはどういうプラグインを使用すればよいのかわからないって方が意外と多いと思いますので、今回は特別に、具体的に、プラグインを使って不動産屋さんのサイトの作り方を解説致します。 殆どのプラグインは有名なものです。ただ、中には有料アドオンの
Gentallela - プログラマでも美しく管理画面を作成できるBootstrapテーマ | ソフトアンテナ
「Gentellela」はBootstrap 3を使った無料の管理画面用テンプレートです。デフォルトスタイルのBootstrap 3をベースとして多数のパワフルなjQueryプラグインやツールを組み込んだもので、美しい管理用パネルやダッシュボードを簡単に作成することができます。 テーマにはチャートや、カレンダー、フォーム検証ライブラリ、ウィザードスタイルのインターフェイス、ナビゲーションメニュー、テキストフォーム、スライダー、プログレスバー、通知メニューなどたくさんの有用なライブラリが組み込まれています。 今回はオンライン上で確認できるデモサイトを元に、どのような画面が実現できるのかスクリーンショットとともに紹介したいと思います。 ダッシュボード ▲ダッシュボードのデモでは多様なチャートが表示できることが確認できます。テーマはレスポンシブ対応で画面サイズに応じて適切に描画されます。 フォー
記事作成のやる気も上がる！Wordpress管理画面を自分好みにカスタマイズする方法
WordPress管理画面のデザインを自分好みにカスタマイズできることをご存知でしたか？ ちょっとしたデザインのアレンジを加えるだけでも記事作成に対するモチベーションは大きく変わってきます。「いい気分でつくればいいものができる」とはよく言われますよね。気分のノリがカスタマイズ前とは大きく違うので記事作成の効率もクオリティも自然と上がります。 さて、今回はそんなメリットも見込めるWordpress管理画面デザインのカスタマイズ方法を紹介します！ プラグインを使わずに管理画面をカスタマイズする さて、実際のやり方について触れていきます。 プラグインを使用しない場合、functions.phpを直接編集していきます。functions.phpの編集に失敗するとWordpressにアクセスできなくなるので、かならずfunctions.phpのバックアップを取ってから自己責任でカスタマイズしてくださ
WordPressの管理画面をクリーンでシンプルなスタイルに変更するプラグイン・「Slate Admin Theme」
Slate Admin ThemeはWPの管理画面のスタイルをシンプルでクリーンなスタイルに変更してくれるプラグインです。上記のようなスタイルになります。公式とあまり変わらないように見えますが、メニューの項目のアイコンの位置が変わったりスペースを多く取ってくれていたりnotificationが見やすくくなっていたりと、公式から大きく変えずに見やすさだけ向上していると個人的には思えて好印象でした。いつか使うかもと思ったので備忘録として。 Slate Admin Theme 尚、こちらはpro版もあるようで、有料版ではスタイルだけでなく、管理画面、ログイン画面のロゴの変更やスタイルのカスタマイズ、管理画面内への任意のメッセージの挿入、任意のメニューの表示/非表示へのスイッチ、管理画面内のフッターのカスタマイズなど様々な機能が追加されているようです。pro版は本プラグインを有効化すればフッターに
WordPress：管理画面の各一覧ページを簡単にカスタマイズできるプラグイン「Admin Columns」 - NxWorld
「Admin Columns」は、WordPressの管理画面にある投稿や固定ページなどの各一覧ページを簡単にカスタマイズできるプラグインです。 項目も豊富に用意されており、表示する順番もドラッグ＆ドロップで簡単に変更することができます。 紹介している内容やキャプチャなどは、WordPress Ver 4.2.2で使用した際のものになります。 インストール・有効化 管理画面のプラグインから「Admin Columns」を検索してインストール、もしくは「Admin Columns」からファイルをダウンロードして環境にアップロード。 プラグインを有効化すると「設定」に「Admin Columns」という項目が追加され、そこで各一覧画面をカスタマイズできます。 使い方 「設定 → Admin Columns」を選択すると下のような画面が表示されるので、ここで各一覧画面をカスタマイズできます。 ペ
WordPressでYouTube動画を埋め込み、ギャラリーに
WEB制作のポイント 2015年7月3日 WordPressでYouTube動画を埋め込み、ギャラリーに 通勤電車のなかで、待ち時間に、テレビを観ながら、話題の動画をオンデマンドで楽しむ毎日。 携帯デバイスの4G LTE化も手伝い、YouTubeは、いまや企業にとってプロモーションの必須ツールになった。 外部のサービスを自社サイトに取り込むのは、サービス提供サイトの仕様変更などに伴ってリスクがついてまわるが、それを補っても余りあるほど恩恵は大きいものだ。 今回は、YouTubeの公式チャンネルに登録した動画コンテンツをWordPressの記事に埋め込んだり、自社の動画ギャラリーとして公開する方法を紹介する。YouTubeを代表とする動画SNSの採用を検討する際の参考となれば幸いだ。 動画ギャラリープラグインは、企業サイトに馴染みにくい WordPressには、動画ギャラリーに関するプラグイ
Gentallela·多くのデザインパターンに対応したBootstrap製の管理画面テンプレート MOONGIFT
Bootstrapを使った管理画面テンプレートはたくさんあります。今回もその一つ、Gentallelaを紹介したいと思います。多くのテンプレートをもち、多数のチャートライブラリとも連携するようになっています。 スクリーンショット多めで紹介します。ぜひご覧ください。 Gentallelaの使い方 ダッシュボード。グラフが多数使われています。 別版。こちらは折れ線グラフです。 こちらは曲線。 フォーム。 さらに拡張版フォーム。 カレンダーやスライダー。 画像の切り抜きなんて機能も。 フォームバリデーション。 ウィザード。 画像アップロードフォーム。ドラッグ&ドロップ対応です。 フォームボタン。 基本的な要素。 ギャラリー。 タイポグラフィ。 アイコン。Font Awesomeです。 こちらはGlyphiconsです。 その他のウィジェット。 請求書。 メーラーっぽい形。 カレンダー。 テーブル
使いやすさをデザインする上で心掛けていること - Mackerel ブログ #mackerelio
こんにちは。デザイナーの id:murata_s です。Mackerelのリリース当初からMackerelの画面設計やUX、ユーザビリティなどのデザイン業務全般を担当しています。 今回は、主にエンジニアさんのためのツールであるMackerelをデザインする際に id:murata_s が気をつけている点を紹介します。ユーザーにとって必要な情報を分かりやすく伝え、迷わないデザインを施すにはどういった配慮が必要か、製品の振る舞いのデザインについてMackerelの事例を交えながら考えてみたいと思います。 Mackerelは言わばソフトウェアであり管理画面ですから、一般に言われるウェブサービスよりもツールとしての側面が強いサービスだと思います。雑誌の誌面ではなく、車のダッシュボードをつくっているようなもので、グラフィックデザイン的な情報設計の考え方が前提となりつつも、それに加えてプロダクトデザイ
WordPressの管理画面にPDFマニュアルを埋め込んで、運営コストを削減しよう | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。ひろゆきです。 今日はWordPressマニュアルを管理画面に埋め込んだときの覚書です。もちろん、使い方次第ではこれを応用して色々なものを埋め込めると思います！ なぜマニュアルを埋め込むのか WordPressでサイトを構築する際に、利用者向けにマニュアルを作ることはよくありますね。特に利用者がWordPressを初めて使う場合や、複雑にカスタマイズされたWordPressを使ってもらう場合に役立ちます。 そんなマニュアルですが、バージョンが変わるごとにメールで送ったりしていると管理が煩雑になることがあると思います。 そこで、マニュアルを管理画面に埋め込んでしまえば、利用者はマニュアルの管理から開放され、制作者もサーバーにアップすれば良いだけとなり、一石二鳥というわけです。 マニュアルを管理画面に埋め込む手順 それでは早速、マニュアルを埋め込んでみましょう。 1. マニュアルを
参考になるフラットな管理画面・ダッシュボードUIデザイン（30例） - いぬらぼ
壁紙・写真8953 webデザイン3925 デザイン3291 絵画・イラスト・アート2193 動物1745 3D1724 UI1291 photoshop1083 フリー1004 風景834 自然821 かわいい689 wordpress679 素材652 テーマ632 チュートリアル626 フォント617 幻想的548 動画530 お洒落524 建築物501 犬430 テンプレ400 イラスト397 psd396 猫384 ロゴ331 jquery297 ブラシ296 プレミアム285 プラグイン274 テクスチャ260 CSS249 ミリタリー221 タイポグラフィ217 名刺213 gif212 都市風景210 インテリア206 宇宙203 エフェクト200 SF188 ポスター186 ファンタジー186
【デザインまとめ】綺麗なデザインの管理画面 30選
以前記事にした「【デザインまとめ】綺麗なデザインの管理画面 40種類 」、時間が経ってリンク先が消えていたりしますね。 また綺麗なデザインの管理画面も追加したいと思います。 サムネイルだけで見ると、全部似たようなものに見えてきますが、デモサイトを見てみると細かな部分でデザイナーさんの個性が出ていて面白いです。 ご参考になれば幸いです。 左に紺か黒のナビがあるやつ ◆Material Admin デモサイト ◆Edumix 黄緑がきれい デモサイト ◆Make デモサイト ◆Con デモサイト メガネのロゴがかわいい ◆Mega デモサイト 黒でメリハリ ◆Admin box デモサイト ちょっとレトロ感ある色遣いが印象的。 ◆Singular デモサイト やわらかな色遣い。 ◆Azan デモサイト ◆Brio Web App デモサイト 丸みの強い要素がかわいい ◆HeyMetro デモサ
WordPress管理画面を顧客用にカスタマイズする方法 | hTDESIGN
お客様から依頼を受けてWebサイトを制作する場合、新着情報の投稿など、顧客側でサイト更新を行いたいという要望は多いかと思います。 WordPressで制作したならば、サイト管理画面にログインすることで更新作業が行えるので、それは可能です。管理者（制作側）が、予め顧客のアカウントを追加して、管理権限を制限することによって、不用意にサイト構築内容が変更されてしまうのも防ぐ事ができます。 しかしながら、あからさまにWordPressを利用していることが露骨な管理画面を、そのまま顧客にお見せするのも節操がありません。ここでは、そういった部分の配慮と、顧客に解り易い管理画面にカスタマイズするために、私が採っている方法を記述します。 尚、以下の内容はWordPressバージョン3.3.2/3.4.2で検証したものです。 ログイン画面のカスタマイズ ロゴを変更する functions.phpに下記コード
WordPressの管理画面に独自のオプション保存をするためのSettings APIの使い方 - Shinichi Nishikawa's
WordPressの管理画面に独自のオプションを保存するための方法です。 書籍『WordPressプラグイン開発のバイブル』の中では、紹介しきれなかった部分です。 Settings APIとは Settings APIは、テーマやプラグインから管理画面に独自の設定保存領域を作るためのAPIで、バリデーションや保存などの大部分をWordPressに任せることができる便利なものです。 Settings API – WordPress Codex 日本語版 Settings API « WordPress Codex Settings API利用の基本的な流れ もっともシンプルに項目を追加する流れは、以下のようになります。 admin_init フックにて、以下の3つを登録 セクション：管理画面のどこに表示するか ( add_settings_section ) フィールド：input, sel
WordPressの記事投稿画面のレイアウトは1カラムで順序立てて効率化を図ろう
WordPressで構築したブログに記事を書く際に、ブラウザから管理画面で書くという人も大勢いるのではないかと思いますが、もしやデフォルトのレイアウトのまま使っていませんか? 投稿画面の「表示オプション」で調整することで、記事の執筆の効率化に繋げられるかもしれませんよ。 記事投稿画面がデフォルトだと･･･ WordPress Day Photo by Andrew Abogado はっきり言って使いにくいんじゃないかと思うんですよね。 その理由は記事の公開ボタンのボックスの位置にあります。 上は記事投稿画面(バージョン3.9.1)のデフォルトレイアウトですが、デフォルトだと投稿の「公開」というボックスが右上に配置されます。 ブラウザを使って記事を書く場合、 記事のタイトルを入力 本文を入力 スラッグやカスタムフィールドを入力 カテゴリを選択 タグを入力 アイキャッチ画像を設定 公開ボタンを
WordPressの投稿画面を色々カスタマイズ ｜ 福岡のホームページ制作会社・メディア総研株式会社 マグネッツ事業部
オッス、オラムラタ。 今回はWordpressのタイトル下やらエディター下など色々な場所に要素を追加してみたいと思います。 投稿の際の注意書きを入れたりマニュアルへのリンクを貼ったりすることでクライアントにも優しい投稿画面が仕上がるのではないでしょうか？ 目次 アクションフック タイトル直前で実行「edit_form_top」 タイトル直後で実行「edit_form_after_title」 エディター直下で実行「edit_form_after_editor」 オプション要素の最後で実行「edit_form_advanced」 独自のボックスを追加「add_meta_box」 投稿タイプによって内容を変更させる 最後に アクションフック WPでは管理画面を開いた時や投稿画面を開いた時、プラグインを停止させた時など様々なタイミング（アクション）にフックを使い任意の処理を実行することができます
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Wantedlyの成長を支える管理画面 #admin_night
