WordPressサイトを引っ越しする3つの方法。サイト規模・難易度別まとめ

moving-wordpress最近Wordpressで作ったWebサイトやブログを別のサーバに引っ越しさせたり、二つのサイトを一つにまとめる(このブログがそう)といった作業を立て続けに何度かやる機会がありました。

サイトの規模が小さければチャチャっとプラグインで移動できますが、少し規模が大きくなってくるとプラグインでエラーがでたり、うまくいかなかったり…と何だかんだ時間が取られるもので、次回の引っ越し作業で困らないように3つの方法を覚書きにしてみました。

 

 

1.難易度:易、小規模~大規模サイトに。Wordpressのインポート・エクスポート機能(+手動での作業)

この方法は基本的に小規模でも大規模なサイトでもOKな方法です。DBの管理画面(phpMyAdmin)やFTPを必要とせずWordpressの管理画面からだけの作業なので、あまりWeb関連の作業に自信がない場合は、この方法が一番心理的負担も少なくオススメ。でも丸ごと引っ越しさせられるわけではないので、基本的なコンテンツを引っ越した後、最後は手作業が必要になります。なので、ちょっと面倒くさいですが、誰にでもできる方法だと思います。

以下が手順。

投稿や固定ページ、カスタム投稿、コメント、カテゴリー、タグなどを引っ越し

まずはWordpressのインポート・エクスポート機能を使って基本的なコンテンツを移行させます。

  1. 引っ越し先のサーバーにWordpressを新規インストールしておく
  2. 引っ越し元のサイトのWordpress管理画面から、ツール>エクスポート を選択、全てのコンテンツをエクスポート(ダウンロード)する
  3. 1でインストールしておいたWordpressの管理画面で、ツール>インポート を選択。
  4. WordPressの欄から「インポータの実行」をクリックする
  5. 2でエクスポートしたファイルを指定し、「添付ファイルをダウンロードしてインポートする」にチェックを入れてインポートを実行する

 

これで投稿や固定ページなどメインのコンテンツは引っ越しできているはずです。

※「添付ファイルをダウンロードしてインポートする」にチェックが入っていると、投稿や固定ページないでリンクされているメディアファイル(画像など)も自動的にインポートしてくれます。が、サイトの規模が大きい場合にはうまくインポートが行われないこともあるようです(経験済み)。この場合は、手動でFTP経由でファイル類を引っ越しさせる必要があります。

 

ウィジェットの引っ越し

WordPressのインポート・エクスポート機能ではウィジェットやメニュー、ユーザーなどはエクスポートできません。

このうちウィジェットはWidget importer & exporter というプラグインを利用することで元サイトからウィジェットをエクスポート&新サイトにインポートすることができます。とても便利なのでオススメです。

 

その他のコンテンツを手動で復元させる

上記以外のコンテンツは、引っ越し前のサイトとにらめっこしながら自分で手作業で新しいサイトに作成していくことになります。具体的には

  • ユーザー情報
  • サイトの各種設定(表示設定、パーマリンク、タイトル、テーマのカスタム設定など)
  • メニュー
  • プラグイン
  • 投稿のアイキャッチ画像

といった情報です。面倒くさいですが、ここが終わればほぼ引っ越し完了です!

 

ドメインが変わる場合は投稿や固定ページ、ウィジェット内のリンクを変更する

引っ越しに伴ってドメインが変更となる場合、投稿記事や固定ページ、ウィジェット内に貼られている内部リンク(サイト内リンク)や画像URLなどが古いサイトのままになっている可能性があります。チェックしてみてください。

これを新しいドメインに変更するのに一個一個変更しているのではあまりに面倒くさすぎる!ので、Search Regexというプラグインを使って一括変換します。

※ドメインが変更となる引っ越しでは重複コンテンツでのGoogleペナルティを避けるために元サイトから301リダイレクトをし、Google Search Consoleでアドレス変更の申請をする必要あり。このあたりは、以下の過去記事で書いているので良かったら参考にしてみてください。

サイト移転時の301リダイレクト手順とSearch Consoleでのアドレス変更まとめ

 

複数のサイトやブログを統合する場合は、この方法で

一つのサイトを別サーバーに移動させる、というのではなく、AサイトとBサイトがあって、BサイトにAサイトを統合させるという場合は、この方法、つまりWordpressのエクスポート・インポート機能を使うことになります。

ざっくりメモ書きしておくと、Aサイトから投稿その他のコンテンツをエクスポートして、Bサイトにインポート。その後、プラグインSearch Regex等を使ってリンクを調整、AサイトからBサイトへ301リダイレクト、Search Consoleでアドレス変更通知という感じです。やることは難しくないのですが、やはりちゃんと移行できているかどうか一記事ずつ表示チェックをしたりするとやたら時間がかかります(80記事の移動で一週間くらいダラダラ作業していました。。)

 

では続いて2番目の方法。

 2.初級。小規模サイト・ブログ向け。Duplicatorプラグインで楽々引っ越し

WordPressの引っ越しに非常に便利なプラグインがあります。Duplicatorというのですが、これでできる引っ越しほど楽なものはないです。多分、1時間もかからずに作業が完了してしまうのではないでしょうか。。

WordPressサイトの引っ越しを考えている方はとりあえずこのプラグインで引っ越しできるかどうか試してみることをオススメします。

