Shopify Free Trial Apply
Shopify 60天试用
Shopify 14天试用
WordPress

WordPress

WordPress建站及WordPress SEO相关话题
Shopify

Shopify

Shopify建站及Shopify SEO相关话题
Google SEO

Google SEO

Google SEO相关话题
SEM

SEM

SEM相关话题
SNS 社媒营销

SNS 社媒营销

讨论SNS社交媒体营销话题
Zoho

Zoho

Zoho SAAS相关产品使用话题讨论
EDM

EDM

讨论Email Marketing相关话题
隽永东方售后服务

隽永东方售后服务

隽永东方售后服务专区

Shopify插件二三事

Shopifycarol 发表了文章 • 1 个评论 • 245 次浏览 • 2019-04-19 14:59 • 来自相关话题

1.SEO Image Optimizer ‑ SEO
作用:图像SEO
地址:https://apps.shopify.com/seo-image-optimizer




 
2.Klaviya email marketing 
作用:收集注册了网站客户的邮箱地址,帮助追踪之前加入了购物车,或是进入了结算页面,但是最后还是放弃购买的客户。直接通过邮件联系他们。
地址:https://apps.shopify.com/klaviyo-email-marketing





 
3.Instagram shop by Snapppt
作用:顾客只要点击图片上的图标,就会弹出相应产品的购买页面。把Instagram平台变为获取新客户、销售管道的方式。
地址:https://apps.shopify.com/instagram-shop-by-snapppt





  查看全部
1.SEO Image Optimizer ‑ SEO
作用:图像SEO
地址:https://apps.shopify.com/seo-image-optimizer
1184a78c9ffc59ace72448093eb91c49.png

 
2.Klaviya email marketing 
作用:收集注册了网站客户的邮箱地址,帮助追踪之前加入了购物车,或是进入了结算页面,但是最后还是放弃购买的客户。直接通过邮件联系他们。
地址:https://apps.shopify.com/klaviyo-email-marketing

6.png

 
3.Instagram shop by Snapppt
作用:顾客只要点击图片上的图标,就会弹出相应产品的购买页面。把Instagram平台变为获取新客户、销售管道的方式。
地址:https://apps.shopify.com/instagram-shop-by-snapppt

20180620151557_77602.png

 

Shopify商城中Customer Reviews的重要性——如何运用customer review来提高成交率

Shopifycarol 发表了文章 • 1 个评论 • 627 次浏览 • 2019-01-23 14:27 • 来自相关话题

在研究高流量在线商城时我们会发现这样一个现象,许多商城内产品的内容可能并不如我们产品丰富,在相同价格下为什么他的产品却能获得这么多流量呢?仔细看,这些商城的内容一点都不少,他们的customer reviews里包含了消费者各种各样的消费评价、甚至是实拍图。





 
在SEO方面,购买产品的消费者在评价处描绘产品的措辞往往对搜索引擎优化很有用。因为不同的用户描述方面会有差距,会提升网页长尾关键词的收录。要知道长尾关键词所带来的流量是更准确的,长尾关键词增加收录也会为网站带来更多的流量!在分析一个商城站外链的时候我们发现,实际上有很多外链锚文本所链接的目的地是这些评论用户评论。你要相信你的消费者文案功底不比你差,只要他们开心分分钟给你写个大论文。





 
在线评论对于网站来说非常重要,因为它们能够通过向消费者提供他们决定购买产品所需的信息来提升网站销售额。简短的提供customer review能够给网站带来好处的一些数据吧:
74%的客户在进行最终购买之前会咨询评论或评级。如果有产品评价区域,63%的消费者更有可能从网站购买。80%的消费者根据他们在网上找到的负面信息改变了对购买的看法。平均而言,网站上发布的评论中有75%是积极的71%的消费者认为评论使他们在购买正确的产品或服务时更加舒适。57%的在线受访者在购买之前会考虑评论!阅读评论和提问的客户比不提供评论的客户高出105%!
 好吧,说了这么多Customer Reviews​重要的原因。接下来就介绍一下shopify中如何处理customer reviews吧。shopify中有提供免费与付费的Customer Reviews​​ app,进入网站shopify 后台,点击APP,进行搜索即会发现许多能够提供customer reviews 的app。










通常我们使用的有谷歌提供的google customer reviews、product reviews或者Judge.me Product Review​s这三种。
Google customer reviews​





这款软件是谷歌提供的,收费是一次性收费$25。添加方式也比较简单。只要根据网站自身情况按照步骤设定即可。
 
Product reviews






优点:这个app 能够轻松自定义,不会代码的人也比较好操作,同时有提供批量操作,csv导入和导出的功能。从数据营销的角度,用户评论的内容和分数能够添加到您的Google搜索结果中,对搜索引擎更友好。
缺点:不能提供图片,对于一些图片很重要的产品来说,不能发布图片这点不太友好

这款产品安装完成后只需要在后台app页面中双击app即可进入页面进行发布、删除、回复等功能。





Judge.me Product Reviews






 优点:用户对产品的评分能够Google搜索中标记,能够自动社交推送来推动来自Facebook和Twitter的流量,能够使用评论优惠券或积分(整合)进行激励,能够提供图片评论功能。自定义等
缺点:也不算缺点,这个app需要付费,每个月$15如果能够提升网站销量的话是完全可以接受的。











这款app和前一款相比提供的功能更丰富,是否适用主要看自身产品是否需要把!
 
除此之外,如何让你的客户进行评论呢?
 
给购买了产品的用户发送邮件

可以通过mailchimp来制定广告系列发送给那些已经将产品放在手中一两个星期的客户 。这些客户在充分了解过产品后,能够对产品写出更实际的心得。具体mailchimp进行电子邮件营销方法可以google一下。
 
