• 赤色のリンクは、まだ日本語Codexに存在しないページ・画像です。英語版と併せてご覧ください。(詳細

このWikiはいつでも誰でも編集できます

コンテンツ幅

提供: WordPress Codex 日本語版
移動先: 案内検索

この項目「コンテンツ幅」は、翻訳チェック待ちの項目です。加筆、訂正などを通して、Codex ドキュメンテーションにご協力下さい。

コンテンツ幅テーマ機能のひとつで、バージョン 2.6 から導入されました。この機能を使うと、例えば oEmbed 埋め込みや投稿内の画像などといったあらゆるコンテンツの最大幅をテーマ内で設定可能になります。

WordPress はこのテーマ機能を活用することで、oEmbed コードをフロントエンドで指定のサイズ (横幅) に拡大・縮小したり、メインコンテンツエリアのレイアウトを崩すことなく画像を挿入したりといったことができます。また、この機能によりプラグインも $content_width に保存された値にアクセスできるため、どんなテーマにでも完璧に溶け込めるような基礎を築くこともできます。

テーマ対応の追加

バージョン 2.6 以降、テーマは functions.php ファイル内で $content_width 変数を指定する必要があります。例えば以下のようにします。

if ( ! isset( $content_width ) ) {
    $content_width = 600;
}

また、以下の CSS をテーマに追加することも推奨されています。

.size-auto, 
.size-full,
.size-large,
.size-medium,
.size-thumbnail {
    max-width: 100%;
    height: auto;
}

参考: この変数はメディアの編集画面でサイズ選択ポップアップを表示するときにも使われます。もし add_image_size() で定義したカスタム画像サイズのポップアップを有効とするために、グローバルの $_wp_additional_image_sizes を使っているなら、$content_width は add_image_size() 関数で指定した幅を上書きします。 (配列 $_wp_additional_image_sizes については get_intermediate_image_sizes() /en を見てください。基本的には利用可能な画像サイズの名前/高さ/幅を持ちます。)

用例: 次のコードで 640x320 の画像を定義するとします。

add_image_size( 'full-width-horizontal', 640, 320, true );

ここで何らかの理由により $content の幅を 600 にセットし

$content_width = 600;

さらに kucrut さんの例 を使ってサイズをメディアのポップアップへ追加すると、次のように表示するでしょう:

  • "Full width horizontal - 600 x 300"

これは期待した次のようなポップアップの内容とは異なります:

  • "Full width horizontal - 640 x 320"

今後の開発

リソース

関連項目

テーマサポート: add_theme_support(), remove_theme_support(), current_theme_supports()
テーマ機能: サイドバー, ナビゲーションメニュー, 投稿フォーマット, 投稿サムネイル, カスタム背景, カスタムヘッダー, 自動フィードリンク, html5, コンテンツ幅, editor-style



最新英語版: WordPress Codex » Content_Width最新版との差分