• 欢迎访问 顾小北的B2C博客 请加入我们的Facebook营销群 QQ群
  • 各位不要通过QQ和微信来问问题(每天消息太多),如有问题凡请直接在各相关帖子下面留言,我会回答大家的问题的。
  • 如果您觉得这个博客非常有看点,那么赶紧使用Ctrl+D 收藏 顾小北的B2C博客 吧!

从零开始,30天学会在Shopify上开店之店铺设置–Day5

Shopify 小北 11915次浏览 2个评论 扫描二维码

从零开始,30天学会在shopify上开店—Day1

从零开始,30天学会在shopify上开店—Day2

从零开始,30天学会在shopify上开店之店铺设计—Day3

从零开始,30天学会在shopify上开店之杂货店VS利基店—Day4

从零开始,30天学会在Shopify上开店之店铺设置--Day5

Okay,今天我们要讲的是在Shopify上开店,关于店铺设置创建页面的细节,包括要创建哪些页面,如何创建,以及设置导航。

登录Shopify后台以后,点击左侧的Online store–>Navigation:

从零开始,30天学会在Shopify上开店之店铺设置--Day5

菜单分为底部菜单主菜单。下面看看这两个菜单分别显示在网站的哪个位置。

打开你的店铺地址:xxx.myshopify.com

网站顶部显示的就是你的主菜单。

从零开始,30天学会在Shopify上开店之店铺设置--Day5

网站底部显示的就是底部菜单。

从零开始,30天学会在Shopify上开店之店铺设置--Day5

下面详细讲解一下主菜单的设置

回到Navigation部分,点击Main Menu,你可以修改主菜单的标题,也可以不修改。这个标题不会显示在你的网站里。

从零开始,30天学会在Shopify上开店之店铺设置--Day5

在主菜单里面,我要设置一些菜单是客户可以点击进入的。所以,如果客户进入我的网站,看到主菜单,我会想让他们看到这些东西:

  • 客户有办法联系我们;
  • 客户可以追踪他们的订单物流记录;
  • 客户可以点击不同的产品类目。

     

接下来进入菜单内容设置

我们先删除默认的菜单Home和Catalog。点击相应菜单右边的删除图标来删除菜单:

从零开始,30天学会在Shopify上开店之店铺设置--Day5

 

点击Add menu item, 输入菜单名称,点击Link下面的空白框,选择一个Collection:

从零开始,30天学会在Shopify上开店之店铺设置--Day5

如果这个要添加的Collection事先没有创建好,那么我们就需要回到Products里去创建一个Collection.

点击上面截图的Cancel, 右击左侧栏的Products,打开一个新窗口。然后点击Collections:

从零开始,30天学会在Shopify上开店之店铺设置--Day5

点击右上角的创建Collection, 输入标题:Creative Gifts. 下面选择“手动”(手动添加产品到这个Collection),最后点击保存:

从零开始,30天学会在Shopify上开店之店铺设置--Day5

创建好Collection以后,我们需要添加产品到这个Collection. 点击All products–>add product:

从零开始,30天学会在Shopify上开店之店铺设置--Day5

输入产品的标题、描述、图片、价格、重量等必要信息。

重点是:在右边的Collections部分,要手动点击空白框并选择Creative Gifts. 这样,产品才会显示在这个Collection里面。最后保存。

从零开始,30天学会在Shopify上开店之店铺设置--Day5

我们再回到之前那个创建主菜单的窗口,在Link部分选择Creative Gifts这个Collection, 然后点击添加。最后,别忘了点击保存。

从零开始,30天学会在Shopify上开店之店铺设置--Day5

所以,按照上面的操作步骤,我们可以添加不同的菜单,比如Cool Gifts, Funny Gifts, Mothers, Kids.

当然,菜单里面不仅仅可以添加Collection,而且可以添加产品、页面、博客帖子等内容。

比如要创建一个About Us菜单(名称可以换,你可以说Meet Us,方便自己辨认即可)。

1. 我们要先创建一个About Us的页面。点击左侧栏Online Store下面的Pages, 点击添加页面,输入页面标题About Us.和内容介绍,最后保存。

从零开始,30天学会在Shopify上开店之店铺设置--Day5

