タグ別アーカイブ: ホームページ作成

採用サイトをリニューアルしても結果が変わらない会社に共通する失敗とは

社員たちが作業する手元
採用サイトをリニューアルした。デザインも刷新した。コンテンツも整理した。それなのに、応募数は変わらない。来ても採用につながらない。内定を出しても辞退されてしまう・・・。
そんな状況に直面している採用担当者や経営者の方に、ひとつ問いかけさせてください。

「リニューアルの前に、「なぜ自社を選ぶのか」を言葉にできましたか?」

採用サイトの失敗の多くは、デザインの問題でも、情報量の問題でもありません。その手前にある「採用コンセプトの言語化」が抜け落ちたまま、見た目だけを整えてしまったことにあります。

失敗の原因は、ほぼ共通しています。『採用コンセプトの言語化』が抜け落ちたまま、見た目だけを整えてしまうこと。この記事では、その実態と、実際の改善事例をお伝えします。

平田弘幸

執筆した人:平田弘幸

株式会社フレイバーズ代表取締役。一般社団法人ブランドマネージャー認定協会・認定コンサルタント(インターナルブランディング)、ブランドマネージャー(1級)。大手電機メーカーで国内外の営業、企画を15年間経験した後、フレイバーズ設立。製造業での知見を活かし、中小企業のブランディングに強み。


本記事で分かること

採用サイトを刷新したのに変わらない。その理由は、ほぼ100%「コンセプトの言語化」です。この記事では、行動経済学の視点と支援事例から、失敗のパターン・確認すべき3点・改善の進め方を具体的に解説します。

1. 「採用サイトをリニューアルすれば解決する」は思い込み

採用に課題を感じた会社が最初にとる行動は、多くの場合「採用サイトのリニューアル」です。

確かに、見た目が古い、スマートフォン対応ができていない、情報が整理されていない——これらはリニューアルで解決できる問題です。しかし、採用サイトを刷新しても、次のような課題は解決しません。

  • 応募数は増えたが、採用につながる人材が来ない
  • 内定を出しても辞退される
  • 入社しても早期離職が続く
  • 採用説明会の参加者数は、以前とほぼ変わらない

これらの課題の本質は、サイトの「見た目」ではなく「設計」にあります。より正確には、サイトに何を伝えるかという「本質の設計」、つまり採用コンセプトが定まっていないことにあります。

どれだけデザインを磨いても、伝えるべき本質が曖昧なら、応募者の心は動きません。採用サイトはあくまで「表現の器」。器をいくら美しくしても、本質が訴求できていないのでは意味はないのです。

2. 採用活動は営業と同じ:環境が変われば打ち手も変わる

もうひとつ、リニューアルが失敗に終わる理由があります。それは「一度作ったら終わり」という考え方です。
営業活動を思い浮かべてください。市場環境が変わり、競合が変わり、顧客のニーズが変わったとき、同じ提案書を使い続けるでしょうか。おそらく、状況に合わせて提案内容を見直すはずです。

採用活動も、これとまったく同じなのです。

  • 求職者の価値観が変化した
  • 競合他社が採用に力を入れ始めた
  • 自社の事業フェーズが変わった
  • 求める人物像が変わった

これらの変化に合わせて、採用サイトの打ち出し方も変えていく必要があります。にもかかわらず、「リニューアルした安心感」から一度作ったサイトをそのまま使い続けてしまう会社は少なくありません。

採用サイトは制作コストがかかります。そのため、一度リニューアルすると「しばらくはこれでいこう」という心理が働きがちです。しかし、営業が「先期に作った提案書を使い続ける」ことがないように、採用の打ち手も定期的に見直すサイクルを持つことが、長期的に見て大きな差を生みます。
なにも、毎回リニューアルをせよということではありません。本質的な部分(御社の良さ、社風など)は変える必要はなく、必要な部分だけを改修すればいいのです。

採用活動は、作って終わりではなく、継続的に見直し続けるものです。その視点がなければ、どれだけ丁寧にリニューアルしても、いずれ同じ課題に直面することになります。

3. 行動経済学から見る「応募者の意思決定」

行動経済学を意識することで変わる採用の質

では、採用サイトで本当に伝えるべきこととは何でしょうか。それを理解するために、行動経済学の「システム1・システム2」という概念を使って説明します。

システム1:なぜ『なんとなくいい会社』で終わってしまうのか

人間の意思決定には、大きく2つのモードがあります。ひとつは「システム1」と呼ばれる、直感や感情に基づく高速な判断です。

採用サイトで言えば、「なんかいい会社っぽい」「デザインがおしゃれ」「社員が楽しそう」といった第一印象がこれにあたります。大手企業のブランドや、有名なデザイン会社が作ったきらびやかなサイトは、このシステム1に強く働きかけます。

システム2:応募者が『ここしかない』と思う瞬間

もうひとつは「システム2」と呼ばれる、論理や言語に基づく、時間をかけた思考です。

採用の文脈では、「この会社を選ぶ理由が、自分のなかで言葉にできている状態」がこれにあたります。「なぜここで働きたいのか」を自分自身に説明できる状態、と言い換えてもいいかもしれません。

システム1だけに頼ると何が起きるか

システム1だけに訴えかける採用サイトは、短期的には応募を集めることができます。しかし、応募者が選考を進めるにつれて、「なぜここを選んだのか」という自己説得が追いついてこない。

その結果が、内定辞退・早期離職・定着率の低下です。

「なんとなくいい雰囲気だった」で入社した社員は、壁にぶつかったとき、「なぜここで働いているのか」という問いに答えられません。一方、「この会社でなければならない理由」を自分の言葉で持っている社員は、困難があっても踏みとどまれる。

これは、採用の問題に見えて、実は入社後の定着や組織文化にまで連鎖する問題です。採用コストをかけて入社してもらっても、早期に離職されれば、また採用費がかかる。その悪循環を断つためにも、採用の入口から「なぜここか」を明確にしておくことが重要です。

採用の質を上げるには、システム2に働きかけること、すなわち「この会社でなければならない理由」を応募者が自分の言葉で持てるよう、採用サイトが設計されている必要があります。

4. 採用コンセプトの言語化が、採用の質と量を変える

採用コンセプトを明確に言語化すると、すべての活動がスムーズに動く

システム2に働きかけるために必要なのが、採用コンセプトの言語化です。

採用コンセプトとは、「なぜ自社で働くのか」「自社で働く意味とは何か」を一貫したメッセージとして言語化したものです。

これは、採用担当者が考えるものではありません。社員一人ひとりの「なぜここで働いているのか」「どんな瞬間にやりがいを感じるか」というリアルな声を丁寧にヒアリングし、そこに共通する価値観や体験を抽出することで生まれます。

社員ヒアリングが起点になる

当社がサポートする際、最初に行うのは必ず社員ヒアリングです。

「会社の強みは何ですか?」と聞いても、出てくるのは表面的な答えばかりです。そうではなく、「入社前と後でギャップがありましたか?」「辞めようと思ったことはありますか? なぜ続けているんですか?」、こういった問いから、その会社の本質的な魅力が浮かび上がってきます。