使用优惠券,折扣等

即使是最小的激励措施也会对客户的参与度产生巨大影响。在一些提交评论后能够提供特别的优惠券能够提升消费者参与度。同时也能促进其他产品的销售。
 
 
最后提醒一点:

有些网站看到一些不好的评价就不管不顾的直接删除了,只留下称赞的评价。实际上全是无脑吹的评论并不会让消费者也无脑喜欢呀!产品的最佳评判者是产品本身的消费者。对于消费者来说,负面评论能够让消费者 准确了解他可能遇到的产品漏洞并事先做好心里准备; 有助于维护产品的可信度和真实性 。
 
当然这个评论是可以控制的,太过分的(比如带有辱骂、嘲讽)评论也是可以删的。一些不适合之类,或者不好的产品体验的评论完全是可以留下来的。每个人的体验都不一样。 

  查看全部
在研究高流量在线商城时我们会发现这样一个现象,许多商城内产品的内容可能并不如我们产品丰富,在相同价格下为什么他的产品却能获得这么多流量呢?仔细看,这些商城的内容一点都不少,他们的customer reviews里包含了消费者各种各样的消费评价、甚至是实拍图。

20190123131939.png

 
在SEO方面,购买产品的消费者在评价处描绘产品的措辞往往对搜索引擎优化很有用。因为不同的用户描述方面会有差距,会提升网页长尾关键词的收录。要知道长尾关键词所带来的流量是更准确的,长尾关键词增加收录也会为网站带来更多的流量!在分析一个商城站外链的时候我们发现,实际上有很多外链锚文本所链接的目的地是这些评论用户评论。你要相信你的消费者文案功底不比你差,只要他们开心分分钟给你写个大论文。

20190123132619.png

 
在线评论对于网站来说非常重要,因为它们能够通过向消费者提供他们决定购买产品所需的信息来提升网站销售额。简短的提供customer review能够给网站带来好处的一些数据吧:
  • 74%的客户在进行最终购买之前会咨询评论或评级。
  • 如果有产品评价区域,63%的消费者更有可能从网站购买。
  • 80%的消费者根据他们在网上找到的负面信息改变了对购买的看法。
  • 平均而言,网站上发布的评论中有75%是积极的
  • 71%的消费者认为评论使他们在购买正确的产品或服务时更加舒适。
  • 57%的在线受访者在购买之前会考虑评论!
  • 阅读评论和提问的客户比不提供评论的客户高出105%!

 好吧,说了这么多Customer Reviews​重要的原因。接下来就介绍一下shopify中如何处理customer reviews吧。shopify中有提供免费与付费的Customer Reviews​​ app,进入网站shopify 后台,点击APP,进行搜索即会发现许多能够提供customer reviews 的app。

20190123133810.png


20190123133958.png

通常我们使用的有谷歌提供的google customer reviews、product reviews或者Judge.me Product Review​s这三种。
  • Google customer reviews​


20190123134435.png

这款软件是谷歌提供的,收费是一次性收费$25。添加方式也比较简单。只要根据网站自身情况按照步骤设定即可。
 
  • Product reviews


product-reviews.png


优点:这个app 能够轻松自定义,不会代码的人也比较好操作,同时有提供批量操作,csv导入和导出的功能。从数据营销的角度,用户评论的内容和分数能够添加到您的Google搜索结果中,对搜索引擎更友好。
缺点:不能提供图片,对于一些图片很重要的产品来说,不能发布图片这点不太友好


这款产品安装完成后只需要在后台app页面中双击app即可进入页面进行发布、删除、回复等功能。

20190123135727.png

  • Judge.me Product Reviews


20190123135931.png


 优点:用户对产品的评分能够Google搜索中标记,能够自动社交推送来推动来自Facebook和Twitter的流量,能够使用评论优惠券或积分(整合)进行激励,能够提供图片评论功能。自定义等
缺点:也不算缺点,这个app需要付费,每个月$15如果能够提升网站销量的话是完全可以接受的。



20190123140614.png


20190123140807.png

这款app和前一款相比提供的功能更丰富,是否适用主要看自身产品是否需要把!
 
除此之外,如何让你的客户进行评论呢?
 
  • 给购买了产品的用户发送邮件


可以通过mailchimp来制定广告系列发送给那些已经将产品放在手中一两个星期的客户 。这些客户在充分了解过产品后,能够对产品写出更实际的心得。具体mailchimp进行电子邮件营销方法可以google一下。
 
  • 使用优惠券,折扣等


即使是最小的激励措施也会对客户的参与度产生巨大影响。在一些提交评论后能够提供特别的优惠券能够提升消费者参与度。同时也能促进其他产品的销售。
 
 
最后提醒一点:


有些网站看到一些不好的评价就不管不顾的直接删除了,只留下称赞的评价。实际上全是无脑吹的评论并不会让消费者也无脑喜欢呀!产品的最佳评判者是产品本身的消费者。对于消费者来说,负面评论能够让消费者 准确了解他可能遇到的产品漏洞并事先做好心里准备; 有助于维护产品的可信度和真实性 。
 
当然这个评论是可以控制的,太过分的(比如带有辱骂、嘲讽)评论也是可以删的。一些不适合之类,或者不好的产品体验的评论完全是可以留下来的。每个人的体验都不一样。 


 

开启shopfiy之旅——域名注册以及绑定

Shopifychad 发表了文章 • 1 个评论 • 408 次浏览 • 2019-01-12 11:07 • 来自相关话题

