「SWELLカスタマイズ」ブログカードのキャプションを強調してみた!

まいどおおきに!おおもと(@so88qa)です♪

最近話題のWordPressテーマSWELLのコピペで簡単カスタマイズ記事です!

今回のカスタマイズはブログカードのカスタマイズ

ブログカードカスタマイズ

SWELLのブログカードはシンプルだからカスタマイズで個性が出やすい

おおもとのアイコン画像おおもと

今回のカスタマイズはSWELLらしくシンプルなカスタマイズです!

気になる人はコピペをして試してみてくださいね♪

もくじ

ブログカードの設定

SWELLの設定
おおもとのアイコン画像おおもと

まずSWELLの設定からブログカードの種類を設定してください。

STEP
SWELLの設定

SWELLの設定からエディター設定に移動してその他の項目をクリック

STEP
ブログカード(内部)

ブログカードの種類をタイプ3に設定

STEP
ブログカード(外部)

ブログカードの種類をタイプ3に設定

created by Rinker
¥1,832 (2020/10/29 02:56:11時点 Amazon調べ-詳細)

かんたんカスタマイズ

/*ブログカード*/
[data-type=type3] .p-blogCard__caption{
     background:repeating-linear-gradient(-45deg,transparent 1px 2px,rgba(43,129,171,.1) 3px 4px);
     border:1px solid #004262;
}

今回のカスタマイズは

  • backgroundで背景をストライプに変更
  • borderで囲みの線を追加

をしています!

おおもとのアイコン画像おおもと

背景の色を変えたい人はカラーコードではなくrgbaで変更してください。

created by Rinker
¥1,760 (2020/10/29 02:56:12時点 Amazon調べ-詳細)

カスタマイズまとめ

今回の記事はSWELLブログカードのキャプションを変更するカスタマイズ記事でした♪

おおもとのアイコン画像おおもと

SWELLらしくシンプルなカスタマイズをしてみました!

このカスタマイズが気に入った人はぜひ試してみてくださいね!

この記事をシェアする

コメントを書いて応援♪

コメントする

CAPTCHA

もくじ
閉じる