「試してみる」とかいたのは、サイトの規模が大きくなるとほぼエラーが出てしまうからなんです。。コンテンツに含まれる画像の量やサイズにもよると思いますが、80記事くらいのブログはエラーがでて全然ダメでした。。

ただ、最初にエラーがでても不要なプラグインとかメディアファイル、キャッシュを削除するなどすれば使える可能性もありますのでトライしてみてください。

具体的な使い方はウェブさえさんの以下の記事がとても詳しく分かりやすい解説でオススメです。

プラグインでWordPressを楽々お引っ越し!duplicatorならサーバー移転も簡単。

 

3.難易度:やや難、中~大規模サイト向け。プラグインなしで自分でDBとファイル類を引っ越す方法

Duplicatorプラグインで簡単に引っ越しができない中~大規模サイトの場合、DBとファイル類を手動で移動させることができると1のやり方のように面倒な手作業が少なくて済みます。

やり方は以下の通り

 

DBのエクスポートとインポート

  1. 前準備として引っ越し先のサーバーに新しいDBを作成しておく
  2. 引っ越し元のサーバーでデータベース管理画面(phpMyAdmin)にアクセスし、引っ越し元サイトのDBのテーブルを一括エクスポートする
  3. ダウンロードした2のsqlファイルをテキストエディタなどで開く
  4. sqlファイルを見ていき、元のテーブル名の接頭辞が、新しいDBのテーブル(1で作成)の接頭辞((例:テーブル名がwp_posts, wp_postmetaなどとなっている場合は接頭辞はwp_)と異なる場合は、新しいDBのテーブルの接頭辞になるように変換する(テキストエディタの文字列一括置換などで)
  5. 準備しておいたDBで4のsqlファイルをインポートする

 

ファイル類のエクスポートとインポート

  1. 元サイトのサーバにアクセスし、サイトのファイル類(Wordpress本体が入っているフォルダ)を丸ごとローカルにダウンロードする
  2. 1でダウンロードしたファイル類の中からweb-config.phpを開き、新しいDBの接続情報に変更する
  3. ダウンロードしたすべてのファイルを新しいサイトのサーバーのWordpressを設置する場所にアップロードする

 

書いてみると1番目よりこの方法のほうが随分シンプル。。一度慣れてしまえば一番面倒くさくない方法かもしれません。

 

ドメインの変更がある場合はコンテンツのリンクを一括変更

引っ越しに伴ってドメインの変更がある場合、投稿その他のコンテンツ内のリンクを新しいドメインに変更する必要があります。これにはSearch Regexというプラグインがお勧め。一括変換してくれるので楽々です。1番目の方法の最後にも書いていますがドメインが変わる場合は301リダイレクトとSearch Consoleでのアドレス変更通知をお忘れなく!

 

WordPressでCSSの変更内容が表示に反映されない4つの原因と解決法

cache-problemWordPressでスタイルシート(cssファイル)の内容を変更しても、その変更内容が表示に反映されないときがあります。特にキャッシュ系のプラグインやCloud FlareなどのCDNサービスを使っている人に起こりやすいのですが、最近、変更してずいぶん時間が経っているのに変更内容が一向にブログの表示に反映されないことが何度かありました。その時の解決法も含めて、考えうる原因と解決法についてまとめたいと思います。

原因その1: 変更したcssの記述が正しくない

あたりまえですが、cssが正しく記述されなければ表示もちゃんとされませんよね。単純なことですけど、コロン(:)やセミコロン(;)が抜けていないか、{}で閉じられているか、など再チェックしましょう。

cssの変更の際には、ブラウザの開発ツールを使うとミスが少なくなり、編集スピードもグッとあがります。

超時短!ブラウザ上でCSSの編集がサクサクできる開発ツールの基本的な使い方

 

原因その2: ブラウザのキャッシュが効いている

ブラウザのキャッシュにより、以前の状態が表示されていることがあります。ページを2~3度、再読み込み(F5キー押下)すると表示が新しくなることがあるので、試してみてください。でも、Wordpress側で、ページの読み込み速度を高速化するためのキャッシュプラグインを使用している方は、これだけだとうまくいかないことが多いです。その場合は次!

 

原因その3: Wordpressのキャッシュ系プラグインのせい

私はW3 Total Cacheプラグインを使用して、ページキャッシュ、ブラウザキャッシュなどの設定をしています。こういうキャッシュ系のプラグインを使っていると、スグに変更が反映されないときが多いです。W3 Total Cacheの場合、Purge from cacheやEmpty all cachesといったメニューがあるので、それを実行してキャッシュをいったん削除します。その他のプラグインも似たような機能がついていると思うので、Wordpressのダッシュボードから確認してみてください。

 

原因その4: Cloud Flareのキャッシュのせい

W3 Total Cacheと併せて利用するとかなり高速化の効果が高い、CDNサービスCloud Flareですが、少し前に仕様が変わったのか、以前のやり方では、変更前のcssの状態がかなり長く続いてしまう、ということに気づきました。。

Cloud Flareについてはこちらの記事も見てみてください。

ブログ表示速度をアップさせるために使っているプラグインとCloudFlare

 

以前は、ログインして、一時的にDevelopment Mode(開発モード)に設定しておけば、cssやjavascriptなどをキャッシュしないで(CDN経由にしないで)表示してくれ、編集がすべて終わった後に、Development modeを終了しておけば、その編集内容が引き続き表示に反映されていました。

が、最近は、Development modeを終了すると、編集内容がすべてなかったかのように、以前の表示に戻ってしまう…という事態が何度か発生。「一日経てば表示が更新されるだろう」と思って放っておいたら、ナント一週間たっても更新されないままでした!

焦って、CSSが書き戻されていないかなどチェックしなおしたりしたのですが、最終的に分かったのは、これです。

Cloud FlareのCacheメニューからキャッシュをクリアーしないと、変更が反映されない。

でした。。

 

いや~、意外にハマってしまった。。以下、キャプチャとともに解決法を載せたのでCloud Flareをお使いの方はぜひ一度確認してみてください!

 

CSSの編集をする際には、Overview のところでStatusをDevelopment modeに変更します。

Cloud flare

 

Development Modeが有効になっているときは、cssの変更がスグに表時に反映されるはずです。(されない場合は、キャッシュプラグインの方のキャッシュも削除)

 

重要なのは、CSSの編集を終えて、Development Modeを無効化するとき。まず、Cachingのメニューに移って、Purge everythingをクリックします。こうすることで、以前Cloud Flareがキャッシュしていたファイルはクリアされ、変更後の状態を新たにキャッシュしてくれます。
Cloud flare

 

最後にDevelopment Modeを無効化して完了。

Cloud flare

WordPressをサーバーにインストールする方法(さくらサーバー)

この記事では、レンタルサーバー(さくらインターネット)にWordpressをインストールする方法を図解しています。さくらインターネットもそうですが、多くのレンタルサーバーではWordpressを簡単にインストールできるツールが備わっていて、初めてでもほんの15~20分もあればインストールが完了します。さくっとインストールしていきましょう^^

 

ちなみにこの記事はWordpressでつくるブログ(またはウェブサイト)のドメインがサーバーに設定されていることが前提で話が進んでいきます。

WordPressでブログやサイトを運営するには、

  1. サーバをレンタルする
  2. 独自ドメインを取得する
  3. ドメインをサーバーに設定する
  4. WordPressをサーバーにインストールする

という手順がまず必要になります。この記事では4番目の手順について解説していますが、1~3についてはこちらの記事でそれぞれ解説しています。これからWordpressを始める方は参考にしてみてください。

では本題に入っていきます!^^

 

データベースを作成する

まず、Wordpressで作るブログやサイトの情報を保管するデーターベースを作っていきます。

さくらインターネットのコントロールパネルにログインしましょう。

コントロールパネル

 

左サイドバーから「データベースの設定」を選択します。

さくらインターネット データベースの設定

 

「データベースの新規作成」をクリックします。

さくらインターネット データベースの設定2

 

データベース名を設定します。後からデータベース一覧を見た時にどのブログ(またはサイト)のデータベースなのか分かるような名前を設定しておくといいですね。データベース文字コードはUTF-8を選択してください。

さくらインターネット データベースの設定3

「データベースを作成する」をクリックします。

データベースが作成されると、データベース一覧が表示されます。作成したデータベース名が表示されていることを確認しておきましょう。

 

では次に、Wordpressのインストールです!

WordPressをサーバーにインストールする

コントロールパネルの左サイドバーから「クイックインストール」を選択します。

wpinstall1

 

カテゴリーメニューから「ブログ」を選択し、インストールメニューから「Wordpress」を選択します。

Wordpressインストール手順2

 

 

インストール先の一番目のボックスには、今回使用するドメインを選択します。二番目のボックスにはWordpress用のファイル類を保存するフォルダ名を指定します。wpとか、適当につけましょう。

データベースには、先ほど作成したデータベースを一覧から選択します。

テーブルの接頭語は表示されている文字列のままでoKです。

Wordpressインストール手順3

 

入力内容を今一度見直して、インストールボタンをクリックします。

 

無事にインストールが完了すると以下のような表示になります。「アプリケーションの設定へ進む」をクリック。

Wordpressインストール完了

 

 

WordPressのインストール画面が表示されるので必要な情報を入力します。ユーザー名とパスワードはこの後すぐに必要になるのでメモっておきましょう。

Wordpressインストール

 

 

WordPressのインストールの完了画面が表示されたらログイン画面へと進みます。ユーザー名とパスワードを入力してログイン!

 

Wordpressログイン

 

 

ダッシュボードが表示されたらオメデトウございます!! 早速セキュリティのために一つ、作業をしておきましょう。

 

ニックネームを変更する(セキュリティのため)

WordPressをインストールした直後は、管理者(あなた)のユーザー名と、ブログに表示されるあなたのニックネームが同じものになっています。これは変更しておかないと、ログイン情報の半分を公開しているようなもので危ないので、すぐにニックネームを

変更しておきましょう。

ダッシュボード左のメニューから ユーザー > あなたのプロフィール を選択します。

「ニックネーム」のところを「ユーザー名」と違うものに変更し、ブログ上の表示名のところは「ニックネーム」を選びます。下の方にいって「変更を保存」をクリックして完了です。

 

Wordpressニックネームの変更

 

 

WordPressのインストールは以上です。お疲れ様でした!

 

WordPressでブログを初めて作るならまず最初に知っておきたい予備知識

今回の記事では、Wordpressでブログを作って運営していくのに必要となるものと予備知識についてまとめています。

初めてWordpressでブログを作る方で、「自分、あまりPCやインターネットの用語に詳しくないな~」と思っている方は、実作業に入る前に、ぜひこの記事の内容を一読してみてください。自分で実際に作業していくと色々クリアになってきますので、全部理解できなくても大丈夫です。気軽な気持ちで読んでみてくださいね^^

ブログ開設に必要な環境

PC+ブラウザ

WordPressでブログやサイトを作るには、パソコンが必要になります。スマホやタブレットからも記事の投稿や更新などはできるのですが、最初に色々設定していく際は特に、管理画面での細かな作業はパソコンなしではキツイと思います。

 

ブラウザも必須。何でもいいんですが、できればIE以外にしてください。Chromeが私はおススメです。

Chromeがインストールされていない場合は以下のリンクからダウンロードできます。

Chromeブラウザのダウンロード

 

インターネット

WordPressはサーバーにインストールして利用します。基本はインターネットに接続できないと記事の投稿や編集などもできません。また画像のアップロードなども時々あるので、ある程度、回線速度が安定したネット接続環境を用意するようにしてくださいね。どれくらいが安定した回線速度なのか、といわれると難しいですが、低速なモバイル通信とかじゃなければ大丈夫だと思います。

 

WordPressブログ作成に必要な4つのもの

WordPressでブログを作っていくのに必要なものは

  1. レンタルサーバー
  2. 独自ドメイン
  3. WordPress本体
  4. WordPressテーマ(テンプレート)

の四つです。

 

そしてブログに記事を投稿できるようになるまでに、 おおまかに四つの段階があります。

  1. レンタルサーバーを借りる
  2. 独自ドメインを取得する
  3. WordPressをサーバーに設置する
  4. テーマをWordpressにインストールする

それでは以降でそれぞれについて簡単に説明をしていきますね。

 

レンタルサーバー

レンタルサーバーとは

ブログをインターネット上に公開するためには、ブログを発信する拠点が必要ですよね。その拠点となるのがレンタルサーバーです。

レンタルサーバーにWordpressをインストールし、ブログのデータ(設定情報、記事や画像など)を保存することで、インターネット上でブログを公開できるようになります。

サーバーとWordpress

レンタルサーバーは性能やサーバー会社によって異なりますが、Wordpressが利用できるサーバーは月額300~1500円くらいで借りれます。

 

レンタルサーバーでブログを運営するメリット

レンタルサーバーをわざわざ借りてブログを運営するとなると、「難しそう。面倒くさそう」と思ってしまうかもしれません。無料ブログサービスを利用していれば、必要ないですからね^^; でもレンタルサーバーでブログを運営することにはとても大きなメリットがあるんです。

そのメリットとは「安定性」です。無料ブログサービスだと突然、利用規約が変わって急にブログが更新できなくなったり消されてしまうということがありますが、サーバーを借りてブログを運営すれば、他者によってブログが消されてしまうということはなくなります。

Googleアドセンスなどを利用してブログから収益を得たいと思っている場合や、個人ブログのように情報を何年も蓄積していく場合、それが「消されない」という安心感はすごく重要ですよね。

それにサーバーを借りること自体は全然難しくないので安心してくださいね^^

 

では次に、独自ドメインとは何か、なぜ独自ドメインを取得する必要があるのか、見てみましょう。

 

独自ドメイン

独自ドメインとは

ドメインは、簡単にいうと、インターネット上の住所のようなものです。あなたの家の住所は、世界に二つとありませんよね。ドメインというインターネット上の“住所”も世界に一つだけです。その“住所”があるおかげで、人々はインターネット上であなたのブログやサイトにアクセスすることができます。

 

以下のようなURLのピンク色の文字の部分がドメインと言われる部分になります。

http://○○○.com

 

特に○○○の部分は、自分で好きな文字列に設定でき、これを独自ドメインと呼びます。

 

例えば、当ブログのURLは http://locatimefree.com ですが、 独自ドメインを取得するときは、locatimefreeという部分の文字列は自分で決めて、 その後ろの部分は.com .net .biz などから好きなものを選ぶことになります。

独自ドメインはドメインを提供する会社や、.comにするか.netにするかなどにもよって価格が変動しますが、年間1000~2000円くらいを考えておけば大丈夫です。

 

独自ドメインを使うことのメリット

独自ドメインでなければ、無料で使えるドメインもありますが、わざわざ独自ドメインを使うことにはメリットが幾つかあります。

自分の好きな名前にできる

サイトやブログの名前やテーマに合ったドメイン名にすることができるので愛着がわきます。自分で決めた文字列に.com や .bizなどがつくだけのシンプルな形なので覚えやすいですし、覚えてもらいやすいです。覚えてもらいやすいっていうのはアクセスアップ・ブランディングのためにも重要だったりします。

 

SEOに強い

独自ドメインの方が他のドメイン形式に比べて検索エンジンによる評価が高くなります。

評価の高い順に

  1. 独自ドメイン 例) http://sakura.com
  2. サブドメイン 例) http://○○○.sakura.com
  3. ディレクトリ形式 例) http://sakura.jp/○○○/

