テーマを作ろう – 其の三(header.php前編)

ゆるきゃん△4話を一生リピートしてます。

実際にテーマ開発に取り組みだしたわけなんですが…まぁわからんことも多いのでまずは実際のTwenty Seventeenテーマから必要なことを勉強します。まずはheader.php。

<html <?php language_attributes(); ?> class="no-js no-svg">

いきなり来たな。

<?php language_attributes(); ?>

これはサイトの言語設定を反映させるみたいですね。lang=”jp”って感じ。滅多にないとは思いますが「管理画面は英語設定だけどサイトは日本語だよー」って人はこれ手動で設定しないとダメですね。

次…

class="no-js no-svg"

no-jsはJava Scriptを動作するかチェックするためのクラス。といってもこのクラス名に意味は無くて、

  1. ページの読み込み時にJSを走らせて.no-jsを消す
  2. JSが動かない環境下だと.no-jsが消えない
  3. cssなどで.no-jsに対してjsが動かない場合の処理ができる(jsが動かないよってメッセージをdisplay: noneからblockにしたり)

またno-svgも同様にsvgを読めないブラウザ向けに通常の画像ファイルを読み込むためのクラスみたいですね。

んー、これいるのかな?ずいぶん前に書いた けど基本古いブラウザってのがもう存在が罪だと思っていて、早く駆逐するためにも敢えて対応しないのが僕は正解だと思ってます。これはやらなくてもいいかなー。次。

<meta charset="<?php bloginfo( 'charset' ); ?>">

Codexによると

charset’ – Version 3.5.0 以降は “UTF-8“を常に返します。その前のバージョンでは、管理画面の「設定 > 表示設定」で設定された「ページとフィードのエンコーディング」を表示するものです。このデータは wp_options テーブルの “blog_charset” レコードから取得されるものです。

えっと、じゃあUTF-8でいいよね…?多分どっちでもいいんだろうけど…。これから仕様変更があったときに対応するためにはcharset引っ張ってきた方が良いのかな…?一応これは使っておこう。

<link rel="profile" href="http://gmpg.org/xfn/11">

なんだコレ。懇切丁寧な説明がされているサイトがありました。ありがとうございます。

これは XFN フォーマットを取り入れたページであることを伝えるメタデータです。 XFN(XHTML Friends Network) とはマイクロフォーマットの 1 つで、他者(他のサイト)との関係を示すものですが、現状では役に立つようなシチュエーションが存在しません。 したがって積極的に削除するべきです。

消します。まだ<head>までしか終わってないのに1000文字超えてる…。ここまでまとめて次の記事に行きます。

<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1">

<?php wp_head(); ?>
</head>

CSSとか全く読み込んでないけどいいのかな…?後で調べよう。ではまた。