WordPress

WordPressのテーマ『Twenty Fourteen』の色カスタマイズ方法

 

IMG_6978

WordPressデフォルトで入ってるテーマの中でもシンプルで使いやすい『Twenty Fourteen』ですが、色のカスタマイズが少々手間です。

最近、Twenty Fourteenのバージョンアップがありました(1.1)(Twenty Fourteenに限らずデフォルトで入ってるテーマ他2つもですが)。バージョンアップしたら、この色のカスタマイズ箇所がデフォルトに戻ってしまいます。

そんなわけで、もう1度変更することになったので、手順を書いておきます。

方法としては単純。『style.css』を編集するだけです。しかし、変更箇所が多いです。緑色系統の色が3種類設定してありまして……

  • 緑(リンク色や検索窓、コメント送信ボタンのデフォルト等)
#24890d
  • 黄緑(リンクや検索窓、コメント送信ボタンのホバー時等)
#41a62a
  • 明るい黄緑(アクティブページの文字色等)
#55d737

となっています。

この色を変えたい場合は、FTPで『style.css』ファイル自体をダウンロードして、この3色をテキストエディタ(Sakuraエディタなど)で好きな色にまとめて一括置換するのが楽でしょうか。

『Contact Form 7』でメールを送信できないときの対処法

ヴァージョンアップによって以下の方法は現在使えなくなってる可能性があります。

IMG_6575

WordPressで、お問い合わせフォームを作成するときの定番プラグイン『Contact Form 7』。

たいへん便利なプラグインですが、WordPressをインストールしてるサーバーによっては、メール送信先を他のサーバーに設定できないことがあります。

例えばSakuraサーバーならばSakuraのメールアドレスに送ることはできるのですが、Yahoo!のメールアドレスには送信できない等。

たとえ『Contact Form 7』のフォーム送信で「あなたのメッセージは送信されました。ありがとうございました。」のコメントが表示されていても送信されていないことがありますので、必ず確認しておきましょう。

そういう場合は、『WP Mail SMTP』プラグインを使って、GmailのSMTPサーバを使って解決します。

『WP Mail SMTP』をインストールして設定します。

「From Email」と「From Name」は省略可能です(WordPressで設定したデフォルトのメールアドレスになります。差出人はWordPress)。

以下

  1. 「WordPressの全てのメールをSMTP経由で送信する。」にチェック
  2. 「SMTP Host」を「smtp.gmail.com」
  3. 「SMTP Port」を「465」
  4. 」と「」にチェックして
  5. 「Username」「Password」に自分のGmailアドレスとパスワードを設定します。

送信テストもできますので、ちゃんと送信できてるか確認すれば完了です。

WordPressコメント入力欄のシンプル化カスタマイズ

IMG_6433

今回は入力欄の改造のみ。comments.phpをいじる方法ではなく、簡単にできるやり方でやります。

  • 「メールアドレス」入力欄と「ウェブサイト」入力欄を消去。
  • 「名前」と「コメント」欄のみのシンプルな形にします。
  • ついでに周りの注意書きや文字類も消去。
  • ごちゃごちゃ禁止!

☆functions.phpに書き込むタイプ

▼コメント入力欄の「ウェブサイト」と「メールアドレス」を消去

functions.phpに以下を追加します。一番下が分かりやすいです。

add_filter('comment_form_default_fields', 'mytheme_remove_url');
function mytheme_remove_url($arg) {
$arg['url'] = '';
$arg['email'] = '';
return $arg;
}

これだけです。と思ったのですが、注意点が1つ!

設定>ディスカッションの「名前とメールアドレスの入力を必須にする」のチェックを外しておいてください。これを忘れるとメールアドレスが書き込めないため、コメントすることができなくなります。

また、functions.phpをさわるときは(phpファイルをいじるとき全般にですけども)、事前にバックアップを取っておきましょう。

最終行の「}」を書き込み忘れたりすると、シンタックスエラーが出て最悪WordPressから書き込みできなくなったりします!<やらかしたことがあるらしい(涙)

☆CSSに書き込むタイプ

以下をCSSファイルに書き込みます。場所は下の方ならどこでも良いですが、Twenty fourteen ならstyle.cssの6.14の一番下あたりに書いておくと後々も分かりやすいはずです。

▼下の「次のHTMLタグと属性が使えます」うんたらを消去

.form-allowed-tags{display:none;}

