HTML、CSS、JSコードを挿入できますか?
この記事では、systeme.io で作成したページにHTML、CSS、JSコードを挿入する方法について説明します。
ここで必要なものは以下の通りです:
- systeme.io アカウント
- HTML、CSS、JSコード
なぜページにカスタムコードを追加するのですか?
ページにHTMLコードを追加することで、画像、テキスト、リンクなどのコンテンツにカスタムスタイル、機能、構造を追加することができます。
例えば :
- スタイルをカスタマイズするには、CSSコードを追加します。
- ページや個々の要素にアニメーションを追加するには(例えば、ボタンにカーソルを合わせたり、クリックしたときなど)、JSコードを追加します。
- 一般的なタイトルやテキストを追加したり、ページ上にテーブルやセクション、区分を作成するには、HTMLコードを追加します。
重要な注意事項:
カスタムコードをヘッダーコード、フッターコード、トラッキングコード、または生のHTMLコードセクションに追加する場合は、以下のタグは含めないでください:
<head> </head>
<footer> </footer>
<html> </html>
<body> </body>
iframe
を使用してビデオを追加する場合、余分なタグは必要ありません。
誤った例:
<div> <iframe src="あなたの動画へのリンク"></iframe> </div>
正しい例:
<iframe src="あなたの動画へのリンク"></iframe>
1.「追跡(トラッキング)コード」セクションにコードを追加する:
Facebookトラッキングコードを挿入するには、コードを配置したいページを含んでいるセールスファネルにアクセスして下さい。
左側のページリストからファネルページを選択し、「ページを編集」をクリックして下さい。
左上にある 「設定」をクリックし、「追跡」(トラッキング)セクションまで下にスクロールしてください。
1.1 ヘッダーコードセクションに挿入するコード
このセクションには、ページのタグとタグ内に必要なコードを貼り付けてください。
1.2 フッターコードセクションに挿入するコード
このセクションでは、「ドキュメント・オブジェクト・モデル」(DOM)用のコードを追加します。
2.セールスファネル設定からコードを追加する:
正確なトラッキングを行うには、いくつかのコードを各ファネルページに追加する必要があります。
各ページにコードを貼り付ける作業を繰り返さなくても良いように、全てのファネルページに自動的にグローバルにコードを適用する事が出来ます。
全てのページに自動的にコードを適用するには、プロフィール画像に行き、「設定」をクリックし、左側の項目から 「セールスファネル」をクリックして下さい。「トラッキングコード」テキストボックスにトラッキングコードを貼り付け、「保存」をクリックしてください。
3.ページに「HTMLコード」要素を追加する:
ページのエディターを使って、任意のHTMLコードをページに直接挿入することも可能です。
- 「Raw HTML 」要素をページの好きな場所にドラッグして追加します。
- 小さな歯車を選択し、項目の設定を表示します。(画像の1番)
左側の画面に、HTMLコード統合用のセクションが表示されます。そこにコードを貼り付けます。(画像の2番)
HTMLコードをテキストボックスに追加し(画像の3番)、「保存」する(画像の4番)。
必ず変更を保存してください。