【SWELL】を設定してみる

はじめに
2025.04.27 

当ブログはアフィリエイト広告を利用しています
Light
Light

何？cocoon以外にもあるの？そろそろ頭パンクしそうなんだが？

この記事では、SWELL初期設定の方法をまとめてみました。
SWELLテーマを使用したい場合は「【cocoon】を設定してみる」を確認してみてね！

【SWELL】初期設定

初期設定内容リスト
  • プロフィールを設定
  • ファビコン・OGP・NO IMAGEの画像を設定
  • SWELL設定で高速化やエディターの設定
  • カラーパレット設定
  • タグ選択をチェックリスト形式にする
  • 吹き出しの設定

プロフィールを設定

【外観】→【ウィジェット】→【プロフィール】ウィジェットをサイドバーやフッターにドラッグ

SWELLのプロフィールは、ウィジェットで設定します。
必要な項目を入力し、プロフィール画像もウィジェットで設定します。

Light
Light

ウィジェットごとに設定しないといけないのでご注意

ファビコン・OGP・NO IMAGEの画像を設定

ファビコン：【外観】→【カスタマイズ】→【WordPress設定】→【サイト基本情報】
OGP：【SEO SIMPLE PACK】→【OGP設定】→【基本設定】タブのOGPタグの基本設定
NO IMAGE画像：【外観】→【カスタマイズ】→【サイト全体設定】→【NO IMAGE画像】
Light
Light

SEO SIMPLE PACKは、SWELLテーマで必須のプラグイン。
プラグインをインストールしてから設定してね。

SWELL設定で高速化やエディターの設定

【SWELL設定】→【SWELL設定】→【高速化】

SWELL設定でブログを高速化します。
【キャッシュ機能】→すべてチェック
【ファイルの読み込み】→「SWELLのCSSをインラインで読み込む」にチェック
【遅延読み込み機能】→「記事下コンテンツを遅延読み込みさせる」「フッターを遅延読み込みさせる」「スプリクト（lazysizes.js）を使って遅延読み込みさせる」にチェック
【ページ遷移高速化】→高速化の種類「使用しない」にチェック

カラーパレット設定

【SWELL設定】→【SWELL設定】→【エディター設定】

カラーパレットに自分で決めたブログテーマカラーをセットしておくと便利です。
エディター設定では、「ボーダーセット」「マーカー」「ボタン」などのデザインを変更できます。

外観→カスタマイズのカスタマイザーでデザインを整える

【外観】→【カスタマイズ】のカスタマイザーでサイトデザインを整える

SWELLではカスタマイザーで詳しくデザインを変更できます。
ひととおり目を通してデザインを整えましょう。

タグ選択をチェックリスト形式にする

【外観】→【テーマファイルエディター】→ 編集するテーマを選択がSWELL CHILDになっていることを確認し、【Theme Functions】を選択する → コードをコピペする

「テーマファイルエディター」を変更するときは、あらかじめバックアップをとっておきましょう。

下記のサイト様のコードをコピペさせていただきました。

タグをチェックボックスで選択できるようにする（Gutenberg＆Classicエディタ対応）
WordPressのタグをフリー入力式からチェックボックス選択式に変更する方法です。重複予防や効率アップに♪
libre-co.com

//投稿のタグをチェックボックスで選択できるようにする
function change_post_tag_to_checkbox() { $args = get_taxonomy(‘post_tag’); $args -> hierarchical = true;//Gutenberg用 $args -> meta_box_cb = ‘post_categories_meta_box’;//Classicエディタ用 register_taxonomy( ‘post_tag’, ‘post’, $args); } add_action( ‘init’, ‘change_post_tag_to_checkbox’, 1 );

吹き出しの設定

【ふきだし】
Light
Light

あ、僕のことだね

吹き出しに設定するアイコンや吹き出しスタイルを設定します。

SWELLの場合は、記事作成した後から吹き出し設定を変更するとそれまで記事に貼りつけたすべてのふきだしのデザインも一括で変更されます。

まとめ

SWELL初期設定はカスタマイザーで多くの部分のデザインを管理できるのが魅力です。
ある程度デザインが整ったら、次は記事を書いてみましょう。
サクサク進むはずです。

コメント