となっていて、無料ブログサービスを使う場合など、無料で使えるドメインは基本、サブドメインやディレクトリ形式のドメインになっています。こういった場合、検索エンジンでサイトを上位表示させるのが格段に難しくなったり、同じドメインを使っている他のユーザーの影響を受ける可能性があったりします。独自ドメインならこういった心配もないので安心です^^

 

自分で変えなければずっと変わらない

独自ドメインを持ち続けることで、以下のような大切な資産が築かれていきます。

  • バックリンク(他のサイトやブログ、SNSなどからリンクされること)
  • 検索エンジン(Googleやyahooなど)の評価
  • ドメイン年数

これらは検索エンジンでの上位表示に欠かせない要素。もし、ドメインが変わってしまたら、せっかくの被リンクや、検索エンジンの評価、ドメイン年数は水の泡。またゼロから再スタートしなければいけないんです。

例えば、無料ブログサービスのドメインを使っていて、急にそのサービスが終了した場合、自分が使っていたドメインが無くなってしまったり、あるいは別のものに変更になってしまうかもしれません。

 

サイトやブログを長く運営すればするほど、築いたものを失った時の痛手は大きくなりますので、長期的な目で見るなら独自ドメインを持っておくのが安心です。

 

 

 

ちょっと長くなりましたが、次は、Wordpress本体についてです。