採用サイトは、その言語化されたコンセプトを表現する「手段のひとつ」にすぎません。コンセプトが明確であれば、採用サイトのライティングも、写真の選び方も、構成も、自然と決まってきます。

よくある「言語化できていない」サインとは

自社の採用コンセプトが言語化できていない場合、採用サイトにはこんなメッセージが並びがちです。

  • 「チャレンジできる環境があります」
  • 「風通しのいい職場です」
  • 「成長できる機会が豊富です」
  • 「社員一人ひとりを大切にしています」

これらのフレーズ自体が悪いわけではありません。ただ、どの会社でも書けてしまう言葉は、どの求職者にも刺さらない言葉でもあります。「うちの会社だからこそ」が見えない。

採用コンセプトが言語化されているかどうかの簡単な判断基準は、「その文章を読んで、入社を検討する理由が出てくるか」です。「なんとなくよさそう」で終わるなら、まだコンセプトの言語化が足りていないサインです。

逆に、コンセプトが曖昧なまま進めると、サイトのどこを見ても「なんとなくいい会社」しか伝わらない。そういう採用サイトが量産されています。

採用コンセプトの言語化、どこから始めればいいか分からない。そんな方は、まずはお気軽にご相談ください。社員ヒアリングから一緒に進めます。

無料相談はこちら

フレイバーズでは、社員ヒアリングから採用コンセプトの言語化、採用サイト制作までを一貫して支援しています。詳しくは採用サイト制作・リニューアルの支援内容をご覧ください。

5. 採用サイトをリニューアルする前に確認すべき3つのこと

採用コンセプトを土台にしたリニューアルを進める前に、確認しておきたいポイントが3つあります。

①「なぜここで働くのか」を社員の言葉で語れるか

実は、経営者や採用担当者でさえ、競合と比べたときの自社の強みを明確に言語化できていないケースは少なくありません。「うちはチームワークがある」「成長できる環境がある」・・・そう言いながら、「他社と何が違うのか」を問われると言葉に詰まる。それが現実です。だからこそ、現場の社員に話を聞くことが重要。複数の社員に「なぜここで働き続けているか」を問いかけ、共通して出てくるキーワードを拾い上げる。そこにこそ、採用コンセプトの種が埋まっています。

②ターゲットとなる求職者像は明確か

「ポテンシャル重視で幅広く採用したい」という方針は理解できますが、「全員に刺さるメッセージは誰にも刺さらない」というのが採用サイト設計の実態です。20代の第二新卒なのか、専門スキルを持つ中途なのか、ターゲットを絞ることで、伝えるべき言葉と構成が変わります。

③リニューアル後の効果測定の仕組みがあるか

採用サイトの改善は、公開してからが本番です。Google AnalyticsやSearch Consoleを継続的に確認することで、次の打ち手が見えてきます。たとえば、採用活動の時期によってアクセスされるページは変わっていきます。春の就活シーズンには企業理念や社風のページに流入が増え、秋以降は職種ごとの業務内容ページが見られるようになる——そういった動きを読むことで、「今この時期に訪れている求職者には、どのメッセージを前面に出すべきか」が自然と見えてきます。データは、採用サイトを育てるための羅針盤です。

この3点が整っていれば、リニューアルの方向性はかなり絞り込めます。逆に言えば、この確認なしにデザインや文章の修正から入ると、また同じ課題に直面する可能性が高くなるでしょう。

6. 事例前半:企業説明会のブースに誰も来なかった会社

社員インタビューの様子

ここで、実際の支援事例をご紹介しましょう。

社員120名規模の中堅企業。採用には毎年一定の予算をかけていましたが、なかなか成果が出ていませんでした。採用担当者からの相談は、率直なものでした。

「企業説明会で、ブースに誰も来ない日があるんです。隣ののブースは人が並んでいるのに」

現状の採用サイトを拝見すると、情報は整理されており、写真も丁寧に撮影されていました。ただ、何を伝えたいのかが、読んでも頭に残らない。社員インタビューも掲載されていましたが、「楽しい職場です」「成長できます」という言葉が並んでいるだけでした。

まず社員ヒアリングから始めた

私たちが最初に取り組んだのは、社員へのヒアリングです。現場の社員10名近くにインタビューし、「なぜこの会社に入ったのか」「続けている理由は何か」「どんな仕事に達成感を感じるか」を深掘りしていきました。

そこで見えてきたのは、「人が育つ会社」というキーワードでした。難しい仕事を任せながらも、新卒社員の成長が他社と比べて明らかに早い。大手では一部しか担当できない仕事が、この会社では最初から最後まで携われる。その分、壁にぶつかることも多いはずですが、それでも社員が定着し、着実に力をつけていく。人を育てることへの向き合い方が、他社より数段すぐれている——その体験が、社員たちの語りに繰り返し登場したのです。

コンセプトを言語化し、採用サイトを再設計

「大手ではなく、ここを選ぶ理由」を採用コンセプトとして設定し、採用サイト全体を再設計しました。ファーストビューには「自分の手が届く仕事」というメッセージを据え、それを裏付ける具体的なエピソードを社員の声として掲載。「風通しがいい」「成長できる」といった抽象的な言葉は一切排除し、「入社1年目からどんな仕事に関わったか」「どんな瞬間にやりがいを感じたか」を、社員の生の言葉で語ってもらう構成にしました。

結果は、数ヵ月で明らかになりました。応募数が増えただけでなく、「御社のサイトを読んで、ここしかないと思いました」という応募者が増えてきた。選考での辞退も減り、入社後の定着率も改善しました。

ところが、3年ほど経つと、新たな課題が生まれてきました。採用予定枠は毎年埋まり、応募者のレベルも以前と比べて明らかに上がっている。成果としては申し分ない。しかし、応募者の質が上がった分、比較される相手も変わってきたのです。「応募者が大手企業と迷っているケースが増えてきました」——採用担当者からそんな言葉が出てくるようになりました。

7. 事例後半:課題が変わったとき、サイトも変える

採用の質が上がったことで、比較される競合が変わりました。以前は「この会社か、あの中堅企業か」という比較だったのが、「この会社か、大手か」という比較になってきた。ある意味では嬉しい悲鳴ではあります。しかし、そうも言っていられません。大手と迷い始めた応募者が親や学校の先生に相談すると、「せっかくなら大手に行きなさい」というアドバイスが返ってくる。それが引き金となり、内定辞退が続出するようになっていたのです。

採用担当者の悩みは、むしろ以前より深くなって来ていたのです。

打ち出しの軸を変える判断

ここで私たちがご提案したのは、採用サイトの2回目のリニューアルでの打ち出し方です。

前回のリニューアルで有効だった「人が育つ会社」というコンセプトはそのまま生かしつつ、新しいメッセージを加えました。それが、「大手より大きな仕事ができる」という打ち出しです。

大手に入れば、入社後しばらくは一つの部門の一つの業務しか担当できない。一方、この会社では入社1〜2年目から、プロジェクト全体に関わる機会が与えられる。これまで築いてきた仕組みやナレッジによって各社員が実行すべきことは明確で、チームの連携も取れている。先輩からのフィードバックを受けながら、仕事の全体像を早い段階で理解できる環境がある。

それを求職者の言葉で、具体的に伝える構成に作り直しました。