▼「コメントを残す」を消去

.comment-reply-title{display:none;}

▼「メールアドレスが公開されることはありません。」を消去

.comment-notes{display:none;}

▼コメント欄のタイトルを消去

.comments-title{display:none;}

これだけです。

テーマによってはこちらの方法で「メールアドレス」入力欄と「ウェブサイト」欄も消去できるようですが、Twenty fourteenではできませんでした。また、Twenty fourteen以外のテーマではcssのclass名が上記と多少違ってる可能性があります。

WordPressは、英語のものを日本語化ファイルで変換するという方法をとってるので、この手の文字を消すのが案外ややこしいですよね。そこでCSSを使って有無を言わさず消してみました。

◆結論のようなもの

  • WordPressコメント欄の本格カスタマイズはけっこうややこしい
  • そして、プラグインはたいてい多機能型
  • でも今回のような大ざっぱなものは簡単

robots.txtでやらかした!

IMG_6444

robots.txtの設定をミスって、ウェブマスターツールに「重要なエラー」って言われてしまいました。てへ。

しかもしばらくどこが原因かわからなかったという(涙)

・ robots.txtってなんぞ?

まず、robots.txtが何か、これを何のために設定するかを知らないと分かりづらいのですが、おおざっぱに書くと、このファイルでサイト内のロボットにアクセスされたくないページを指定することができます。

検索サイトのロボットですね。クローラーともいいます。

robots.txtファイル内に Disallow:  のあとにサイト内のディレクトリやファイルを指定しておけば、ロボット避けになります。Allow:で拒否したディレクトリ内部を例外的に許可することもできます。

一部無視するクローラーもあったりとか、他にサイトマップの位置を書いたりもするのですが、細かい書式などはググってくださいってことで、今回割愛(不親切設計)。

 ・ robots.txtを何のために設定するか?

さて、ではrobots.txtを何のために設定するか?

基本的にロボットに見て欲しいページを指示するためなのですが……

まず、前提として今のGoogleさんは内容の薄いページや同じ内容のページがたくさんあるのを好まない傾向があるのです。しかもダメページがあると、サイト全体の評価が下がります。SEOな話ですね。

また、1回でクロールしてくれる数には限りがあるようで、クローラーがリンクをたどってダメページに行ってしまうと、見て欲しいページに行ってくれる可能性が減ってしまいます。

そんなわけでダメページをロボットサーチ拒否設定にしておくことでSEO的に有利になるというわけです。

まぁ、私の個人サイト程度ではおまじないにもならないくらいの効果だとは思いますが、ある程度アクセスの増えてきたサイトには多少の意味はあるようです。

(この理由以外にも身内用のサイトなどで、スパムコメントが来づらくするようにロボット拒否設定することもあります)

・ で、何やらかした?

そんなわけで、このサイトの話ではないのですが、ドメイン直下とその下/BLOG/ディレクトリの2箇所にWordPressをインストールしたサイトがありまして、そこのサイトのrobots.txt設定でやらかしました。

ドメイン直下のメインサイトではパーマネントリンク設定がデフォルトではないし、固定ページはそれぞれ名前を設定してあるのですが、/BLOG/の方は、パーマネント設定がデフォルトになったままです。

(変えろよって話なんですが、初期からそのままになってまして……いまさら変えるのもという)。

さて、robots.txtをWordPress用に

Disallow:  /wp-admin/
Disallow:  /wp-includes/
Disallow:  /wp-content/plugins
Disallow:  /wp-content/cache
Disallow:  /wp-content/themes
Allow: /wp-content/uploads

こんな感じのよくある設定をしました。

また、WordPressはカテゴリーやらタグやら、やたら同じようなページを大量作成してしまう傾向があるので、いっそメイン記事以外の部分をDisallow設定にしました。

ついでにドメイン直下のページ用に

