COS-Pages-Editor

自分のHubSpotページのCSSをカスタマイズするには、どうすればよいですか。

更新日時 November 28, 2016

必要条件

ソフトウェア: HubSpot マーケティング
サブスクリプション: Basic, Pro, & Enterprise

CSSの編集はDesign Manager(デザインマネージャー)のスタイルシートで行うか、各ページでスタイルを調整します。ページの[Style(スタイル)]タブにアクセスする場合は、目的のページを編集モードで開き、ページエディター上部の[Style(スタイル)]アイコンをクリックします。

ユーザー追加画像
ユーザー追加画像

デザイン変更がページ全体に適用される場合、使用可能なモジュールのリストで[Whole Page(ページ全体)]()ラジオボタンをクリックすると、スタイル指定オプションがトグル表示されます。1モジュールのスタイルのみを調整する場合は、そのページのプレビューウィンドウ上にマウスを移動し、変更するモジュールの上にマウスポインタを置きます。すると、そのモジュールがストライプのボックスで強調表示されます。ここでモジュールをクリックすると、スタイル指定オプションがトグル表示されます。

ユーザー追加画像
ユーザー追加画像

テキスト、間隔、背景、枠線の各項目の黒いアイコンをクリックすると、これらのオプション間を移動できます。

ユーザー追加画像
ユーザー追加画像

現行デザインの1要素を変更する場合、スタイル指定オプション内の要素(フォント、間隔、色など)を見つけ、ピッカーで新しい値を設定します。値が設定されると、その設定の横にダークグレーの丸とその丸からはみ出すようにして重ねられた「X」が表示されます。その要素に加えた変更をキャンセルする場合は、これをクリックします。

ユーザー追加画像
ユーザー追加画像

スタイル指定オプションボックスの右上隅にある十字矢印をクリックすると、そのスタイル指定オプションウィンドウが閉じます。編集を加えたモジュールがあると、[Style(スタイル)]パネルでそのモジュールの隣にグレーのリンクが表示されます。この[Reset to Default(デフォルトにリセット)]リンクをクリックすると、そのセクションに加えた変更がクリアされます。ページのコンテンツに戻る場合は、ページ上部の[Content(コンテンツ)]アイコンをクリックします。ページから離れる前に、[Save(保存)]ボタンをクリックし、スタイル指定やコンテンツに対するすべての変更を保存しておきましょう。

ユーザー追加画像
ユーザー追加画像