7.結果:厳しい採用市場でも応募数・質を維持

2回目のリニューアル後、採用の難易度は変わらないまま、応募数・質ともに水準を維持できています。現在の担当者の課題は、「大手より大きな仕事ができる」という採用コンセプトに新たに加わったサブコンセプトを、採用サイトのあらゆる接点でいかに一貫して訴求するか。説明会、先輩社員との懇談会、面接など。それぞれの場面で「大手よりやりがいがある」という実感を応募者に届けていくことが、いまのテーマになっています。

「採用サイトを一度作ったら終わり」ではなく、「課題が変わったら打ち手を変える」・・・。この会社がその姿勢を持てたことが、継続的な採用力の源泉になっています。

8. まとめ:採用サイトのリニューアルは手段、目的は「言語化」

採用サイトのリニューアルがうまくいかない理由は、ほとんどの場合「採用コンセプトの言語化が先行していないこと」と「市場変化に合わせて見直す視点がないこと」の2点に集約されます。

デザインを整えることは重要です。しかし、デザインを整える前に「何を伝えるか」が定まっていなければ、どれだけ美しいサイトを作っても、応募者の心には届きません。

また、採用活動は一度形にしたら終わりではありません。外部環境が変わり、自社の課題が変わったとき、採用の打ち手も変えていく。それが採用力を継続的に維持する唯一の方法です。

今の採用サイトを振り返ったとき、こんな状況に当てはまるなら、見直しのタイミングかもしれません。

  • 数年前にリニューアルしたきり、内容をほとんど更新していない
  • 社員インタビューはあるが、「どこでも使えそうな言葉」しか載っていない
  • 応募はあるが、選考を進めると辞退が多い
  • 自社の採用コンセプトを一言で説明できない

採用サイトは、会社の採用力を映す鏡です。サイトの内容に違和感を感じたなら、それは採用コンセプトの言語化から見直すサインです。まずは現状のサイトを「応募を検討している求職者の目線」で読み直してみることから始めてみてください。

フレイバーズの採用サイト支援について、具体的なプロセスや制作事例はこちらのサービスページでご確認いただけます。

フレイバーズへのご相談

フレイバーズでは、採用サイトの「見た目のリニューアル」だけでなく、採用コンセプトの言語化から支援しています。

社員ヒアリングをもとに「なぜここで働くのか」を言葉にし、それを採用サイト・採用パンフレット・採用説明会の資料に一貫して落とし込む。そのプロセスをご一緒することで、「デザインを変えても変わらなかった」という課題から抜け出せます。

「採用サイトのリニューアルを検討しているが、何から始めればいいかわからない」「応募数は増えたのに採用につながらない」。そんなお悩みをお持ちの方は、まずはお気軽にご相談ください。

 

無料相談はこちら

初心者が、WordPressでコーポレートサイトを作る全手順-1

初心者が、WordPressでコーポレートサイトを作る全手順

WordPressは、初心者でも十分に扱える優秀なCMSツールだ。
一般的にはブログソフトと認知されているが、カスタマイズ次第で、社長を納得させるだけのコーポレートサイトを構築できるほどの能力を持っている。

筆者がWordPressを採用する理由は、かんたんにコーポレートサイトを作れるからというだけではない。
WEBサイトは作ることを目的とすべきではなく、運用し、ビジネスに貢献させることこそ、企業が行うべきことだという信念があるからだ。

WEB制作プロダクションの筆者が言うのもおかしな話だが、多額な費用をかけ、きらびやかなWEBサイトを作っただけでは、ビジネスに貢献することなどあり得ない。
自社製品やサービスを紹介するコンテンツを作り、修正し、また加えていく。その繰り返しをねばり強く重ねていく企業だけがネットで強くなっていく。

このコーポレートサイトの運用に、最適といえるツールがWordPressなのだ。
WordPressは検索エンジンとの親和性が高い。これは世界的に証明されている。すなわち、集客を行ううえで有利だということだ。

社長から突然自社サイトを作れと命じられた。自社サイトにあまりコストをかけられない。あなたが、こんな事情を持つ担当者なら、この記事を参考にしながら、自社サイトの構築に取り組んでほしい。半年後、なるほど!と思えることが起こるはずだ。

WordPressを企業WEBサイトに仕上げるための作業ポイント

残念ながら、いくらWordPressがすごいと言っても、インストールしただけで企業WEBサイトとしての体裁は整わない。最低限の見栄えと構成を備えるべきだ。

この記事では、プログラミングはもちろん、HTMLやCSSを編集することなく、WordPressの管理画面だけを操作して企業WEBサイトへ仕上げていく手順を紹介することがテーマだ。

  • WEBサイトの構成を考える
  • コーポレートサイトに適したテーマを選ぶ
  • コーポレートサイトには不要なWordPressの機能や表示を削除する
  • WordPressでグローバルナビゲーション(サイトメニュー)を作る
  • WordPressでTOPページ(HOME)を作る
  • WordPressで会社案内ページを作る
  • WordPressで事業内容ページを作る
  • WordPressでお問い合わせページを作る
  • WordPressで最新のお知らせページを作る
  • ヘッダー画像を差し替える

WEBサイトの構成を考える

WordPressに手を加える前にやるべきは、サイトの構成を考えること。「周到な準備があれば、レースはスタートする前に決まっている」多くのスポーツ選手が口にする言葉だ。
企業WEBサイトのミニマム構成は、おおよそ以下のようなサイトマップになる。

コーポレートサイトのミニマム・サイトマップ

WordPressには、「固定ページ」という文字通り更新を行わない定型ページと、随時更新を行っていく「投稿ページ」という概念がある。上記のサイトマップを2つの概念を使って構築していく。

青枠で囲われている

  • TOPページ(HOME)
  • 会社案内
  • 事業内容
  • お問い合せ

については、WordPressの「固定ページ」を用いて制作。

赤枠で囲われている

  • お知らせ
  • お知らせ詳細

については、更新を重ねていくコンテンツなので、WordPressの「投稿ページ」を用いて制作する。

コーポレートサイトに適した「テーマ(フォーマット)」を選ぶ

WordPressの初期状態

WordPress4.1.1(2015年4月6日現在)のインストールが完了した直後は、次のようなページが表示される。
なんだこりゃ?と感じるほど、何の趣向もないページだ。

WordPressのインストールは、先に優秀なコンテンツが存在するので、そちらを参考にされたい。
「WordPress インストール」と検索するだけで、詳細な記事がいくつも見つかるのは、最も普及しているCMSツールである証拠でもある。あなたがWordPressに関して、分からないことが出てきても、いくらでも助けてくれる人たちがいるのは何とも心強い。これも筆者がWordPressをおすすめする理由のひとつだ。

「WordPress インストール」でGoogle検索してみる

WordPressの初期状態画面

WordPressの「テーマ」を選択しよう

本格的な作業に着手する前に、WordPressのテーマを選び直す。テーマとは、デザインフォーマットのことだ。
先ほど画面キャプチャで示したテーマは、WordPressのバージョン4.1.1の初期設定で選択されているテーマだが、ページの左側に機能が集中しており企業WEBサイトとしては、なじみのないものだ。思い切って、「コーポレートサイト」っぽくなりそうな、他のテーマに切り替えよう。