shopify以精简的后台操作,安全的收款方式,多样的推广渠道,越来越受到中小型电商用户的喜爱。很多人在搭建网站的过程中,对于shopify默认域名,以及如何注册筛选顶级域名,都会稍有疑惑。我在这里分享一些粗鄙的经验,以便大家参考之用。如有错误,欢迎指正。
关于默认域名
一般是以××××.shopfiy.com,我们称这种域名是非顶级域名。如果你用这种域名就显得多low啊。毕竟作为电商的牌面,加了个shopify,不仅添加了无意义的单词,给顾客带来记忆负担,更是给shopify打了广告(当然不给shopify打广告,人家也是那么牛逼)。所以果断放弃这种域名,咱丢不起那人。
关于域名筛选
一个好的域名,是一个成功电商的开始,所以这一步一定要慎重。购买域名都是以年为单位,价格在50-100/年等,所以果断去第三方平台购买域名。国内平台推荐万网(阿里云旗下的,马云爸爸强力推荐)。当然当你确定好域名之后,不要立即购买,要查查它有没有黑历史。如果你碰到那种搞过非法的活动、行为的域名,你是哭都来不及。因为这种域名会在google搜索里留存很多垃圾外链,会让你后期推广头疼不已。甚至可能google搜索引擎将其列为黑名单,一辈子无法翻身。所以呀,要提前查查域名的清白。
首先推荐查询域名历史信息的网站:whoisrequest,在搜索框里搜索×××.com等(不要带WWW),即可看到域名历史存在信息




这里推荐大家不要用历史信息太多的域名,你懂得,很难受。谁知道他们干了什么事呢?
其次大家在选在域名的时候要查询下注册的域名,如:×××.com或者品牌,是否已经在所在市场的国家被注册了,是否侵权了?例如美国的一个查询版权的网站:uspto,




我没有遇到过侵权的问题,所以具体操作方式,大家自己摸索下。
关于域名解析
域名解析,老生常谈,网上教程数量都已经可以赶超中华人民的数量了。所以这里仅以万网域名解析为例,有需要咨询别个解析方式的朋友也可以给我们留言,会及时回复滴。
登录阿里云控制后台,找到域名:




进入域名解析列表:




双击指定域名,进入新手指导




将www设置成shops.myshopify.com,如图




将@设置成23.227.38.32,如图




过10分钟左右,域名解析即可生效。
关于域名绑定
解析好的域名当然不能自动生效,我们只是将其指向到shopify服务器。我们还要最后一步,去网站后台绑定域名。当然过程更是so easy ,废话不多少,上图为证:
找到domain部分,即域名部分:




之后将解析好的域名(不带www)填入,next即可链接到解析好的链接。如图:




最后可以验证是否对接完成,如图:




好了,大功告成,开始你的shopify电商之旅吧!
  查看全部
shopify以精简的后台操作,安全的收款方式,多样的推广渠道,越来越受到中小型电商用户的喜爱。很多人在搭建网站的过程中,对于shopify默认域名,以及如何注册筛选顶级域名,都会稍有疑惑。我在这里分享一些粗鄙的经验,以便大家参考之用。如有错误,欢迎指正。
  • 关于默认域名

一般是以××××.shopfiy.com,我们称这种域名是非顶级域名。如果你用这种域名就显得多low啊。毕竟作为电商的牌面,加了个shopify,不仅添加了无意义的单词,给顾客带来记忆负担,更是给shopify打了广告(当然不给shopify打广告,人家也是那么牛逼)。所以果断放弃这种域名,咱丢不起那人。
  • 关于域名筛选

一个好的域名,是一个成功电商的开始,所以这一步一定要慎重。购买域名都是以年为单位,价格在50-100/年等,所以果断去第三方平台购买域名。国内平台推荐万网(阿里云旗下的,马云爸爸强力推荐)。当然当你确定好域名之后,不要立即购买,要查查它有没有黑历史。如果你碰到那种搞过非法的活动、行为的域名,你是哭都来不及。因为这种域名会在google搜索里留存很多垃圾外链,会让你后期推广头疼不已。甚至可能google搜索引擎将其列为黑名单,一辈子无法翻身。所以呀,要提前查查域名的清白。
首先推荐查询域名历史信息的网站:whoisrequest,在搜索框里搜索×××.com等(不要带WWW),即可看到域名历史存在信息
1.png

这里推荐大家不要用历史信息太多的域名,你懂得,很难受。谁知道他们干了什么事呢?
其次大家在选在域名的时候要查询下注册的域名,如:×××.com或者品牌,是否已经在所在市场的国家被注册了,是否侵权了?例如美国的一个查询版权的网站:uspto
2.png

我没有遇到过侵权的问题,所以具体操作方式,大家自己摸索下。
  • 关于域名解析

域名解析,老生常谈,网上教程数量都已经可以赶超中华人民的数量了。所以这里仅以万网域名解析为例,有需要咨询别个解析方式的朋友也可以给我们留言,会及时回复滴。
登录阿里云控制后台,找到域名:
3.png

进入域名解析列表:
4.png

双击指定域名,进入新手指导
5.png

将www设置成shops.myshopify.com,如图
6.png

将@设置成23.227.38.32,如图
7.png

过10分钟左右,域名解析即可生效。
  • 关于域名绑定

解析好的域名当然不能自动生效,我们只是将其指向到shopify服务器。我们还要最后一步,去网站后台绑定域名。当然过程更是so easy ,废话不多少,上图为证:
找到domain部分,即域名部分:
10.png

之后将解析好的域名(不带www)填入,next即可链接到解析好的链接。如图:
11.png

最后可以验证是否对接完成,如图:
12.png

好了,大功告成,开始你的shopify电商之旅吧!
 

注册试用shopify60天,为网站上线做足准备

Shopifychad 发表了文章 • 1 个评论 • 345 次浏览 • 2019-01-04 13:45 • 来自相关话题

