【SWELL】タブブロックの設定と使い方

【SWELL】タブブロックの設定と使い方

SWELLの「タブ」ブロックの設定と使い方をまとめています。

目次

タブブロックの使い方

記事編集画面で「タブ」ブロックを追加します。

タブブロックの追加

後はお好みでサイドバーから全体のデザインを変更して、タブコンテンツを編集して下さい。

タブブロックの編集

タブブロックは、全体の要素となるタブとその中に配置するタブコンテンツで構成されています。

ポイント
  • 必要な数だけタブを追加する
  • タブのタイトルを入力する
  • タブのデザインはサイドバーから変更する
  • タブコンテンツには自由にブロックを追加して編集できる

タブコンテンツの設定

タグコンテンツには、自由にブロックを追加して編集できます。

例えば、タブブロックの中に「投稿リスト」ブロックを追加すれば、トップページの様なタブ切り替えを任意のページに設置することができるので、サイト型のトップページを作成したい時に使うと便利です。

タブブロックは、組み合わせ次第でいろんな使い方ができます。

タブブロックを使う時の注意

タブコンテンツに(目次に追加されるレベルの)見出しを設置する時は注意して下さい。

タブコンテンツに見出しを追加

開いていない(非アアクティブな)タブに見出しを設置すると、目次のリンクが機能しません。

最後に

タブブロックは、比較コンテンツや類似コンテンツを切り替えて表示させたい時に使うと便利です。

ただ、プレビュー画面ではSP表示を確認できないので、記事を投稿した後はSP画面の確認を忘れないで下さい。

今日の一言

2024年3月6日からGoogleのコアアップデートが始まりました。今回は長めの調整でまだ完了していません。このブログは、3月16日時点では確実にマイナス方向。雑記ブログが被弾しているのかと思いきや、僕にとって優良な記事を配信している特化型ブログも複数被弾しているので、一部の個人ブログが被弾しているといった感じ。なんとなくドメイン単位でフィルターをかけられているような気がします。捕捉されると、どんな記事を書いても中途半端な順位までしか上がらない。加えて、一部の記事が大幅に下落する傾向。

コメント

コメントする

アップロードファイルの最大サイズ: 30 MB。 画像, 音声, 動画, 文書, スプレッドシート, 対話型, テキスト, アーカイブ, コード, その他 をアップロードできます。 Youtube、Facebook、Twitter および他サービスへのリンクは自動的にコメント内に埋め込まれます。 ここにファイルをドロップ

目次