管理画面にログインし、[外観]-[テーマ]を選択すると、標準でインストールされているテーマが表示される。
今回は、この中から「Twenty Thirteen」を使用する。
自分好みのテーマをネットで探し、インストールすることも可能だが、ひとまず「Twenty Thirteen」を選択してみよう。

テーマを切り替えるのは、デザインキャプチャの下に表示されている「有効化」ボタンを押すだけだ。

WordPressのテーマ一覧画面

「Twenty Thirteen」を有効にした後、サイトのTOPページ(HOME)を表示した状態。

テーマ変更後のTOPページ(HOME)

初心者が、WordPressでコーポレートサイトを作る全手順-1、後半は

次ページは「WordPressから、コーポレートサイトには不要な機能や表示を削除する」

初心者が、WordPressでコーポレートサイトを作る全手順-2

初心者が、WordPressで企業サイトを作る全手順-2

初回の「初心者が、WordPressで企業サイトを作る全手順-1」では、企業サイトの体裁をおおよそ完成させた。

第2回目となる今回は、各セクションの体裁をどうするか、どうやって更新していくかについて紐解いていこうと思う。

数あるCMSツールのなかでも、WordPressは実は初心者にとっても扱いやすいもので、なおかつ極めようと思えば、その意思に応えてくれる奥深さも備えている。

「初心者が」のキモは、あらかじめテンプレートが準備されているCMSツールを活用することによって、HTMLやCSSといった、いわゆるWEB制作の知識がなくても、WEBサイトとしてある程度の体裁を整えられることだ。

少し馴れてきたら、WordPressを使って、試行錯誤しながらでもWEBサイトにあなたのオリジナリティを組み入れていくことにもチャレンジしてほしい。

最新のお知らせを掲載する

お知らせの最新5件をページの右側(サイドバー)に表示する。
管理画面の[外観]-[ウィジェット]の「副ウィジェットエリア」に「最近の投稿」を設定すればよい。
「最近の投稿」をクリックし、「副ウィジェットエリア」をチェック、「ウィジェットを追加」をクリックする。

最新のお知らせ1 ウィジェット追加

続いて「副ウィジェットエリア」に追加された「最近の投稿」のサイト上の表示文字を変更する。
「副ウィジェットエリア」の「タイトル」欄に、表示したい文字を入力すれば変更できる。ここでは「最新のお知らせ」とした。
最新の表示件数を増やしたいのであれば、「表示する投稿数」を希望する件数に変更しておこう。

最新のお知らせ2 ウィジェット編集

ここまでの作業で、ページの右サイドバーに「最新のお知らせ」欄が追加された。

最新のお知らせ3 TOPページ

サイトのTOPページ(HOME)を作る

ここから固定ページの内容の入力を進めていく。
まずは、サイトTOP(HOME)だ。

現状は、サイトTOPには、投稿ページで入力されている最新の記事が表示される設定になっている。
ページの内容を入力する前に、サイトTOPに固定ページで作った「サイトTOP(HOME)」が表示されるように変更する。
操作は、管理画面の[設定]-[表示設定]の「フロントページの表示」を変更すればよい。
「固定ページ」をチェックし、「フロントページ」から「TOPページ」を選び保存する。

TOPページ TOPを固定ページに設定

ここまでの作業でサイトのTOP(HOME)には固定ページで作成した「TOPページ」が表示されるようになった。ここで、1点気になることが・・・。それは「TOPページ」と固定ページのタイトルが表示されていることだ。
会社案内や事業内容であればこれでいいが、サイトのTOPに「TOPページ」とは、なんともセンスがない。

TOPページ タイトル不恰好

これを解消するには、テーマを改造する方法もあるが、ここでは固定ページのタイトルをHTMLのコメント化(コメントアウト)し、表示させなくすることで回避しておく。
操作は、管理画面の[固定ページ]-[固定ページ一覧]から以前に作成した「TOPページ」を編集で開く。
そして、タイトルをHTMLのコメント記述ルールに従って修正する。HTMLのコメントは、表示したくない文字列を「<!ーー」と「ーー>」で囲めばよい。
今タイトルに入力されている「TOPページ」を「<!ーーTOPページーー>※」と修正し、更新する。

※本来は半角で記述すべき。

TOPページ タイトルコメント化

サイトのTOPページを確認すると、固定ページのタイトルは表示されなくなった。

HOME

次にTOPページの内容を入力していこう。
まずTOPページに何を掲載するかを考える。
無難なところで、

  • 事業内容をイメージできるビジュアル画像
  • 企業メッセージ

で構成する。

まず、ビジュアル画像を準備する。WordPressの管理画面の中で画像のリサイズや切り出しなどの編集も可能だが、今回は幅600px高さ200pxの画像を事前に準備した。
操作としては、先ほどと同様に管理画面の[固定ページ]-[固定ページ一覧]から以前に作成した「TOPページ」を編集で開く。そして、仮の入力内容を消去後、「メディアを追加」から準備したビジュアル画像を選択する。

TOPページの内容を入力

「メディアを追加」をクリックすると「メディアを追加」画面がポップアップするので、「ファイルを選択」から表示されるダイアログで準備しておいたビジュアル画像ファイルを選択する。

TOPページ

選択したビジュアル画像を開くと、画像をアップロードの後、以下のような画面になる。
「添付ファイルの表示設定」の中の「サイズ」をフルサイズにして「固定ページに挿入」をクリックすれば、固定ページの入力画面に組み込まれる。

TOPページ メディアを追加

以下が固定ページの入力画面に組み込まれた状態だ。

TOPページ ファイル選択

次にビジュアル画像の下に企業メッセージを掲載する。
ビジュアル画像の下あたりをクリックし、Enterキーを押すとカーソルが表示されるので、メッセージを入力して、更新する。

TOPページ ファイル挿入

TOPページを見てみよう。

TOPページ 挿入後

会社案内ページを作る

次に会社案内のページを制作する。
会社案内に関しては、次の手順で制作する。

  • MS-Excelで内容を入力
  • MS-Excelのセルをコピー、WordPressの固定ページ入力画面にペースト

この方法を用いると、HTMLを知らなくても表組みで内容の掲載が可能になる。

まず、MS-Excel上で会社案内の内容を入力する。おおよそ以下のような内容だろう。

会社案内ページ Excel

次に管理画面の[固定ページ]-[固定ページ一覧]から以前に作成した「会社案内」を編集で開く。
そして、先ほどのMS-Excelに入力した内容を範囲選択してクリップボードへコピーし、「会社案内」の編集画面でペーストすれば完了だ。

会社案内ページ ペースト

会社案内ページを見てみよう。
表組みされているので項目名と内容がきれいに面一で揃っている。
画像では見難いが罫線も入っている。

会社案内ページ

初心者が、WordPressでコーポレートサイトを作る全手順-2、後半は

「事業内容ページを作る」へ

初心者が、WordPressでコーポレートサイトを作る全手順-3

初心者が、WordPressで企業サイトを作る全手順-3

初心者でも、WordPressなら企業サイトを構築できる。前回の記事では、この命題を実現できることを証明した。