Shopify是SaaS领域的购物车平台,适合跨境电商构建独立的电商网站。作为目前市场上构建电商网站最简洁有效的工具,其历史悠久。Shopify成立于2004年,截止2019年1月,全球已经有60万商家,为全球175个国家提供电商服务。从2012年到现在已经实现累计在线交易额400亿美金,并且每年保持平均74%的增加速度。Shopify是一家上市公司,公司规模宏大,有一个强大的技术团队24小时为商家提供服务器。有一套完备的资金结账系统,保证商家的资金安全。后台友好的商家界面让你分分钟了解怎么运营自己的电商网站。你还在等什么呢?赶紧隽永东方——Shopfiy官网合作伙伴试用吧。
作为最早一批加入SHopify Partner的公司,我司可以提供给我们的顾客两种注册方式,如下图:




第一种:Shopify14天试用,这种方式顾客可以自主注册网站信息,账号资料不用对外公开,当然注册的时候英语这块要求还是有点的。不过都是简单易懂的注册流程,信息填写完备即可。
第二种:Shopify60天试用,这种方式也是完全免费的,就是需要我司作为Shopify Partner帮您后台手动注册VIP账号。即可享受60天的免费Shopify体验,通过这种方式让顾客更好的熟悉后台操作,避免客户没有准备充分就上线造成的用户体验度差的影响。这种注册方式,需要我们的顾客提供一些信息资料,如下:




当然我司也会对顾客的信息资料严格保密,坚决保护顾客的合法权益。欢迎各位新老顾客加入体验 查看全部
Shopify是SaaS领域的购物车平台,适合跨境电商构建独立的电商网站。作为目前市场上构建电商网站最简洁有效的工具,其历史悠久。Shopify成立于2004年,截止2019年1月,全球已经有60万商家,为全球175个国家提供电商服务。从2012年到现在已经实现累计在线交易额400亿美金,并且每年保持平均74%的增加速度。Shopify是一家上市公司,公司规模宏大,有一个强大的技术团队24小时为商家提供服务器。有一套完备的资金结账系统,保证商家的资金安全。后台友好的商家界面让你分分钟了解怎么运营自己的电商网站。你还在等什么呢?赶紧隽永东方——Shopfiy官网合作伙伴试用吧。
作为最早一批加入SHopify Partner的公司,我司可以提供给我们的顾客两种注册方式,如下图:
1.png

第一种:Shopify14天试用,这种方式顾客可以自主注册网站信息,账号资料不用对外公开,当然注册的时候英语这块要求还是有点的。不过都是简单易懂的注册流程,信息填写完备即可。
第二种:Shopify60天试用,这种方式也是完全免费的,就是需要我司作为Shopify Partner帮您后台手动注册VIP账号。即可享受60天的免费Shopify体验,通过这种方式让顾客更好的熟悉后台操作,避免客户没有准备充分就上线造成的用户体验度差的影响。这种注册方式,需要我们的顾客提供一些信息资料,如下:
2.png

当然我司也会对顾客的信息资料严格保密,坚决保护顾客的合法权益。欢迎各位新老顾客加入体验

Shopify 根据浏览器的不同尺寸显示不同的图片

ShopifyBob 发表了文章 • 1 个评论 • 470 次浏览 • 2018-12-19 09:26 • 来自相关话题

相信用过shopify的用户都了解一点,就是当我们在添加图片的时候,如果图片的高度很小,PC端显示没有问题的时候,在手机端就会变成一个长条,所以大家可能会很郁闷,怎么才能让移动端显示的图片大一点呢?
 
但是目前Shopify如果想要根据不同的浏览器显示不同的图片,我下面将三种方法:
 
