php
  • jquery
  • api
  • shopify
  • 2016-07-28 29 views 0 likes 
    0

    我想向我的product.liquid文件添加進度條。是否可以在shopify中通過腳本標籤加載引導

    我正在通過使用內聯樣式的腳本標記來處理我的進度條。

    var append=''; 
    append +='<div style="'+divStyle+'"><center><p><span style="color: #000000;"><strong>HURRY! ONLY </strong>'; 
    append +='<strong style="color: #ff0000;" id="left-item" class="left-item">'+ userVisit +'</strong><strong> LEFT IN STOCK.</strong></span></p><center>'; 
    append +='<div style="background-color:#f5f5f5;border-radius:4px;box-shadow:0 1px 2px rgba(0, 0, 0, 0.1) inset;height:20px;margin-bottom:20px;overflow:hidden;" id="style1" class="progress">'; 
    append +='<div style="width: '+ barWidth+'%;animation: 2s linear 0s normal none infinite running progress-bar-stripes;background-color: #D9534F;background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);background-size: 40px 40px;box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15) inset;color: #fff;float: left;font-size: 12px;height: 100%;line-height: 20px;text-align: center;transition: width 0.6s ease 0s;" aria-valuemax="'+ data['max_count']+'" aria-valuemin="'+ data['min_count']+'" aria-valuenow="'+ userVisit+'" role="progressbar" class="progress-bar progress-bar-danger progress-bar-striped active">'; 
    append +='<span style="border: 0 none;clip: rect(0px, 0px, 0px, 0px);height: 1px;margin: -1px;overflow: hidden;padding: 0;position: absolute;width: 1px;" class="sr-only">80% Complete (danger)</span></div></div></div>'; 
    
    $(document).find('.progressBar').append(append); 
    

    我想加載bootstrap給我的進度條更多的樣式。有沒有解決方案。

    回答

    1

    你的問題有點令人困惑。但是,您可以自然地將自舉(CSS文件和JavaScript文件)添加到Shopify主題。

    您可以將文件添加到您的主題,或通過Bootstrap的MaxCDN直接鏈接文件。

    對於後:

    1. 找到您theme.liquid編輯主題時,內部的佈局
    2. <head></head>標記之間確保從Bootstrap Getting Started的代碼片段粘貼下面引導CDN
    3. 保存,就是這樣。

    取決於您的主題,你可能會有不同的片段最CSS和JavaScript文件(通常head-csshead-styleshead-jshead-scripts,但它們可以是任何東西)。隨意跟隨腳手架,並把你的引導CSS和你的引導JS應該在哪裏。

    相關問題