SWELLのトップページの文字サイズをド迫力にカスタマイズする方法

上のアイキャッチ画像のようにTOPページの「文字サイズ」をカスタマイズする方法です。私はキャッチコピーの「文章力のお粗末さ」を文字サイズでカバーしようとしています。（どうぞ笑ってください）

秋田です。（元銀行員で支店長・個人ローン関連の部長経験しました。定年退職後にネット通販で起業しています）

そんな私が構築したお手軽・簡単・継続報酬ありの副業が「口コミアフィリエイト」ですが、そのサイトのTOPページヘッダー画像が上のアイキャッチ画像です。

【本記事がおススメの人】
■ SWELLのトップページを迫力ある文字サイズにカスタマイズしたい人
■ SWELLのデフォルトのデザインが少しばかり迫力不足で「もの足りない」と感じている人
※ 注意点･･･画像を用意する時に、その画像そのものに「大き目の文字」を入れ込んで使うという手もあります。

【準備】
管理画面（ダッシュボード）から、「外観」⇒「カスタマイズ」⇒「追加CSS」にコピペできる状態にしておいてください。

トップページ文字サイズをド迫力にする方法とは･･･コピペしてください

下記コードを「追加CSS」にコピペするだけです。簡単です。

.p-mainVisual__slideTitle{
font-size:5.5vw;
font-weight:bold;
line-height:1;
}

.p-mainVisual__slideTitle{
text-shadow:1px 1px 8px #333;
}

もちろん忘れずに「公開済み」をクリックしてください。

フォントサイズやテキストシャドウの数値は好きなようにカスタマイズします

■ font-size ⇒ 5.5 の数字を自由に変えて大きさを確かめましょう。
■ text-shadow 1px 1px 8px #333 ⇒ pxの数値と色を好きなように変更してください。

まとめ

今回の記事は、SWELLのWPテーマを使っていて、かつトップページのヘッダー画像に･･･動画やスライドではなくて「静止画像」を使う際のデザインをカスタマイズするやり方です。

カスタマイズする文字サイズ等を微調整しながら好みのデザインに仕上げてください。（少しばかり試行錯誤が必要です）

※ この場合は「追加CSS」のカスタマイズをしていません。

ちなみに上記画像ページ（サイト）はこちらです。⇒ super-success.net/lp/dream/

【まとめ】
■ 画像そのものに「大き目の文字＝キャッチコピー」を入れて画像を作ってそれを表示させる時には、「追加CSS」はカスタマイズしません。（追加CSSは空欄のままです）
■ 画像そのものをデザイン化してしまえば固定ページのヘッダー画像としても使えます。
（固定ページをLPにする場合など）
■ 追伸にて取り上げましたが、私のSWELLの仕様について公開・解説した記事も良かったら見てください。

下の動画は本記事に連動させたYoutube動画です。（音が出ますので再生にはご注意ください）

実は・・・余談ですが、、
自分のパソコンのWEBカメラと画面録画を使って自分で作成した第1号の動画です。声が不明瞭とか、編集が下手とか、これでもテイク4くらいやりました。（苦笑）これから少しずつ上手くなるとは思います。どうぞご理解くださいませ。

※ 中高年の方へ・・・動画で副業にチャレンジするのは「アリ」だと思います。

ここまで本当にありがとうございました。

【追伸】