• Skip to primary navigation
  • Skip to main content

Nagashima Laboratory

  • Home
  • Lecture
  • Note
  • Index
  • About

フルサイト編集の基本

WordPressのテーマ(Theme)とは?

サイトの外観(視覚情報と構造)を決める仕組みのこと。WordPressでは、設計の情報とコンテンツが分離されているため、同じコンテンツでもテーマを変えると全く異なるデザインで表示可能です。

WordPressには、毎年リリースされる 公式テーマ(Twenty〜シリーズ) があります。最新のWordPressの機能を試す「手本」のような役割をするテーマです。

フルサイト編集(Full Site Editing [FSE] )とは?

コードを書かなくてもデザインを変更可能な仕組みです。全てのパーツをブロックのように視覚的に組み立て、編集できます。

サイト全体(ヘッダー、フッター、投稿テンプレートなど)が「ブロック」で構成されている、フルサイト編集対応テーマ(ブロックテーマ)を使う必要があります。なお、公式テーマがフルサイト編集に本格対応したのは、Twenty Twenty-Two(2022年)からです。WordPress公式テーマはブロックテーマを標準化していることから、今後はブロックテーマはが主流になると考えられています。

ブロックテーマは、下記のようなファイルの集合体です。ですが、利用者はファイルを直接編集することなく、管理画面のフルサイトエディタ上からノーコードで編集ができます。

  • theme.json 
    • 色・フォント・余白など、テーマ全体の設計指示書の役割をする
  • HTMLファイル
    • WordPress独自のブロックマークアップ(コメント形式の構文)で書かれたファイル。ブロックの配置方法が指示されている。

【参考】従来型テーマ(クラシックテーマ)

フルサイト編集に対応していない「クラシックテーマ」と呼ばれるテーマもあります。細かいカスタマイズ需要に応えるオリジナルのテーマなどの制作に利用されています。既存サイトの多くはクラシックテーマで稼働しており、今もWordPressのテーマとして、クラシックテーマも提供されています。

クラシックテーマは、下記のようなファイルの集合体です。サイトのカスタマイズをするにはPHPの編集が必要です。

  • テンプレートファイル(header.php、footer.php、single.php、page.php など)
    • 各ページのレイアウトを定義
  • スタイルシート(style.css)
    • デザインや装飾を指定
  • functions.php
    • 機能追加やテーマ独自の設定

テーマの切り替え

  • ダッシュボード > 外観 > テーマ
  • 有効化することでテーマが使えるようになります

テンプレートとテンプレートパーツ

  • 外観 > エディタ
  • フルサイト編集対応テーマを有効化するとエディタの使用が可能

テンプレート

  • ページ全体の枠組み(例:投稿ページ用、固定ページ用、404ページ用)
  • ページのレイアウトを決める「設計図」

パターン・テンプレートパーツ

  • 共通部分を分割した部品(例:ヘッダー、フッター、サイドバー)
  • 複数のテンプレートに使い回される

 ヘッダーやフッターの編集

  • 外観 > エディタ(デザイン)> パターン > ヘッダー(フッター)
  • サイト全体で共通する「ナビゲーション・ロゴ・フッター情報」などを管理
  • テンプレートパーツを直接編集し、全ページに一括反映できる

サイト全体のスタイル変更(色・フォント)

  • 外観 > エディタ(デザイン) > スタイル
  • Global Styles(全体スタイル設定)を使うと、全体のデザインを一括管理できる
  • 個別CSSを編集する前に、まずはスタイル機能で調整する
  • 設定できるのは、色(背景・テキスト・リンク)、タイポグラフィ(フォント種類・サイズ・太さ)、レイアウト(コンテンツ幅など)など

2025-09-26 (Last Modified: 2025-09-30) Category: 資料 Tags:wordpress

Copyright © 2023–2025 · Nagashima Sayuri Laboratory