1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

WordPress Output Advent Calendar 2022

Day 11

【WordPress】ブロック記事エディタの使い方

Last updated at Posted at 2022-12-10

前回の記事

前回の記事では、コピーライト=著作権について触れました。Webサイト制作する上では重要な観点ですが、手を動かすというより頭を動かす感じでしたね笑

今回から、また手を動かしていきます。実際に記事を投稿してみましょう。

僕のAdvent Calendarを読み終わった人が、
「へぇ簡単なんだなぁ〜 自分もWordPress使ってサイト作ってみようかな〜」って思うあなたがそこにいたのなら、、、、
読むだけで、頭の中WordPress化しちゃったんだよッ!!!!

記事を投稿する

新たしい記事を作成する

投稿>新規追加メニューを開きます。
image.png
まっさらな画面が出てきましたね。これが投稿画面です。
ここにタイトルや、本文、画像などを追加していきます。

タイトルを追加する

image.png
「タイトルを追加」と書かれているところにカーソルを当てると、タイトルを入力することができます。
image.png

要素を追加する

次に段落を追加したいのですが、すでに一つ要素が追加されています。
image.png
この部分にテキストをいれることで、文章を追加することができます。
image.png
こんな具合ですね。
しかし、これだけだと、記事自体のタイトルと、文章だけがある状態です。
見出しも追加しましょう。
Enterを押すか、もしくは、右の+ボタンを押すと要素の追加をすることができます。
image.png
見出しを選択します。
image.png
見出しを追加することができました。
テキストと見出しの順番が逆なので入れ替えます。
入れ替える要素にカーソルを当てるとメニューが表示されますので、^ボタンを押すとひとつ上に要素が上がります。入れ替えは、ドラッグ&ドロップでもできます。
image.png
image.png
これでOKですね!
このようにして、見出しと段落を追加して記事を作成していきます。

画像を追加する

画像を挿入してみましょう。
Enterを押すか、+ボタンで要素を追加します。メニューから画像を選択すると以下の状態になります。
image.png
アップロード、メディアライブラリ、URLから挿入、の三つの方法で画像を挿入できます。
今回は、先に作成したロゴを挿入してみましょう。
メディアライブラリを選択して追加していきます。
image.png
できました。簡単ですね。

カラムを追加して、横並びで段落を並べる

横並びでコンテンツを並べてみます。
左上の+ボタンを押すと、追加できるすべての要素を一覧で表示することができます。
image.png
この中からカラムを選択します。
image.png
選択すると、以下のような要素が追加され、幾つに分割するかを選択することができます。
image.png
今回は横に3つ並べてみました。
image.png
それぞれに要素を追加していきます。
image.png
見出しと画像をそれぞれのカラムに追加しました。
記事のレイアウトを視覚的に調整できるようになっています。

SNSアイコンを並べよう

同じように左上の+ボタンを押して、すべてのメニューを表示し、ウィジェット欄を探しましょう。ソーシャルアイコンを利用すると簡単にSNSアイコンを並べることができます。
image.png
選択すると以下のような状態になりますので、右の+ボタンで追加したいSNSを選択します。
image.png
image.png
多くのSNSが登録されていますが、日本で普及しているLINEなどはありません。
アイコンの追加ができたら、それぞれのアイコンをクリックして、URLを登録して完了です。
image.png

おわりに

いかがでしたでしょうか。一度では、紹介しきれないほどのブロック機能がついています。是非触ってみて、どんな機能があるのか確認してみましょう。
こんなことができるなら、こういう構成にしようとか、イメージが湧くと思いますよ。

それでは、次回は、投稿に付随する設定を見ていきましょう。

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?