AiCmo

← マニュアル一覧

はじめに

HTMLで作るLPの作り方｜AIで作ったコードを貼り付けるだけ

AiCmoの「HTMLで作る」で、ChatGPTやClaudeなどのAIで作ったHTMLを貼り付けてLPにする手順です。新しいLPの作り方、HTMLコードの貼り付け、ライブプレビューでの確認、保存まで。「ビジュアルに戻る」を押すと貼り付けたHTMLが消える注意点も。

最終更新 2026-10-16
相談者

ChatGPTやClaudeでLPのHTMLを作りました。AiCmoで公開できますか？

中川 瞬中川 瞬

できます。「HTMLで作る」を選んで、作ったコードを貼り付けて保存するだけです。

「HTMLで作る」は、AIで作ったHTMLや、外で作ったHTMLを貼り付けて、そのままLPにする作り方です。コードを貼り付けて保存するだけ。デザインはAIや外のツールで作り、公開はAiCmoで行えます。

ほかの作り方業種のテンプレートから作るなら「型で作るLPの作り方」、画像や文章のブロックを並べて作るなら「LPの作り方（ブロックで作る）」をご覧ください。作り方は、LPを作ったあとに変えられません。

全体の流れ

  1. 手順1　「HTMLで作る」で新しいLPを作る（目安1分）
  2. 手順2　HTMLコードを貼り付ける（目安1分）
  3. 手順3　確かめて保存し、公開する（目安3分）

手順1　「HTMLで作る」で新しいLPを作る

左メニューの「ページ管理」→「LP管理」を開き、「＋新しいLPを作成」を押します。「どの作り方で LP を作りますか？」と聞かれたら、「HTMLで作る」を選び、LPの名前を付けます。

手順2　HTMLコードを貼り付ける

「HTMLコード（直接編集）」の欄に、AIなどで作ったHTMLをまるごと貼り付けます。<!DOCTYPE html> から最後の </html> まで、全部をコピーしてください。

貼り付けると、右の「ライブプレビュー」に、できあがりがその場で表示されます。

LPのHTML編集の画面。中央左にHTMLコード（直接編集）の入力欄、右にライブプレビュー。上に戻る・LP名・スマホPC共用・PCとスマホの切り替え・背景色・ビジュアルに戻る・プレビュー・保存して登録のボタン。
図1　左の欄にHTMLを貼り付けると、右のライブプレビューにすぐ表示されます。

「ビジュアルに戻る」は押さない上の「ビジュアルに戻る」を押すと、貼り付けたHTMLは消えて、ブロックの状態から作り直されます。HTMLで作るLPでは押さないでください。念のため、AIで作ったHTMLは手元にも保存しておくと安心です。

AIにHTMLを作ってもらうときのコツ

  • 「1つのHTMLファイルで、CSSも中に入れて」と頼むと、そのまま貼り付けられる形で出てきます
  • スマホで見やすく作ってもらうよう、ひと言添えます。LPを見る人の多くはスマホです
  • 画像は、インターネット上のURL（https://〜）で指定します。パソコンの中の画像の場所を書いても表示されません
  • 申し込みやLINE登録のボタンには、飛ばしたいURLを入れてもらいます

手順3　確かめて保存し、公開する

上の「PC」「スマホ」を切り替えたり、「プレビュー」を押したりして、見え方を確かめます。スマホでの見え方とボタンのリンクは、必ず確認してください。

問題がなければ、右上の「保存して登録」を押します。保存したLPは、LP管理の一覧に並びます。

LP管理で「公開する」を押す

左メニューの「ページ管理」→「LP管理」の一覧で、作ったLPを探します。保存したばかりのLPは「下書き」になっていて、まだお客さまには見えません。「公開する」を押すと公開されます。

LP管理の一覧に並んだLPの枠。オプトインLP、/optin、下書き・ブロックの札、編集・複製・公開する・削除のボタン、メモ欄、公開期限（任意）の日時と「期限後は公開終了ページを表示」の選択と「期限を保存」ボタン、オートウェビナー、フォルダの選択。
図2　LP管理の一覧。「下書き」のLPは「公開する」を押すと公開されます。
  • 名前の横の「/optin」のような部分が、公開URLの末尾です
  • 公開期限（任意）：日時を入れて「期限を保存」を押すと、その日時を過ぎたら公開URLが開けなくなります（「公開終了」ページを表示）。キャンペーンや締め切りのあるLPに便利です。空欄なら期限なしです
  • メモ・フォルダ：管理用です。LPが増えてきたら、フォルダで分けておくと探しやすくなります

HTMLで作るLPのよくある質問（Q&A）

QHTMLが分からなくても使えますか？

A使えます。AIに作ってもらったコードを、そのままコピーして貼り付けるだけです。直したいところがあれば、AIに「ここを直して」と頼んで、もう一度貼り付け直してください。

Q画像が表示されません。

A画像の指定が、パソコンの中の場所になっていないか確認してください。画像はインターネット上のURL（https://〜）で指定する必要があります。

Q貼り付けたHTMLが消えてしまいました。

A「ビジュアルに戻る」を押すと、HTMLは消えてブロックの状態から作り直されます。手元に保存しておいたHTMLを、もう一度貼り付けてください。

まとめ｜HTMLで作るLPのポイント

この記事の要点

  • 「LP管理」→「＋新しいLPを作成」→「HTMLで作る」
  • AIで作ったHTMLを、最初から最後までまるごと貼り付ける
  • 「ビジュアルに戻る」は押さない（HTMLが消える）。HTMLは手元にも保存しておく
  • スマホの見え方とボタンのリンクを確かめて「保存して登録」→ LP管理で「公開する」

次にやること

LPからLINE登録してもらうには、登録経路のURLをボタンのリンク先に使います。作り方は「登録経路の作り方」をご覧ください。