ペライチの
トップページの隙間の埋め方

気になる隙間をスッキリ解消!
トップページ画像を入れたのはいいけど、
上下にある空白の隙間が気になる!

なんてことはありませんか?

以下は、この隙間をなくす方法をお伝えします。

しっかり解消して、
お客様に喜ばれるページにしましょう!

解消はプレミアムプランの方のみができます

具体的な手順

手順1

隙間を埋めたいトップページがある
公開されているページを開きます。
*ペライチの編集画面ではありません

トップページ画像の上で
右クリックをして、
「検証」をクリックしましょう。

手順2

赤枠の中をコピーしたいので、
「Ctrl」+「C」を同時に押しましょう。

手順3

次に、ペライチの編集画面を開きます。

現在のトップページを消して、
「+」を押して
ブロックの挿入をしましょう

手順4

「その他」にある
「HTML」をクリックしましょう。

手順5

「ここをクリックして埋めたいコードを貼り付けてください。」
の文章をクリックします。

手順6

「ここをクリックして埋めたいコードを貼り付けてください。」
の文章を消して、

「Ctrl」+「V」を同時に押します。

手順2でコピーしたものが、
貼りつけられたはずです。

手順7

赤枠内の
data-structure="e-img"
を消します。

(「alt="" 」と「">」の間を消します)

手順8

以下の赤文字をコピーしてください。

 style="width:100%; margin-top:-60px; margin-bottom:-60px;

上記の文字をコピーしたら、
画像の赤枠内のように
コピーした文字を貼りつけます。

(「alt="" 」と「">の間に貼りつけます)

手順9

「保存」を押して完了です。

完成したページを見てみましょう

公開しているページを見てみましょう。

赤いラインの部分にあった

上の隙間がなくなっています。
細い赤枠の部分の
下の隙間もなくなっています。

隙間の微調整方法

上の隙間の調整

赤枠内にあった
「60」の数値を変えましょう。

数値を減らすほど
隙間が大きくなります

今回は「50」に変更します。

下の隙間の調整

赤枠内にあった
「60」の数値を変えましょう。

数値を減らすほど
隙間が大きくなります

今回は「40」に変更します。

完成!微調整が終了!

スマホやPCを確認しながら、
好みの隙間に調整して完成です。

綺麗なトップページになり、
お客様にとって
より見やすいページになりました。

解説者プロフィール

上田祐輝 (Yuki Ueda)
株式会社心と体サプライズ代表取締役。
株式会社上田防水布店Webクリエイター、
コピーライター。

理学療法士として仕事をしていたが、
家業のテント屋を手伝うために2015年に退職。

ホームページ作成、コピーライティング、
広告運用をゼロから学び、ペライチを使って
3年で月1000万円以上の売上をつくる。
主な実績
  • 株式会社上田防水布店で、3年で月1000万円の売上をつくる
  • 理学療法士として、国民的アイドルの施術も担当
  • セミナー満足度100%のこともあり、毎回大好評
  • 全国2000人以上の新規顧客を獲得
  • 47都道府県へ3000個以上の商品を発送
  • 理学療法士として、国民的アイドルの施術も担当

解説者のFacebookはこちら


Facebookでは
「ページ作りで役立つ情報」を
定期的に投稿しております。