私はストーク19 というWordPressテーマを使っています。
(公式ホームページはこちら↓)
![](https://www10.a8.net/0.gif?a8mat=3BG01Z+Q73EA+3PSE+60H7L)
記事を書く時、ボックスを使うと読みやすいですよね。
その「BOXの中にリストを表示させる」
ことを、やりたかったのですが…
- これが
- どうしても
- わからなかったーーー
↑これを作るのに、5時間ぐらい格闘しました(T . T)
方法がわかったので、忘れないうちに、記録します。
「とにかく早くボックスの中にリストを入れたい!」かたは
「もくじ」の「2」をタップしてください。
もくじ
ボックスを記事に挿入する
囲みボックスを、記事に挿入する方法は、2つ。
(機械オンチの超初心者なので、違っていたらすみません)
- ショートコードを入れる
- STORK19 Blocksから入れる
ボックスをショートコードで入れる方法
結論から言うと、この方法はおススメしませんf^_^;
私はこの方法でボックスの中にリストは、入れられませんでした(泣)
でも、ショートコードを使うときのために、記録しておきます。
右側の「+」マークをタップ。
(私はiPad使用なので、パソコンの場合はクリック)
![](https://kataduke-kokuu.com/wp-content/uploads/2020/06/02C898BC-F562-4E20-BE4E-49C65B7180F5-1024x588.jpeg)
ウィジェットをタップ
![](https://kataduke-kokuu.com/wp-content/uploads/2020/06/4338C3F5-58DF-4918-8E77-69F1BAED28C3-1024x673.jpeg)
「ショートコード」をタップ
すると、このような画面になります↓
![](https://kataduke-kokuu.com/wp-content/uploads/2020/06/7D34070F-F9B8-4FF1-B525-E3B35F5830A2-1024x669.jpeg)
ショートコードを入れるワクが出るので…
![](https://kataduke-kokuu.com/wp-content/uploads/2020/06/B703D7F2-1106-4027-8A44-EA4DF6E81385-1024x591.jpeg)
ストーク19のホームページから
使いたいボックスのショートコードを
コピペしてきます。
(ここから↓)
そして、コピペしたものを、さっきの空欄に入れると…
![](https://kataduke-kokuu.com/wp-content/uploads/2020/06/959BD562-8553-42C9-849B-9401CA2624FB-1024x666.jpeg)
このような画面になります。
ここで「下書き保存」→「「プレビュー」にすると
![](https://kataduke-kokuu.com/wp-content/uploads/2020/06/092A16DC-4541-45AA-A143-64F54255531E-1024x664.jpeg)
(↑プレビュー画面)
このように、ボックスが出現します!
しかし…お気づきでしょうか。
このパターンだと「プレビュー」しないと、表示がわからないんですσ(^_^;)
うーん…ちょっと使いづらい…。
さらに、ここから「ボックスの中にリストを入れる」方法が
どうしてもわかりませんでした。
「 STORK19 Blocks」から入れる
もう一つの方法があることに、気がつきました!
STORK19 Blocksという、
ストーク19独自のテンプレート(?)から入れる方法です。
ふたたび「+」をタップ。
![](https://kataduke-kokuu.com/wp-content/uploads/2020/06/B217021C-367C-4FFD-9642-2BB428CE2537-1024x661.jpeg)
ズラズラっと出てきた下の方の
「STORK19 Blocks」(ワードプレスのロゴ『W』がわかりやすいです)
を、タップ。
![](https://kataduke-kokuu.com/wp-content/uploads/2020/06/88B96D90-08E0-4690-9CEB-EC625DDED72E-1024x670.jpeg)
【STORK19 Blocks】が出てこない場合は、「AddQuicktag」というプラグインをインストールしてください。
「S19」とラベルのついた「ボックス(タイトル付)をタップ
![](https://kataduke-kokuu.com/wp-content/uploads/2020/06/3F110F4D-E662-4023-B0A6-90267C4FD91C-1024x672.jpeg)
ワンタップでポン!
と、タイトル付のボックスが入りました♪
![](https://kataduke-kokuu.com/wp-content/uploads/2020/06/98E93AFE-7DCD-489D-8396-DC04042AFA0E-1024x671.jpeg)
ここから↑ボックスの中にリストを入れることが出来ます。
ボックスの中にリストを入れる
ボックスの中の「+」マークをタップ
![](https://kataduke-kokuu.com/wp-content/uploads/2020/06/130042C8-A7B3-4934-B971-16DC3482ECC1-1024x671.jpeg)
「一般ブロック」をタップ
![](https://kataduke-kokuu.com/wp-content/uploads/2020/06/02685F95-67E6-4BDC-9556-1E9D42A78DD3-1024x675.jpeg)
「リスト」をタップ
![](https://kataduke-kokuu.com/wp-content/uploads/2020/06/B084B93C-C005-4671-9321-87B57E789825-1024x672.jpeg)
ボックスの中に、リストが入りました\(^o^)/
![](https://kataduke-kokuu.com/wp-content/uploads/2020/06/D970947C-A9D5-40B2-82CF-B014C3AF2172-1024x595.jpeg)
こんな感じです↓
- ボックスに
- リストが
- 入ったよーーー♪
………。
いやまって。ちょっと待って。
私が使いたいのは、このボックス↓
![](https://kataduke-kokuu.com/wp-content/uploads/2020/06/488107D4-AA5E-4003-A638-E8D2CA78BB2A-1024x664.jpeg)
↑この、ショートコードで出したボックスのデザイン。
このボックスの中に、リストを入れたいのです。
それで…
ここから…
格闘すること数時間( ; ; )
見つけ出した方法は、ものすっごく簡単でした…。
まず、ボックスを出すのはここから↓
![](https://kataduke-kokuu.com/wp-content/uploads/2020/06/A3CA40ED-5FF7-4B50-BCE8-50762A741F00-1024x672.jpeg)
そうすると、このボックスが出ますね↓
![](https://kataduke-kokuu.com/wp-content/uploads/2020/06/EE30633D-BE95-40E1-8AA0-39DCB3D2DF58-1024x671.jpeg)
確かに、これなら「+」マークがあるから、リストを入れられる。
でも、デザインが違うぅ…
デザイン直せないし…
はい。ここが、間違い。
デザイン直せます!!!
変えたいデザインのボックスを『選択』して。
ここです↓ここから…
![](https://kataduke-kokuu.com/wp-content/uploads/2020/06/C0DD8EDF-DAE9-47E8-A80B-7875C00ACC25-1024x443.jpeg)
この歯車マークをタップすると
![](https://kataduke-kokuu.com/wp-content/uploads/2020/06/33D7BC51-0AE5-4C19-A937-C29CBEE34C67-1024x512.jpeg)
こんな画面になります。
ここから、下の方の「シンプル」を選べば!
![](https://kataduke-kokuu.com/wp-content/uploads/2020/06/65152303-A0B9-40A1-B403-5A872B85C4D9-749x1024.jpeg)
シンプルな枠線になりました\(^o^)/
![](https://kataduke-kokuu.com/wp-content/uploads/2020/06/8C5A1B20-582E-4C7B-AB55-96D7BEB0C5B5-1024x439.jpeg)
編集画面では、「+マーク」が出るので、
「+」をタップして、「リスト」を挿入
- ついに
- ついに!!!
- リストになったよーーーーーー(嬉し泣)
もし、編集画面でボックスの中に「+」がなかったら
ボックスの中をタップしてみてください。
色もこちらで変えられます↓
![](https://kataduke-kokuu.com/wp-content/uploads/2020/06/67CFB676-3E65-4149-B7ED-7198C1252C21-749x1024.jpeg)
- 番号にもできます
- 番号の色は変えられない…と思います
- 自由
- 自在
考えてみれば、すごーく単純な話なのですが…( ´艸`)
ここにたどり着くまで、長かったです(泣)
公式サイトは、結構使い方など詳しく説明してくれているのですが
ボックスの中にリストを入れる方法の説明はなくて
「リストの挿入も簡単」と、サラっと書いてあるだけでした。
格闘してる時は「怨」という文字が浮かぶほどでしたが(?!)
![](https://www16.a8.net/0.gif?a8mat=3BG01Z+Q73EA+3PSE+609HT)
公式ホームページ↑
やっぱり、シンプルで可愛い好きなテーマなのでした(*^^*)