全3回でお届けする、「初心者でも企業サイトを」の最終回の今回は、もう少しWEBサイトの内容をそれっぽいものにできるような工夫を凝らしていく。

Googleがスマホサイトに対応していないWEBサイトの検索順位を下げると宣言し、戦々恐々としている担当者も多いかもしれない。しかし、もう少しだけ努力すれば、レスポンシブデザインさえカバーすることができる。もうスマホ化の心配など無用になるのだ。

前回の記事では、企業サイトのおおよその体裁を整えることに注力した。各セクションのページを作ってきたわけだが、企業サイトのツールとして必要なのは、情報の更新「お知らせページ」を設けることだ。WordPressをCMSとして使う大きな理由でもある。

WordPressで最新のお知らせページを作る

お知らせの掲載はWordPressの機能「投稿ページ」で制作する。
初期状態では「Hello World!」が1件登録されているので、「Hello World!」を削除してから新たに「コーポレートサイトをリニューアルしました。」記事を登録しておこう。

管理画面の[投稿]で投稿ページの一覧が表示されるので、タイトルが「Hello World!」のページを「ゴミ箱」へ送る。

Hello World削除

続いて「新規追加」で「コーポレートサイトをリニューアルしました」ページを作成する。
要領は、固定ページの作成と同じなので、前回の記事を参考にしてほしい。

記事入力

作成した「コーポレートサイトをリニューアルしました」ページをチェックしてみよう。
少しタイトルが大きいので、スタイルシート(CSS)に修正を加える必要がある。ただし、細かな調整はもう少し後にして、今はこのままにしておこう。

「コーポレートサイトをリニューアルしました」ページ

お知らせの一覧を見てみよう。
「未分類」と表示されるのが気になる。
「未分類」を「お知らせ」に変更しよう。

未分類気になる

管理画面の[投稿]-「カテゴリー」で現在登録されている投稿ページのカテゴリーの一覧が、ページの右側に表示される。
初期状態では、「未分類」1つが登録されている状態だ。
「編集」をクリックし、名前を「お知らせ」、スラッグを「news」に修正しておこう。

カテゴリー
カテゴリー編集

お知らせの一覧をチェックすると、「未分類」が「お知らせ」変更されている。

お知らせになった

ヘッダー画像を差し替える

企業サイト作りも、ようやく終盤にさしかかっている。こんどは、ヘッダーの背景画像とタグライン(メッセージ)を変更しよう。

管理画面の[外観]-「ヘッダー」でヘッダーのデザインなどが編集できるようになる。そのなかの「ヘッダー画像」でヘッダーの背景画像を変更する。「新規画像を追加」から任意の画像を選んで設定する。

ヘッダー画像差し替え

「ファイルをアップロード」で新たな画像ファイルをアップロードして使用する。
「ファイルを選択」から表示されるダイアログで

アップロード

ファイルのアップロードが正常に終わると「選択して切り抜く」から、ヘッダーのサイズに合った部分を指定し「画像切り抜き」で切り抜く。

切り抜き

「保存して公開」でヘッダー画像の変更は完了だ。

保存

トップページをチェックすると、ヘッダー背景が変更されている。

TOPページ

次にタグライン(メッセージ)を変更し、文字色も同時に調整しておこう。

管理画面の[外観]-「ヘッダー」でヘッダーのデザインなどが編集できるようにする。そのなかの「サイトタイトルとキャッチフレーズ」でタグライン(メッセージ)を修正する。

メッセージ変更

同様に、「色」でテキストの表示色を変更する。
「保存して公開」をクリックすれば完了だ。

文字色変更

完成したサイトを見てみよう

ここまでの作業で制作したページを見てみよう。

TOPページ

会社案内

事業内容

お問い合せ

お知らせ

スマホサイトを見てみよう

ちなみに、今回のサイト構築で利用したWordPressのテーマ(フォーマット)は、レスポンシブにも対応しており、実は、裏側ではすでにスマホサイトができあがっている。
以下にスマホページのキャプチャをいくつか紹介する。

スマホサイト・トップページ

スマホサイト・会社案内

スマホサイトのグローバルナビ

WordPressがあれば、初心者でも十分に企業サイトを構築できる

ここまでの作業でようやく企業WEBサイトを完成させることができた。ミニマムな構成であれば初心者でも企業WEBサイトが作れることが理解していただけたと思う。

もちろん、この仕上がりが最善だとは筆者は考えてはいない。しかし、企業サイトにとってほんとうに大切なことは、訪問者に対して有益な情報を提供し、それによって実現する「集客」であるはずだ。

たったこれだけのサイトであっても、訪問者が「助かった」と感じてくれるほどの有益な情報が掲載されているサイトであれば、検索エンジンも高い順位を差し出してくれる。

これを実現するためには、WordPressで構築したWEBサイトの強みを活かし、更新を怠らず、あなたの顧客候補が何を求めているかを模索し続けよう。検索エンジンのクローラーがあなたの新しいWEBサイトを巡回してくれる日は近い。

WordPressで改行や段落を挿入するには

WordPressで改行や段落を挿入するには

当社が制作するWEBサイトには、ニュースやトピックスのコンテンツ管理にWordPressを導入するケースが多い。本公開後、クライアントがニュースを掲載しようとするときによくある質問が「改行すると、行間が広くあいてしまうんだけど・・・」というもの。
WordPress初心者が感じる疑問のひとつだ。ふだん、業務で使い慣れているMS-Wordとは挙動が違うので戸惑ってしまうわけだ。

慣れてしまえばどうってことはないが、質問を受けることが多いので、今回は、WordPressの投稿画面で改行や段落を挿入するときのコツを紹介しておこう。

「CMSで改行すると、行間が広くあいてしまうんだけど・・・」

この質問の「改行」、おそらくこのクライアントは文章の途中で次の行にカーソルを移したくて「Enter」キーを打ち込んでいると思われるが、この操作は「改行」ではなく「改段落」の操作をしてしまっていることをご存じだろうか?
では、改行はどうするのか?
「Shift+Enter」キーを打ち込むことで「改行」させることができる。実は、この考え方はMS-Wordでも同じなのだ。MS-Wordの例を下に示しておく。

WordPressでの改行位置

ここでは話が混乱するので、もっと詳しく知りたい方は以下のページなどを参考にしてほしい。

「改行=Enter」じゃないって知ってた? 皆が知らないWordとPowerPointの罠!

WordPressでは、改行にならない「Enter」キーの正体

WordPressの投稿画面では、「Enter」キーを打ち込むとその前のテキストの塊をひとつの段落としてまとめ「pタグ」で括るようにHTMLが自動展開されている。下の画像では、赤ラインの部分にカーソルを位置させ「Enter」キーを打ち込んだ場合の見え方と自動展開されるHTMLを示している。

WordPressでは、改行にならない「Enter」キーの正体

「Enter」キーを打ち込むと、カーソル位置で「改段落」され、次の段落との間に規定された余白が作られる。

改行

改行

HTMLは、以下のように生成されている。

改行したあと

WordPressで改行したければ「Shift+Enter」キーを打ち込むべし

先に触れたように文章中で次の行に「改行」したければ、「Shift」キーを押しながら「Enter」キーを打てば、不意な余白が発生することなく改行することができる。下の画像では、その状態を示す。

