タグ: WordPress

【WordPress】管理バーが表示されなくなったときの対処法
皆さん、こんにちは。

すなです。

先日サイト制作でWordPressを扱っていた時に、管理バーが表示されなくなった事件が発生したので、そのときに対処法をまとめました。

次のいずれかのステップを踏めば、僕と同様の状態になってしまった方も管理バーを元の状態に戻せると思います。

管理バーとは

まずは「管理バー」が何かって話なんですけど、これはWordPressのページ上部に固定されているメニューバーです。

使っているプラグインによるのですが、基本的には投稿を編集するボタンやサイトから管理画面に移動するボタンなどがあります。

これはWordPressにログインした人にしか見えないので、管理バーは普通のサイト閲覧者には見えることも操作されることもありません。

WordPressのユーザーとして僕がこの管理バーを使うときの99%がサイトと管理画面を行き来するのに使っています（逆にそれ以外ではほぼ使っていません）。

余談なんですけど、この「管理バー」という名称は昔の呼び方で、現在は正式には「ツールバー」と呼ぶらしいです。

では実際に戻す方法をご紹介いたします。

ログイン・ログアウトを試す

基本中の基本です。

今までは通常に表示されていたのに急に表示されなくなった場合は、まずは落ち着いてログイン・ログアウトを行いましょう。

だいたいの場合はこれのゴリ押しでなんとかなります。

キャッシュをクリアする

ログイン・ログアウトがダメだった場合は、次はキャッシュをクリアしてみましょう。

キャッシュを簡単に説明すると、ブラウザにある「Webページの情報を一時的に記憶する機能」です。

何らかの理由で管理バーが表示されない、誤った情報がキャッシュに保存されている可能性があります。

それを一旦クリアすることで、次の読み込みでWebページを正常に読み込みなおします。

ちなみにキャッシュを消す方法は以下の通りです。
- Google Chromeの場合
  1. Fn+12で「検証ツール」を開く
  2. ブラウザの左上のリロードボタンを長押しする（または右クリックする）
  3. 選択肢の中から1番下の「キャッシュの削除とハード再読み込み」をクリックする
- Safariの場合
  1. Safariのメニューバーより「環境設定」を開く
  2. 「一般」タブの1番下の「メニューバーに”開発”メニューを表示」にチェックします
  3. メニューバーの「開発」から「キャッシュを空にする」をクリックします
キャッシュを削除したら、ページを再読み込みしてください。

管理バーを含んだ正常なWebページが読み込まれるはずです。

wp_head()とwp_footer()

上記のキャッシュクリアをしてもまだ管理バーが表示されない場合は、今度はwp_head()とwp_footer()があるか確認しましょう。

WordPressで自作テーマを作った方は特に注意しましょう。

これらの関数はHTMLにWordPressに必要な情報を出力するので、これらがないと管理バーが出力されません（厳密には管理バーはwp_footer()で生成されます）。

これらの関数は通常、wp_head()がheader.phpに、wp_footer()がfooter.phpに書かれます。

テーマエディターからそれぞれのページを確認して、どっちもの関数がちゃんと書かれているかを確認しましょう。

基本設定を確認

wp_head()とwp_footer()の両方の関数があるのを確認したにも関わらず、いまだに管理バーが表示されない場合は「基本設定」を確認しましょう。

管理画面から「ユーザー>プロフィール」を選択すると、「ツールバー」という項目があります。

「サイトを見る時にツールバーを表示する」というチェックボックスがありますので、これにチェックが入っているのかを確認しましょう。

これが抜けていると管理バーは表示されません。

いかがだったでしょうか。

WordPressで管理バーが表示されなくなった時に対処法4つをご紹介いたしました。

ちなみに僕はその先日に初めていきなり管理バーが消えたのですが、色々試した末にログイン・ログアウトをゴリ押ししたら何故か復活しました。

皆さんも管理バーが消えたらネット上には同じような人がたくさんいるので、焦らずに是非ググって解決してください。

それではまた別の記事でお会いしましょう。
2021年4月7日
【簡単】WordPressサイトにラクしてお問い合わせフォームを設置する手順
皆さん、こんにちは。

すなです。

本日はWordPress初心者に向けた記事になります。内容はタイトルにある通り、

「WordPressにお問い合わせフォームを導入する方法」