1、一个是用css写,当浏览器缩小到一定的尺寸以后,PC端的图片隐藏,移动端的图片显示,如下所示:@media (max-width:768px){
.desktop img{
display:none;
}
.mobile img{
display:none;
}
}
2、第二个就是让这个图片当做背景,固定容器的高度,但是这个有一个缺点就是浏览器小到一定程度就会被裁切,只保留中间的部分,所以做图的时候还得特别注意,要把重要的内容尽量往图片的中间位置放,如下所示:@media (max-width:768px){
.desktop{
display:block;
height:300px;
background:url("https://cdn.shopify.com/s/file ... 6quot;) no-repeat;
background-size:cover;
}
}3、就是通过在section对应的文件中添加两个图片,一个是移动端的,一个是PC端的,如下图所示:





 
如果不会添加可以查看Shopify sections模板文件里面添加text、textarea等字段 ,然后在前台需要显示的位置添加一段HTML的代码,并调用这两个图片:
 




 
如上图所示,我们只要用picture标签来引用这两个图片即可,picture中间的source可以根据自己的需求添加多个,在添加的同时,不要忘记在下面多添加几个图片,然后我们在对其改造一下,如下图所示:





 
这样如果在后台Customize中,有一个地方没有添加图片,在电脑上面对应的位置就不会显示图片。
 
以上三种各有优缺点,如果想以后在也不想看代码的话,本人建议使用第三种方法,写一次就可以。
 
如有不对,还请各位大神提出修改意见! 查看全部
相信用过shopify的用户都了解一点,就是当我们在添加图片的时候,如果图片的高度很小,PC端显示没有问题的时候,在手机端就会变成一个长条,所以大家可能会很郁闷,怎么才能让移动端显示的图片大一点呢?
 
但是目前Shopify如果想要根据不同的浏览器显示不同的图片,我下面将三种方法:
 
1、一个是用css写,当浏览器缩小到一定的尺寸以后,PC端的图片隐藏,移动端的图片显示,如下所示:
@media (max-width:768px){
.desktop img{
display:none;
}
.mobile img{
display:none;
}
}

2、第二个就是让这个图片当做背景,固定容器的高度,但是这个有一个缺点就是浏览器小到一定程度就会被裁切,只保留中间的部分,所以做图的时候还得特别注意,要把重要的内容尽量往图片的中间位置放,如下所示:
@media (max-width:768px){
.desktop{
display:block;
height:300px;
background:url("https://cdn.shopify.com/s/file ... 6quot;) no-repeat;
background-size:cover;
}
}
3、就是通过在section对应的文件中添加两个图片,一个是移动端的,一个是PC端的,如下图所示:

微信图片_20181219091050.png

 
如果不会添加可以查看Shopify sections模板文件里面添加text、textarea等字段 ,然后在前台需要显示的位置添加一段HTML的代码,并调用这两个图片:
 
微信图片_20181219091400.png

 
如上图所示,我们只要用picture标签来引用这两个图片即可,picture中间的source可以根据自己的需求添加多个,在添加的同时,不要忘记在下面多添加几个图片,然后我们在对其改造一下,如下图所示:

微信图片_20181219092103.png

 
这样如果在后台Customize中,有一个地方没有添加图片,在电脑上面对应的位置就不会显示图片。
 
以上三种各有优缺点,如果想以后在也不想看代码的话,本人建议使用第三种方法,写一次就可以。
 
如有不对,还请各位大神提出修改意见!

关于shopify开发的入门

Shopifychad 发表了文章 • 1 个评论 • 1068 次浏览 • 2018-12-11 11:05 • 来自相关话题

最近经手维护以及开发的shopfiy项目还是比较多的,在这块的开发上面积累了些许经验,经日有seo同事问道shopfiy后台文件怎么查找,找不到很多需要的东西怎么办?特在此写一些关于shopify入门的一些知识,只为给后来的同事填填坑,一起学习进步之用。
来来来,干货走起:




进入后台,上面这三个位置算是我们开发者需要知道的核心部分,产品以及分类,和上线后才添加的online store.如果把online store去掉,那所有产品都不存在,都在网站上是不会显示的。




打开产品分类,像里面有缩略图的部分,就是在某个产品分类点进去之后右下角有个collection img,上传之后就会呈现。而在页面上当引入某个分类的时候这张collection  img也会正常显示出来。




点击打开online store界面,这四个部分都是非常重要的,我们依次分说。首先第一个theme主题,类似wordpress里面主题,此处可以上传主题包,一般是zip压缩包。其界面里也是包含很多重要内容,也是每个项目的核心部分,内容展示如下:




其中customize部分类似worpress里面的在线构建网页,只是wordpress用的比较少,但是对于shopify却是神器,这个界面长什么样子呢?大家请看:




这部分是左侧侧边栏,所有的section是构成首页部分的关键,不同的section通过拖拽可以调换位置,我们构建首页的时候根据不同的要求选择不同的section,然后拖拽到不同的位置。那就有同学问了,如果某部分section并不完全符合,我们应该怎么去找到对应的code做修改呢?好,关键的来了,请睁大你迷人的双眼:




点到某个section,进入之后,点击右键查找元素,在这部分section的最外层节点里面有个type属性,就是它,他就是你在code里面找到对应的文件夹的名字。ps:一定要在custiomize界面右键查看代码哦,网站页面这些代码是不存在的。
说到code界面呢,也是在theme界面,再次给大家看下位置:




edit code,点击进入(友情提示,新手尽量不要更改这部分代码),当当当,




清新脱俗的界面映入眼帘,对于经常打代码的你是不是跃跃欲试?废话不多讲,先说说几个文件夹的含义。第一个layout文件夹,首页部分存放位置,名曰theme.liquid,有的叫什么index.liquid。该文件所用就是引入框架,css样式已经首页部分框架搭建等。它与我们最大的作用就是引入css样式,以及js文件。具体引入方式可参照里面的方式,方式多种多样,自行参悟即可。
其次看下这个template文件夹。顾名思义模板,什么页面模板,collection模板都在该文件夹。也是可以自己新建文件夹的,新建重命名之后,在后台product里collection或者page里就可以重新选择新建的模板。操作方式和wordpress雷同。
接下来这个可有意思了,值得大家好好学习研究的文件夹section。此处的妙用即是,凡是此文件夹的内容都是可以在cutiomize界面呈现出来的。这样我们的客户就可以很方便的操作网站的内容了。




看图说话,有木有觉得很熟悉,有没有似曾相识的感觉。没有的话说明你没用心看,不用心何以体会到我这字字如今的境界,昂?哈哈,开个玩笑。这个侧边栏即是上面展示section部分的侧边栏,上面说了这部分通过右键查看代码,找到的type是featured-collection。好,我们就在sectionwen文件夹找到featured-collection.liquid文件。打开之后,请看最下面有个标签:{ schema }{ endschema },里面部分




为了尽可能多的展示,字体有些小,见谅哈。看看上面给上面section侧边栏的截图,有没有很相似?仔细看,如果看出相似之处,那说明你有当码农的慧根。嘿嘿,对你看到的相似之处就是两个又是一一对应的关系。此处添加修改不同的json字符串,那么customize界面就会展示不同的功能模块。是不是很强大?很给力?试想你添加了对应的模块给顾客,顾客添加完数据,你通过liquid语言代码引入到网站页面上来。是不是很完美?因为该文章是入门,所以再深次层的代码解读就需要大家去努力了,在此就不做赘述。
snippets,字面理解,代码块。这部分内容就是已经写好了很多很多代码块或者功能模块,如果那部分需要,只要直接引用即可{%  include ***  %}就100%是引入snippets部分内容,自己也可以写成固定snippets,然后引入即可。
后面的asset文件夹就是存放png文件,以及js,css文件的地方,引入到文件的方式也不尽相同。例如对于favicon的引入<link rel="shortcut icon" type="image/x-icon" href="{{ 'favicon.png' | asset_url }}">,加粗部分就是常用引入图片方式。后面俩文件夹看了,没必要提了,完全没啥可说的,自己研究下即可。
edit code部分基本完结,欲知后事如何,应该没有下回了。噗,言归正传,继续往下看edit languages。你可以更改默认语言,这里比较蛋疼,默认语言不支持中文,我大中华文明竟然这样被抛弃了。而且更蛋疼的是,你改成中文之后的bug,导航部分无法生成下拉菜单,所以千万不要改成中文。宁愿用插件转成中文,也不要把默认语言改成中文。
接下来blog部分,新闻部分,作为电商网站,这部分用的不太多。简单来说这部分也是以页面的形式编辑的,就是page的编辑器以及样式。在里面可以大大广告之后,在页面的侧边栏等将这些展示出来,起到引流的作用。
后面的pages部分,如果懂得wordpress,那这部分就兼职熟的不要不要的。标题,内容,模板引入等等。这里有一点值得提一提,下面有个seo的工具




什么title,description,url都是可以更改的。尤其是url的更改,就可以改成顾客所需求的url,增加用户体验
来来来,最后一个点navigation。此处可以更改页面的导航栏,也可以在页面的footer部分增添新导航。增加新的导航就如图




在link里面选择展示的内容,如果name没写,选择好link之后,name就会自动填充当前link。而且所有增加的nav都是可以拖拽调换位置的,有人就说了如果想增加子菜单是不是直接拖到对应父nav下面就可以生成子菜单了?非也非也,子菜单的这种添加方式是有bug的,有时候不生效。最有效的方式就是返回前面add menu,再新家一个nav,名字就是需要添加的父nav的名字。再将子菜单添加进去,保存刷新页面,页面就会完美呈现子菜单了。
这次的入门教程就写到这里吧,有时间我会再更新第二部的,让更多的人熟悉shopify,熟悉liquid,更多的人参与进来。
  查看全部
最近经手维护以及开发的shopfiy项目还是比较多的,在这块的开发上面积累了些许经验,经日有seo同事问道shopfiy后台文件怎么查找,找不到很多需要的东西怎么办?特在此写一些关于shopify入门的一些知识,只为给后来的同事填填坑,一起学习进步之用。
来来来,干货走起:
1.png

进入后台,上面这三个位置算是我们开发者需要知道的核心部分,产品以及分类,和上线后才添加的online store.如果把online store去掉,那所有产品都不存在,都在网站上是不会显示的。
2.png

打开产品分类,像里面有缩略图的部分,就是在某个产品分类点进去之后右下角有个collection img,上传之后就会呈现。而在页面上当引入某个分类的时候这张collection  img也会正常显示出来。
3.png

点击打开online store界面,这四个部分都是非常重要的,我们依次分说。首先第一个theme主题,类似wordpress里面主题,此处可以上传主题包,一般是zip压缩包。其界面里也是包含很多重要内容,也是每个项目的核心部分,内容展示如下:
4.png

其中customize部分类似worpress里面的在线构建网页,只是wordpress用的比较少,但是对于shopify却是神器,这个界面长什么样子呢?大家请看:
5.png

这部分是左侧侧边栏,所有的section是构成首页部分的关键,不同的section通过拖拽可以调换位置,我们构建首页的时候根据不同的要求选择不同的section,然后拖拽到不同的位置。那就有同学问了,如果某部分section并不完全符合,我们应该怎么去找到对应的code做修改呢?好,关键的来了,请睁大你迷人的双眼:
6.png

点到某个section,进入之后,点击右键查找元素,在这部分section的最外层节点里面有个type属性,就是它,他就是你在code里面找到对应的文件夹的名字。ps:一定要在custiomize界面右键查看代码哦,网站页面这些代码是不存在的。
说到code界面呢,也是在theme界面,再次给大家看下位置:
4.png

edit code,点击进入(友情提示,新手尽量不要更改这部分代码),当当当,
7.png

清新脱俗的界面映入眼帘,对于经常打代码的你是不是跃跃欲试?废话不多讲,先说说几个文件夹的含义。第一个layout文件夹,首页部分存放位置,名曰theme.liquid,有的叫什么index.liquid。该文件所用就是引入框架,css样式已经首页部分框架搭建等。它与我们最大的作用就是引入css样式,以及js文件。具体引入方式可参照里面的方式,方式多种多样,自行参悟即可。
其次看下这个template文件夹。顾名思义模板,什么页面模板,collection模板都在该文件夹。也是可以自己新建文件夹的,新建重命名之后,在后台product里collection或者page里就可以重新选择新建的模板。操作方式和wordpress雷同。
接下来这个可有意思了,值得大家好好学习研究的文件夹section。此处的妙用即是,凡是此文件夹的内容都是可以在cutiomize界面呈现出来的。这样我们的客户就可以很方便的操作网站的内容了。
8.png

看图说话,有木有觉得很熟悉,有没有似曾相识的感觉。没有的话说明你没用心看,不用心何以体会到我这字字如今的境界,昂?哈哈,开个玩笑。这个侧边栏即是上面展示section部分的侧边栏,上面说了这部分通过右键查看代码,找到的type是featured-collection。好,我们就在sectionwen文件夹找到featured-collection.liquid文件。打开之后,请看最下面有个标签:{ schema }{ endschema },里面部分
9.png

为了尽可能多的展示,字体有些小,见谅哈。看看上面给上面section侧边栏的截图,有没有很相似?仔细看,如果看出相似之处,那说明你有当码农的慧根。嘿嘿,对你看到的相似之处就是两个又是一一对应的关系。此处添加修改不同的json字符串,那么customize界面就会展示不同的功能模块。是不是很强大?很给力?试想你添加了对应的模块给顾客,顾客添加完数据,你通过liquid语言代码引入到网站页面上来。是不是很完美?因为该文章是入门,所以再深次层的代码解读就需要大家去努力了,在此就不做赘述。
snippets,字面理解,代码块。这部分内容就是已经写好了很多很多代码块或者功能模块,如果那部分需要,只要直接引用即可{%  include ***  %}就100%是引入snippets部分内容,自己也可以写成固定snippets,然后引入即可。
后面的asset文件夹就是存放png文件,以及js,css文件的地方,引入到文件的方式也不尽相同。例如对于favicon的引入<link rel="shortcut icon" type="image/x-icon" href="{{ 'favicon.png' | asset_url }}">,加粗部分就是常用引入图片方式。后面俩文件夹看了,没必要提了,完全没啥可说的,自己研究下即可。
edit code部分基本完结,欲知后事如何,应该没有下回了。噗,言归正传,继续往下看edit languages。你可以更改默认语言,这里比较蛋疼,默认语言不支持中文,我大中华文明竟然这样被抛弃了。而且更蛋疼的是,你改成中文之后的bug,导航部分无法生成下拉菜单,所以千万不要改成中文。宁愿用插件转成中文,也不要把默认语言改成中文。
接下来blog部分,新闻部分,作为电商网站,这部分用的不太多。简单来说这部分也是以页面的形式编辑的,就是page的编辑器以及样式。在里面可以大大广告之后,在页面的侧边栏等将这些展示出来,起到引流的作用。
后面的pages部分,如果懂得wordpress,那这部分就兼职熟的不要不要的。标题,内容,模板引入等等。这里有一点值得提一提,下面有个seo的工具
10.png

什么title,description,url都是可以更改的。尤其是url的更改,就可以改成顾客所需求的url,增加用户体验
来来来,最后一个点navigation。此处可以更改页面的导航栏,也可以在页面的footer部分增添新导航。增加新的导航就如图
11.png

在link里面选择展示的内容,如果name没写,选择好link之后,name就会自动填充当前link。而且所有增加的nav都是可以拖拽调换位置的,有人就说了如果想增加子菜单是不是直接拖到对应父nav下面就可以生成子菜单了?非也非也,子菜单的这种添加方式是有bug的,有时候不生效。最有效的方式就是返回前面add menu,再新家一个nav,名字就是需要添加的父nav的名字。再将子菜单添加进去,保存刷新页面,页面就会完美呈现子菜单了。
这次的入门教程就写到这里吧,有时间我会再更新第二部的,让更多的人熟悉shopify,熟悉liquid,更多的人参与进来。
 

Shopify sections模板文件里面添加text、textarea等字段

ShopifyBob 发表了文章 • 1 个评论 • 551 次浏览 • 2018-11-14 14:16 • 来自相关话题

现在使用Shopify的用户越来越多,但是自己有不会程序的开发,所以基本上都是使用免费或者购买shopify主题来搭建自己的店铺。但不是所有的主题都能完美的符合自己的心意,比如想在一些图片下面添加一段简单的描述、或者在某个板块上面添加一个标题,点单的方法是找到对应的标签下面添加一个标签,然后把一段文字或者一个标题放在里面,但是这样比较麻烦,每次修改还得找到对应的文件,并且还得天天和一大堆HTML打交道,对于不懂得人是一件非常头疼的事情。下面我给大家说一个方法,只要复制粘贴就可以了,
例如;在首页的三个图片的上面和下面添加标题和描述,如图所示:





 
1、首先需要打开后台,进入到代码编辑的部分:




 
同时把Customize theme页面也打开,将标题的输入框放在下图左边的位置:




 
2、然后在sections文件下面找到对应的模块文件,然后鼠标拉到最下面黑色标签位置:




 
3、将下面的代码添加在上图红色位置,





  ,

{
"type": "text",
"id": "title",
"label": "Heading",
"info": "Optional"
}4、然后刷新Customize theme页面,就会看到一个输入框:





 
然后将需要添加的标题写在里面,保存。
 
5、接下来还是回到原来的模块文件,鼠标拉到最上面,并找到需要添加的位置:





 
6、添加以下代码,并保存:




<h2>{{ section.settings.title }}</h2>7、刷新前台,添加的内容就显示了,当然样式要简单的调整下就可以了。





 
图片下面的标题和一段文字也是同样的添加方法:












 
如果想成CheckBox,只要将type改成checkbox,id重新改一个小写的名字,方便调用,label改成一个小的标题就可以。
 
如果在添加的过程中遇到其他的问题,可通过下面的链接联系我们。
https://www.eastdesign.net/contact/ 查看全部
现在使用Shopify的用户越来越多,但是自己有不会程序的开发,所以基本上都是使用免费或者购买shopify主题来搭建自己的店铺。但不是所有的主题都能完美的符合自己的心意,比如想在一些图片下面添加一段简单的描述、或者在某个板块上面添加一个标题,点单的方法是找到对应的标签下面添加一个标签,然后把一段文字或者一个标题放在里面,但是这样比较麻烦,每次修改还得找到对应的文件,并且还得天天和一大堆HTML打交道,对于不懂得人是一件非常头疼的事情。下面我给大家说一个方法,只要复制粘贴就可以了,
例如;在首页的三个图片的上面和下面添加标题和描述,如图所示:

QQ图片20181114134134.png

 
1、首先需要打开后台,进入到代码编辑的部分:
QQ图片20181114133659.png

 
同时把Customize theme页面也打开,将标题的输入框放在下图左边的位置:
QQ图片20181114135135.png

 
2、然后在sections文件下面找到对应的模块文件,然后鼠标拉到最下面黑色标签位置:
QQ图片20181114135425.png

 
3、将下面的代码添加在上图红色位置,

QQ图片20181114135756.png

 
	  ,

{
"type": "text",
"id": "title",
"label": "Heading",
"info": "Optional"
}
4、然后刷新Customize theme页面,就会看到一个输入框:

QQ图片20181114140125.png

 
然后将需要添加的标题写在里面,保存。
 
5、接下来还是回到原来的模块文件,鼠标拉到最上面,并找到需要添加的位置:

QQ图片20181114140434.png

 
6、添加以下代码,并保存:

QQ图片20181114140527.png
<h2>{{ section.settings.title }}</h2>
7、刷新前台,添加的内容就显示了,当然样式要简单的调整下就可以了。

QQ图片20181114140712.png

 
图片下面的标题和一段文字也是同样的添加方法:
QQ图片20181114141042.png

QQ图片20181114141227.png

QQ图片20181114141304.png

 
如果想成CheckBox,只要将type改成checkbox,id重新改一个小写的名字,方便调用,label改成一个小的标题就可以。
 
如果在添加的过程中遇到其他的问题,可通过下面的链接联系我们。
https://www.eastdesign.net/contact/

shopify 常用 APP

ShopifyBob 发表了文章 • 0 个评论 • 524 次浏览 • 2018-10-17 10:12 • 来自相关话题

常用但不一定全用的APP
 
1、语言翻译app:langify 
2、Tab标签切换app:Product Tabs 

3、产品自定义app:Product Options by Bold 

4、物流跟踪app:AfterShip 

5、社交媒体登录app:Hull Social Login  

6、产品评论app:Product Reviews 

7、在线聊天工具app:LiveChat  

8、订单打印app:Order Printer 
9、产品数量变化及降价app:Quantity Breaks 
 
10、批量订购app: Bulk Order Page
 
11、退款APP:Clicksit Return Center 
 
12、常见问题手风琴APP:FAQ Accordion by Widgetic
 
13、表单生成器App:Free Form Builder by HulkApps
 
14、产品标签App:Product Label Tagger by BNMetrics
 
15、最近浏览App:Recently Viewed Products

未完待续。。。 查看全部
常用但不一定全用的APP
 
1、语言翻译app:langify 
2、Tab标签切换app:Product Tabs 

3、产品自定义app:Product Options by Bold 

4、物流跟踪app:AfterShip 

5、社交媒体登录app:Hull Social Login  

6、产品评论app:Product Reviews 

7、在线聊天工具app:LiveChat  

8、订单打印app:Order Printer 
9、产品数量变化及降价app:Quantity Breaks 
 
10、批量订购app: Bulk Order Page
 
11、退款APP:Clicksit Return Center 
 
12、常见问题手风琴APP:FAQ Accordion by Widgetic
 
13、表单生成器App:Free Form Builder by HulkApps
 
14、产品标签App:Product Label Tagger by BNMetrics
 
15、最近浏览App:Recently Viewed Products

未完待续。。。

Shopify 全局设置

ShopifyBob 发表了文章 • 0 个评论 • 448 次浏览 • 2018-10-17 10:04 • 来自相关话题

全局设置将影响网站的整个选项,是做主题定制非常好的地方。在这里我们根据自己的爱好来对现在的主题进行修改。

进入shopify全局设置后台:Online Store —> Theme ,如下图所示:









 
进入到设置页面以后会在最右侧有一个从外边,所有的可调性内容都在这个里面设置,比如:Logo、文章字体、颜色、侧边栏以及产品列表等,如下图所示:





然后我们就可以逐个点击进入设置,左侧可以预览所修改的设置,然后点击右下角的保存按钮就可以了 查看全部
全局设置将影响网站的整个选项,是做主题定制非常好的地方。在这里我们根据自己的爱好来对现在的主题进行修改。

进入shopify全局设置后台:Online Store —> Theme ,如下图所示:
online-store.png


theme.png

 
进入到设置页面以后会在最右侧有一个从外边,所有的可调性内容都在这个里面设置,比如:Logo、文章字体、颜色、侧边栏以及产品列表等,如下图所示:

theme-setting.png

然后我们就可以逐个点击进入设置,左侧可以预览所修改的设置,然后点击右下角的保存按钮就可以了

Shopify Home 后台首页

ShopifyBob 发表了文章 • 0 个评论 • 455 次浏览 • 2018-10-17 10:01 • 来自相关话题

当我们打开shopify后台的时候,出现在我们眼前的是Shop Home这个页面。





 
如果Shopify网站正常运行,那么在后台Home页面会显示一些店铺的相关信息,如当天有多少访问量、当天收获多少、需要处理的订单、日常任务、日常信息等信息。

在Home右侧的侧边栏是关于店铺的访客以及最近操作的事项,我们可以选择统计时间,最长可统计90天的数据





 
而且Shopify还会推荐一些文章,可以了解更多的信息。










  查看全部
当我们打开shopify后台的时候,出现在我们眼前的是Shop Home这个页面。

shophome.jpg

 
如果Shopify网站正常运行,那么在后台Home页面会显示一些店铺的相关信息,如当天有多少访问量、当天收获多少、需要处理的订单、日常任务、日常信息等信息。

在Home右侧的侧边栏是关于店铺的访客以及最近操作的事项,我们可以选择统计时间,最长可统计90天的数据

shop-home.png

 
而且Shopify还会推荐一些文章,可以了解更多的信息。

tuijian1.png


tuijian2.png