今回は、リストの作り方について書こうと思います。
リストは、順不同のリストと順番のあるリストに分けられます。
それぞれをWordPress、HTMLでの書き方で解説しようと思います。
順不同のリストの作り方について
WordPressでの作り方(ブロックエディタを使って)
左上の「+」からブロック挿入ツールを開き、赤丸のリストをクリックします。
すると、このように「・」のリストが表示されるので、リストにしたいキーワードをタイピングし、ENTERを押すことで次の「・」が表示されます
- あ
- い
- う
- え
- お
という具合ですね。
リストから段落へ戻す場合は「SHIFT」を押しながら「ENTER」を押すことでインデントを増やした状態(1文字分下げた状態)で文章を打つことができます。
もしくは、リスト外にカーソルを持って行ってクリックすることで段落を入力することができます。リストとは関連の少ない文章であればこちらの方法の方が良いでしょうね。
HTMLでの作り方
ここでは、「カスタムHTML」を使用して説明を行います。
まずはブロック挿入ツール内で「カスタム」と検索するか、右側に出てくる「＋」から「ブロックを追加」から「カスタムHTML」をクリックします。
そして、「HTMLを入力…」と書かれているところに以下のように記入します。
<ul>
<li>1つ目のキーワードが入ります</li>
<li>2つ目のキーワードが入ります</li>
<li>3つ目のキーワードが入ります</li>
<li>4つ目のキーワードが入ります</li>
<li>5つ目のキーワードが入ります</li>
</ul>
と入力することで以下のように表示されます。
- 1つ目のキーワードが入ります
- 2つ目のキーワードが入ります
- 3つ目のキーワードが入ります
- 4つ目のキーワードが入ります
- 5つ目のキーワードが入ります
「ul」とは、「unordered list」(アンオーダード リスト)の略であり、順番のないリストを表すタグです。
WordPressでリストを作る場合はブロック挿入ツールから作る方が楽なような気がしますが、好みで使い分けていいと思います。
私は、カスタムHTMLで入力する方が作っている感が出て好きです。
順番のあるリストの作り方について
WordPressでの作り方(ブロックエディタを使って)
まずは、先ほどと同様に左上の「＋」から「リスト」を選択します。
先ほどと同様に「・」がついたリストが表示されると思います。
「リスト」と表示されているところをクリックし、赤丸がついたところをクリックします。
すると、「・」が「1.」に変わります。あとは、先ほどと同様にキーワードを入れていきます。
- あ
- い
- う
- え
- お
これで順番のあるリストの完成です。
HTMLでの作り方
先ほどと同様に「カスタムHTLM」で説明を行います。
カスタムHTML内に以下のように入力します。
<ol>
<li>1つ目のキーワードが入ります</li>
<li>2つ目のキーワードが入ります</li>
<li>3つ目のキーワードが入ります</li>
<li>4つ目のキーワードが入ります</li>
<li>5つ目のキーワードが入ります</li>
</ol>
先ほどとの違いは<ul>が<ol>に変わっています。
すると以下のように表示されます。
- 1つ目のキーワードが入ります
- 2つ目のキーワードが入ります
- 3つ目のキーワードが入ります
- 4つ目のキーワードが入ります
- 5つ目のキーワードが入ります
「ol」は「orderd list」（オーダード リスト）の略であり、
順番のあるリストに使用されます。
まとめ
今回はリストについてまとめました。順番のあるリスト、順番のないリスト、それぞれ使い分けながらリストを作成していきましょう。 また、リストの作り方についても2種類紹介しました。表示のされ方はどちらも同じなので好きな方法でリストを作成してみましょう。ConoHa WINGについて
WordPressの始め方を紹介しますので、興味がある方はご覧ください。
WordPressを始めるなら「ConoHa WING」がおすすめです。
Conoha Wingは、国内最速のレンタルサーバーを謳っています。
もちろん私も使っていますが、特にアップロード等の速度に不便なく使用できています。
料金の割引、初期費用無料、ドメインが2つまで無料と初心者がお得に始めやすい環境が整っています。
詳しくは以下のリンクに契約から私が使っている無料テーマの「Cocoon」の有効化の方法まで記載していますので参考にされてください。
コメント