天涯论坛

 找回密码
 立即注册
搜索
查看: 3|回复: 1

shopify官方主题排名第1转化率最高免费主题Brooklyn配置及优化

[复制链接]

2976

主题

412

回帖

9117万

积分

论坛元老

Rank: 8Rank: 8

积分
91179177
发表于 前天 15:16 | 显示全部楼层 |阅读模式

哎呀累死了这周一起始上传了3天制品最终制品上传完了,看“连载龙详富博客shopify开店教程之六shopify制品发布”原文,发布制品的时候shopify前台用的免费主题Debut效果不太好看,不爱好,为此想换个主题,综合大部分资料晓得shopify官网主题排名第1的免费主题是Brooklyn布鲁克林,

shopify免费主题Brooklyn效果

据述是免费主题中转化率最高的shopify主题,为此我咱们跨境电商机构老板要我做的功能性服饰外贸商城模板切换成这款免费shopify主题Brooklyn以下是我实质循序渐进的操作图文记录,对一样第1次用shopify的网友可能有点帮忙

免费shopify主题Brooklyn配置后台:

添加安装免费shopify主题Brooklyn非常简单,在shopify官网市场里面有60款付费主题,10款免费主题,其中就有运用量最大和转化率最高免费主题Brooklyn如图

shopify免费主题Brooklyn下载安装

登录shopify后台点击Add theme按钮就能够添加免费主题Brooklyn到自己的后台,但还不可直接运用,还需要在掌控面板中发布Brooklyn主题,在shopify后台主题模板管理页面有2大模块,一个是current theme便是我原来的网站是默认的免费主题Debut在Actions中点击发布就能够将网站切换到Brooklyn主题了,另一一个more theme模块,点击定制Customize按钮就能够进入免费shopify主题Brooklyn自定义设置后台shopify Theme Customize,如图

shopify免费主题Brooklyn设置后台

左侧边栏分为2个部分,一个是Sections功能,一个是theme settings功能,sections功能负责的重点是网站页面的布局以及各个版块内容的设置。Theme Settings功能负责的是网站框架的颜色设置,字体设置,社交网络设置,购物车网页设置以及结款页面的设置。大部分shopify模板支撑shopify的section模块功能的,在设置上所见即所得,右边将立即看到你左边做的设置的效果。要添加模块点击sections项下的Add Section按钮,对板块拖动进行页面的排序。shopify主题之间的设置是相互独立的,设置好Brooklyn主题后,安装并激活新的主题,新主题需要从新进行页面排版,颜色字体的设置,对新主题的设置不会影响Brooklyn之前的设置,从新激活Brooklyn后表示的还是安装新主题之前的样子。

shopify主题Brooklyn优化加强转化率:

Brooklyn免费主题是shopify运用量最多的免费shopify主题是转化率最高的主题,但咱们还是能够在Brooklyn原来主题的基本上做进一步的从代码层级对Brooklyn优化以加强网站转化率!Brooklyn的优良有:免费;支持slide-out cart;移动端一样支持侧边滑出购物车功能,整体风格简洁美丽。对Brooklyn进行代码方面的操作便是Edit Code操作,先对shopify主题进行备份,打开themes>actions>duplicate而后能够完成主题的备份了,显现备份copy of "theme name"主题了,如图一所示

优化shopify免费主题Brooklyn代码

shopify主题Brooklyn优化内容如下:

修改一:修改网站的菜单栏目为顶部固定菜单栏,便是该CSS效果就能够了,打开文件夹Asset下的thme.scss.liquid文件,将以下代码加入到文件末尾,而后保留文件。

shopify顶部固定菜单代码

尤其是手机版效果,固定在顶部了用户体验好了非常多

修改二制品页面下方的关联制品举荐功能,Brooklyn主题在制品页面默认是制品举荐功能,虽然能够关联的shopify制品举荐插件,然则那要花费,还有兼容性的问题,打开template文件夹下面的product.liquid文件,找到如下代码:{% section ‘product-template %}在这一行代码下方插进如下代码:{% secton related-products %}保留文件,而后打开setion文件夹点击add a new section新建命名文件名叫作为related-products删除里面已知内容将如下代码黏贴上去保留。 如图所示。

shopify免费主题Brooklyn制品举荐功能代码

完成上图代码后shopify支持在制品页面表示关联制品功能了,下一步还要激活这一功能,在shopify代码编辑后台左侧栏看到related product选项,选取show related products保留完成设置。后面的Brooklyn优化内容能够再美好购物车按钮,这个只是购物车的CSS效果修改,看你自己想要什么效果的购物车了,就不消讲了。





上一篇:Shopify主题是什么?Shopify主题定义&挑选原则&挑选过程详解
下一篇:东南亚COD市场消费者购买行径趋势解析
回复

使用道具 举报

2953

主题

3万

回帖

9997万

积分

论坛元老

Rank: 8Rank: 8

积分
99979403
发表于 昨天 10:44 | 显示全部楼层
外贸论坛是我们的,责任是我们的,荣誉是我们的,成就是我们的,辉煌是我们的。
回复

使用道具 举报

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

本版积分规则

站点统计|Archiver|手机版|小黑屋|天涯论坛 ( 非经营性网站 )|网站地图

GMT+8, 2024-11-24 17:29 , Processed in 0.107686 second(s), 22 queries .

Powered by Discuz! X3.4

Copyright © 2001-2023, Tencent Cloud.