2025年 第20・21回 「ブロックテーマ」で家具屋さんのサイトをつくろう

  • 自動バックアップが機能しているか、このタイミングで確認しておこう。
  • 昨日、WordPressコアのメジャー最新版、v6.9 がリリースされました。アップデートしましょう。

これまで実習でつくってきたサイトは「クラッシックテーマ」といわれるテーマでつくってきた。近年、「ブロックテーマ」という新しい仕組みのテーマが浸透しつつあるので、この機会にブロックテーマの使い方に触れておきます。

ブロックテーマは、投稿や固定ページの編集でお馴染みのブロックエディターのような感覚で、パーツを組み合わせながら、コードを触らずにサイト全体をカスタマイズできるテーマ。フルサイト編集(Full Site Editing / FSE)と呼ばれている。

今回は、『1冊ですべて身に付くWordPress入門講座』(SBクリエイティブ)のサンプルを題材に、家具屋さんのサイトをつくります。使用するテーマは『Twenty TwentyTwo』。

以下、参考書から抜粋して掲載するので、誌面の解説を見ながら各自のペースで進めてください。

注意点

3年前に発行された書籍のため、最新版と比べるとボタンの位置や名称など違うところが多いが、概念は変わっていない。実際の画面と見比べなら手探りで作業を進めよう(本を買ってみたが最新版と微妙に違う…ということはよくあること)。

準備

「Local」で新規サイト作成

  • サイト名:WCB Furniture
    • 「Advanced options」をクリックしてアドレスが wcb-furniture.local になっていることを確認
  • Preferred
  • ユーザー名 kanri
  • パスワード icc2025

管理画面にログイン後、「Settings」ページにて、

  • サイトの言語:日本語
  • タイムゾーン:UTC+9
  • 日付形式:Y年n月j日
  • 保存

「Local」にて、

  • 「SSL」の Trust をクリック

管理画面にログイン後、「Settings」ページにて、

  • WordPressアドレス、サイトアドレスのスキームを「https」に修正
  • 保存するとログアウトさせられる(スキームがhttpからhttpsに変わるのでログイン状態が引き継げない)。
  • WordPressに再ログイン

テーマ「Twenty TwentyTwo」をインストール

  • 外観 > テーマ > 新しいテーマを追加
  • 右上の検索窓に「Twenty Twenty-Two」と入力
  • インストール、有効化

素材データのダウンロード

制作(4つの固定ページを作成)

  • 固定ページ > 新規固定ページを追加
  • タイトル:
    • About
    • Gallery
    • Delivery
    • Contact

画像データはダウンロードしたサンプルデータの WP_Data > Data > chapter2 > images から使用。
テキストデータはありませんので、資料を見て手入力してください。

「Gallery」ページのYouTube動画のURL:
https://www.youtube.com/watch?v=DbfX5onwy1A

参考テキストその1


参考テキストその2(テーマのカスタマイズ)


Subscribe
Notify of
guest
0 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x