用户购物流程优化这样做，你知道吗？(上)

近期，很多客户有提到一个需求，“站内优化”。其实，我想说的是，虽然只有短短四个字，但是却包含太多内容了，比如页面布局优化，网站内容优化，页面加载速度优化，用户购物流程优化等等，这些都是站内优化的范畴。
本篇文章内容，我们就用户体验流程优化，做一个详细的介绍。在我们帮客户建站以及给客户提供站内优化的过程中，在店铺基础功能搭建完毕后，从用户进到我们的产品购物页面开始，哪些措施或者说手段，能更好地让用户感觉到放心，信任，冲动，从而产生购买欲望，并最终付款。今天就系统地给大家介绍一下。内容涉及比较多，因此，相关内容我会分为上下两篇来写。

流程优化六大步

1. 快速动态结款按钮

2. 悬浮加入购物车按钮

3. Upsell App的运用

4. 安全图标的巧妙设置

5. 产品评论App的使用

6. Checkout页面的优化

快速动态结款按钮

我们在很多网站上都会看到有这个Buy with Paypal的按钮，于是会有一些新用户来问我，这个是做什么的？怎么设置？怎么修改下面这个按钮的颜色？默认Buy It Now按钮为黑色，PayPal按钮为黄色，入下图。

用户在产品页面，直接点击快速结款按钮，会跳过购物车及checkout页面，先到达Paypal支付页面，这样从点击到付款的过程会大大缩短，减少用户考虑的时间。

如果你使用的主题是Shopify的免费主题，那么在后台主题都支持这个按钮的动态设置，默认是没有的。如果你是在非Shopify主题市场里购买的主题，且时间比较老了，那也许没有这个按钮的设置，需要自行添加代码。
我们点开主题自定义设置，Online Store -> Customize -> Product Pages，这个按钮英文名称称作dynamic checkout button，通常如果要搜索这个按钮的相关情况，只需要在google中搜索这个名词，会出来很多相关的文章。如下图，选中Show dynamic checkout button。

看这个颜色不满意，想要修改按钮的颜色？看这里：
Online Store -> Current Theme ->Actions -> Edit Code -> Assets，找到后缀带.scss的文件，如下图。在文件的最后，添加下列代码，点击保存：

.shopify-payment-button__button–branded .shopify-cleanslate div{

background-color: #000000 !important;

color: #FFFFFF !important;

border-color: #000000 !important;

}

其中标红颜色的部分代表你想修改的颜色值。background-color是按钮的背景颜色，border-color要与背景颜色保持一致。color是按钮中字体的颜色。下面第二张图就是我将按钮背景修改成了黑色，字体修改成了白色。这也是很多大网站这个按钮比较流行的颜色，比如fashionnova.com。

悬浮加入购物车按钮

这个按钮的作用主要是当用户产生购买冲动的时候，能让用户第一时间找到地方下单。
为什么这点至关重要呢？想象一下这样一种情况，我们的商品描述稍微长了一些，因为只有这样，才能将我的商品描述的清楚，当用户往下浏览的时候，哇，越看越觉得这个商品很棒，想购买了，于是他要把页面往上拉，往上拉，再往上拉一点，咦，出现了Add to Cart，可是这个时候我仔细想了一下，又不是很想买了。

这样的情况非常普遍，尤其是从Facebook看到广告过来的用户，多数为冲动性购买消费者，热度只有那么几分钟，所以我们要抓住关键的几分钟。当他想要买的时候就一定要让他快速点击购买按钮，尤其是在手机端，屏幕显示内容特别有限。于是，在这样的大环境下，悬浮购物车按钮就应运而生了。先看看效果是什么样的：

给大家推荐这款App，Sticky Add To Cart BOOSTER PRO，虽然是付费，但是效果还不错。PC端的时候，整个按钮Bar显示的比较清楚，比较大，而且还显示了商品图片，标题以及变体，价格等，比较醒目。移动端的时候，购买按钮显示整条，也比较显眼，让用户时刻注意到。

Upsell App的运用

对于冲动性购买的用户，适当的优惠能加速他购买的过程。因此，Upsell以及Cross sell的App的重要性就不需要多说了，很多老的Shopify卖家都已经注意到了，我就不一一去介绍了。但是，最近，很多卖家会问这样一个问题，给我截个图，然后问我，你知道下面这个是通过哪个App来实现的吗？

刚好小编最近在帮客户建站的时候，有用到过这个App，Quantity Breaks，分享给大家。具体这个app有什么用处呢？刺激购买，提高客单价。
安装这个App后，可以自己在后台设置优惠规则，主要是针对购买数量上的折扣，也就是我们通常讲的Upsell，可以提高我们的平均客单价。设置后，优惠信息会自动显示在Add To Cart按钮下，用户在准备添加购物车的时候就能第一时间看到优惠信息。

除此之外，用户在购物车页面，如果购买数量没有达到优惠条件，可以在购物车页面再次进行优惠提示，如果购买达到优惠条件，购物车显示价格会自动显示折扣后的价格，如下图：