カテゴリー
サイトの調整
U-KOMIで使用できるカスタムCSS一覧
このガイドでは、U-KOMIで使用できるカスタムCSSをご紹介しております。 🔰 カスタムCSSの設定方法 U-KOMI管理画面内に存在するカスタムCSS 設定画面にて、設定することが可能です。 無効の場合や未設定の場合は、デフォルトのCSSが適用されます。 カスタムCSS設定場所 カスタムCSS適用箇所 設定場所 ウィジェット (商品詳細ページのレビュー一覧・レビュースライダー) レビュー>ウィジェット>カスタムスタイルで、カスタムCSSを有効にするを有効にする 専用ウィジェット (お客様の声ページなど、レビュー専用のページ) レビュー>専用ウィジェット>カスタムスタイルで、カスタムCSSを有効にするを有効にする タブウィジェット レビュー>タブウィジェット>カスタムスタイルで、カスタムCSSを有効にするを有効にする FAQ FAQ>FAQ設定>カスタムCSS ギャラリー ギャラリー>写真ギャラリーで、CSSを追加したいギャラリーを選択後、カスタムCSS欄のカスタムCSSを有効にするを有効にする ⚠️ カスタムCSS設定時の注意点 注意点1 CSS追加後、反映まで数分ほどかかる場合があレビューがない時のカスタムタイトルを非表示にする
レビューがない時にタイトルを非表示する方法 カスタムタイトルをご利用頂いてる場合で、レビューがない時にレビューコンテンツを非表示にする場合は下記のdivのclassにカスタムタイトルを囲んでいただければカスタムタイトルも非表示になります。 :book: スターレーティングのカスタムタイトル用divのclass .u-komi-custom-star-rating-title :book: レビュー一覧のカスタムタイトル用divのclass .u-komi-custom-widget-title ---スクロールの高さを調整
スクロールの高さを調整する方法 スティッキーヘッダーを利用の場合は下記のJSコード実行でU-KOMI内のページ変更など機能利用時に実行されるスクロール高さを調整することができます。 スクロール高さ調整を行うためのコード <script> document.addEventListener('DOMContentLoaded', function() { document.querySelectorAll('MENU_ELEMENT').forEach(function(element) { element.classList.add('sticky-container'); }); }); </script> ☝ 【MENU_ELEMENT】はスティッキーヘッダーのクラスかIDを入力します ( `.class` か `#id` が利用可能です)