ブログ

MAをこれから勉強したい人からカミハヤユーザーまで、
役に立つ情報のご紹介です。

カミハヤMA
2022.07.08

フォーカスアイテムのフォームデザイン修正方法

本記事では、フォーカスアイテムでデータを収集するためのフォーム設定した際のフォームデザイン修正方法について説明します。

 

目次
 
 1.はじめに
 2.修正方法
 3.最後に 

1.はじめに

カミハヤMAには、Webサイトを訪問したコンタクトに対して、「注意を引く」演出を行うフォーカスアイテムという機能があります。
フォーカスアイテム機能を利用すれば、専門的な開発スキルが無くても簡単に構築することが可能です。ただし、データを収集する目的でフォームを呼び出す際にフォームレイアウトが崩れてしまうので、個別にCSSの修正が必要となる場合があります。今回はその方法について説明します。

2.修正方法

フォーカスアイテム機能のフォーカス「データを収集する(カミハヤMAフォームを使用して、訪問者データを収集する)」を選択した場合、フォームのコンテンツを作成していくことになります。あらかじめカミハヤMAのフォーム機能でフォームを作成しておきます。そのフォームをプルダウンメニューから選択して挿入すればよいだけなのですが、そうすると添付画像のようにフォームデザインが少しおかしなこととなります。

【単純に挿入するフォームを選択した場合】
 

フォームデザインの崩れを修正するには、コンテンツのCustom CSSのフィールドに個別にCSSを設定することで解決していきます。
今回の場合を例にとるとブラウザの開発者ツールを用いて、修正箇所のクラス名を確認します。後は、そのクラスに対して表示崩れを正すためのCSSの設定をしていく流れとなります。

【Custom CSSを用いて修正】
 

3.最後に

いかがでしたでしょうか。今回は、コンテンツモードの「ベーシック」を用いた場合での修正例をご紹介しましたが、「エディタ」「HTML」のコンテンツモードを利用するとオリジナルのフォーカスアイテム用のデザインをあてていくことが可能となります。
フォーカスアイテムを利用去れる際は、デザイン修正が必要となりますので本記事が少しでもお役に立てればと思います。

カミハヤの製品ラインナップ

複数製品を組み合わせてのご利用も可能です。詳細はお気軽にお問い合わせください。

カミハヤCMS

カミハヤCMS

オープンソースCMS Drupalとローコードソリューション“サイトスタジオ”の活用により、工数を抑えて、素早くサイトを立ち上げることができます。

もっと見る
カミハヤMA

カミハヤMA

直感的で使いやすい管理画面、ノーコード。技術者無しでも素早くキャンペーンを始められる、BtoB向けマーケティングオートメーションツールです。

もっと見る
カミハヤSEO

カミハヤSEO

オープンソースCMS Drupalとローコードソリューション“サイトスタジオ”の活用により、工数を抑えて、素早くサイトを立ち上げることができます。

もっと見る
カミハヤMAトライアルキャンペーン実施中! MAトライアルのお申込み
資料ダウンロード
資料ダウンロード
お問い合わせ
お問い合わせ
よくあるご質問
よくあるご質問