WordPressでは、改行にならない「Enter」キーの正体

改行させたいところにカーソルを位置させ、「Shift」キーを押しながら「Enter」キーを打つ。

余白はない

HTMLは、pタグではなく改行を指示する「brタグ」が追加されている。

「brタグ」が追加されている

以上が、「Enter」キーだけを打ち込んだ場合と「Shift+Enter」キーを打ち込んだ場合のWordPressの挙動の違いだ。「挙動を逆にすればいいのに」と思ったりもするが、こればっかりは慣れてもらうしかない。

段落と段落の間を調整したい

見た目に凝りだすと段落と段落の間を「もう少し広く」などと調整したくなると思うが、残念ながらWordPressの管理画面上にはその部分を簡単に修正できる機能を備えていない。この場合は、先ほど説明した「Enter」キーを打ち込んで自動展開される「pタグ」に対してスタイルシート(css)の「マージン(margin)」を調整する必要があるが、これは、制作会社に依頼するかスタイルシートに詳しい方に作業してもらう方がいいだろう。

読みやすいページは余白がきれい

読みやすいWEBサイトは、文章自体の読みやすさはもちろんだが、ページ全体の余白の使い方が上手い。筆者は、技術情報を求めて日に何十回と検索をかけ、何十とページを読むが、そのさい行間が詰まっていて段落が取られていないページだと読む気がせず、次の検索結果から違うページに進むことがよくある。

上記のことは、訪問者が読むニュースやトピックスについても同じことがいえる。このコラムの読者には、改行と段落を上手く使いこなしてもらい、読みやすいページ作りを心がけてほしい。

WordPressのフックを利用し、記事保存時に処理を追加

WordPressのフックを利用し、記事保存時に処理を追加

WordPressでCMSを構築する際、投稿(記事)の保存のタイミングで何らかの処理を実行させたいときがある。
そういったときのためにWordPressには「フック」とよばれる機能が備わっている。
「フック」とは、日常用語からも想像できるように「引っ掛ける」という意味で、WordPressの処理のタイミングにオリジナルの処理を引っ掛けておき、同時に実行してもらう仕組みのことをいう。

WordPressが備えているフックは、投稿(記事)の保存のタイミングだけでなく、管理画面にログインした際、ログアウトした際など、多くのタイミングで「フック」が準備されている。

プラグイン API/アクションフック一覧

今回は、そのなかでも「投稿(記事)の保存のタイミング」にオリジナルの処理を「フックする」ことにフォーカスする。

1. 当社の事例

当社の事例

いきなり技術的な説明に入っても、WordPressのカスタマイズ作業に携わる人以外はピンとこないはずなので、過去に当社が実装した事例を先に紹介しておこう。

1-1. 投稿保存と同時にアップロードしたExcelの内容をインポートする

せっかくCMSを導入しても、情報入力に手間がかかるようであれば、日々の運用の効率化には寄与しない。とくに一覧表で表現されるような情報をブラウザ上で入力するのは、骨の折れる作業の代表である。
そこで当社がよく採用する手法が、Excelの定形フォーマットに事前に情報を記載してもらい、その情報を投稿(記事)の保存のタイミングでインポートする方法である。

以下は、この手法で情報を登録した例だ。

  • メーカーコーポレートサイトの製品スペックの登録
  • 不動産物件検索サイトの物件詳細の登録

ここでは、「製品スペックの登録」についてもう少し詳しく紹介しておこう。

1-2. 製品スペックの登録

当社のクライアントにはメーカー企業が多い。そのため、WEBサイト制作において必然的に製品検索機能を実装することになる。常に課題となるのは、一つ一つの製品スペックをどのようにCMSで登録させるか。扱う製品によっては、スペック項目が20~30項目にもおよび、そのうえ、製品のカテゴリーごとにスペック項目が異なるのが常である。
もちろん管理画面には、それらを加味してカスタムフィールドを駆使したカスタマイズを施すが、これだけの項目数を全製品について管理画面上から入力するには相当な労力が予想されるため、以下のように実装している。

  • スペックの項目と内容をExcel上に記載してもらう
  • CMSの管理画面上でそのExcelをアップしてもらう
  • 製品情報を保存するタイミングでその内容をカスタムフィールドにインポートする
  • サイトの表示には、カスタムフィールドにインポートされた情報をもとにレンダリングする

この機能の実装によって、とくに初期データ入力が格段に楽になった。もちろん、インポートされたスペックの内容は、管理画面上で再編集することも可能だ。

インポートするスペックExcelシートのイメージ

(インポートするスペックExcelシートのイメージ)

WEBサイト上に表示された状態

(WEBサイト上に表示された状態) ※値が未入力の項目は非表示としている。

2. 実装方法

実装方法

「投稿(記事)の保存のタイミング」には、もう少し細かなタイミングでいくつかのフックが準備されている。例えば、更新時に呼び出されるフック(pre_post_update、edit_post、post_updated)や、新規保存時に呼び出されるフック(wp_insert_post)、全ての保存時に必ず呼び出されるフック(save_post)などが存在する。

いずれのフックも実装する要領は同じである。フックはテーマフォルダーのなかにある「functions.php」に記載すればいい。以下に、何かしら記事が保存されれば、ある特定のメールアドレスにメールを送信する例を紹介しておく。

add_action( 'save_post', 'savepost_mailsend' );
function savepost_mailsend($post_ID){

    mail('dummy@dummydomain', '記事が更新されました', 'WordPressで記事の内容が更新されました。');

}

「add_action」関数が、WordPressの処理にアクションを追加(フック)する関数である。第一引数にある「save_post」が独自の処理を実行するタイミングで、さらに第二引数にある「savepost_mailsend」が独自処理が記載されている関数名。第一引数は、WordPressで決められているフックの名前(文字列)を記述し、第二引数の関数名は自由に決定すればよい。
上記の例を簡単に説明すると「記事が保存される save_post のタイミングに独自処理 savepost_mailsend をフックするので呼び出してね」とWordPressにお願いしているということだ。

「function」以降に続く記述が独自処理の内容になる。ここでは、単純にメールを発信しているだけだが、要件によってはもっと複雑な処理を記述することになる。引数には「$post_ID」が渡されるので、更新のあった記事の内容を呼び出してその内容に沿った処理を記述することも可能だ。

3. WordPressは、フックの活用で機能拡張も自由自在

WordPressは、フックの活用で機能拡張も自由自在

WordPressには、WEBサイトの開発者が欲しい関数やフック、フィルターとよばれる機能がふんだんに準備されていて、機能拡張が比較的しやすい。もちろん、WEBサイトの開発者の希望をもれなくカバーしてくれているわけではないが、バージョンアップを重ねるたびにその充実が図られている。

WEBサイトのすべてのシステム要件がWordPress上で実現可能とはいわない。当社でもスクラッチでデータベースの設計から手がけるシステムも存在する。しかし筆者は、WordPressに準備されている関数やフック、フィルターを利用することで十分にWEBサイトのCMSとしてクライアントの要望に応えられる可能性が高いと感じている。
読者のなかには、クライアントの要求仕様を見ただけで、WordPressの採用をあきらめた経験を持つ方もいると思うが、今いちどその要件をWordPressのフックと照らし合わせて考え直してみてはどうだろう。いいアイデアが浮かぶ可能性があるはずだ。

