連携フォームは自由にHTMLを記述することが出来ますので、リッチな表現が可能です。
本ページでは連携フォームで記載いただけるサンプルコード集を記載いたします。
*このページで使用している各class、id名はエルセグの仕様変更等に伴い利用できなくなる可能性がございます。あらかじめご承知おきください。
*本記事は2021年9月7日時点で動作を確認しております。

画像をリッチにする

画像を横幅100%にする

<style>
.form-description{
width:100% !important;
}
.form-description img{
width:100% !important;
}
</style>

ヘッダー箇所を削除する

<style>
.header{
display:none !important;
}
.image,
.form-description{
margin:0 auto !important;
}
</style>

画像の角丸を削除する

<style>
.image img{
border-radius:0 !important;
}
</style>

上記を併せて設定する場合

<style>
.form-description{
width:100% !important; /* 全体枠を幅100%に */
}
.form-description img{
width:100% !important;  /* 画像幅を100%に */
}
.header{
display:none !important;  /* ヘッダー箇所を非表示 */
}
.image,
.form-description{
margin:0 auto !important;  /* ヘッダー前後の余白を削除 */
}
.image img{
border-radius:0 !important;  /* 画像の角丸を削除 */
}
</style>

解析コードを設置する

Google Analyticsを設置する

GoogleAnalyticsをはじめとしたJavascriptを設置するタイプの解析コードは、入力ページにも完了ページにも設置することが可能です。

お客様がどのタッチポイントで離脱しているのかを調べるためにも、ぜひ設置しておきましょう。
GoogleAnalyticsで発行される下記のようなトラッキングコードを、そのまま張り付けて頂ければOKです。

Google Analytics
https://analytics.google.com/analytics/web/

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-xxxxxxxx-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-xxxxxxxxx-1');
</script>

※こちらはサンプルコードです。お客様毎にUA-xxxxxx-1のコードが異なりますので、GoogleAnalyticsをまだ利用されていないからは、上記リンクから登録を行ってください。

お客様の操作改善

自身の購入履歴を確認できるリンクを設置

通常のブラウザで開く場合(推奨)
urlの末尾に ?openExternalBrowser=1 を追加します。
*既にパラメータがある場合はhttps://xxx.com/?param1=xxx&openExternalBrowser=1 のように&でつなげます

<a href="https://sp.order.my.rakuten.co.jp/?openExternalBrowser=1">
購入履歴を確認する(楽天ページ)
</a>

LINEブラウザで開く場合

<a href="https://sp.order.my.rakuten.co.jp/">
購入履歴を確認する(楽天ページ)
</a>

入力フォーム・ボタンを下部に固定する

<style>
.OrderForm{
position: absolute;
bottom: 1rem;
background-color: #fff;
box-shadow: 0 -1px 3px rgb(0 0 0 / 30%);
width: 100% !important;
padding: 1rem;
margin: 0 auto;
box-sizing: border-box;
}
</style>