をご紹介と思います。
- ブログ開設したけど、お問い合わせフォーム作れない
- プログラミングスキルがなくて、簡単に作りたい
と言う方は是非ご覧ください。

HTML知らなくても大丈夫

WordPressはプログラミングスキル、HTMLやCSSを知らなくてもブログサイトが開設できる便利なソフトウェアです。

プログラミングスキルがあればもっとカスタマイズできるのですが、WordPressはそのスキルがなくても全然困らないくらいお手軽に扱えるのが良いところです。

しかしWordPressにはデフォルトで「お問い合わせ」の機能がありません。

そこで今回はHTML&CSSのスキルがなくても簡単にお問い合わせを導入できるプラグインをご紹介いたします。

Contact Form 7がオススメ

WordPressには「Contact Form 7」というプラグインがあります。

これがかなり優秀で、今回はこれをオススメします。

今回はお問い合わせを固定ページで作成して、それをサイトのヘッダーに置く方法を紹介します。

プラグインを新規追加する

まずダッシュボードを開いた状態で、まずは「プラグイン > 新規追加」をクリックします。

Contact Form 7をインストールする

検索バーから「Contact Form 7」と入力します。

自動的に検索がかかって、Contact Form 7が表示されます。

Contact Form 7の「今すぐインストール」をクリックして、今すぐにインストールします。

有効化する

インストールが数秒で完了すると「今すぐインストール」の表示が「有効化」に変わります。

その「有効化」をクリックして、Contact Form 7を有効化します。

するとWordPressのメニューに「お問い合わせ」という欄が追加されます。

お問い合わせを作成

新しく追加された「お問い合わせ」から「新規追加」を選択します。

お問い合わせフォームを作る

今回はContact Form 7のデフォルトのフォームを使って、そのまま説明します。

自分の分かりやすい名前を設定したら、「保存」をクリックします。

固定ページを作成する

「保存」をクリックすると、青い背景のコードが表示されてお問い合わせフォームが作成できたのが確認できます。

「固定ページ > 新規追加」を選択して、固定ページの作成画面に移動します。

タイトルを今回は分かりやすく「お問い合わせ」にします。

段落の右の「＋」ボタンをクリックして、選択肢の中から「Contact Form 7」を選びます。

プルダウンから先ほど設定した名前を選びます（コンタクトフォーム１は最初から入っているフォームです）。

これで「公開」をクリックすると、以下のようなお問い合わせのページが作成できます。

お問い合わせページ

ヘッダーにお問い合わせを設置する

「外観 > メニュー」から新しくメニューを追加します。
- 「メニュー名」は自分が分かりやすい名前を設定します。
- 「メニュー項目を追加」から「お問い合わせ」を選択して「メニューに追加」をクリックします。
- 「メニュー設定 > メニューの位置」でお問い合わせを表示させたいメニューをクリックします（どの表示でも表示させたいので、全部にチェックしてもokです）。
上記の設定が完了したら、最後に「メニューを保存」をお忘れなくクリックして設定を保存します。

すると以下のように、ヘッダー位置に「お問い合わせ」が表示されるようになりました！

もちろん、「お問い合わせ」をクリックすると先ほど作った固定ページが表示されます。

お問い合わせフォームを作った方がいい理由

いかがだったでしょうか。

Contact Form 7を使って、プログラミングスキルがなくても簡単にお問い合わせフォームを設置する方法をご紹介しました。

これで皆さんももうお問い合わせページを作るのに困りませんね。

ちなみにデフォルトの状態だとお問い合わせからのメールは、サイトを開いているサーバーに送信されるのでレンタルサーバーにアクセスすればメールを確認することができます。

ところで今回はお問い合わせフォームをCotact Form 7を使って導入する方法をご紹介しましたが、もしかしたら「僕のサイトにはお問い合わせは必要ないよ！」と言う方も中にはいらっしゃるかも知れません。

しかし僕はWordPressサイトにはお問い合わせフォームを導入することをオススメします。

それには大きな理由が3つあります。
- 読者の信頼を得やすい
- もしかしたら企業からも連絡が来るかも
- Googleアドセンスに通りやすい！？？
読者からの信頼

読者がブログを読むとき、それが芸能人ならば顔も素性も分かっているので読者は安心して読むことができます。

