タテ長になってしまったブログ（ワードプレス）のトップページを、見やすく最新記事

だけを大きく表示させ、その他の記事はサムネイル（アイキャッチ画像）付きの見出し

だけにカスタマイズしました。

いじったのは自作のテーマだけど、汎用のPHPであればコピペで大体が

通用すると思う。

カスタマイズしたファイルは「home.php」。

変更前のｐｈｐコード

<?php if(have_posts()): while(have_posts()): the_post(); ?>
	<?php get_template_part('content'); ?>
<?php endwhile; endif; ?>

変更後phpコード

<?php if(have_posts()): while(have_posts()): the_post(); $counter++; ?>
	<?php if ($counter <= 1): ?>
	<?php get_template_part('content'); ?>
<?php else:?>

<?php get_template_part('content','excerpt'); ?>
<?php endif;?>

<?php endwhile; endif; ?>

変更後php、二行目に追加したコードは最新記事を判別する。

<?php if ($counter <= 1): ?>

６行目は最新記事以降の記事を表示させる。

<?php get_template_part('content','excerpt'); ?>

しまい

Autoptimize バージョン 1.9.4　（オートオプティマイズ）

HTML、CSS、JavaScriptを縮小してくれるプラグイン。

• 備忘録

当ブログでは、HTML・CSSは、有効にすると最適化されるが、JavaScriptに関しては

プラグイン ScrollTo Top　が無効化されてしまう。よって「Optimize JavaScript Code?」

だけ利用せず導入すことにした。

Google は、サイトの表示速度が検索順位を決める重要な要素の１つであると、

とあるサイトで話題に挙げていた。薄々そんなこともあるんだろうなと、気にはして

いましたいたが、何も対処せず、ブログ（WordPress）に色々なプラグインを導入し、

記事もマメに書いていました。でも、次第に表示スピードが遅くなり、ストレスを感じ

だしていた今日この頃。Google Debelopers の　「PageSpeed Insights」なる、

表示スピードを解析してくれるところを見つけ、テストして見たんです。

PageSpeed Insights

https://developers.google.com/speed/pagespeed/insights/

当ブログをテストしてみた結果、

モバイル　52/100　　パソコン　55/100

大方の評価は予想していましたが、思わしくありませんね。

解析結果は修正箇所を何項目か提案しています。

どれからどうやっつけようか？　取り合えず「WordPress　高速化」で検索。

その中から有名なものを当ブログに実装しましたが・・・

W3 Total Cache ： キャッシュの最適化

バージョン 0.9.4.1

※ 利用サーバー ： バリューサーバー　XREA　/　WordPress 4.3　ブログテーマ ： 自作

WP ダッシュボードから「 W3 Total Cache 」を難なくインストール。

プラグインを有効化した後、

管理画面の「Performance」→「General Settings」で、何故かpage cacheが

「Disk :Enhanced」で有効化「Enable」出来ない。「Disk: Basic」を選択すれば

有効化できるけど、他のプラグインとの相性なのか？それともサーバー仕様？

仕方なく「Disk: Basic」でセーブして、表示スピードを検証。

PageSpeed Insights スコア　　モバイル　62 / 100　　パソコン　62/100

微妙な結果です。

実際の表示スピードは、飛躍的？どころか以前と殆ど変わりない。

page cache が「Disk :Enhanced」で有効化できれば、スコアももう少し期待できる

かもしれないが、今の私には知恵なし・手立て無し。

「W3 Total Cache」は、多くの記事に書かれている「すぐれもの」って

ホントなんでしょうかね？

私的判断として XREAサーバーで、W3 Total Cache は不向きということで、

導入は却下。

追伸

W3TCを削除する場合は要注意。普通にプラグインを停止して削除すると不具合を起こす。

私がそうだったように。管理画面の「Performance」→「General Settings」で、

全ての「Enable」のチェックを外し、「Miscellaneous」内のチェックも全て外す。

それから通常のプラグイン停止し削除する。最後にFTPでサーバーにアクセスし、

wp-contentの中、もしくはwp-content/pluginsの中も残骸がないか確認し、

残っていたら削除すべし。

しまい

現状バージョン：WordPress 4.3

不具合の症状は、投稿ページでビジュアルとテキストの切り替えが出来ない。

以前も同じ症状があったので、自分のブログ履歴を検索したらありました。

↓

新規投稿でビジュアルとテキストの切り替えが出来なくなった

問題を起こしたプラグインがバージョンアップしたら使えるようになったけど、

ワードプレスがバージョンアップしたせいで、また不具合を起こしたと推測する。

現在のバージョン

【 PS Disable Auto Formatting　バージョン 1.0.10 】

停止すればビジュアルとテキストの切り替えが出来るようになるが、

割と重宝しているプラグインなだけに、早めに修正版を期待する。

しまい

数日前からワードプレスにログインできなくなりました。

色々ググッ、この手の修復法を試して見ましたがダメです。

でぇ、ふとページ上段見るとエラーメッセージ？らしきものがぁ。

ググッてみたら原因が判明しました。

【エラーメッセージ】

「Warning: Cannot modify header information – headers already sent by

