ブロックエディターを使ってみよう!

自己紹介

村上直子(フリーランスのデザイナー。図を使ったコミュニケーションを研究中。ブロックエディター好き。最近はMiroも好き。)

今日すること

  • ブロックエディターとは?説明
    • 概要
    • ざっくりイメージ
    • 画面構成
  • ワークショップ
    • 進め方の説明
    • 80問ドリル

ブロックエディターとは?説明

概要

  • ブロックエディターとは2018年12月からWordPressに標準搭載されている エディター( = 編集画面)
  • WordPressはもともと「ブログ」として始まった。近年は「ウェブサイト」を作るという役割も担うようになってきた。
    • ブロックエディター の出現によってHTMLやCSSなどの専門的な知識がなくても、ウェブサイトを作りやすくなった。

ざっくりイメージ

詳しく知りたい方は ゼロから学ぼう!ブロックエディター(Gutenberg)WordCamp Tokyo 2019 p52 – 72 スライドをご参照ください。

画面構成

ワークショップ

進め方の説明

1)村上が画面共有してお手本

リピートします。

2)わからないことがあったら質問

質問方法1:ミュートを解除にして発言




質問方法2:チャット「困ってます!」

3)画面共有でみんなで解決





4)難しい問題はメンターさんとブレイクアウトルームで個別解決

5)できたらスプレッドシートにコメント記入で進捗報告


80問ドリル

データをコピーしてお使いになりたい方は、「YouTube視聴参加の方へご案内 / 前半ブロックエディター ドリルを一緒にやってみよう!」をご参照ください。

まずはWordPressにログイン・自分のドリルにアクセスしよう

  1. スプレッドシートにアクセス
  2. B列に自分の名前を書き込む(自分のデータを確保!)
  3. ログインページにアクセス(B列1行)
    F行に「できた!」「OK」など書き込み
  4. 自分のデータのユーザー・パスワード
  5. 自分専用のページにアクセス
  6. 「固定ページを編集」をクリック
    G行に「できた!」「OK」など書き込み
ログインすると現れるアドミンバーの「固定ページ編集」ボタンを押すと、編集ページにアクセスする

村上の解説を聞いてドリルをやってみよう!

  1. 解説をきく
  2. やってみる
  3. 質問する
  4. スプレッドシートに「できたよ!」報告

自分で先に進める方は進んでもOKです!80問まで辿りついたら、残り20問は自分で足されてみてください◎