Shopfiy sticky Div

Question

Shopify Iconテーマを使用しています。誰かがモバイルで開くと、画面の下部にスティッキーなdivを含める必要があります。下の画像に似たものが添付されています。

誰かがそれを達成する方法について助けることができます。

sticky div example

Answer 1

あなたのテーマにCSSを追加するcssファイル

.sticky-div { 
 
    display: none; 
 
} 
 
@media screen and (max-width: 768px) { 
 
    .sticky-div { 
 
    display: block; 
 
    position: fixed; 
 
    bottom: 0; 
 
    left: 0; 
 
    right: 0; 
 
    height: 30px; 
 
    z-index: 10000; 
 
    /* set height as you want */ 
 
    background: #ddd; 
 
    /* set color as you want */ 
 
    } 
 
}

<div class="sticky-div"> 
 
    <!-- Your content here --> 
 
</div>

</body>タグの前にHTMLを追加します。