查看: 5330|回复: 30

购物按钮下的 购物安全保证图片 怎么添加

[复制链接]

2

主题

2

帖子

38

积分

新手上路

Rank: 1

积分
38
发表于 2018-3-25 09:44:38 | 显示全部楼层 |阅读模式
购物按钮下的 购物安全保证图片 怎么添加

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
回复

使用道具 举报

72

主题

490

帖子

1622

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
1622
QQ
发表于 2018-3-25 20:55:33 | 显示全部楼层
添加的方法有三种,
最简单的一种是在应用市场搜索Trust Badge,然后找到你想要的APP安装就可以了
第二种办法是购买特定的模板,有不少模板是自带这一功能的,如Shoptimized
第三种办法就是自己做一张图片,通过代码的方式插入到你的主题里面。因为主题文件结构的不同,修改代码的位置可能不同,这个就需要自己去辨别了。这里我用Shopify的免费主题Brookyln做演示。图片可以去Google Image里面搜索Trust Badge,如下图,选择一个自己喜欢的图片下载下来。



下载下来的图片最好先用PS或者百度图片在线压缩工具将图片压缩下,以防止文件过大影响网站的加载速度。


鉴于大部分人不懂HTML,这里可以先将图片上传到Shopify,然后利用Shopify编辑框自动生成HTML:打开shopify后台 - Product - Add Product, 将刚刚下载下来的图片上传上去,在编辑框中显示,你可以在编辑框中对图片进行居中操作,大小更改



改行之后点击Show HTML按钮,复制下来图片的HTML代码




打开Shopify的后台 - Online Store - Theme - Current Theme - Actions - Edit Code, 如下图所示。 (如果你不懂代码,为防止误操作,建议在修改代码之前对主题进行备份。具体操作方法见:https://waimaob2c.com/4-3-shopify-theme-download-install.html 这篇文章里面关于Duplicate功能的介绍




打开主题的代码文件之后,在左侧搜索框中输入Product,然后在Section文件下打开product-template.liquid,然后使用键盘快捷键Ctrl+F打开搜索框,输入Button,找到购物车代码的位置,在购物车代码下面,也就是</form>的上方插入一个空行,将你刚刚复制的Trust Badge的图片HTML代码粘贴到空行的位置。然后点击右上角的Save按钮,对保存进行更改。


如下图所示:




这样就可以了,打开你的任意产品页面,就可以在购物车下方看到你刚刚添加的Trust Badge的图片了。如下图所示。




本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
回复 支持 反对

使用道具 举报

7

主题

24

帖子

107

积分

注册会员

Rank: 2

积分
107
发表于 2018-8-5 11:32:27 | 显示全部楼层
louiswei 发表于 2018-5-12 11:03
按照楼主第三种方法昨晚找了,都没找到button的位置,有button的位置如下,感觉不太对呢,就没改,怕改错就 ...

我用的Brooklyn模版也是按照楼主的说法找到,同样也没有找到,是怎么回事呢?
"type": "select",
        "id": "add_to_cart_button_size",
        "label": {
          "pt-BR": "Tamanho do botão",
          "es": "Tamaño del botón",
          "de": "Schaltflächengröße",
          "it": "Dimensione pulsante",
          "en": "Button size",
          "ja": "ボタンのサイズ",
          "fr": "Taille du bouton"
        },
这是我找到的……,差别也有点大呢
回复 支持 反对

使用道具 举报

0

主题

3

帖子

14

积分

新手上路

Rank: 1

积分
14
发表于 2019-8-6 19:43:48 | 显示全部楼层
其实按照楼主说的找,还挺好找
</button>
                {% if section.settings.enable_payment_button %}
                  {{ form | payment_button }}
                {% endif %}
              </div> 代码替代文字
            {% endform %}

          </div>
回复 支持 反对

使用道具 举报

0

主题

1

帖子

18

积分

新手上路

Rank: 1

积分
18
发表于 2018-3-26 15:33:02 来自手机 | 显示全部楼层
Conway 发表于 2018-3-25 20:55
添加的方法有三种,
最简单的一种是在应用市场搜索Trust Badge,然后找到你想要的APP安装就可以了
第二种办 ...

好帖,学习了
回复 支持 反对

使用道具 举报

18

主题

59

帖子

325

积分

中级会员

Rank: 3Rank: 3

积分
325
发表于 2018-4-6 11:05:01 | 显示全部楼层
我都是在每次上产品的时候添加Trust badge图片,这个可以吗
回复 支持 反对

使用道具 举报

0

主题

6

帖子

40

积分

新手上路

Rank: 1

积分
40
发表于 2018-5-9 18:17:17 | 显示全部楼层
打扰啦,请问购买按钮的颜色是在哪里修改呀
回复 支持 反对

使用道具 举报

0

主题

6

帖子

40

积分

新手上路

Rank: 1

积分
40
发表于 2018-5-9 18:59:40 | 显示全部楼层
刚找到啦,谢谢楼主分享的知识
回复 支持 反对

使用道具 举报

4

主题

26

帖子

101

积分

注册会员

Rank: 2

积分
101
发表于 2018-5-9 23:10:25 | 显示全部楼层
非常感谢,用第三种方法搞定了。但是同时也有个问题请教,搜索的app的没法安装,是因为没有科学上网的原因吗?Messenger 也无法连接。难道需要长期连接v吗?求教,谢谢。
回复 支持 反对

使用道具 举报

8

主题

62

帖子

205

积分

中级会员

Rank: 3Rank: 3

积分
205
发表于 2018-5-12 11:03:07 | 显示全部楼层
按照楼主第三种方法昨晚找了,都没找到button的位置,有button的位置如下,感觉不太对呢,就没改,怕改错就麻烦了

{%- if item.show_share_buttons -%}
<div class="container-indent wrapper-social-icon">
  <div class="container text-center">
    {%- include 'addthis' -%}
  </div>
</div>
{%- endif -%}
回复 支持 反对

使用道具 举报

7

主题

65

帖子

203

积分

中级会员

Rank: 3Rank: 3

积分
203
发表于 2018-5-18 18:35:13 | 显示全部楼层
太感谢了 啊 !大神,能看你的网站吗
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

热门推荐

请教如何去掉网站底部的powered by shopify 字句
请教如何去掉网站底部的po
请教如何去掉网站底部的powered by shopify 字句
Shopify建站运营推广相关问题征集
Shopify建站运营推广相关
承蒙各位Shopify卖家朋友们的支持和厚爱,在运营WaimaoB2C.com博客和WaimaoB2C.cn论坛
提高转化率的一个小提示
提高转化率的一个小提示
最近测试,在Checkout按钮下面添加了一次些促销信息,转化率稍稍有些提升,但是因为数
购物按钮下的 购物安全保证图片 怎么添加
购物按钮下的 购物安全保
购物按钮下的 购物安全保证图片 怎么添加
Shopify产品页面插入视频方法
Shopify产品页面插入视频
在Shopify网站的产品页面插入视频的两种方法: 这两种方法的前提都是你首先要将视频上
网站不做广告,Google analytics数据分析怎么有部分流量是paid...
网站不做广告,Google ana
如题, 我们的shopify网站目前主要引流方式还是引导一些其他平台的客户过来购买,平时
删除buy on amazon
删除buy on amazon
群主大人,我想删除这个按钮,比较稳妥的做法是什么? 因为之前修改代码忘记备份,产

Archiver|手机版|小黑屋|

  • Copyright   ©2015-2016  Shopify论坛 | WaimaoB2C.cn   Powered by©Discuz!   ( 冀ICP备15011551号-4 )
快速回复 返回顶部 返回列表