WordPressワードプレス

WordPress(ワードプレス)とは、一言で言うと、本格的なブログやウェブサイトを簡単に作るためのWebアプリのようなものです。コンテンツ・マネージメント・システム(CMS)といわれるウェブサイト管理・更新システムの一つで、現時点では、世界で最もシェア率の高いCMSになっています。

公式サイトhttp://ja.wordpress.org/

WordPress本体は無料で使うことができ、また拡張機能として追加できるプラグインも無料で使うことができるものが本当っにたくさんあります。基本的にはサーバーとドメインにお金がでていくだけで運用が可能な、何ともありがたいリーズナブルなシステムなんです。

最初は少しとっつきにくいと感じるかもしれませんが、慣れてくればサクサク作業を進められるようになりますよ^^ 私はプログラミングの経験がなくてもワードプレスでブログを作って更新している人を何人も知っています。

 

WordPressのテーマ

WordPressのテーマは、ブログやサイトの各パーツをどう配置するか、どんなデザインにするかなどが記述されたファイル一式のことを言います。「テンプレート」というほうが分かりやすいかもしれませんね。

例えば、当ブログの一番上にはブログタイトルやメニューバーのあるヘッダーがあり、左側のコンテンツ部分に記事、右側には広告やブログカテゴリーなどの表示があるサイドバーが配置されています。一番下には管理人情報などのあるフッター

