Widget
      ホームに戻る
      2. ページ制作
      3. Widget

      Widgetの非表示部分を編集画面プレビューで確認する

      Widget全体を編集画面左側のプレビューで確認したい場合は、下記手順をお試しください。

      ユーザーのアクションに応じて次のコンテンツを表示させるWidgetを利用する場合、
      プレビュー画面では、最初のコンテンツのみ表示されます。
      Widget全体を編集画面左側のプレビューで確認したい場合は、下記手順をお試しください。
       

       

      変更方法

      CSSに「display: none;」の記述があるWidgetの場合

      ▼ Widget例
      • アンケート（選択すると遷移・枠あり）※要JavaScript(アンケート)
      • アンケート - どの選択肢でも結果は変わらない　※要JavaScript(アンケート)
      • アンケート（次の質問が表示される）※要javascript(アンケート)
       
      1. CSS欄で「display: none;」と検索する
      2. 該当記述をコメントアウトする
      • 変更前
      display: none;
      • 変更後
      /*display: none; */
        3.　編集完了後、変更前の状態に戻します。 
      ※ 配信ページでは、「display: none; 」の記載がある状態で正しくWidgetが動作します。
       

       
       

      CSSに「display: none;」と「opacity: 0; 」の記述があるWidgetの場合

      「display: none;」をコメントアウトした上、下記手順をお試しください。

      ▼ Widget例
      アンケート-チャット型※要javascript(アンケート)

      1. CSS欄で「.l-slideIn { opacity: 0; }」と検索する
      2. 該当箇所の「opacity: 0」を「opacity: 1」に変更する
      3. 編集完了後、「opacity: 0」に戻します。 

      ※ 配信ページでは、「opacity: 0」の記載がある状態で正しくWidgetが動作します。

       
      • 変更前
      .l-slideIn { opacity: 0; }
      • 変更後
      .l-slideIn { opacity: 1; }