ブログのデザイン変えました。Simplicityでいじったところ。

ブログのデザインを変えました

調べたらスマホで見ている人が7割くらい。だがしかし、我が家にはスマホ無し。
古いipodはあるので、それで一応動作確認はしています。

Facebookからリンクをたどるとタブレットの場合は、スマホ用のページになるんだけど、それが絶望的に見にくい。超不格好。

いいかげん変えてみようと思い、ブログのテーマを変えました。
かなり多くのブログが採用しているSimplicityです。

ここはメモ用ページとして設定や記述を変えた箇所を記載していきます。
随時、調整するのでこのブログ自体が何か見ずらいかもしれません。でも限界なので。
でも、ipodだとフリーズする・・・。

Simplicity

Wordpressテーマ「Simplicity」を作成しました。 Simplicityには主に、以下の7つの特徴があります。 シンプル 内部SEO施策済み 拡散のための仕掛けが施されている 端末に合わせた4つのレスポンシブスタイル

wp-simplicity.com

simplicityでタグページをnoindexにしない

子テーマのfunctions.phpに以下を追加して再定義する。
タグページのヘッダーメタにnoindexを出しません。２ページ以降はnoindexが出ます。

function is_noindex_page(){
  return (  is_attachment() || is_search() || is_paged()); //添付と検索結果、2ページ目以降を含めない
}

余計なヘッダー情報を削除する

WP本体のバージョンでは必要ないものも含まれるかも。
子テーマのfunctions.phpに追加します。

remove_action( 'wp_head', 'print_emoji_detection_script', 7 );
remove_action( 'wp_print_styles', 'print_emoji_styles' );
remove_action('wp_head', 'wp_generator');
wp_deregister_script ( 'l10n' ) ;
remove_action('wp_head', 'rsd_link');
remove_action('wp_head', 'wlwmanifest_link');
remove_action('wp_head', 'wp_shortlink_wp_head');

モバイルでもデフォルトのSNSボタンを出す

子テーマに、sns-buttons-top.phpをコピーし、is_mobile()をfalseにする。sns-buttons-icon.phpもコピーして内容を変更。

バージョンの変化のためか、http://wp-simplicity.com/mobile-share-buttons/の記事通りやるとエラーとなる。

ボタンのサイズなどが調整が必要みたい。PC版は問題ない。

PCでFacebookボタンが表示されない症状

フッターでスクリプトが読み込まれていない。
親テーマを修正。公式サイトに情報があり、最新版では改善されているそうだ。

早いテーマではない

多機能でどちらかといえば遅い部類のテーマ。レスポンシブかと思いきや、違う。一般的なイメージのレスポンシブではないことは確か。しかし、最適を求めれば振り分けるのが正解のような気がする。

遅いからトータルキャッシュを入れてみる。ページとjsとCSSを最小化。ユーザーエージェントグループではipadを外す。外さないとキャッシュが混在する。テーマ側でタブレットをスマホ表示しているなら問題ない。ここら辺の境目が合いまい。完全レスポンシブを選択？？よーわからん。

SNSボタンは本当は公式を使いたいけど、飾りみたいなもんだから少しでも早いテーマのをキャッシュと合わせて使う。

スライドサイドバーはタブレットで見るとクールなのに、スマホで見ると邪魔でしかない。ほんと邪魔こいつ。なのでやめた。残念。

youtube speed load

このプラグインが.jsと.cssを読み込まないようにして、直接テーマに記載。

７月16日

SEOプラグインでタイトルやmetaをほとんどまかせる。つまり、テーマは殆ど無効化。なぜか、サイトマップがリダイレクトされていたので修正。アーカイブのタイトルを変更。２ページ目以降もインデックスさせるように変更。テーマの修正必要。

アーカイブページのトップに無駄なリンクがあるので削除

ページャーの左の二つが要らない。どちらもトップページ。スマートな書き方ができないので、list.phpで分岐させてfunction.phpで新たに定義した。

hタグの見直し

記事内はh3ベースだったが、このテーマではh2がいいみたい。個別記事はサイトタイトル部分がpで記事タイトルがh1になっていた。h3をh2にh4をh3に置き換える。

また、個別記事はサイトタイトルがpタグなのだが、通常サイトはこれで問題ないと思う。しかし、このサイトはほぼスラックラインについてしか書かれていないので、記事タイトルもh1に変える。header-logo.phpを編集。条件分岐部分を削除した。個別記事はh1タグが二個になるが、こっちのほうがこのブログにあっている。h1、h2、h1、h2、h3・・・となる。

フッター部分

コピーライト部分を前のテンプレートからコピペ。

続きを読むの部分

同一アンカーで違うページに飛ぶのはあまり好きじゃないので、list.phpを編集。タイトルをカットして…表示にする。タイトルが短い場合は…はでない。個別の関連記事も変えたいけど、いまはそのまま。

SSL化

SSL化してみました。寝ログを参考にしたら比較的簡単かと思いきや、ブラウザーショットや素の楽天アフィリエイト、過去のブログの画像、フリッカーの画像などなど。。どんどん出てきます。
懸案だった、amazonと楽天のウェブサービスはphpで置き換えたらokになて助かりましたが、書き方的に非効率だろうから今後時間がある時にスマートな方法を考えてみます。

ただし、FacebookのいいねがSNSカウントキャッシュでも引き継げず。ポケットは大丈夫なのになぜに、今後調査してみます。

ブログカードのクリッカブル化

jqueryでsimplicityのブログカードをdivごとクリックできるようにしました。SSL化に伴いブログカードが大量増加。外部だけ新しいタブで開く。あと、追従サイドバーにアマゾン張りつけ。ルーズなCSSで助かった。そのまま行ける。