こういったブログの各パーツのレイアウトや、ベースとなるデザインを決めるのがWordpressのテーマです。

 

ブログの基本的なレイアウトとデザインはあらかじめテーマの中に記述されているので、あとはサイトタイトルなどを設定したり、カテゴリーを作ったり、記事を書いたりと、コンテンツを作っていけば、運用が開始できてしまうわけです^^

テーマには無料で配布されているものから有料のものまで色々ありますが、無料のものでも使いやすいものはたくさんあるので予算はあまり気にしすぎなくて大丈夫です。当サイトは賢威という有料のテーマを使っています。

 

以上、Wordpressを初めて使う人が知っておきたい予備知識でした。ではまた!

WordPressのビジュアルエディタでツールバーが全く表示されなくなったときの対処法

今日、新たに記事を投稿しようと思ってWordpressダッシュボードから新規投稿画面を開いたら、ビジュアルエディタが固まってしまいました。。。

Wordpress ビジュアルエディタ 固まった

こんなことは今までなかったので、内心かなり焦りましたが無事解決したのでその一部始終をお届けしようと思います。問題の原因や解決方法は色んなパターンがあるみたいなので、以下に書く方法も試してみてくださいね。

私のWordpressではエディタのある画面を開くと必ず「テキスト」モードがデフォルトで表示されるようになっています。

WordPressのエディタでテキストモードを必ず最初に表示させる方法

メルマガ配信のプラグインとの関係でそうしているのですが、記事を書くときはやっぱりビジュアルエディタも使いたいので、ビジュアルモードが表示されないっていうのは非常に困ってしまいます。

 

「ビジュアル」タブをクリックしていくら待ってもビジュアルエディタのツールボタンが全く表示されない。エディタの部分をクリックしてもテキスト入力モードにならずただの白いエリア状態。。最近500エラーとか多いから、もしかしてまた固まったのかなと思って再読み込みをしてみたものの、全く同じ現象。。

 

どういうことなんだよぉお!?

と、軽くパニックになりながらもGoogle先生に聞いてみたところ…

 

 

こんな情報が見つかりました。

この不具合は、別の場所で一度構築したWordPressを使った場合に頻発します。

引用元のサイト

 

なるほどなるほど。そういえば今日サブドメインのサイトから幾つかの記事をインポートしたから設定がへんになっちゃったのかな、などと思いつつ、web-includeのtinymceを入れかえていざ新規投稿!

 

 

 

結果は、

何も変わってない・・・

 

もうこうなったらWordpressの再インストールか・・・???などという嫌な予感がしながら他に方法は・・・と検索したところ

wp-config.phpに以下のコードを追加するという話がありました。

define(‘CONCATENATE_SCRIPTS’, false );

参考:WordPressのビジュアルエディタがChromeでだけエラー

 

で、その通りにやってみたものの・・・

 

 

 

ダメでした・・・orz 

非常に残念。

 

 

そしてついにWodpressのトラブルシューティングへ。

そこでムムっこれは!!と思ったのが↓↓

7.プラグインが原因だった報告多数。全てのプラグインを一旦無効化し、一つずつ有効化して原因となっているプラグインを特定する

 

今さらな感じですが、そういえばプラグインによる不具合は結構よくあるんですよね。