しかし、皆さんのブログはどうでしょう。

僕も含めて、ほぼ99%の方がいわゆる素人の一般人だと思います。

そんなブログを読むとき、読者はどこのどんな人が書いているのか不安になっています。

しかしブログにお問い合わせフォームがあると、読者は

「この人は連絡が取れる、怪しい人ではないんだな」

と思ってもらえます。

お問い合わせフォームがあることで、実際に連絡することがなくても読者は安心して皆さんのブログを読むことができます。

企業からの連絡も

信頼できるブログが完成したら、個人の方から色んな連絡が来るかもしれません。

しかし、そんな信頼できるブログに連絡するのは企業も同じです。

信頼できる、アクセスの多いブログで企業の商品を紹介してもらえれば、企業は商品の売上アップに繋がると考えるのは妥当ですよね。

お仕事に繋がるかもしれない連絡が来るかもしれないので、そんな企業様のためにも窓口を用意しましょう。

Googleアドセンスに通りやすい！？？

本当か分かりませんが、巷ではこう言われているらしいです。

Googleアドセンスは審査基準を公表していません。

なので、この情報に信憑性がどこまであるのかは正直分からないのです。

しかしブロガーのヒトデさんが「数百人からアドセンス審査の相談を受けてきて、通る人の共通点が見えてきました」と仰っていた中にこれがありました。

確かに、上記の「読者の信頼を得る」と繋がるところもあるのですが、

連絡できる窓口がある = 信頼できるブログ

であるのは想像できます。

Googleも無闇に広告は出したくないので、信頼できるブログの基準に「お問い合わせがあるか」が入っていても納得できると僕は感じました。

これらの観点からも、まだお問い合わせフォームを設置していない方は是非Contact Form 7でお問い合わせを用意しましょう！

それではまた会いましょう。
2021年3月16日
【ブログ入門】WordPressサイトを開設する方法
こんにちは、すなです。

今回は僕たちWebエンジニアも御用達も「WordPress」を使って完全に自分だけのサイトを作る方法をご紹介いたします。
- Webサイト制作を始めたい
- はてなブログ等ではなく自分だけの完全オリジナルサイトを持ちたい
という方は是非見ていってください。

それでは本編です。

サーバーを借りる

まずはあなたのサーバーを借りないといけません。

サーバーには色んな役割がありますがざっくり説明すると、皆さんが書いたプログラミングのファイルを保存する場所です。

サーバー(server)の語源のserveですが、こんな意味があります。

〜に仕える、奉公する、尽くす
（飲食物を）出す
（テニス・バレーボールなど）サーブする
weblioより

「相手のために出す、仕事する」みたいな意味があります。

つまりITにおいては「ファイルを供給する」という役割があります。

ここで言うファイルとは簡単に言うとホームページのことです。これらを保管している場所から皆さんのパソコンに提供するので「サーバー」と呼ばれています。

サイトやブログ開設の第一歩は、まず自分のサーバーを持つことから始まります。

このブログのサーバーは「ロリポップ！」という会社からレンタルしていますので、今回は「ロリポップ！」でサーバーを借りるという体で話を進めていきます。
ロリポップ！

各種レンタルサーバー屋さんには色んなプランがありますが、ブログサイトを開設するだけなら1番普通のプランで問題ないと思います。

僕が入っているロリポップ！のスタンダードプランは、初期費用1650円と月額550円なので全然負担はないです。

「WordPress簡単インストール」でWordPressを準備する

ロリポップ！（や他のレンタルサーバー屋さん）でサーバーを借りてログインしたら、「WordPress簡単インストール」的な項目がどこかにあると思います。
- ロリポップ！だと、「サイト作成ツール > WordPress簡単インストール」
- さくらインターネットだと、「Webサイト/データ > クイックインストール>WordPress」
- エックスサーバーだと、「WordPress > WordPress簡単インストール」
レンタルサーバー3大手のWordPress導入方法を紹介しましたが、だいたいの場合はWordPressの案内がどこかにあると思います。

各種サイトがWordPressインストールの手順を用意しているので、その案内に沿って作業すれば問題なく借りたサーバーにWordPressを準備できると思います。

WordPress開設！！！

WordPressの導入が完了したら、晴れてあなたのブログの開設完了です！！！おめでとうございます！

