子テーマ化詳細
閲覧数: 36(0)
子テーマ化にあたって具体的に修正した部分の説明をします。まずは「header.php」から。サイトのタイトルに使っているフォントを指定しています。グーグルフォントの「Cabin Sketch」を使用するための設定です。
<link href='https://fonts.googleapis.com/css?family=Cabin+Sketch' rel='stylesheet' type='text/css'>
現在、フォントはローカルにコピーした「Barcode 39 Text」を使用しています。設定は以下の通り。
@font-face {
font-family: 'Barcode';
src: url('./fonts/LibreBarcode39Text-Regular.eot');
src: url('./fonts/LibreBarcode39Text-Regular.eot?#iefix') format('embedded-opentype'),
url('./fonts/LibreBarcode39Text-Regular.woff2') format('woff2'),
url('./fonts/LibreBarcode39Text-Regular.woff') format('woff'),
url('./fonts/LibreBarcode39Text-Regular.ttf') format('truetype'),
url('./fonts/LibreBarcode39Text-Regular.svg') format('svg');
font-weight: 400;
font-style: normal;
}
「style.css」と「functions.php」は前回の記事で説明済みなので省略。この2つのファイルの存在が子テーマ化の基本です。
「footer.php」ではフッターが意図しないところで改行されないようにスタイル指定を追加しています。
<?php do_action( 'oblique_footer_svg' ); ?>
<footer id="colophon" class="site-footer" role="contentinfo">
<div style="word-break:keep-all" class="site-info container">
<?php do_action( 'oblique_footer' ); ?>
</div>
</footer>
「content.php」では抜粋の時に「いいね」まで含まれてしまう現象をかなり強引に解消しています。その他には広告のコードも入れています。詳細はこちらを参照ください。
<?php ob_start();
the_excerpt();
$str=ob_get_contents();
ob_end_clean();
if (mb_strpos($str, "いいね") === FALSE){
$pieces = explode("取り消す", $str);
} else {
$pieces = explode("いいね", $str);
}
echo $pieces[0];?>
「content-single.php」では広告コード、「関連記事」と「最終更新日」を追加しています。
<footer style="word-break:normal" class="entry-footer"> <?php oblique_updated_on(); ?>
「single.php」ではページナビで説明した通り、前後のページへ移動する際の「カテゴリの制限」を実装しています。
「content-none.php」では検索結果がなかった時に表示される画面が左寄せになっていたので、他のページと同じように中央寄せにするスタイル指定を追加しています。
<div style="text-align:center" class="page-content">
その他にはパソコンでは右上に表示される「検索」ですが加飾はアンダーラインのみとしています。スマホでは勝手に「border-radius」のような角丸に加飾されてしまっています。指定以外のことを勝手にされるのは嫌いなのでパソコンの表示と同じように直線のアンダーラインになるように「style.css」に「appearance: none」を追加します。
.header-search .search-field {
-webkit-appearance: none; <-- 追加 (Safari、Chrome用)
-moz-appearance: none; <-- 追加 (FireFox用)
padding: 5px 10px;
border-top: 0;
border-right: 0;
border-bottom-color: #6f6f6f;
border-left: 0;
border-radius: 0;
background-color: transparent;
font-size: 12px;
font-weight: 400;
}
修正を加えたファイルの一覧は以下の通りです。
-rw-r--r-- 1 root 1.4K Oct 17 13:04 archive.php -rw-r--r-- 1 apache 2.4K Sep 24 17:24 comments.php -rw-rw-r-- 1 apache 1.2K Sep 21 19:59 content-none.php -rw-r--r-- 1 apache 940 Oct 8 13:41 content-page.php -rw-rw-r-- 1 apache 4.4K Oct 13 20:32 content.php -rw-rw-r-- 1 apache 3.0K Oct 9 16:49 content-single.php drwxr-xr-x 2 apache 4.0K Oct 20 21:42 fonts/ -rw-rw-r-- 1 apache 521 Sep 21 19:59 footer.php -rw-rw-r-- 1 apache 364 Sep 21 19:59 functions.php -rw-rw-r-- 1 apache 4.0K Oct 20 21:59 header.php drwxrwxr-x 2 apache 4.0K Oct 17 21:00 inc/ -rw-r--r-- 1 root 1.4K Oct 20 14:35 index.html -rw-r--r-- 1 root 1.3K Oct 9 23:47 index.php -rw-rw-r-- 1 apache 137K Sep 21 19:59 screenshot.png -rw-r--r-- 1 root 1.4K Oct 17 13:05 search.php -rw-rw-r-- 1 apache 1.5K Oct 24 21:12 single.php -rw-rw-r-- 1 apache 40K Oct 27 00:13 style.css
-rw-r--r-- 1 apache 24K Oct 20 14:35 LibreBarcode39Text-Regular.eot -rw-r--r-- 1 apache 28K Oct 20 14:35 LibreBarcode39Text-Regular.otf -rw-r--r-- 1 apache 40K Oct 20 14:35 LibreBarcode39Text-Regular.svg -rw-r--r-- 1 apache 23K Oct 20 14:35 LibreBarcode39Text-Regular.ttf -rw-r--r-- 1 apache 8.8K Oct 20 14:35 LibreBarcode39Text-Regular.woff -rw-r--r-- 1 apache 6.9K Oct 20 14:35 LibreBarcode39Text-Regular.woff2
-rw-rw-r-- 1 apache 8.0K Oct 17 21:00 template-tags.php
最終更新日: 2019年6月14日