というわけで、怪しげなのを一個一個停止しながらチェックすることに。

 

ポチポチやていったところ・・・

 

 

 

見つけてやりましたよ。^^ ついに、解決です。

 

 

悪さをしているプラグインはCrayon Syntax Highlighterっていうやつでした。

プラグイン自体が悪いとかじゃなくて、たぶんワードプレスのバージョンと上手く合わなかったんだと思いますが、とりあえず私の場合はこのプラグインを停止したことで見事解決に至りました。幸い、使ってみようとおもっってインストールしたものの、まだ必要にもならなかったプラグインだったので良かった。

これまでダッシュボードを使っていて困る経験はなかったんで、自分にとってはちょうど良い教訓だったと思います。バックアップは自動でいつも取ってありますが、万が一に備えることの重要性はホント言うまでもないですね。。

これでめでたく新規投稿ができるよ!っていうことで、以上、解決後お初の記事でした!

 

Mar.15.2015追記:現在はCrayon Syntax Highlighterを利用していますが、特に問題は起きていません。もしかしたらCrayon Syntax Highlighterと当時使っていた他のプラグインとの関係で起こっていた問題なのかもしれません。

WordPressでのウィジェットの追加・削除方法

この記事ではWordpressの「ウィジェット」の使い方、追加・削除方法について図解します。

まず、そもそも「ウィジェット」とは何かというと、サイドバーに様々な情報を追加するための【パーツ】のことをいいます。

例えば以下の画像では右側に幅の狭いエリアがあって、そこにカテゴリーや最近の投稿が表示されていますが、この幅の狭いエリアを【サイドバー】といい、サイドバーに載せられている色々なパーツが【ウィジェット】です。

サイドバーとウィジェット

 

使っているWordpressのテーマによりますが、サイドバー以外にもメインコンテンツの下や、フッター部分にウィジェットが追加できる場合もあります。

WordPressテーマ「賢威」では、サイドバーのほかに【サブコンテンツ】というエリアにウィジェットが追加できます。2カラムの表示タイプの場合、以下の画像のように、左側の幅の広いエリア(メインコンテンツ)の下、フッターの上にサブコンテンツが表示されます。タグクラウドが表示されているエリアですね。今は一つのウィジェット(タグクラウド)しか入れていませんが、サブコンテンツにももちろん、複数のウィジェットを追加できますよ^^

サブコンテンツとウィジェット

ブログのカラム設定により、サイドバーとサブコンテンツが表示される場所は変わってきますので、ウィジェットを追加しながらそれぞれの位置を確認してみてください。

ウィジェットを使うとブログ内のおすすめ記事やカテゴリなどを表示したり、広告やイチオシ情報を目立たせたりできます。

 

では以下にウィジェットの削除方法、追加方法について解説していきますね。

ウィジェットの削除方法

ウィジェットを削除する方法は二つあります。一つは、設定を残したままブログの表示から外す方法、もう一つは完全に削除する方法です。

例えばまた後から使うかもしれないけど取りあえず今は表示させたくない場合は、設定を残したまま使用停止にするほうがいいですね。

以下の図のようにして、サイドバー(あるいはサブコンテンツ)からウィジェットを「使用停止中のウィジェット」のエリアにドラッグ&ドロップします。

ウィジェット削除

 

今後全く使用するつもりがなく、設定を残さないで削除してしまいたい場合は、以下のようにして削除できます。

ウィジェットの削除

 

 

ウィジェットの追加方法

ウィジェットを追加する場合は「利用できるウィジェット」の中から追加したいウィジェットを、追加したいエリア(サイドバーかサブコンテンツ)にドラッグ&ドロップします。

ここではカテゴリーをサイドバーに追加してみます。

ウィジェットの追加

追加できたら詳細設定を行います。

カテゴリー設定

 

投稿数を表示しておくと、訪問者にも親切ですね^^

設定ができたら保存をクリックして完了です。

 

以上、基本的なウィジェットの追加・削除方法でした。

WordPressでの固定ページの作成方法

この記事では、Wordpressの「固定ページ」とは何か、そして固定ページの作成方法を簡単に説明します。

固定ページとは何か

WordPress Codex日本語版にはこんな解説があります。

固定ページはブログにコンテンツを追加するもうひとつの道具であり、ブログについての「静的」な情報を述べるのによく使われます。 つまり、固定ページは完全に「時間に影響されない」のが特長です。 固定ページの良い例が「About」や「Contact」のページです。 固定ページを投稿という名の時間軸志向のものと混同しないように注意してください。

WordPress Codex日本語版「管理画面」

WordPressでは投稿記事(英語:Post)は投稿した順に時系列に並んでいきますよね。固定ページは、投稿記事とは全く無関係に存在します。「時間に影響されない」、つまり、「いつそのページが書かれたかは意味を持たない」のが特徴ということです。

例えば、「お問い合わせ」「サイトマップ」などは、常に新しい情報が追加されていくブログの記事や新着情報などとは少しタイプが異なりますよね。こういう情報を載せるのに使われるのが固定ページです。

このブログには、右上のところにAbout、Sitemap、Contactというリンクが表示されていますが、これは固定ページで作られたものです。

時系列順に並んでいく記事とは別に常に【固定】でブログに表示させたいものを固定ページで作る、と考えていただければよいかと思います^^

 

何の固定ページを作ったらいいのか?

会社のHPとかなら固定ページが必要になるケースがほとんどですが、個人のブログの場合は、「一体何を固定ページで作ったらいいのか?」と思うかもしれません。