記事の執筆をすれば、サイトがあなた好みのブログに変化していきます。

【中級編】テーマを変えてみよう！

ですが、これだとWordPressのデザイン・見た目がデフォルトのままです。少しダサいや、テンプレのデザインは嫌だ、というこだわりの強い方もいらっしゃるかもしれません。

そんなはWordPressの「テーマ」を変えて見ましょう。

WordPressにはLINEでいう「着せかえ」に似た機能があり、見た目やデザインを「テーマ」を変えることで変更できます。

有料・無料など様々なテーマがネット上にあるので、お気に入りのデザインのテーマを見つけたら自分のWordPressにアップロードして適用してみてください。

正常に処理が完了すると、あなたのWordPressがさっきとはまるで違う見た目をしているのが分かると思います。

僕がオススメする無料のWordPressテーマを5つピックアップしましたので、調べる前に一旦こちらを見てみてください。
- Cocoon – シンプルで万能的な無料テーマ。デフォルトがホワイトを基調としたデザイン。
- Luxeritas – サイトが非常に軽く設計されている無料テーマ。「ザ・ブログ」というデザイン。
- Lightning – 多くのカスタムが用意されている無料テーマ。会社サイトなどにも向いている。
- AFFINGER – 『「稼ぐ」に特化』した有料テーマ。1つのテーマで多くのデザインが可能。
- SANGO – エンジニア系の発信で有名な「サルワカ」が提供している有料テーマ。
皆さんもお気に入りのテーマを見つけて、自分なりのサイトにしましょう。

【応用編】独自ドメインを取得してみよう！

今度はサイトのurlに注目しましょう。現在では借りたレンタルサーバーのurlがそのまま使われていると思います。

せっかくならurlのブログと関連性のある名前にしてみましょう。

レンタルサーバーから提供されるurlではなく、自分で用意するオリジナルなurlを「独自ドメイン」と呼びます。

独自ドメインは、レンタルサーバー同様に、色んな会社さんが貸し出し・販売をしているので各種サイトを訪問して自分が欲しいドメインがまだ有効かどうかを見てみてください。

僕はロリポップ！が推奨する「MuuMuu Domain」でこのブログの「sunablog.tokyo」という独自ドメインを88円/年で契約しています。
ムームードメイン

ドメインは以下の様に「~.〇〇」のドット以降によって料金が大きく違います。
- 「~.jp」は、2035円
- 「~.com」は、1045円
- 「~.tokyo」は、88円
- 「~.ai」は、13090円
これらは全てMuuMuu Domainでの結果ですが、他のドメインの会社を見ると結構料金が違ったので、独自ドメインに契約される方は色々見てから決めてみてください。

独自ドメインを購入されたら、ロリポップ！（や他のレンタルサーバー屋さん）にログインして、「独自ドメイン設定」で借りているサーバーと独自ドメインを紐づけてください。

この作業は設定後、処理が完了するまで数分かかりますが、少し待つと先ほど借りた独自ドメインであなたのブログを閲覧できる様になります。

これが完了すれば、あとはもう少しです。

【応用編】サイト自体をSSL化してみよう！

最後にブログサイトをSSL化しましょう！

これは簡単に言うと、サイトの通信を暗号化して安全性を高めるということです。

サイトのSSL化はこちらの記事でざっくりと説明しているので、興味を持たれた方はこちらも合わせてご覧ください。

https://sunablog.tokyo/2021/03/10/post-900/

（多くのレンタルサーバー屋さんも同じだと思いますが）ロリポップ！では借りたドメインのSSL化を無料で行えます。

ロリポップ！にログインしたら、「セキュリティ > 独自SSL証明書導入」という項目を選択してください。

ここで、先ほど紐づけた独自ドメインを選択して、SSL保護を有効にすれば晴れてあなたのブログはSSL化されたということになります。

これであなたもサイトを開設できる様になります

いかがだったでしょうか。

知っていると大した作業じゃないんですけど、いざ分かりやすく文章にしたら記事のボリュームが多くなってしまいました。

作業の深い手順は省いて説明しているので、躓いたら焦らずに1つ1つ調べて解決していただけたらなと思います。

最後の最後まで読んでくださった方はありがとうございました。

また次のブログでお会いしましょう。
2021年3月12日