【文章首发于 Abby 外贸建站博客】
本 WordPress 建站教程全面覆盖主机购买、WordPress 基础设置、Hello Elementor 主题、Elementor、Elementor 编辑器与 Elementor Pro 授权、网页设计、内容上传、网站安全、速度优化、WordPress SEO 优化、数据分析等共 20 个章节。按照建站顺序划分为技术 – 设计 – 优化三大篇章,每个步骤都有详细的文字说明和清晰的图片示例,可以从零开始,搭建完整的外贸 B2B 网站。
Abby 在成为建站服务商之前,首先是一枚外贸人,在建站人和外贸人的成长路上,得到过很多大牛的无私分享。Abby 作为外贸人的从 0 到 100 万,是通过料神 Sam 的无私分享得到的;Abby 作为建站人的成长,是从免费视频教程开始的。如今作为过来人,也希望把这份实战经验传递下去。
如果预算充足,想全力投入外贸业务而非建站技术的,欢迎了解 Abby 的建站服务。
如果预算有限,完全可以跟着这篇教程一步步自建,亲手搭建网站。
无论选择哪一条路,都祝愿大家的网站,能真正服务于业务,带来源源不断的询盘和订单。
章节目录导航
普通人搜索建站,最先刷到的都是注册域名、选购主机、安装主题这类操作,因为这是建站起步的必经环节,受众最大、热度最高。但是,这距离上线一个对业务有帮助的网站还有距离。以下是建站的完整流程。
技术篇(启动篇)
资源费用清单
购买 Hostinger 主机
选择 Hostinger 套餐
选择域名
注册 Hostinger 账号
完善基础信息(地区)
选择付款方式
在 Hostinger 创建网站
新手指引
意外处理
WordPress 基础设置
用户语言
常规设置
阅读设置
创建产品分类
Hello Elementor 主题
安装主题
上传 LOGO
设置菜单
绑定首页
Elementor 编辑器
Elementor Pro
设计篇
导入模板
主题构建器 Theme Builder
Header
Footer
Single Post 文章详情页
Single Product 产品详情页
Post Archive 文章聚合页
Product Archive 产品聚合页
产品与文章
发表文章
上传产品
理解原理
另一种编辑器:Elementor
局限性
补充分类目录描述
效果展示
固定页面
Home 首页
About 关于我们
Contact 联系我们
网站设计工作完成
网站的后续运营
优化篇
WordPress 网站安全设置
速度优化
未经优化的效果
速度优化插件
主要的速度优化任务
谁的 WP 网站慢?
SEO 友好的 WordPress
固定链接
站点地图
Gutenberg 编辑器
更多原生 SEO 友好
SEO 插件
关键词分析与优化
开放收录
数据分析
还在犹豫是否要建站?预算是否足以购买建站服务?自身能力是否适合自学?建站程序选 WordPress 还是 SaaS?写给外贸人看的建站指南(实战篇)根据外贸业务的实际发展阶段、外贸人在团队中的角色定位给出了实用建议。
第一部分:技术篇(启动网站)
本教程搭建的是适合 B2B 业务的展示型网站,稍加调整也可以做成询盘型网站,适合开展 B2B 业务的外贸工厂、贸易公司、外贸 SOHO。
资源费用清单
Hostinger 主机,月租 3.99 USD,赠送域名一年。
付费插件 Elementor Pro,官方原价 84 USD/年,我司代理价 120 元/年。
来自专业建站服务商的分享:不管是模板建站还是定制建站,B2B 网站不需要付费主题——那是 C 端零售网站用的。如果没有定制预算,也不想从空白状态开始,可以考虑选购一套 Elementor 模板。
购买 Hostinger 主机
主机(也叫服务器)是安装 WordPress 的设备。就像手机是安装微信的设备,电脑是安装 Office 的设备。一般来说,预算越充足,能买到的设备性能越好。但是部分主机服务商为了吸引新客户,会放出一些特别优惠的价格。
选择 Hostinger 套餐
本文推荐使用 Hostinger Unlimited 主机,月租 2.79~3.99 USD,赠送一个域名。购买时长可选 12/24/48 个月,时间越长,月租越低。
Hostinger 主机套餐选择
Premium 套餐适合个人练习用 ,实测不装任何插件也容易卡住(刷新可恢复),不适合用于商业部署。
Ecommerce Startup 套餐适合要安装 WooCommerce 或者计划做 SEO、SEM 引流的网站(流量更多)。
选择域名
在通信网络里,你先要有电话号码,然后别人才能给你打电话。在互联网上,网站先要有域名,然后访客和搜索引擎才能通过域名进入你的网站。
Hostinger 随主机套餐赠送一个域名,第一年免费,可以在未注册的域名中任意选择。外贸网站推荐 .com 域名,可以使用品牌名或公司名,尽量简短好记。注意:大多数拼音对老外来说并不好记,可以用英文单词。
Hostinger 赠送一年域名操作方法
注册 Hostinger 账号
选好套餐和域名,点击 Continue 到达注册页面。
输入邮箱地址 – 设置密码 – 同意协议 – 点击注册按钮。记录好邮箱地址和密码,以后登录 Hostinger 平台要用。
也可以用 Google 账号或 Github 账号直接登录。
完善基础信息(地区)
注册后进入地址设置环节,确认国家是 China,然后点击下一步。
如果用中国的网络环境注册,国家默认就是 China,后续付款方式可以选择支付宝,而且不会加税费。
如果通过海外线路访问,国家的默认值可能是其它地区,不会出现支付宝选项,欧洲地区还会额外加税费。
注意:海外主机无需实名认证,不审核个人信息。名字等信息仅 Hostinger 后台可见,可填可不填、可真可假。
Hostinger 注册方法
Hostinger 地区与基础信息设置
选择付款方式
在付款方式中选择支付宝。
出现提示窗口,点击按钮确认。(信息要点:原价是欧元,可能存在手续费,到账最迟需要 24 小时)。
出现付款码,拿出支付宝扫一扫。一般是即时到账,有时会慢一些,可以留意支付宝的扣费信息。
Hostinger 付款方式选择页面
Hostinger 如何使用支付宝付款
Hostinger 支付宝扫码付款
在 Hostinger 创建网站
付款成功后,Hostinger 会自动跳转 Hpanel 并弹出建站指引,跟随指引可以快速创建 WordPress 网站。
新手指引
在建站和迁移之间,选择创建新网站 Create a Website。
在多种建站程序之间,选择 WordPress。
设置 WP 网站的站点语言、管理员邮箱和密码。管理员邮箱可以沿用 Hostinger 注册邮箱,也可以修改。
在多种创建 WordPress 网站的方式之间,选择空白网站 Create blank site。
选择网站域名。可以在下拉列表中选择 Hostinger 赠送的域名,也可以输入在其它平台购买的域名。
选择机房位置。离目标客户越近越好,服务全球客户的网站,推荐美国节点(全球数据中心)。
等待约 1 分钟,WordPress 安装就完成了,会自动跳转到 WordPress 后台。
至此,WordPress 搭建的基本流程已经走通,接下来做基础配置。
Hostinger 创建新网站 Creat a Website
Hostinger 创建 WordPress网站
Hostinger 输入管理员邮箱和密码
Hostinger 从空白网站开始
Hostinger 网站绑定域名
Hostinger 网站选择机房 离客户越近越好
Hostinger 网站等待建站程序运行 什么都不用做
Hostinger 网站建成成功,自动打开 WordPress 后台
意外处理
如果付款不是即时到账,没有自动跳转到 Hpanal,可以通过这个链接进入:Hostinger Hpanel 入口。
如果点错选项,没能成功创建 WP 网站,新手指引又消失了,可以从面板左侧的 Websites 菜单开始建站。
Website 界面也可以检查付款是否成功:付款成功出现安装网站选项,反之出现 Get websites plan 选项。
付款失败通常是触发了支付宝风控,登录支付宝手动确认付款即可。扫码支付时,手机尽量别挂梯子。
Hostinger 建站入口 - 如果错过了新手指导怎么办?
WordPress 基础设置
用户语言
先进入 User 菜单,编辑用户信息,把语言切换为简体中文,拉到页底,点击 Update Profile 按钮。
此设置只影响单个用户在 WordPress 后台看到的语言,不影响其它用户的语言,也不影响站点语言。
日常用中文,要查建站资料、看建站视频时可以切换到英文,方便名字对应。
WordPress 用户语言设置
WordPress 如何设置语言为简体中文?
WordPress 如何更新个人资料?
常规设置
入口:左侧菜单 – 设置 – 常规。修改设置后记得保存。
填写站点标题、站点副标题(可省略)、上传站点图标。详细介绍请看:站点信息:LOGO、图标、标题。
如果是英文网站,站点语言保持 English。站点语言和用户语言的详细介绍请看:多语言优化服务指南。
时区选择上海(=北京时间)。服务单一国家的 C 端网站,可以选择客户所在时区,方便客户看时间。
日期和时间格式可以自定义,也可以保持默认,通常按英式标准选择【日/月/年】格式。
Wordpress 设置站点标题、副标题、图标、语言
Wordpress 站点语言保持英文,修改日期与时间格式
阅读设置
入口:设置 – 阅读。
归档页面(即聚合页)文章数量建议设置为 12。比默认值 10 更合适,版式排列可以是 3×4 或者 4×3。
勾选【建议搜索引擎不索引本站点】。
保存更改。
在网站尚未建成的阶段,对搜索引擎不可见非常重要!!!如果网站还没建好,搜索引擎就看到了,会判定网站是半成品、质量低、重复内容(Hello World 等演示素材,成千上万站点都在用),糟糕的第一印象会拖累后续正式内容的收录与 SEO 表现。
在网站建成,正式上线时,取消勾选此项,搜索引擎就可以正常收录网站了。
WordPress 阅读设置 - 建议搜索引擎不索引本站点。
创建产品分类
设置入口:左侧菜单 – 文章 – 分类目录。
创建 Posts 和 Products 两个一级分类。
输入二级产品分类的分类名,父级分类选择 Products ,点击【添加分类】按钮。
用类似的方法创建其它二级分类、三级分类。分类的数量不限、层级不限。
Wordpress 创建二级菜单
注意:这里用 WordPress 内置的 Post 功能展示产品,不需要额外的插件,对服务器的性能要求也最低。此方案与 WooCommerce、ACF 方案的优缺点对比请看 WordPress 如何实现产品展示?
Hello Elementor 主题
Hello Elementor 是最轻量的 WordPress 主题,安装量已经连续多年排名第一,配合 Elementor 页面编辑器使用,可以快速搭建 WordPress 外贸网站。
安装主题
入口:左侧菜单 – 外观 – 安装主题
按热门程度排序,找到排名第一的 Hello Elementor 主题,安装并启用。
点击旧主题的【主题详情】 – 删除旧主题。为避免冲突,每个网站只留下使用中的主题(一个)。
注意:使用中的主题无法删除。
Wordpress 如何安装主题?
Wordpress 如何安装 Hello Elementor 主题?
Wordpress 如何启用 Hello Elementor 主题?
Wordpress 如何查看主题详情?
Wordpress 如何删除不需要的主题?
上传 LOGO
点击 Hello Elementor 主题的【自定义】按钮。
在站点身份中上传品牌 LOGO 并发布。
返回上一级。
Hello Elementor 主题的使用方法 - 自定义
Hello Elementor 主题的使用方法 - 站点身份
Hello Elementor 主题的使用方法 - 返回上一级
设置菜单
进入【菜单】,创建新菜单,起一个名字,勾选菜单要用到哪里,点击下一步。
在菜单中添加项目。可以搜索,可以在已有页面、文章、分类、标签中选择,可以直接新建页面、文章。
创建并添加 Home、About、Contact 三个基础页面,展开分类目录,把文章分类和产品分类也添加到菜单。
长按 Product Catalog 1,拖拽放到 Products 下级,发布菜单。
Hello, elementor 的菜单设置
Hello Elementor 主题的使用方法 - 创建新菜单
用 Hello Elementor 创建导航栏菜单
Hello Elementor 主题如何添加页面
Hello Elementor 主题拖拽调整菜单层级
绑定首页
进入【主页设置】——选择【一个静态页面】—— 从下拉列表中选择刚刚创建的 Home 页面 ——发布。
Hello, elementor 的主页设置 - 绑定首页
Hello, elementor 的主页设置 - 选择 Home 并发布
Elementor 编辑器
使用 Hello Elementor 主题后,会自动出现 Elementor 推荐横幅,点击按钮可直接安装 Elementor。
也可使用插件标准安装路径:左侧菜单 – 插件 – 安装插件 – 搜索插件名称 – 立即安装 – 启用。
跳过 Elementor 的新手引导,点击 3 次 Skip 后,自动打开用 Elementor 编辑页面的窗口。
点击左上角 Elementor 图标,选择【退出到 WordPress】,回到 WordPress 后台。
安装 Elementor 页面编辑器的两种方法
跳过 Elementor 设置引导 1
跳过 Elementor 设置引导 2
跳过 Elementor 设置引导 3
从 Elementor 页面编辑器退回 WordPress 后台
Elementor Pro 网页设计必备
Elementor Pro 是 Elementor 页面编辑器的专业版(付费版),购买后可以解锁 Elementor 的全部功能,是 WordPress 网站样式设计的必备插件。相比免费版,Elementor Pro 提供 Theme Builder、动态标签、表单、弹窗等高级功能。
在展示型网站中,Elementor Pro 用于制作首页大图轮播、并提供主题编辑器、动态标签等功能。
在询盘型网站中,Elementor Pro 用于制作询盘按钮、询盘表单、询盘弹窗、悬浮的联系按钮等询盘元素。
付费插件标准安装路径:左侧菜单 – 插件 – 安装插件 – 上传插件 – 选择文件,从本地上传压缩包 – 安装激活。
安装包可以从 Elementor 官网获取(84 USD/年),也可以在我这里开通 Elementor Pro 授权(120元/年)。
Elementor Pro(专业版/付费版)上传入口
第二部分:设计篇
在设计工作开始之前,建议先阅读建站素材准备,提前准备好网站要用到的图片、视频、文案,以提高建站效率。
本文必备资源只有建站主机 + Elementor Pro,其它资源和服务是可选的:
购买了模板建站或定制建站——专心准备素材即可,设计任务交给我。
购买了模板资源或主题资源——先获取资源,阅读官方的说明文档,把模板/主题装上,再继续阅读本文。
导入模板
WordPress 后台 – 左侧菜单 Elementor – Editor – Tools – Website Templates 选项卡 – Import
上传我提前准备好的 Elementor 模板压缩包:Simple-Website-for-Demo.zip
勾选全部 – Import and apply – 关闭窗口。(注意,此方法仅适合新站点,网站已有内容可能会被覆盖。)
Elementor Pro 整站模板导入的菜单入口
Elementor Pro 整站模板导入方法
Elementor Pro 模板导入成功
主题构建器 Theme Builder
进入 Theme Builder,从上往下编辑。比本教程更详细的操作方法,请看 Elementor 编辑器的基本操作。
Elementor Pro Theme Builder 主题构建器菜单入口
Theme Builder 逐个创建 Site Part
Header
先在左侧列表中选中 Header,然后点击编辑。
Header 一共有 3 个元素,分别是 LOGO、菜单、按钮,先在画布上选中元素(有粉框),然后在左侧修改。
左侧修改面板会写明当前选中的元素,有三个选项卡:内容、样式、高级设置,通常只需要修改内容。
LOGO 可以改选图片,菜单可以修改数据源,按钮可以绑定电话、邮箱、询盘表单或联系我们页面。
修改完成点击右上【发布】,然后点击左上 E 图标,回到 Theme Builder
Elementor Pro Theme Builder 主题构建器 顶部导航栏编辑入口
Elementor 如何替换站点图标?
Elementor Pro 如何打开 Theme Builder?
Footer
用类似的方法编辑 Footer。画布上选中 – 左侧面板修改 – 改完发布 – 点击 E 图标回到 Theme Builder 面板。
底部有两组图标列表,每个列表项可以单独设置文本和链接,B2B 网站常见搭配是一组菜单、一组产品。
Elementor Pro Theme Builder 编辑页脚入口
Elementor Pro 如何编辑页脚列表项?
Single Post 文章详情页
Post Content 中的内容绑定了动态数据,不用改。只需要修改 CTA 版块(所有文章详情页 CTA 相同)。
可以修改标题、描述 、表单、图片。在画布上选中图片,在左侧面板点击图片,可以选择新图片。
发布时会出现弹窗,可以选择模板的应用范围:文章分类 Posts。
Elementor Pro Theme Builder Single Post 编辑入口
Elementor 如何编辑首页?替换占位图片
文章详情页模板应用于文章分类
Single Product 产品详情页
用类似的方法编辑 Single Product,前两个版块绑定动态数据,无需修改,只需要修改后面三个固定版块。
FAQ 版块由两个【切换】组件构成,每个组件包含多组问答,先选中,然后在画布或左侧面板中修改。
Social Media 本质是标题+描述+图片组,标题可以换成 Our Factory,图片可以放工厂实拍图。
发布 – 应用于 Products 分类及其子分类。
Elementor Pro Theme Builder 编辑文章详情页(产品)
Elementor Pro 如何写 FAQ?
Elementor Pro 如何实现图片与视频混排?
Elemento Theme Builder 产品详情页模板应用于 Products 分类
Post Archive 文章聚合页
静态数据和动态数据都可以修改。选中 Posts,可以修改样式(皮肤)、列数、总数量、图片相关设置。
静态数据:无论文章分类、文章标签如何变化,显示的内容始终如一。
动态数据:随文章分类、文章标签变化。
发布 – 应用于 Posts 分类及其子分类。
Elementor Pro Theme Builder 编辑文章聚合页
Elementor Pro - 选中 Posts 元素
Elementor 主题构建器文章列表页模板应用于 Posts 分类
Product Archive 产品聚合页
静态数据和动态数据都可以修改 – 发布 – 应用于 Products 分类及其子分类。
Elementor 主题构建器产品列表页模板应用于 Products 分类
产品与文章
无论是自己建站还是找服务商建站,产品和文章都是外贸企业自己发表的。如果数量不多,也可以让服务商代劳。
发表文章
入口:WP 后台 – 顶部工具栏 – 新建 – 文章 – 自动打开 Gutenberg 页面编辑器(点击链接查看操作指南)。
标题与正文:文章可以包含多级标题、段落、单图、多图、表格等元素。
文章设置:右侧面板 – 文章选项卡 – 设置特色图片 – 添加摘要 – 选择分类目录 – 发布/保存。
添加摘要、选择分类目录后点击发布。
Wordpress 如何新建文章?
Gutenberg 编辑器如何绑定特色图片、摘要和分类目录(文章)?
上传产品
再新建一篇文章,编辑方法与上述相同,在分类目录中勾选产品分类。展示效果如图。
Gutenberg 编辑器如何绑定特色图片、摘要和分类目录(产品)?
理解原理
Gutenberg 编辑器提供了主图、摘要、详情、分类的输入窗口,发布/保存时,数据存入数据库。Elementor Theme Builder 通过动态数据读取,数据的具体内容可以灵活处理:
主图:一张图片。可以是文章主图,也可以是产品主图。
摘要:一段文字。可以是文章摘要,也可以是产品简要描述。
详情:多种内容组合。可以是文章内容,也可以是产品详细描述。
分类:可以是文章分类,也可以是产品分类,不同分类应用的模板不同。
另一种编辑器:Elementor
新建的 Post 默认使用 Gutenberg 编辑器,打开后可以改用 Elementor 编辑器,样式设计更灵活。
主图、摘要、详情、分类的输入窗口:先点击 Elementor 工具栏的页面图标,逐项设置后发布。
Gutenberg 编辑的所有内容,自动合并为一个文本编辑器。
点击 Elementor 工具栏的 + 图标,可以添加其它元素。
用 Elementor 编辑的内容,在后台列表中会出现两个编辑选项:编辑、使用 Elementor 编辑。
怎么从 Gutenberg 编辑器转向 Elementor 编辑器?
Elementor 编辑器如何填写标题、摘要、特色图片?
古腾堡编辑器转 Elementor 编辑器效果如何?
一篇文章,两种编辑方式:Wordpress 古腾堡编辑器与 Elementor 编辑器
局限性
由于本质上是 Post,不可能加入购物车。不过,可以文本形式(不是数值,无法计算)显示价格。
WordPress Post 原生只有一张主图,没有 Product Gallery(产品画廊)。不过,详情里可以放多张图片。
产品和文章共用 Post,适合产品少或者文章少的网站,如果产品和文章都很多,还是分开管理更合适。
如果你的产品需要收藏夹、购物车、价格计算、产品画廊等电商功能,就需要改用 WooCommerce 方案。三种产品展示方案(Post、WooCommerce、ACF)的优缺点对比请看:WordPress 如何实现产品展示?
对绝大多数外贸 B2B 网站来说,产品只需要展示参数、应用场景、认证信息,并引导客户发询盘,Post 方案完全够用,这也是本教程推荐它的原因。
Post 方案展示产品没有电商常见的 Product Gallery 效果
补充分类目录描述
左侧菜单文章 – 分类目录 – 逐个分类目录点击【编辑】,把描述补上,点击更新按钮。
分类目录编辑入口
为分类目录添加描述
效果展示
文章详情页效果展示文章详情面
产品详情页效果展示产品详情页
文章列表页效果展示文章聚合页
产品列表页效果展示产品聚合页
固定页面
和频繁更新的产品、文章不同,页面在建站初期设计好,后期很少改动。典型页面:首页、关于我们、联系我们。
页面上除了标题、段落、图片,还包含一些特殊模块,设置步骤较多且各不相同。由于只在建站初期用一次,特意去学有点浪费时间,如果购买了建站服务,为了降低学习曲线,我们会直接帮忙部署好。
对于外贸团队来说,由于操作频率太低,学会了也很容易忘记,反而容易因操作失误带来各种问题。
Home 首页
点击顶部工具栏最左侧的 WP 图标,随时可以返回 WordPress 后台。
左侧菜单 – 页面 – 在 Home 下点击【使用 Elementor 编辑】,可以用 Elementor 编辑首页。
使用方法与编辑 Theme Builder 模板的相同,在画布上选中元素,然后修改内容,最后点击右上发布。
把页面上的标题、段落、图片换成自己的。
如何用 Elementor 编辑首页?
Elementor 使用方法 - 在画布上选中,在左侧编辑
About 关于我们
修改方法与 Home 相同,除了在左侧面板中修改。标题、段落的内容,也可以直接在画布中修改。
可以设置入场动作(让网站动起来):选中元素 – 高级设置 – 动作效果 – 进入动画 – 从下拉列表中选择效果。
Elementor 中的每个元素都可以设置入场动作,只是它会增加 JS 代码,影响加载速度,很多网站默认不启用。
Elementor 页面编辑器 - 如何在画布中修改标题?
Elementor Pro - 如何让网站元素动起来?
Contact 联系我们
详细介绍请看建站服务 FAQ 下的:联系我们(含表单、社媒、地图)。
谷歌地图:输入位置,谷歌地图会自动定位,访客可直接在该页面上放大、缩小地图。
联系表单:不同的表单可以用名字加以区分;可以指定要收集哪些信息;可以删除不需要的信息。
表单信息:访客提交邮件订阅、联系表单、询盘表单信息后,在后台 Elementor – Submission 中查看。
Elementor Pro - 如何绑定谷歌地图?
Elementor Pro - 如何修改表单的内容与样式?
Elementor Pro - 访客提交的表单信息在哪里查看?
网站设计工作完成
以上就是 WordPress 网站的全部设计工作,可以看到,绝大多数设计工作由 Elementor 完成,还要用到其专业版的 Theme Builder 和动态数据等功能,所以必须要有 Elementor Pro。
如果购买建站服务,Theme Builder 和固定页面的设计工作由我完成,我还会上传少量的产品和文章以确认样式。
模板建站的设计来源于模板(通常比我这个空白线框模板更精美),导入就能用,交付速度快,费用也低。
定制建站的设计是逐个组件放入并调整的,需要熟悉每个组件的操作,而且是一对一定制,交付时间更长。
了解网站设计工作的完整流程后,可以很清晰地知道,模板上的文字、图片都是可以被替换的,所以:
挑选模板或主题资源时,不用过度执着资源上的演示图片和演示文字,多关注结构和配色即可。
模板和主题按行业分类,是为了迎合大众的筛选习惯,一套医疗健康模板,换掉图文,也可以是光伏网站。
如果展示产品的方案不是本教程演示的 Post,而是 WooCommerce 或 ACF,设计工作的流程会有细微差异。
网站的后续运营
外贸企业日常上传产品、发表文章,大多只需要用到 WordPress 内置的 Gutenberg 编辑器,它的操作非常简单,资料齐全的情况下,复制粘贴内容,拖拽上传图片即可。这项工作需要外贸企业自行完成,我不提供代传服务。
一方面,每个网站需要上传的文章和产品数量不同,不好打包进服务费里。
一方面,很多外贸企业缺失的不是上传这个操作,而是只有一堆未经整理的散乱资料,根本无法直接上传。
在真实的外贸业务中,内容创作、资料整理会占用大量的时间。特别是内容创作,外贸人在询盘对接、沟通谈判的过程中,对客户、市场的认知会逐渐加深,内容也需要随之持续精进,文案、图片、视频等内容都需要反复打磨,而这些核心任务是很难依靠外力的。
找我建站的外贸人,很多自己也会建站,只是为了守住核心业务,选择把建站这项标准化工作外包。
第三部分:优化篇
网站设计好之后,交给外贸企业上传产品、发表文章,后续还有网站安全、速度优化、SEO 优化等相关工作。
WordPress 网站安全设置
WordPress 网站安全是外贸 B2B 网站运营的底线,一旦被入侵,客户数据和询盘信息都可能泄露。爆破流程:找到后台入口 – 输入用户名/邮箱 – 密码爆破。我们可以沿着爆破链路层层设防。
安装安全插件
WordPress 后台面板 – 左侧菜单插件 – 安装插件 – 搜索 ASE – 安装并启用插件。
Wordpress 网站安全设置 - 搜索安装安全插件 ASE
安全设置
入口:左侧菜单插件 – 已安装插件 – 点击 Admin and Site Enhancements (ASE) 下的设置。
Wordpress 网站安全设置 - ASE 设置入口
修改登录入口
WordPress 默认的登录入口是 /wp-admin,/wp-login.php 等,更换入口可以过滤掉绝大部分自动化扫描。注意:
修改的同时要做好记录,否则自己也进不去。
如果忘了入口,可以在服务器后台禁用插件,恢复默认登录入口。
ASE 设置方法:进入 Log In/Out | Register,开启更改登录 URL,修改网站后台入口,保存更改。
Wordpress 网站安全设置 - 更改登录 URL(关闭默认入口)
限制密码尝试次数
攻击者找到后台入口后,还要输入用户名和密码,通常需要尝试很多次才能猜中,可以用 ASE 限制尝试登录次数。另外,不要使用 Admin、User 等常见的用户名。
ASE 设置方法:进入安全,开启限制登录尝试次数,保存设置。密码失败次数超过限制时,会自动锁定账号。
Wordpress 网站安全设置 - 限制登录尝试次数
其它安全保护
WordPress 自带强密码机制,就算沿用 /wp-admin 入口 + Admin 用户名,基础安全性也尚可。
插件的作用是叠加防护,如果登录信息泄露,所有防护都会失效,日常要注意保密和各平台密码独立。
如果想要更高的安全等级,也有一些安全插件可以开启二次验证,每次登录需要邮箱或短信验证码。
WordPress 速度优化
未经优化的效果
按照本教程搭建的网站,只用到一款设计插件 Elementor 和一款安全插件 ASE,网站本来就是轻量化的,这是未做任何速度优化的谷歌测速结果:
Wordpress 网站速度优化桌面端效果 - 轻量化的网站无需刻意优化也很快
Wordpress 网站速度优化移动端效果 - 轻量化的网站无需刻意优化也很快
速度优化插件
Hostinger 服务器提供配套的速度优化插件 LiteSpeed Cache,它可以调整各类资源的加载顺序,还可以合并、压缩代码,但经常只利好桌面端,评分拉高到 99~100;移动端评分往往不升反降。有两个原因:
代码合并压缩后,桌面端加载速度更快,但是移动端加载大文件压力大,速度反而会变慢。
Google Page Insight 的移动端测试,模拟的是低性能手机在弱网络环境下的访问。
Wordpress 网站速度优化 - 代码合并把桌面端速度评分拉满
Wordpress 网站速度优化 - 代码合并对手机端的负面效果
这时候要根据实际情况取舍:
如果目标客户主要通过有线网络,在电脑上打开网站,可以牺牲移动端速度,把桌面端性能拉满。
如果目标客户主要通过无线网站,在移动端访问网站,就要卸载速度优化插件,或者选择不合并代码。
如果没有选择 Hostinger 等 WordPress 专用主机,或者主机配套的速度优化插件不给力,可以用 WP Rocket 替代。WP Rocket 是口碑最好的 WordPress 缓存插件之一,以设置简单出名,启动后能自动开始工作,对 WordPress 网站加速效果显著。
主要的速度优化任务
外贸企业的主要任务是处理好上传到网站的内容:
视频的文件体积最大,建议托管到 Youbute,再用 Elementor 的视频组件嵌入,延伸阅读:视频处理。
图片要压缩再上传,延伸阅读:图片处理:尺寸、命名、压缩、WebP 图片在外贸 B2B 网站中的应用。
谁的 WordPress 网站慢?
互联网上吐槽 WordPress 速度慢的,大多是练习生,买最便宜的服务器,装最多的插件,有的插件功能重复,还会互相打架,这种无论怎么优化,速度都快不起来。就像用 500 元的手机玩游戏,装再多的加速器也还是卡顿。
还有一些选择了复杂主题导致速度慢的。实践证明,展示型、询盘型的网站,用 Hello Elementor 这款最轻量化的主题就可以搭建,并不需要复杂主题。
SEO 友好的 WordPress
WordPress 本身就是 SEO 友好的建站程序,除了前面基础设置中提到的搜索引擎可见性开关,还自带以下功能。
固定链接
页面 URL 包含相关关键词有利于 SEO。WordPress 自带文章名格式的固定链接选项,开启后,新文章会根据标题自动生成链接。这是 WordPress SEO 的基础操作之一,建议在建站初期就设置好,固定链接结构一旦确定,后期修改会影响已有收录。
设置方法:WP 后台左侧菜单 – 设置 – 固定链接 – 固定链接结构选择文章名 – 保存更改。
使用方法:日常发布文章时,在标题中包含相关关键词,文章的 URL 也会自动包含该关键词。
SEO 友好的 WordPress - 在 URL 中包含文章名
站点地图
自动生成、自动更新 XML 站点地图,可通过 Google Search Console 等平台,主动提交给搜索引擎收录,以便搜索引擎高效地发现站内页面,爬取效率更高。默认地址 /wp-sitemap.xml,包含文章、页面、分类、标签、用户。
Wordpress 自动生成的站点地图
Gutenberg 编辑器
页面和文章标题自动标记为 title,并提供特色图片、摘要、别名 Slug、分类、标签的可视化录入窗口。
自动记录发布时间和修改时间,可以输出到页面,搜索引擎喜欢新鲜内容。
在编辑面板中,大纲选项卡下,清晰显示标题的层级关系、字数、阅读时间,可辅助内容创作。
SEO 友好的 WordPress - 标题层级清晰的 Gutenberg 编辑器
图片替代文本
WordPress 菜单 – 媒体 – 媒体库 – 选择图片 – 查看附件详情 – 可以直接编辑替代文本(ALT)。
搜索引擎无法看懂图片内容,给图片添加替代文本可以:
帮助搜索引擎理解图片表达的信息。
让图片参与图片搜索排名,可以在谷歌图片搜索中获得曝光机会。
丰富页面主题关键词信号,提升页面 SEO 效果。
Wordpress 为图片添加 ALT 文本的入口
如何通过 WordPress 媒体库修改图片替代 文本?
更多原生 SEO 友好
分类可以设置特色图片和描述,标签可以设置描述,图片可以设置替代文本(ALT)。
对密码保护文章、搜索页、空归档页默认输出合适的 noindex 标记,无需手动标记。
自动创建 robots.txt,默认路径 /robots.txt,禁止搜索引擎抓取后台、禁止抓取部分敏感内容。
内置重定向。如果访问带多余参数、大小写错误、斜杠不对的 URL,WP 会自动 301 跳转到标准规范 URL。
SEO 友好的 WordPress - 支持手动修改 slug
SEO 友好的 WordPress - 支持手动修改 slug
WordPress SEO 插件
安装入口:WordPress 后台 – 左侧菜单插件 – 安装插件 – 搜索 SEO – 立即安装 – 启用。
Wordpress 插件库中,三款安装量过百万的 SEO 插件
WordPress 插件库中,提供三款活跃安装量超过百万的 SEO 插件:Yoast SEO、Rank Math SEO、All in One SEO。三款插件都提供站点地图和 meta 信息管理,都能满足 WordPress SEO 的基础需求,任选一款 SEO 插件安装即可。
我最推荐的是 Rank Math SEO,它免费提供重定向管理和 404 监控功能,可以为外贸网站省下买 SEO 插件的钱。基础设置教程请看:Rank Math SEO 新手指南。如果担心设置出错,或者想了解更高级的用法,可以选购 SEO 技术支持。
注意:不要把三款都装上,不是 SEO 插件越多 SEO 效果越好,反而会互相打架。
关键词分析与优化
用户在搜索引擎搜索,从输入关键词开始。所以 SEO 优化最重要的基础工作之一,就是研究用户会用哪些词搜索,还要分析各种关键词的搜索意图,再把合适的词布局到自己的网站上。
对 WordPress B2B 网站来说,关键词研究要围绕”产品词 + 应用场景词 + 采购意图词”展开,常见的采购词有 supplier、manufacturer、wholesale 等等。
基础的关键词收集请看:Google Keyword Planner 注册与使用方法。
分析用户搜索意图请看:关键词与用户搜索意图。
如果想外包一部分工作,也可以考虑 SEO 关键词优化服务,把正文以外的 SEO 关键词相关的任务交给我。
关键词优化在上传所有产品和文章后展开,是在网站已有内容(给真实访客看)的基础上,往搜索引擎(机器)喜欢的标准调整。SEO 优化中的撰写 SEO 标题和描述、页内优化、站内优化,本质上都是应用关键词分析的结果。
SEO、GEO、AEO 三种优化的重合度很高——都是机器在尽可能地拟合人类的信息需求,但又始终有所区别。
开放收录
还记得刚创建网站时,我们在 WordPress 设置 – 阅读设置中,勾选了【建议搜索引擎不索引本站点】吗?当时网站未建成,不希望搜索引擎来访,现在网站建成,内容完整,是时候开放了。
操作方法:WP 后台左侧菜单 – 设置 – 阅读 – 取消勾选【建议搜索引擎不索引本站点】 – 保存更改。
设置生效后,搜索引擎等机器人/爬虫就可以正常访问和收录我们的网站了,也可以在 Google Search Console 提交 sitemap,加快 Google 收录进度。
网站上线前,在阅读设置中开放收录
数据分析
主要接入以下两种谷歌服务(包含在 SEO 技术支持服务中):
Google Search Console
可提交 sitemap、查看 Google 收录进度,可查看页面、搜索词的曝光、点击与平均排名。
如何在 Google Search Console 提交站点地图?
Google Analytics(GA4)
谷歌分析,可以统计访客来源、记录用户参与时长、站内交互、转化事件。
Google Analytics(GA4)注册入口
Top comments (0)