別に必要なければわざわざ固定ページを作る必要はないですが、例えば当ブログにもある

  • About : ブログについて、ブログの管理人について、免責事項など
  • Sitemap : ブログの記事一覧ページ
  • Contact : お問い合わせページ

なんかは、作っておくと良いと思います。

 

例えばAboutのページ。私もいろいろなブログを覗いていて面白い記事や役立つ記事が多いブログは「このブログの運営者はどんな人なんだろ?」と気になりますし、そうやってブログ管理人さんの自己紹介を読んだブログは結構記憶に残るんですね。「生まれはどこで何人兄弟で・・・」とかまで詳しくなくていいですが(笑)、さらっとでも自分のブログやサイトのコンセプトなどを書いておくといいと思います。

 

サイトマップ(ブログ記事一覧)はこちらの記事で作り方を解説しているので参考にしてみてください。

記事一覧(サイトマップ)を自動生成するWordPressプラグインPS Auto Sitemapの使い方

 

お問い合わせのページは、プラグインを使うと結構簡単に問い合わせフォームが設置できます。Contact Form 7が有名なプラグインですが、私はJetPackのプラグインを使っています。

プラグイン1個で超多機能!ありがたすぎるJetPackで問い合わせフォームを作ってみた

 

 

では以下に固定ページの作成手順を簡単に図解します。

 

固定ページの作成方法

ダッシュボード>固定ページ>新規追加 を選択します。

固定ページの追加

 

タイトルを入力します。ここでは「当ブログについて」と入力します。

固定ページ作成

 

固定ページの内容は、投稿記事を作成するときとまったく同じ要領でできます。

記事の作成の仕方は以下の記事で解説していますので、参考にしてください。

記事投稿の仕方

 

パーマリンクが日本語になっていると思うので、英単語に変更しましょう。パーマリンクの右側の「編集」ボタンをクリックすると以下のように編集モードになるので変更してください。日本語のままでもいいのですが、URLが非常に長くなって何かと不便なので英文字でスッキリさせるのがオススメです。

スラッグ設定

スラッグ設定2

 

中身が完成したら「プレビュー」ボタンをクリックしてチェックしてください。

良ければ「公開」ボタンをクリックして完了です。

固定ページの公開

 

WordPressでの投稿方法と記事作成時に最低限おさえておきたい基本的なSEO

この記事はワードプレスでのブログ記事の投稿方法と、SEOを意識した(=アクセスアップにつながる)記事の編集(文字装飾・見出しのつけ方)について解説していきます。

手順としては

  • あらかじめテキストエディタ(メモ帳など、なんでもいいです)で文章を作成しておく
  • ワードプレスのダッシュボードを開き、投稿画面で体裁を整える
  • タイトルやカテゴリ、タグなどの設定をする
  • 記事を公開する

と言った感じです。

それでは早速いってみましょう!

もしまだWordpressの投稿エディタの機能を拡張していない場合(エディタ用のプラグインを入れていない場合)はこちらの記事を参考にして、プラグインをインストールしてください。断然スムーズに記事の作成・編集ができます。

投稿エディタ用にインストールしておきたいWordpressプラグイン2つ

 

あらかじめテキストエディタで文章を作成しておく

好き好きもありますが、個人的には最初からWordpressダッシュボードの投稿画面で文章を書いていくより、ある程度テキストエディタなどで文章を作ってから投稿画面で体裁を整えるのがおススメです。

WordPressにはデータが失われた時の復元機能はついているのですが、やはり、ブラウザ上で長時間文字を書き続けるのはリスクがあるかなと。

何かの拍子にページが閉じられたり(あるいは自分で閉じちゃったり・・・汗汗)、ブラウザがクラッシュしてしまった時など、せっかく書いた文章が失われてしまうかもしれませんので。。

 

あらかじめ記事をローカルで作っておくと、記事が自分のローカルPCにも蓄積されてていくので、記事を書きながらバックアックも同時にできる。一石二鳥。

 

私はEverNoteを使って大体のものは書いていますが、ノートパッドでも、MicrosoftWordでも使い慣れたもので大丈夫なので前もって作っておくようにするといいと思います。

 

しっかり記事を考えて書いている有名ブロガーさんの中には、記事を書く前に、マインドマップツールなどで構成を考えている人もいます。

私もかなりボリュームのある記事を書くときや、ステップメールを書くときなどにマインドマップを書いていますが、ツールを使わなくても紙とペンでざざっとマインドマップを書いていくだけで、頭の中が整理できて、何を、どんな順番で書くか、構成がつかみやすくなります。

そうすると自分も文章を書き進めやすいし、読んでくれる人にもより分かり易い文章が書けるかなと^^

 

 

文章が書けたら、次のステップですね。

WordPressダッシュボードの投稿画面で文の体裁を整えていきましょう。

 

ワードプレスのダッシュボードを開き、投稿画面で体裁を整える

ワードプレスのダッシュボードを開き、投稿 > 新規追加 を選びます。

 

「ビジュアル」モードが選択されていることを確認して下さい(下図参照)。

新規投稿

 

作っておいた記事全体をコピーして、記事入力欄(上図の「ここに記事を書いていく」という部分)で右クリックし、「プレーンテキストとして貼り付ける」を選択してください。

 

