当前位置:首页 > 建站教程 > 为你的opencart网站添加Buy on Amazon按钮 | 多站点跳转购买按钮 |Opencart教程

为你的opencart网站添加Buy on Amazon按钮 | 多站点跳转购买按钮 |Opencart教程

3年前 (2024-01-09)建站教程1270
在在opencart搭建独立站跳转到亚马逊购买按钮流程开始: 1.打开opencart后台–规划设计–模板编辑器–product  
在opencart添加Buy on Amazon跳转购买按钮
2.输入以下代码   <style type=”text/css”> .buy_button_thr { position: absolute; width: 185px; height: 42px; line-height: 42px;  display: inline-block;  margin-left: 10px; font-size: 14px; } .buy_button_thr a { text-align: center; cursor: pointer; color: #fff; display: block; text-decoration: none; } .buy_button_thr .buy_button_thr_a { border-radius: 50px; background: #f7ab00; } .buy_button_thr .buy_button_thr_a:hover { background-color: #7f7f7f; } .buy_button_thr .buy_button_thr_ul { list-style: none; margin: 0; padding: 18px; background-color: #efefef; position: absolute;width:100%;z-index:1; } .buy_button_thr .hide { display: none; } .buy_button_thr .buy_button_thr_ul li { display: block; padding: 4px 6px; font-weight: 400; line-height: 20px; margin-bottom: 4px; } .buy_button_thr .buy_button_thr_ul li a { font-size: 12px; text-align: left; cursor: pointer; color: #6d6d6d; display: block; line-height: 100%; } .buy_button_thr .buy_button_thr_ul li:hover a { color: #ec4a00; } .buy_button_thr .buy_button_thr_ul img { vertical-align: middle; max-width: 100%; } .buy_button_thr .buy_button_thr_ul li em { margin-left: 4px; } #tab-description { line-height: 18px; padding-top:0;} #tab-description > p { margin-bottom: 0; } </style> {% if HIDDEN_LINKS %} <div id=”HIDDEN_LINKS” style=”display:none;”>{{ HIDDEN_LINKS }}</div> {% endif %} <script type=”text/javascript”> $(function () { ({ jsonSelector: ‘#HIDDEN_LINKS’, insertAfterSecltor: ‘#button-cart’, countryIcon: { uk: { title: ‘United Kingdom’, src: ‘/image/catalog/countryImgs/i_uk.jpg’ }, de: { title: ‘Germany’, src: ‘/image/catalog/countryImgs/i_de.jpg’ }, us: { title: ‘United States’, src: ‘/image/catalog/countryImgs/i_us.jpg’ }, jp: { title: ‘Japan’, src: ‘/image/catalog/countryImgs/i_jp.jpg’ }, it: { title: ‘Italy’, src: ‘/image/catalog/countryImgs/i_it.jpg’ }, es: { title: ‘Spain’, src :’/image/catalog/countryImgs/i_sp.jpg’ }, fr: { title: ‘France’, src: ‘/image/catalog/countryImgs/i_fr.jpg’ }, ca: { title: ‘Canada’, src: ‘/image/catalog/countryImgs/i_ca.jpg’ } }, getLinks: function () { try{ var $el = $(this.jsonSelector), jsonStr = “”; if ($el.length > 0) { jsonStr = $el[0].tagName == “INPUT” ? $el.val() : $el.html(); } return jsonStr.length > 0 ? JSON.parse(jsonStr) : ”; }catch(e){ return ”; } }, createHtml: function (array) { var i, len = array.length,temp,liStr=”,iconCfg; for (i = 0; i < len; i++) { temp = array[i]; iconCfg = this.countryIcon[temp.img] || temp.img; liStr += ‘<li> <a target=”_blank” href=”‘+ temp.link + ‘”> < img data-width="194"> 在opencart添加Buy on Amazon跳转购买按钮
在opencart添加Buy on Amazon跳转购买按钮
4.然后在每个产品的生产地写上以下代码 [{“img”:”jp”,”link”:”https://www.zuimoban.com”}] 其中jp,跟link部分是可以更改的,如果有多个站点,就复制上一条句型就可以了,效果如下:  
在opencart添加Buy on Amazon跳转购买按钮
总结以下: 1.添加代码到后台 2.修改服务器字段的属性 3.为每个产品添加各个站点的链接 完美跳转到亚马逊上!

扫描二维码推送至手机访问。

欢迎转载或分享本篇文章。

本文链接:https://www.jcba123.com/article/399

标签: OpenCart
分享给朋友:

“为你的opencart网站添加Buy on Amazon按钮 | 多站点跳转购买按钮 |Opencart教程” 的相关文章

网页设计!教你如何设计网页

网页设计!教你如何设计网页

首先,大家要先知道,什么是网页设计,很多人会说,网页设计不就是文字和图片的组合吗?没错,网页中包括文字、图片、视频等元素,但是仅仅把这些元素排在一起就是网页了嘛,显然不是。 网页设计其实是一个感性思考与理性分析相结合的过程,对设计师自身的美感以及对版面的把握都有较高的要求。经过这几年网页设计的...

网站已运行多少天代码

<p>网站已运行<span id="iday"></span>天<script>function siteRun(d){var nowD=new Date();return parseInt((nowD.getTime()-Date.parse(d))...

两款值得采用的WordPress企业官网主题

两款值得采用的WordPress企业官网主题

如今我们企业官网建设是不是还需要请网络公司搭建?于是可能还会被报价几千甚至几万。遇到小的网络公司或者个人服务商,可能会直接从网上找一些免费主题修修改改,或者是其他客户的改头换面给你。其实这个时候会有很大的风险,比如找免费的主题用于企业网站会有版权风险,安全升级也没有保障,且成本比较高。 这里,...

使用 WP Downgrade 在线降级 WordPress 到旧版本!

我们都知道,每当WordPress有新本的时候,我们都可以在后台一键更新。但是有些时候,我们的主题或插件可能不兼容新版本的WP,这时候我们如果要降级为之前的旧版本,该怎么操作呢?下面一起来看看。 重要提示:不管是升级还是降级,操作前,请务必备份你的网站数据,尤其是网站的数据库,以防万一!...

介绍使用WordPress时10个常用的MySQL查询

多数使用 WordPress 搭建的网站,其后台都是 MySQL 数据库,经常我们需要定制 WordPress 的功能,这里我们列表 10 个最有用的 WordPress 的数据库查询,你需要一个数据库的管理工具,例如 phpMyAdmin 或者 Navicat 等来执行这些 SQL 语句。...

8个好用的WordPress RSS Feed插件

8个好用的WordPress RSS Feed插件

什么是RSS Feed? RSS代表“Really Simple Syndication”,但它也可能意味着“丰富站点摘要”或“实时简单联合组织”。这是一种基于XML的内容格式,可向用户更新所有他们喜欢的网站上的最新新闻,文章,标题和内容。 由于已经存在了很长一段时间,因此许多人都认为RSS...

发表评论

访客

看不清,换一张

◎欢迎参与讨论,请在这里发表您的看法和观点。