WordPressのログインURLを変え、セキュリティアップ

WordPressのログインURLを変え、セキュリティアップ

WordPressは、世界的に人気がありCMSとしても多く活用されている。それが故に攻撃の対象になりやい。攻撃者たちは、インターネットに公開されているサイトに無作為に攻撃を仕掛け、WordPressの穴をついて無理やりにでも入り込もうとアタックを仕掛けてくる。特に存在が明らかになったログイン画面へのアタックは、執拗に繰り返される。

以前に当コラムにおいて、ログインアタック対策に有効なプラグインとして「Limit Login Attempts」を紹介した。このプラグインは、ログイン認証に規定回数以上失敗した場合にログイン処理をロックするというものであった。

今回は、アタックの対象となるログイン画面の存在を隠してしまう「Login rebuilder」について紹介しよう。

ログイン画面のURLは、バレるものと考える

ログイン画面のURLは、バレるものと考える

WordPressのログイン画面は、ただ単にインストールした状態であれば「インストール先/wp-login.php」もしくは「インストール先/wp-admin」をURLに指定すれば簡単に表示させることが可能だ。WordPressで記事を入力したことのある読者であれば容易に想像がつくだろう。

「当社のサイトは大丈夫。インストール先を複雑な文字にしているから」

なんて思っているのであれば、それはまったく無意味なこと。ブラウザの機能でソースを表示すれば、インストール先はちゃんと書かれている。HTMLが読める程度の知識があれば難なく知ることができるのだ。

そのうえ、攻撃者たちは、そんなことは百も承知だ。
あなたのWEBサイトのすべてのページを解析して、機械的に、瞬時に調べ上げる。ログイン画面が攻撃者の目の前に表示されるのは、おそらく1時間とかからないだろう。
攻撃者の前に明らかになったログイン画面は、攻撃対象リストに組み入れられ、連日連夜、執拗なログインアタックを受けることになる。

プラグイン「Login rebuilder」でログイン画面を隠す

プラグイン「Login rebuilder」でログイン画面を隠す

Login rebuilderは、ログイン画面のファイル名(URL)を標準の「wp-login.php」から任意のファイル名に変更することができるプラグイン。「そもそもログイン画面のURLを知られなければ、ログインアタックの対象にもならないでしょ」というロジックだ。

Login rebuilderでログイン画面のファイル名を十分に長い推測不可能なファイル名に変更すれば、ログインアタックに対するセキュリティは、数段強化されることになる。

Login rebuilder のインストールと設定

1.入手とインストール

(図)有効化