(output started at /virtual/・・・」

どうやらとあるページを知らないうちにUTF-8（BOMあり）で保存しアップロード

していたみたいです。多分うっかりメモ帳で開き、そのまま保存したんかな。

BOMなしにしてアップしたらサックリログインできました。

しまい

「WordPress SEO For Image」を自作テーマに実装しました。

便利なこのプラグインは、投稿記事に画像を挿入する時、

いちいちタイトルを記述つぃなくても、自動で勝手に書いてくれます。

また、過去の記事挿入画像にも反映されます。

ページの挿入画像には「alt」を記述すると、ちょっとしたSEOになる上、

文法上も好ましいこと。

私が何故「WordPress SEO For Image」プラグインを選んだかは、

元々「SEO Friendly Images」バージョン：3.0.5を利用したが、

当方のブログとは相性悪かったので、類似したものを探してて、

「WordPress SEO For Image」がヒットしたんです。

当ブログに実装可能のSEO Friendly Images 2.7.6　と

WordPress SEO For Image 1.1.2 は、ほぼ同じものです。

少し古いプラグインではあるが最新バージョン。更新する必要もないので、

SEO For Image　にしたわけです。

インストール後有効化したままで、設定はデフォルトのまま使っています。

しまい

良かれと思い当ブログにインストールしたプラグイン。

「SEO Friendly Images」バージョン：3.0.5

プラグインを実装（有効化）しても変化なし。うまく起動しません。

・WordPress 4.2.1バージョン

・自作テーマ

何故？色々調べてみましたが、不具合についてのページを見つけることができず、

殆ど諦めていました。実は以前このプラグインを投与していたことがあり、

その時は問題なく動いていたのです。

じゃ、その時使っていたらしきバージョンまでダウンしたものを、

本家からダウンロードし、実装してみたんです。

https://wordpress.org/plugins/seo-image/

上記サイトの「Developers」から旧バージョンがダウンロードできます。

やはり動きました。バージョンは「2.7.6」です。

因みに2.7.6以上だと全部試したがダメでした。

当ブログとは別に、少し仕様変更した自作テーマでも試したのですが、

結果は2.7.6以上だと動きませんでした。

自作テーマだと相性悪いんですかね。それともバグ？

そんなことで、古いバージョンでも動いているので、不具合出るまでコレで

いいやと思ったんです。ただですね、ダッシュボードには・・・

 ブログ開くたびに

「新しいバージョンの SEO Friendly Images が利用可能です。」

とメッセージがでます。勿論アップロードしてしまうと、動かなくなります。

うっかりアップしそう・・・ウザイな。

結局「SEO Friendly Images」は却下し、類似したものを探してみると、

ありました。「 WordPress SEO For Image 」

つづく

seoには必須のサイトマップ（sitemap.xml）。

私はサーチエンジン用にサーバー内に一つ設置すれば良いものだと思っていた。

しかし、同サーバー内にホームページと併用しブログ（ワードプレス）も書いていた

ので、そのサイトマップも設置すれば更にSEOに好ましいことを最近知った。

早速ブログのサイトマップを作り、ウェブマスターツールに追加した。

作成法の備忘録です。

当サイトのサイトマップ作成法

※サイト構成　独自ドメイン内にホームページサイトとブログ（ワードプレス）を設置。

●ホームページ用のサイトマップを作成（sitemap.xml）

ウェブ上で自動作成。作成サイト：sitemap.xml Editor

※ オプション設定で、除外ディレクトリに「blog」（ワードプレス）を記述。

●ブログ（ワードプレス）用のサイトマップ作成

 プラグインをインストール：「 Google XML Sitemaps 」バージョン 4.0.8

 設定は何もいじらずデフォルトのまま。

「あなたのサイトマップのインデックスファイルのURL」

 このURLをGoogleウェブマスターツールの「サイトマップに」コピペ。

クロール ＞ サイトマップ

暫くすると認識したことを確認できる。

以上

検索フォーム(検索窓)のカスタマイズをしました。

過去に色々と取り組んでましたが、そもそも当ブログテーマ内に「searchform.php」が

存在しなかったのが良くなかったみたいで、作成してテーマフォルダに追加し、

スタイルシートでカスタムしました。備忘録です。

searchform.php

<form role="search" method="get" id="searchform" action="<?php echo home_url( '/' ); ?>">
    <div class="info"><label class="screen-reader-text" for="s"></label>
        <input type="text" value="" name="s" id="s" />
        <input type="image" src="×××/images/btn.gif" id="searchsubmit" value="Search" />
    </div>
</form>

×××は画像ファイルをアップロードしたURL。

style.css

/* 検索フォーム */
#info { float:right;
	line-height:33px;
	margin-top: 5px;
}

#s{/* 検索文字列入力欄 */
  width:190px;
  height:14px;
}
#searchsubmit{/* 検索ボタン */
  	position: relative;
	top: 6px;
	left: -26px;
	height:20px;
}

過去にカスタマイズした時、wp_includesフォルダー内の「general-template.php」を、

WPがアップデートごとにいじってたが、これからはその必要がなくなった。

「ブログ（ワードプレス）をスマホで見ると、文章が変な所で改行される」ことってないですか？

私が運営してるブログは、以前からこの症状がありましたが、いつものごとく見て見ぬ振り

していました。ただ1週間ほど前からブログのリニューアルを兼ね、この症状を解決すべく、

ググッてみたら意外と似たような記事あったので、備忘録しておきます。

不意な改行の原因

Android(スマートフォンのOS)の「ページの自動調整」機能が原因。

ページの自動調整：スマートフォンの小さな画面で、自動的に改行して見やすくする。

一番簡単な対処法として、スマホ本体でこの機能を解除すればいいが、自分のだけやっても

意味ないし。デフォルト(スマホ購入時)は、大体の機種がこの機能がオンになっているっぽい

ので、アンドロイドの「ページの自動調整」が働いていても、不意な改行されないように

ブログ内のスタイルシートに1行追記する。

div.post p	{
	background-color:#FFFFFF;}

※ 「post」は記事ごとのボックス。「p」は記事内の1行の文章。それにバックグラウンドを

加えることで対処できる。

スタイルシート（style.css）のディレクトリ

blog/wp-content/themes/ブログテーマ/style.css

対処前

対処後