🏗️ テーマ基盤初級

DOCTYPE宣言の構文サンプル

HTML5 と過去の DOCTYPE 宣言パターンを網羅したリファレンス。Prettier による Liquid フォーマッタが複数行 DOCTYPE に対応することを示すテストコード。

用途

テーマファイルを Prettier で整形するときに、DOCTYPE 宣言の種類と複数行フォーマットが正しく保持されることを確認する。

設置場所

theme.liquid の最初の行に DOCTYPE を記述する際、サポートされている構文パターンをリファレンスとして参照。実際のストアテーマでは通常 `<!doctype html>` のみを使用する。

注意点

このコードはテスト素材であり、実際のテーマでは HTML5 の `<!doctype html>` のみを使う。XHTML 1.1 や HTML 4.01 の古い DOCTYPE は現在のブラウザサポート対象外のため、互換性が必要な場合を除き避ける。Prettier の Liquid プラグインを使う場合は、複数行 DOCTYPE でも自動フォーマット時に行の位置が保持される。

タグ:doctypehtmltheme-structureformatterprettier

コード

12 行 / liquid

It supports html5 doctypes
<!doctype html>
<!doctype html>

It supports older doctypes
<!DOCTYPE html SYSTEM "about:legacy-compat">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<!DOCTYPE html PUBLIC
  "-//W3C//DTD XHTML 1.1//EN"
  "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

出典・ライセンス

Source:: Shopify/theme-tools/packages/prettier-plugin-liquid/src/test/html-doctype/fixed.liquid
Repository:: https://github.com/Shopify/theme-tools
License:: MIT

このコードは Shopify 著作の MIT ライセンスソースです。原本の著作権は Shopify が保有します。日本語訳は ALSEL によるものです。

DOCTYPE宣言の構文サンプル

コード

出典・ライセンス

関連項目

セクションスキーマのカスタムブロック定義

セクション呼び出しのフォーマット

レイアウトテンプレートの指定

Liquid フォーマッター互換のセクション表記

基本的なHTMLレイアウト

layout タグのフォーマット