プレビュー画面
![](https://blog.rakupippi.com/blog/media/uploads/2023/07/15151201/%E3%83%95%E3%82%9A%E3%83%AC%E3%83%92%E3%82%99%E3%83%A5%E3%83%BC%E7%94%BB%E9%9D%A21-1.png)
編集した画面の書き出し前イメージを見ることができます。
固定ブロックなどの一部のブロックはこの画面で確認することができません。
書き出し後に共有URLにて挙動を確認してください。
自動切替の設定を行なっている場合
![](https://blog.rakupippi.com/blog/media/uploads/2023/07/15151203/%E3%83%95%E3%82%9A%E3%83%AC%E3%83%92%E3%82%99%E3%83%A5%E3%83%BC%E7%94%BB%E9%9D%A22-1.png)
自動切替の設定を行なっていると、設定したブロックが重複して表示されます。
画面下部の中央[時計マークのついたボタン]から時間指定のプレビューが可能です。そちらにて挙動をご確認ください。
また、LP詳細設定にて、各種SEO対策の設定やGoogleAnalyticsとの連携を設定することができます。
LP詳細設定について
Google アナリティクス設定
![](https://blog.rakupippi.com/blog/media/uploads/2023/07/15151151/LP%E8%A9%B3%E7%B4%B0%E8%A8%AD%E5%AE%9A%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A61-1.png)
Googleアナリティクスのトラッキングコード(UA-XXXXXXXX-X)を設定するだけで、書き出し後のLPにGoogleアナリティクスのグローバル サイトタグ(gtag.js)を埋め込むことができます。
Googleアナリティクスにて設定されるトラッキングコードをご用意の上ご利用ください。
空欄で設定するとトラッキングコードは設定されません。
OGPタグ設定
![](https://blog.rakupippi.com/blog/media/uploads/2023/07/15151155/LP%E8%A9%B3%E7%B4%B0%E8%A8%AD%E5%AE%9A%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A62-1.png)
書き出し後のLPファイルに、OGPタグ設定を追加することができます。
『OGP』とは「Open Graph Protocol」の略で、SNS(Twitter/Facebook)やLINEなどでURLを送ったりしたときに表示される画像付きリンクです。
この設定はSEO対策に有効です。
【OGP 画像】
[ファイルを選択]ボタンからファイルをアップロードできます。
※OGP画像のサーバーにアップ後の反映方法について
OGP設定の画像は、リンクを絶対パスで指定が必須となっております。
書き出し後のhtmlファイルを開き、相対パスになっている画像パスを、アップロード中のドメインに書き換えてください。
<!–▼下部タグのcontent内をアップロード先ドメインに書き換えてください▼–>
<meta property=”og:image” content=”./multiicon/ogp_image.png”>
OGP画像のサイズについて 推奨サイズは 1200px*630px です。
このサイズで登録すると、Twitter、Facebook、LINEなどそれぞれに対応したサイズで表示されます。
アップロードできるファイル拡張子は『.jpg』『.png』『.gif』のいずれかです。
【OGP タイトル】
LPのページタイトルを入力します。
【OGP LP説明】
LPのページの説明文を入力します。
【OGP サイト名】
サイト名やブランド情報があれば入力します。
【Twitter Card】
Twitter上での表示タイプを指定します。
- summary:タイトル、説明、サムネイルが表示されます。一般的な形です。
- summary_large_image:タイトル、説明、サムネイルが表示されます。画像の大きさがsummaryより大きくなります。
- app:アプリの名前や紹介文、アプリアイコン、評価や価格などの表示がされます。アプリ配布用の表示です。
- player:ビデオやオーディオなどのメディアを表示することができます。
【Twitter LPサイトの@ユーザー名】
@から始まるWebサイトのTwitterユーザーIDを入力します。
【Twitter 作成者の@ユーザー名】
コンテンツの作成者や管理者の@から始まるTwitterユーザーIDを入力します。
【FaceBook ID】
FacebookのアプリIDを入力します。各項目は、[設定する]ボタンにて設定ください。
header設定
![](https://blog.rakupippi.com/blog/media/uploads/2023/07/15151153/LP%E8%A9%B3%E7%B4%B0%E8%A8%AD%E5%AE%9A%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A63-1.png)
SEO対策として有効な、LPのmeta descriptionデータを設定します。 検索時にそのページがどんな内容なのかを検索ユーザーに表示する説明文となります。
50文字から120文字以内が理想的です。
ファビコン作成
![](https://blog.rakupippi.com/blog/media/uploads/2023/07/15151158/LP%E8%A9%B3%E7%B4%B0%E8%A8%AD%E5%AE%9A%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A64-1.png)
ファビコン(favicon)とは、Webブラウザで新規タブを開いたときにタブに表示される画像、またはLPをブックマークした際に表示されるアイコン画像です。 RAKUPiPPiでは、512px × 512px 以上のサイズの画像を登録すると、AndroidやiOS等の全ての端末に対応したサイズのアイコン画像を生成します。
※初期設定はらくぴっぴミニアイコンです。
※画像の生成にはやや時間がかかることがあります。
ファビコン変更後、サーバーアップロードしても変更されていない場合について
ブラウザのキャッシュが原因の可能性があります。
ブラウザの強制リロード(スーパーリロード)を行って下さい。
あるいはキャッシュを削除して頂いてから強制リロード(スーパーリロード)をお試し下さい。
SVGファイルのファビコン登録について
base64コードのSVGファイルを登録して書き出すと、CSSにエラーが発生してしまうため、基本的にはSVGファイルは非推奨となります。 『jpg』、『png』、『gif』の形式のファイルでのご登録をお願いします。 また、アップロードファイルサイズ上限は1ファイルにつき2MBまでです。
LPO解析機能用URL追加
![](https://blog.rakupippi.com/blog/media/uploads/2023/07/15151149/LP%E8%A9%B3%E7%B4%B0%E8%A8%AD%E5%AE%9A%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A65-1.png)
解析対象のドメインを入力し、[設定する]ボタンを押して設定ください。LPO解析機能が有効になります。
設定後の書き出しファイルを許可ドメインにアップロードすることで解析が始まります。
[許可ドメインを解除する]ボタンにてLPO解析機能が設定済のドメインを解除できます。
※既に同LPで設定済みの場合、再設定すると新しいドメインで上書きされ、元のドメインでのLPO解析機能は無効化されますのでご注意ください。