​HTMLエディタとスタイルシートでページをカスタマイズ

クローバではHTMLやCSSの知識がなくても、スマートフォンに対応した自由なレイアウトのホームページを作成することができます。しかしWeb制作の経験がある方なら、もっとこんなデザインができたらなあと物足りなく思われることがあるかもしれません。

HTMLエディタとスタイルシートを使えば、ページのデザインを自由にカスタマイズすることができます。以下にその方法を説明します。

HTMLの編集

キャンバスにテキストパーツを配置します。すでにあるテキストパーツを使うこともできます。

テキストパーツの右上にある歯車ボタンをクリックします。

HTMLの編集ウインドウが開きます。

使用可能なタグ

HTMLエディタで使用可能なタグは以下のとおりです。

• H1
• H2
• H3
• H4
• H5
• H6
• A
• BR
• DIV
• P
• SPAN
• STRONG
• EM
• UL
• LI
• OL
• BLOCKQUOTE
• TABLE
• TBODY
• THEAD
• TR
• TD
• TH
• IMG
• IFRAME

IFRAMEについて

IFRAMEタグは、src属性がHTTPSのURLである場合のみ許可されます。

一部機能が制限される場合があります。

利用できる属性

HTMLタグに使用できる属性は一部制限されています。style属性は使用できません。要素にスタイルを設定する場合は、class属性を使用して別途スタイルシートの設定でスタイルを記述してください。

リンクからフォームや記事を表示する方法

HTMLエディタで作成したリンクから、フォームや記事を表示することができます。

HTML中のAタグに以下の属性をつけます。href属性は#とします。

フォームを開く場合

data-action : "form"
data-target : フォームのID

例）

<a href=”#” class=”” data-action=”form” data-target=”359″>フォームが開きます</a>

フォームのIDは、フォームの設定画面で該当のフォームを編集する際のURLから取得できます。

（https://www.qloba.com/forms/456 の場合は456がフォームのIDとなります）

記事を開く場合

data-action : "activity"
data-target : 記事のID

例）

<a href=”#” class=”” data-action=”activity” data-target=”38″>記事が開きます</a>

記事のIDは、該当の記事のURLから取得できます。

（https://example.qloba.com/activities/333 の場合は333がIDとなります）

ボタン・リンクパーツを使っても同様にフォームや記事を開くことができます。

注意事項

利用できるタグ、属性の仕様は今後変更される可能性があります。

サービスのアップデート時にページのHTML構造が変更される場合がありますのでご注意ください。