FifteenをカスタマイズTweetPocketこのブログは開設当初からwordpressで動いているのだが、そろそろテーマを見直そうと思い色々物色してみた。因みにテーマ変更前はこんな感じ無料で利用していたテーマで、ありがたく長年使わせてもらっていたが、時代と共に少し不満な点が出て来たのでテーマを見直すことにした。以下、不満点などスマホ対応出来てない他のプラグインなど入れれば出来たのかもしれないが、そこまで本気で調べなかった。昨今無視できないほどのユーザー数となったスマホを意識せずにPC版と同じ表示ではさすがにまずい横幅がちょっと狭い最近のPCはほとんどワイド液晶になっているのでフォントが小さい見出しが分かりづらいスマホ対応以外はちょっと手直しすれば直せそうではあったが完全に放置状態。Fifteenに落ち着いた。Fourteenにしようかと思ったけど折角なんで新しいものに飛びついてみた。Fifteenの特徴レスポンシブデザインもうすべてはこれのため。PCで見ても、スマホで見てもよろしくやってくれます。シンプルどシンプルです。前は色々テーマ一覧とかみておしゃれなやつとか探してたけど、なんだかんだシンプルが一番じゃねって思ってたのでちょうどよかった。子テーマの作成wordpressのテーマを編集するための常套手段として、子テーマの作成をする。偉そうに書いてますがまったく知らなかった。子テーマを作る利点としては、元のテーマがアップデートされても子テーマ側で影響を受けないこと。実は前のテーマの時は子テーマの存在を知らなくて、元のテーマのフォントサイズを直接編集していたのだが、アップデートの度に元に戻ってしまって結構困っていた。子テーマの作成は、非常に簡単で、wordpressのテーマディレクトリに任意の名前でディレクトリを作成します。child_twentyfifteenwordpressのテーマディレクトリは、<wordpressをインストールした場所>/wp-content/themesです。作ったディレクトリに、1つだけstyle.cssってファイルを作って、中身をこんな感じにする。元のテーマのスタイルシートを読み込んでます。これだけで子テーマの完成、@import以下に自分で定義したいスタイルシートを書いて行けば、見た目の変更は可能です。Fifteenでも特にデザインされてません。普通にH2は太字程度だったと思う。標準テーマなのでベースは用意するから見た目は自分で変えなさいよ的なスタンスなんだと思う。デザインとしてはさほどこだわらないが、記事作成時に折角見出しを付けても見た目で区別がつかないともったいない。いうことで、ネットで情報をあさり、スタイルシートだけで出来る見出しに落ち着いた。左側に縦棒で文字下に線っていう簡単なやつ。色はなぜかオレンジ系にした。h3だけだが一応h1からh6まで作ってある。border-leftとborder-bottomの色を変えたりすれば、各見出しで変化がつくはず。フォントの変更ubuntu環境から見ると特に気にならないのだが、Windowsで見るとフォントが汚い。昔はLinuxの方がフォントが汚くて使用に耐えられない感じだったのに、IPAフォントや、Takaoフォントへ移植してくれた方々のおかげでいつの間にか逆転した感じ。メイリオとかにすればいいの?Windowsよくわからん。style.cssの下に追加。break-all;}最初にgoogleさんが提供しているNotoフォントってやつを使ってみることを試みている。Fontって効いてるのかよくわからん。普通にメイリオの方が効いてるのかもしれないがとりあえずWindowsでもマシになった気がする。ウィジェットの下のマージンを調整サイドメニューに、最近の投稿やらカテゴリやらウィジェットを配置しているのだが、ウィジェットの間のマージンがあれだったのでちょっと修正。style.cssの下に追加。20px;}ちょっとマシになった。アナリティクス設定プラグインでやったほうが簡単かもしれないけど、自分で理解してた方がよいので子テーマ側でやります。今まではstyle.cssの編集のみでしたが、今度はテーマのphpファイルを編集します。アナリティクスはヘッダーに入れたいので、header.phpを編集します。(テンプレートファイルって言うらしい)テンプレートファイルの編集は、style.cssと違って、元のファイルを子テーマにコピーしてから編集を行います。child_twentyfifteen/</head>の直前にアナリティクスのコードを挿入します。–>で囲まれた部分だけ追加です。?>とか、</head>とかは元のファイルにある部分です。テンプレートファイルの場合は、style.cssと違って元のファイルをコピーして編集している。これだともし元のファイルになんか重大な問題があって、修正が行われても、テーマのアップデートでは反映されない。子テーマ側に直書きされているため。アップデートを反映させるには、子テーマ側で元テーマのテンプレートを読み込んで指定箇所に追加したいコードを挿入するようなことをプログラム的にやるしかなさそう。