2. 然后在Navigation的主菜单里添加About Us的菜单。点击Add menu item, 输入菜单名称,link部分选择Pages–>about us,点击添加,最后保存:

从零开始,30天学会在Shopify上开店之店铺设置--Day5

最后,我们再添加一个Contact Us的菜单。同样,要先创建一个Contact Us的页面。

关于联系我们的样式,推荐用typeform.com里面的。打开网站以后,要先注册。注册以后,点击邮件激活,然后登录平台。

点击Contact Form:

从零开始,30天学会在Shopify上开店之店铺设置--Day5

点击Use this template:

从零开始,30天学会在Shopify上开店之店铺设置--Day5

模板自身就提供每一步要问的问题,可以删掉也可以重新设置,点击扳手图标可以重新设置问题,点击右边的三点会出现删除标志:

从零开始,30天学会在Shopify上开店之店铺设置--Day5

设置好以后,点击页面顶部的Share:

从零开始,30天学会在Shopify上开店之店铺设置--Day5

可以看到有三种分享方式:链接、插入、邮件。

这里我们选择把代码插入到我们的Contact Us页面里,点击EMBED,个人建议用弹窗的形式展现,点击Popup, 按钮的文本内容和字体大小都是可以修改的。设置好以后,点击Get the Code:

从零开始,30天学会在Shopify上开店之店铺设置--Day5

复制代码:

从零开始,30天学会在Shopify上开店之店铺设置--Day5

回到Shopify后台,点击pages–>add page, 输入页面名称Contact Us, 输入内容:

从零开始,30天学会在Shopify上开店之店铺设置--Day5

然后点击红框标出的标志切换成HTML样式:

从零开始,30天学会在Shopify上开店之店铺设置--Day5

粘贴代码并保存,全选内容,点击Center aligh可以调到页面中间来:

从零开始,30天学会在Shopify上开店之店铺设置--Day5

如果你觉得文字内容和按钮之间的间隔太小了,可以切换成HTML样式以后多加几行<p></p>表示空行,最后保存看怎么显示:

从零开始,30天学会在Shopify上开店之店铺设置--Day5

然后我们再来添加Contact Us的菜单。点击Navigation,进入主菜单,点击add menu item, 输入菜单名称Contact Us, link下面选择页面Contact Us, 点击添加,最后保存菜单。

所以,我们现在的主菜单有以下内容:Creative Gifts, Cool Gifts, Funny Gifts, Mothers, Kids, About Us, Contact Us:

从零开始,30天学会在Shopify上开店之店铺设置--Day5

那么如何添加二级菜单呢?

比如上面这种排列方式太不美观,我想把Kids放到Mothers下面,把Contact Us放在About Us下面。

点击Navigation,然后进入主菜单。把鼠标放在Kids左边的六个点上,当鼠标变成手掌样式,把这个菜单拖放到Mothers下面;同样的方法操作Contact Us。最后保存。

从零开始,30天学会在Shopify上开店之店铺设置--Day5

下面看看我们网站前台会如何显示:

从零开始,30天学会在Shopify上开店之店铺设置--Day5

当然我们也可以添加一个追踪物流记录的页面,客户输入单号以后,就可以跟踪物流记录。这个会在后面讲解添加插件的时候说到!

从零开始,30天学会在Shopify上开店之店铺设置--Day5

以上就是今天的内容。

对了,接下来我会加快速度来写完这个30天的设置的~~

以上!


本文标题:从零开始,30天学会在Shopify上开店之店铺设置–Day5
转载请保留页面地址:http://www.guxiaobei.com/set-up-shop-on-shopify5.html
喜欢 (9)
[766060636@qq.com]
分享 (0)
头像
发表我的评论
取消评论

表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
(2)个小伙伴在吐槽
  1. 头像
    这些基础掌握确实很有用,但直接上shopify help center 不是更容易获得吗?现在普遍困惑的是,如何为独立站引流,如何引导转化,如何提高ASP 等等。
    Kenny2019-07-04 15:21 回复 Windows 10 | Chrome 75.0.3770.100
  2. 头像
    哇塞,棒棒哒
    Sihan2019-07-04 01:31 回复 iPhone 12_1 | Safari 605.1