Question

我对Big Commerce很新，并且对如何在特定类别上显示图像/特定消息提出疑问。

我目前在所有产品上都显示免费送货图片，但是某个类别我不想要显示该代码段。

我怎样才能实现这个目标？

我显示免费送货图片的方式是修改card.html文件

模板＆gt;组件＆gt;产品＆gt; card.html

谢谢！

Answer 1

您可以尝试免除该类别（通过ID或名称），特别是条件声明。

例如，您可以尝试：

{{#unless category.id '==' 5321}}
    Free shipping!
{{/unless}}

或者if / else：

{{#if category.id '==' 5321}}
    No free shipping!
{{else}
    Free shipping!
{{/if}}

Answer 2

您可以考虑通过横幅在特定类别上插入图片。在此之后，您可以通过jQuery注入css或使用plain css覆盖以在任何您喜欢的地方显示横幅。

yourstore.xyz/manage/marketing/banners/create

修改1

将div包装为if也应解决在某些产品中显示该图像的问题。

{{#if product.shipping}}
{{#if product.shipping.price.value '===' 0}}
   <img class="yourImgClass">{{imgURL}}
{{/if}}
{{/if}}

修改2

这是JS从特定类别中删除某些元素的方法：

＆＃13;

var url = location.href; 

if ( url.indexOf( 'your-url' ) !== -1 ) { 
document.getElementById('your-free-shipping-image-id').remove();
console.log("yay, image bye");
}
else {
console.log("nay, image stays");
}

＆＃13;

编辑3 这是一种有关jQuery知识有限的转变制作解决方法。如果您可以将ID放在图像包装跨度元素上，这会更容易，但我认为您可以做到这一点。将其放在页脚内，括号内。

＆＃13;

$(document).ready(function() {
var s = $('img[src*="https://cdn7.bigcommerce.com/s-7iywz/product_images/uploaded_images/free-shipping-banner.jpg"]');
var url = location.href;
console.log(s.length);

if ( url.indexOf( 'framed' ) !== -1 ) {
s.remove();
}
});

＆＃13;

Answer 3

谢谢你，但它似乎仍然不起作用。

你的代码还有一个小故障

你有{{/unless}} instead of {{/if}}

所以这就是我用的：

{{#if category.id '==' 70}} No free shipping! {{else}} Free shipping! {{/if}}

I've attached the Category ID which is 70

商店里的所有东西仍然显示免费送货

Answer 4

如果您想删除＆＃34;免费送货＆＃34;从单一类别然后使用下面的代码并修复它。

{{#if id '!=' 70 }} Free Shipping Message}} {{/if}}

如果它对您不起作用，那么我建议您发布＆＃34;卡片文件＆＃34;代码在这里，以便我可以检查你在代码中写了什么。

Answer 5

<article class="card {{#if alternate}}card--alternate{{/if}}">
<figure class="card-figure">
    {{#or price.non_sale_price_with_tax price.non_sale_price_without_tax}}
        {{#if theme_settings.product_sale_badges '===' 'sash'}}
            <div class="sale-flag-sash">
                <span class="sale-text">On Sale!</span>
            </div>
        {{else if theme_settings.product_sale_badges '===' 'topleft'}}
            <div class="sale-flag-side">
                <span class="sale-text">On Sale!</span>
            </div>
        {{else if theme_settings.product_sale_badges '===' 'burst'}}
            <div class="starwrap">
                <div class="sale-text-burst">On Sale!</div>
                <div class="sale-flag-star"></div>
            </div>
        {{/if}}
    {{/or}}
    {{#if demo}}
        <img class="card-image lazyload" data-sizes="auto" src="{{cdn 'img/loading.svg'}}" data-src="{{getImage image 'productgallery_size' (cdn theme_settings.default_image_product)}}" alt="{{image.alt}}" title="{{image.alt}}">
    {{else}}
    <div class="card-image-container">
        <a href="{{url}}">
            <img class="card-image lazyload" data-sizes="auto" src="{{cdn 'img/loading.svg'}}" data-src="{{getImage image 'productgallery_size' (cdn theme_settings.default_image_product)}}" alt="{{image.alt}}" title="{{image.alt}}">
        </a>
    </div>
    {{/if}}
</figure>
<div class="card-body">
    <h4 class="card-title">
        {{#if demo}}
            {{name}}
        {{else}}
            <a href="{{url}}">{{name}}</a>
        {{/if}}
    </h4>
    <div class="card-text" data-test-info-type="price">
        {{#or customer (if theme_settings.restrict_to_login '!==' true)}}
            {{> components/products/price price=price customer=customer}}
        {{else}}
            {{> components/common/login-for-pricing}}
        {{/or}}
    </div>
    <p class="card-text" data-test-info-type="productRating">
        <span class="rating--small">
            {{> components/products/ratings rating=rating}} <span style="color:gray;">{{#if num_reviews '>' 0}}</span>
   &nbsp; ({{num_reviews}}) Review{{#if num_reviews '>' 1}}s
{{/if}}{{/if}}
        </span>
    </p>
{{#if id '!=' 70 }}
<span><img src="https://cdn7.bigcommerce.com/s- 7iywz/product_images/uploaded_images/free-shipping-banner.jpg?t=1525811996&_ga=2.165904830.1847420277.1525706943-52562068.1494873040"></span>
{{/if}}
</div>
</article>

我修改了你的代码，只需将其复制并粘贴到你的主题中即可。

Bigcommerce - 在特定类别/产品上显示某些消息/图像

5 个答案: