SWELLのブロック

目次

ブロックのボーダ設定とか

↑ 「ブロックのボーダ設定とか」の行にカーソルを置いて、ポップアップした枠の一番左、「段落」→「見出し」→「H2」と表示されていると、上記の見出しになります。「H3」などに変えてみてください。

右上の点が三つ重なったメニューボタン(ケバブメニュー)の一つ左の四角のボタンを押して、「投稿、ブロック」の設定ができるメニューを表示します。そこで、ボーダ設定01を選ぶと、このように「箱」を表示できます。

同じように、スタイルを選ぶこともできます。これは「角に折り目」を選んでいます

吹き出しを選んでみましょう

グッドマーク付きです

バッドマークもあります

いろいろなブロック

リスト入りグループ

  • 左上の「+」を押し、リストを選択します
  • 「リスト入りグループ」を選んで文字を追加します
  • リストができてから、リストを選ぶと、ポップアップが出るので、一番左の「リスト」の絵を選びます
  • 右のサイドメニューからスタイルを選ぶと、リストの「・」を「⚪︎」にしたり、数字にしたり選ぶことができます
  • この箱の文章以外の場所をクリックし、右のサイドメニューからスタイルを選ぶと、違ったデザインのリストを作る事ができます

アコーディオン

  • 左上の「+」を押し、リストを選択します
  • 「アコーディオン」を選んで文字を追加します
ここをクリックすると……

文章を表示したり閉じたりできます

右のサイドメニューから

デフォルトで開いた表示状態にもできます

バナーリンク

  • 左上の「+」を押し、リストを選択します
  • 「バナーリンク」を選んで文字を追加します
  • バナーリンクのブロックをクリックし、中央左の(ー)のようなボタンを押します
  • 入力欄がでるので、そこにurlを入力することでリンク付きのバナーとなります

ボックスメニュー

  • 左上の「+」を押し、リストを選択します
  • 「ボックスメニュー」を選んで文字を追加します

SWELLボタン

  • 左上の「+」を押し、リストを選択します
  • 「SWELLボタン」を選んで文字を追加します

キャプションボックス

  • 左上の「+」を押し、リストを選択します
  • 「キャプションボックス」を選んで文字を追加します
上部にタイトル

下部に内容といったひとかたまりを作ることができます

枠のスタイルは複数あり

枠の中に吹き出しを作ったり

箱の中に

また箱を作ることもできます

リッチカラム

  • 左上の「+」を押し、リストを選択します
  • 「リッチカラム」を選んで文字を追加します

複数の箱の横幅を%でサイズ指定できます

PC、タブレット、スマホの3つそれぞれにサイズ指定できます

上段は40:60、下段は80:20になっています

テスト

スクロールできます

また、複数ブロックを横スクロールで表示することもできます

文字欄1

文字欄2

文字欄3

説明リスト

  • 左上の「+」を押し、リストを選択します
  • 「説明リスト」を選んで文字を追加するします
項目のタイトルと

項目の説明を記入することができます

項目のタイトルは文章のみですが

説明には画像や他ブロックを使うことができます

like, emoji, round

FAQ

  • 左上の「+」を押し、リストを選択します
  • 「FAQ」を選んで文字を追加します
上段に質問文

下部に答えといった形を作れます

左の「Q」と「A」のアイコンはひとまとまりで変更できます

「Q」の項目は文字のみ、「A」の項目は吹き出し等をつけることができます

フルワイド

  • 左上の「+」を押し、リストを選択します
  • 「フルワイド」を選んで文字を追加します

横幅一杯の画像や背景色を表示できます
このサイトは右にサイドバーがあるため、
記事の中でのフルサイズとなっています

ステップ

  • 左上の「+」を押し、リストを選択します
  • 「ステップ」を選んで文字を追加するします
STEP
ステップタイトルと

ステップ説明を記入することができます

STEP
タイトルは文字のみ、

説明は画像やブロックを追加することができます

like, emoji, round
作業
また、始まりの数字を変更したり、

「STEP」の文字を変更したりできます

タブ

  • 左上の「+」を押し、リストを選択します
  • 「タブ」を選んで文字を追加します

タブにそれぞれ独立した文章やブロックを表示できます

また、タブのタイトルも変更できます

ABテスト

  • 左上の「+」を押し、リストを選択します
  • 「ABテスト」を選んで文字を追加します

確率を指定し、その確率に従って表示内容を変更することができます

今回は49%の確率で下の文字が赤く、51%の確率で下の文字が青くなっています

49%の文字です

広告タグ

  • 左上の「+」を押し、リストを選択します
  • 「広告タグ」を選んで文字を追加します
  • これは記事内で編集するといったものではなく、事前にWordPressのホーム画面の広告ダグから設定しておく必要があります
  • 事前に設定した広告を選択すれば、その広告が表示されます

吹き出し

  • 左上の「+」を押し、リストを選択します
  • 「吹き出し」を選んで文字を追加します

吹き出しを表示することができます。

とり

アイコンと名前を表示したり、

きょうりゅう

右側に表示したりすることができます

ブログパーツ

  • 左上の「+」を押し、リストを選択します
  • 「吹き出し」を選んで文字を追加します
  • これは記事内で編集するといったものではなく、事前にWordPressのホーム画面のブログパーツから設定しておく必要があります
  • 事前に設定したブログパーツを選択すれば、そのブログパーツが表示されます
  • ブログパーツで呼び出された文章になります

リンクリスト

  • 左上の「+」を押し、リストを選択します
  • 「リンクリスト」を選んで文字を追加します

投稿リスト

  • 左上の「+」を押し、リストを選択します
  • 「投稿リスト」を選んで文字を追加します
  • 投稿した記事のリストを表示できます
  • レイアウトを変更したり
  • 表示する記事をランダムにしたりもできます

関連記事

  • 左上の「+」を押し、リストを選択します
  • 「関連記事」を選んで文字を追加します
  • サイト内記事へのリンクを作成できます
  • キャプションやタイトルを変更したりもできます

制限エリア

  • 左上の「+」を押し、リストを選択します
  • 「制限エリア」を選んで文字を追加します
  • ログイン状態、日時等で表示するかどうかを選択できます
  • ログインしている場合下に赤い文章が、ログインしていない場合下に青い文章が表示されます

ログインしていません!

商品レビュー

  • 左上の「+」を押し、リストを選択します
  • 「商品レビュー」を選んで文字を追加します
  • 商品レビューを作成できます
  • 商品名、レビュー者名、商品画像、総合評価、メリット、デメリットを入力できます
仮商品
総合評価
( 3.5 )
メリット
  • メリット入力
デメリット
  • デメリット入力

RSS

  • 左上の「+」を押し、リストを選択します
  • 「RSS」を選んで文字を追加します
  • RSSを表示することができます

フィードに記事が見つかりませんでした。

  • 表示する投稿数を変えたり、レイアウトを変えたりできます

フィードに記事が見つかりませんでした。

SWELLのブロックを活用しよう!

SWELLにはたくんさんのブロックがあるため、実際に使おうとすると悩むことがあると思います。

このページが使うブロック選択の参考になればと思います。

よかったらシェアしてね!

この記事を書いた人

コメント

コメントする

目次