Login rebuilderはWordPress.org(リンク先:https://wordpress.org/plugins/login-rebuilder/) からダウンロードすることができる。
インストールは、ダウンロードした圧縮ファイルを解凍後、[/wp-content/plugins」へアップロードし、管理画面の「プラグイン」から「有効化」すれば完了だ。
ただし、実際に機能させるためには、いくつかの設定と作業を施す必要がある。

2.Login rebuilderの設定

(図)ログインページ

Login rebuilderの設定は管理画面の「設定」-「ログインページ」から行う。

以下がLogin rebuilderの設定内容だ。

(図)設定の全容

3.新しいログイン画面用ファイルの設置

Login rebuilderを機能させるには、「新しいログインファイル」を準備する必要がある。新しいログインファイルは、ログイン画面のURLの一部となる。

新しいログインファイルを設置する方法は以下の通りだ。

まず、新しいログインファイルのためのファイル名を決め、管理画面の中の「新しいログインファイル」をそれに合わせて変更する。この時、「新しいログインファイル」は、推測が困難なできるだけ長いファイル名とすること。この例では、「new-login_b3ljohwpk8mxsra3.php」として新しいログインファイルを作成した。

そして次に、「新しいログインファイル」の記述に従って、実際のファイルを準備する。
変更した「新しいログインファイル」欄の直下に格納するパス示されるので、最終的に新しいログインファイルは、このパスに保存する。このとき、元々のログインファイルである「wp-login.php」を削除する必要はない。処理的には一旦新しいログインファイルを通過させてから、「wp-login.php」の処理を実行させる形を取るからだ。

新しいログインファイルには、さらにその下に示されるソースコードをコピーして貼り付け、先ほど決定した「新しいログインファイル」のファイル名で保存し、サーバーの指定パスにアップロードするだけである。

(図)新しいログインファイル

4.標準のログインファイルにアクセスがあったときの挙動

新しいログインファイルを設置しても、標準のログインファイル「wp-login.php」へのアクセスが止むことはないが、そこにはもうログイン画面は表示されない。Login rebuilderの設定には、標準のログインファイル「wp-login.php」にアクセスがあったときの挙動(応答)を指定できる。

正規の編集者や管理者であれば、新しいログイン画面のURLを知っているはずなので、標準のログインファイル「wp-login.php」へアクセスがあった場合は、「403ステータス」すなわち「アクセスが禁止されています」として応答すればいいだろう。「無効なリクエスト時の応答」には「403ステータス」を指定すればOKだ。

「サイトトップへリダイレクト」は、サイトの負荷を上げることにもなるのでお勧めしない。

(図)標準のログインファイルへのアクセス設定

5.稼働開始:驚くべきセキュリティ効果を体験せよ

基本的な設定は以上である。
「ステータス」を「稼働中」に設定し、「変更を保存」をクリックすれば導入完了だ。
たったこれだけの手間で、あなたが長い間不安に感じていたログインアタックから解放される。今日からあなたはログインアタックについての心配の種はなくなるし、上長にも胸を張ってセキュリティ対策の効果をアピールできるようになる。

ただし、ログインURLが変更になったことを運用担当者に忘れずに連絡しておこう。さもないと、せっかくのあなたの努力が社内からのクレームの嵐で水泡に帰してしまう。

(図)本稼働設定

セキュリティの確保は運用者の責任

セキュリティの確保は運用者の責任

不可解な目的を持ってアタックを仕掛けてくる攻撃者は、非難されてしかるべきだし、もっての外であるが、そのことを声を大にして叫んだところで攻撃者の耳に届くことはない。WEBサイトの運用者や担当者は、可能な限り対処できる対策を粛々と打つしか方法はないのである。

今回紹介したプラグインは、新しいログインファイルを準備するなど、少し作業が必要だが、ぜひ導入にトライしてもらいたい。ログイン画面が露呈しているのと、いないのとではあなたのWEBサイトのセキュリティに雲泥の差がでてくる。Login rebuilderを活用し、今日からログインアタックを気にしない余裕のWEBサイト運営者になろうではないか。

WordPessをスムーズに移行するための安全策

WordPessをスムーズに移行するための安全策

WordPressをCMSとして活用した環境を移行する際に、注意すべきポイントがいくつかある。カスタマイズを加えたWordPressのモジュールやデータベースの扱いだ。
たとえば、リニューアル時の開発用サーバーから本番サーバーへ、新しいサーバーの乗り換えでも慎重に移行を進めなければならない。

コーポレートサイト構築の際に、トピックス(お知らせ、新着情報)や製品検索などのCMSとしてWordPressを活用するケースは多い。
この記事では、WordPressをサーバー移行する際の、データベースの扱いについて、注意点について紹介しておく。スムーズかつ安全に異なる環境にWordPress一式を移行するための参考にしてほしい。

ドメインをデータベースに抱え込んでしまうWordPress

ドメインをデータベースに抱え込んでしまうWordPress

WordPressは、非常によく考えられて、よく作り込まれたソフトウェアであるが、約7年前にWordPressを扱い始めてから今日までずっと不満でならないことが1つだけある。

それは「データベースにドメインを抱え込む」ことだ。

WordPressは、記事のテキスト情報と一緒に記事中に掲載した画像へのリンクをドメインを含めて記録してしまっているのだ。たとえば「http://www.samplesite.ac/img/photo.jpg」の様に、絶対パスで記憶してしまっている。
ひと工夫すれば、絶対パスで記録しなくてもいいようにできそうなものだが、いまだに絶対パスのままだ。
この状態のまま、本番サーバーにデータベースを移行してしまうと、画像ファイルなどは、開発サーバーを参照してしまうことになる。

「WordPress お引越し」や「WordPress サーバー移行」などでネットを検索すると、プラグインを用いたり、データベースにSQLでパッチをあてたりと、いくつかの方法を見つけられるが、当社ではデータベースのエクスポートファイルを直接書き換えることで対応している。
テキストエディタの一括置換で済むこの方法が最も時間がかからず、お手軽だ。

以下に、簡単な手順を紹介しておこう。

テキストエディタの一括置換

テキストエディタの一括置換

  1. mysqldumpコマンドか、phpMyAdminからWordPressで使用しているデータベースをエクスポートする。
    通常、なにも指定しなければSQLで構成されたダンプファイルとして作成される、
  2. 次の吐き出されたダンプファイルをテキストエディタで一括置換する。
    旧サイトが「「http://www.samplesite.ac/」で表示されていた場合、「www.samplesite.ac」の部分を「www.newsite.ac」に文字列置換すればよい。
  3. あとは、再びmysqlコマンドか、phpMyAdminで本番サーバーのデータベースへインポートすれば完了だ。

HTMLの記事、固定ページをインポート

HTMLの記事、固定ページをインポート

当社の制作するWEBサイトは、サイト全体をWordPressで完結させることは稀で、更新頻度の少ないページは、静的HTMLで制作している。しかし、更新頻度が少ないページのなかでも定期的に更新が必要なページは、WordPressの「固定ページ」に入力して、その内容をクライアント自身で編集可能な形にしている。

固定ページとして入力する際、ページデザインに図表が組み込まれていることが多いため、HTMLの形式で入力しているが、このHTML入力はサーバー移行の際に手を焼かせてくれる。

前項で紹介したとおり、移行に際してデータベースをphpMyAdminでエクスポートすると、通常はSQL文の塊としてダンプファイルが生成される。このダンプファイルを本番サーバーでインポートする際、記事や固定ページにHTMLが記述されているとエラーを起こすことがある。

ただ、すべてのケースでエラーが起きるわけではない。エクスポートする際のダブルクォーテーションやシングルクォーテーションの処理に不具合があるか、インポートする際の解釈に問題があるかでエラーを起こすことがあるのだ・・・。

これが本番公開を間近に控えた本番サーバーへの移行作業の際に判明すると「データベースが移行できない!!」と焦ってしまうことになるのだ。しかしこの記事を読んでいるあなたは、もう心配することはない。エクスポートする際に、ひと工夫するだけで回避できるので安心してほしい。

そのひと工夫とは、phpMyAdminでデータベースをエクスポートする際に「XML」形式でエクスポートするだけだ。インポートの際は、phpMyAdminが自動的に認識してくれるので何も気にする必要はない。

エクスポート指定

WordPressの移行用プラグインも

WordPressの移行用プラグインも

WordPressの開発者がどこまで考慮しているかは不明だが、一度構築したWordPressの環境一式を移行する部分については、いまひとつ配慮に欠ける部分があるのは事実だ。

しかし心配することはない。今回紹介した方法は、まだサーバー移行のプラグインが充実していない頃からWordPressを扱っていた筆者が実行してきた方法のひとつであるし、今では、サーバー移行用のプラグインをいくつか見つけることができる。そのなかでも「Duplicator」が使い勝手が良さそう思われるので、機会があれば実務で使用し、次回はレポートとして紹介しようと考えている。

WordPressでPDFを取り込む方法と、気をつけるポイント

WordPressでPDFを取り込む方法と、気をつけるポイント

CMS導入がコーポレートサイト構築時の機能要件として必須となったいま、対象となることが多いのがニュース、トピックス、新着情報などと呼ばれるセクションだ。
このセクションの機能として、多いリクエストはPDFの掲示だろう。もっとも、情報の根幹となるテキストの整形、写真の挿入機能などを省いてのことではあるが。

この記事では、CMSとしてWordPressを採用しているコーポレートサイトにおいて、特別なプラグインをインストールすることなくPDFを掲示する方法をお伝えする。

予算の関係でそこまでの作り込みが依頼できなかった、もしくはWEB制作会社の配慮がなかったために、PDFを掲示するための機能が盛り込まれていないCMSをご利用のWEB担当者の参考になれば幸いだ。

あなたがWordPress初心者であっても問題ない。
カスタマイズされていない管理画面で、なおかつWordPress標準のエディターを利用するだけ、という条件でPDFを掲示できるようになるポイントを紹介しているからだ。

PDFの掲示で、おさえておきたいこと

PDFの掲示で、おさえておきたいこと

WordPressの操作方法の説明に入る前に、PDF改ざんの可能性について確認しておこう。

コーポレートサイトで注意すべきことのひとつに、ファイル改ざんのリスクがある。
PDFファイルは、リードオンリー(書き込み不可)の電子ドキュメントとの認識している方がいるが、PDFは簡単に書き換え可能な電子ドキュメントなのだ。
Adobe社のAcrobatやサードパーティのソフトが手元にあれば、内容の書き換え、編集など簡単にできてしまう。それなのに、重要な決算情報やニュースリリースに書き込み不可とするセキュリティをかけていないPDFドキュメントが多いのが現実なのだ。

オウンドメディアとしてWEBサイトで情報をダイレクトに発信するにあたっては、インターネットの怖さ、悪意の第三者から身を守る最低限のリテラシーを持ち合わせておくべきだ。

書き込み不可にするセキュリティ設定は、前述のAdobe社「Acrobat」を利用しよう。
まず、「ファイル」>「プロパティ」>「セキュリティ」タブから表示される画面を表示させ、図で示す設定を行う。たったこれだけの手間をかけるだけで、あなたの会社のセキュリティレベルは格段にアップする。

大量のPDFファイルに対してセキュリティ設定を施す場合は、「アドバンスト」>「文書処理」>「バッチ処理」からバッチ処理で一括処理することも可能だ。

Acrobatのセキュリティ設定

WordPressでPDFを取り込む方法と、気をつけるポイント、後半は

次ページ「PDFファイルへのリンク方法」へ