Disallow:   /*?*

と書いておきました。パーマネント設定を変えてあるので、WordPressのデフォルトでたくさん出来る「?」の入るページは要らないと判断して。

しかし、しかしですよ、ええと、この書き方だと……

/BLOG/?*

にも適用されるじゃないですか!(よく考えたら当たり前なんですが、しばらく気づかず(涙))

WordPressのデフォルトのページ名はこんな感じですよね。

/BLOG/?p=3939

そんなわけで、パーマネント設定がデフォのままの/BLOG/のブログページがほとんどロボット拒否設定になってしまいましたとさ。

しかし、ウェブマスターツールさんはこんなミスにもツッコミ入れてくれるんですね。

ウェブマスターツールでrobots.txtの記述が正しいかを先にテストすることもできます。あくまで文法的な部分をなので、テストでは今回のようなミスはわからないですが(涙)

結論のようなもの

  • ワイルドカード怖い
  • robots.txt は、素人が下手にいじると危険!
  • まぁサイトが壊れるわけでもないし
  • 変なことすると、ウェブマスターツールが教えてはくれるけども

Sakuraサーバーで間違ってWordPressをアンイストールした場合の対処法。

Sakuraサーバーで要らないWordpressを消そうと思って、やってしまいました(涙)

アンインストールボタンを押してから時間がかかるようなのですが……そこであわてて連打。すると、もう1つの必要なWordpressまで消えてしまいました!

これを復旧する手順を記録しておきます。

ここではSakuraサーバー上での話ということで書きますが、phpMyAdminを使えるサーバーならば、他のサーバーでも似たような対処法で対応できると思います(レンタルサーバーならたいてい入ってるようです)。

バックアップファイルはプラグイン「BackWPup」で取ってあったものを使用しました。

もし、バックアップを取ってなかった場合は……たぶんどうしようもないですが、アンインストールしても実はデータベースそのものは残っているので、データベース部分だけならば、どうにかできるかもしれません。

復旧手順

  1. 同じデータベースにもう1度WordPressをクイックインストール
  2. phpMyAdminを使用して、SQLファイルをインポート
  3. データベース以外のファイルを復旧
  4. プラグインを手動でインストール

1.同じデータベースにもう1度WordPressをクイックインストール。

sakuraのサーバコントロールパネルにログインします。左メニューから

sakura2-2

運用に便利なツール>クイックインストール

まず単純にもう一度クイックインストールでWordPressを上書きして良いようです(あとからインポートで上書きしますので、データベースのバックアップがある場合に限ります!)。

このとき、元のインストールしていたバージョンを合わせた方が良いらしいのですが、低いバージョンをクイックインストールして、あとからアップデートでも大丈夫でした(必ず大丈夫なのかは保証しません!)。

今回は、WordPress ver.3.8.1で運用してたものに、ver.3.7.1でクイックインストールして即ver.3.8.1にアップデートしました。

2.phpMyAdminを使用して、SQLファイルをインポート

sakuraサーバコントロールパネル内

sakura

アプリケーションの設定>データベースの設定>管理ツール ログインから「phpMyAdmin」にログインします。

「BackWPup」バックアップしてあったものを解凍し、中から SQLファイル(“自サイトのデータベース名”.sql)を取り出し、ここにインポートします。

sakura3-2

「ファイルを選択」でSQLファイルを選択しアップデートしてインポート。これでデータベース部分は復旧します。

3.データベース以外のファイルを復旧

しかし、Wordpressをアンインストールしてしまうと、同時にサーバー上の他のファイルも消されてしまうので、FTPでこれも戻さないといけません。

バックアップファイルの中から、「wp-content」フォルダを全部FTPで送りこみます。

このとき、「wp-admin」や「wp-includes」、その他ルートにあるファイルを、まるごとアップしてはいけません。まずは「wp-content」フォルダのみで。ただし、「wp-includes」内部などに自分でさわった箇所がある場合は、そのファイルを個別に追加アップします。

また、フォルダ以外にもルート(正確にはwww直下)にあるwp-config.phpと.htaccessをアップします。

.htaccessをアップするのを忘れると、WordPressのパーマネントリンクの設定が反映されなくなりますので、ご注意。(私はこれであたふたしました。デフォルト設定のままだと実はなくても通るようですが)

4.プラグインを手動でインストール

プラグインに関しては一括インストールしてくれません。バックアップのプラグインリストもしくはメモなどを見ながらひとつひとつインストールしていきます。

これで復旧完了……のはず。

結論のようなもの

  • 誤操作怖い!(涙)
  • バックアップ超大事!!(涙)
  • でも必要なバックアップさえあればどうにかなります。
  • データベースのバックアップはもちろんですが、「wp-content」フォルダなどデータベース以外のバックアップも忘れずに。

ひるね部ブログ(仮)開設

ジャンル分けをどうするか悩みつつおおざっぱにブログ開設。ひとまずここではWordPressの覚え書きとブラウザ関係の話が多くなりそうです。