普通に「貼り付け」(Ctrl + v)で貼り付けると、改行とかが上手く反映されないことがあるので、気をつけてください。貼り付けた後に、一度テキストモードに切り替えて、再度ビジュアルモードに切り替えてみてください。この切り替えで改行が崩れたりしていないかチェックしてから以降の作業を進めていくといいと思います。

 

貼り付けができたら、必要な文字装飾を行っていきましょう。以下のポイントを意識するといいと思います。

  • 記事内の重要なキーワードやポイントとなる言葉を、数カ所で強調表示(太字)にする。
  • 記事内の重要なキーワードを「見出し」に含める
  • 見やすいように、適度に改行を使う

具体的にそれぞれやり方をご説明しますね。

 

記事内の重要なキーワードを、数カ所で強調表示(太字)に

強調表示もやり過ぎると逆効果なので、本当に注目してほしいところや重要なキーワードやフレーズだけを強調表示させるようにしましょう。ちなみに、太字になっているところ(strongタグで囲まれているところ)は検索エンジンの方でも重要な部分として認識されますので、そういう意味でも重要なキーワードを太字にするといいですね。

太字にする方法

visualeditor-bold

太字にしたい文字を選択して「B」のマークのボタンをクリックするか、Ctrl+Bキーで太文字になります。

 

下線を付ける方法

visualeditor-underline

下線を付けたい文字を選択して、のマークのボタンをクリックするか、Ctrl+Iキーで下線が付きます。

 

文字色を変える方法

visualeditor-text-color

色を変えたい文字を選択して、文字色を設定するメニューから色を選択します。

 

文字の背景色を変える方法

visualeditor-text-background-color

色を変えたい文字を選択して、背景色を設定するメニューから色を選択します。薄い黄色がおススメです。

 

文字サイズを変える方法

visualeditor-font-size

サイズを変えたい文字を選択して、文字サイズのプルダウンメニューからサイズを選択します。

 

 

記事内の重要なキーワードを「見出し」に含める

見出しはSEOのためにも積極的につけた方がいいです。

この記事の中でも見出しが時々出てきますが、見出しに設定された部分を検索エンジンは重要な情報だと解釈しますので、記事の中の重要なキーワードは見出しの中で積極的に使うようにしてください。

 

見出しの設定方法は、見出しにしたいフレーズを選択して、見出し2(H2)以降を設定します。お使いのテーマによって、記事のタイトルがH2タグで囲まれていたり、H1タグで囲まれていたりします。記事内の見出しは記事タイトルの見出しより下の階層になるようにします。

 

記事タイトルに使われているhタグを調べるには、投稿済みの記事をブラウザで表示して右クリックからページのソースを表示するメニューを選択すると、記事のソースコードが見れるのでそこからチェックしてください。

 

H1タグが記事タイトルについているなら

<h1>記事タイトル</h1>

→<h2>記事内大見出し</h2>

→→<h3>記事内小見出し</h3>

という風な感じになりますね。

 

ここでは見出し3を設定しています。

見出し

 

賢威」では、記事のタイトルが見出し2(H2)に設定されますので、記事内の見出しは基本的に見出し3(H3)を設定し、もしさらに小見出しがある場合は設定した見出しより下の階層を使うようにしてください。

見出し3の中に見出し2があったりと階層がごちゃまぜになると検索エンジンが困ってしまいSEO的にもよくありませんので注意してください^^;

 

見やすいように、適度に改行を使う

文字の嵐のように、ずらずらーっと、10行以上にわたって改行なしに書かれたような記事はやはり読みにくいです。

時々、そういう書き方をしているカリスマブロガーもいますが、そういう人たちは別格なので。。基本は読みにくければ読まれないと思っておいた方がいいです。T_T

自分でプレビューして読みやすさはどうか、確認しながら適度に改行をいれるようにしてください。

プレビューボタンは、ダッシュボードの右上の方にあります。

 

 

記事の体裁が整ったら、次のステップです↓

タイトルやカテゴリ、タグなどの設定をする

記事が出来上がったら、あとはタイトル、カテゴリ、タグを設定します。

記事の内容を反映する重要なキーワードを使い、さらに興味性・意外性・数値を盛り込むこと意識すると、クリックしたくなるようなタイトルを作りやすいです。(この記事のタイトルはダメなつけ方の例です。ご承知を。苦笑)

 

色んなブログを見ていて、「この記事は気になるな」と思ったタイトルとか、はてなブックマークでたくさんブクマされている記事のタイトルを分析してみるのが良いタイトルをつける近道だ、とよく言われています。意識してみてください^^

 

カテゴリは記事の大分類でできれば1個、タグはカテゴリよりも細かい分類で1~5個くらいまでで設定します。

投稿画面右側に設定ボックスがそれぞれあると思うので、そこで設定してくださいね。

 

記事を公開する

公開する前に必ず「プレビュー」ボタンをクリックして、記事がどんなふうに表示されるか確認し、誤字・脱字、スタイルの崩れなどがないかを確認しましょう。それができたら、公開ボタンをクリックしてブログ記事を公開!

公開した後も、少し日をおいてから再度読み直してみると、また客観的に文章を評価できて、修正個所なども見つかることが多いので、気が付いたときに自分の記事を読み返すといいと思います。

 

今回の内容より少しレベルアップした記事装飾についてもまとめています。興味のある方はこちらの記事もあわせて読んでみてください。

ブログ記事にメリハリを!読みやすさが一気にアップする装飾のアイデア【CSSサンプルあり】