WordPress+Woocommerce外贸独立站搭建教程(入门完整版)

WordPress+Woocommerce建站越来越发普及,这两者结合确实能够呈现“1+1=2”的效果,成本低、自主性较强。本文主要介绍WordPress+Woocommerce外贸独立站搭建教程,内容有些长,涵盖了主机购买到网站上线等一系列步骤。

一、购买Hostinger主机

Hostinger提供虚拟主机和WordPress主机,个人推荐购买Hostinger WordPress主机,据说针对WordPress做了特别优化,在网站适应和稳定性方面表现更好,并增添了很多WordPress特定功能,例如WordPress多站点、更新WordPress核心、插件和主题、WordPress AI和自动备份WordPress网站等。

Hostinger WordPress主机目前推出三个方案,建议选择Business方案,如果预算充足的话也可以选择Cloud startup方案,最高支持搭建300个网站和200 GB NVMe存储。现在购买Hostinger WordPress主机也比较优惠,以下价格的同时还加赠3个月免费使用期限。

Hostinger优惠码:ny2021(虚拟主机高达92%折扣,云主机高达63%折扣,VPS主机高达59%折扣,WordPress主机高达75%折扣。)

购买Hostinger主机

方案 存储 流量 建站个数 域名 价格
Premium 100GB SSD 不限 100个 赠送 21.99元/月
Business 200GB NVMe 不限 100个 赠送 28.99元/月
Cloud Startup 200GB NVMe 不限 300个 赠送 56.99元/月

  《点击进入Hostinger官网购买

Hostinger WordPress主机购买教程:

选择需要购买的Hostinger WordPress主机方案,我这里选择的是Business方案,购买48个月每月仅需28.99元,还加赠三个月免费期限,还是比较划算的。

Hostinger WordPress主机购买教程

然后用邮箱创建账号,已经有账号的话直接登入即可。

Hostinger WordPress主机购买教程

登入之后选择支付方式,支持的支付方式如下,填好信息、优惠码等即可付款。

Hostinger WordPress主机购买教程

三、域名注册并解析

Hostinger提供对新手非常友好而简洁的导航界面,跟着向导一步一步完成就行。

域名注册并解析

点击Start Now开始,选择之后点击下一步,例如以下新手选项:

  • I am creating a website for Myself
  • It will be an Online Store website
  • And I am creating my first website, 或者这里选择beginner

域名注册并解析

接下来选择WordPress或者WordPress+Woocommerce建站方式,会安装一些插件。

域名注册并解析

如何是从别的主机商迁移到Hostinger的话,你可以使用免费的migrate my website工具。选择好建站方式往下:设置WordPress的登录账号和密码,这里要记住了,之后每次登录WordPress的时候都会用得到。

建议选择WordPress就好了,虽然截图不是,后面Woocommerce什么的自己在安装就是了。设置好登录邮箱和密码之后,点击继续,接下来的页面是让你选择一个主题,跳过吧,这些主题虽好,暂时还不知道哪款适合你,况且之后也是可以在WordPress后台随意安装的。

接下来开始注册域名,这里有三个选项:

  • 申请免费域名:任何购买Hostinger主机一年以上的用户都可以获得一个免费的.com域名,有效期为一年,之后每年的续费费用为13.99美元。我建议新手选择这个选项,因为这样就无需进行域名解析了;
  • 购买新的域名:如果想托管两个或更多的网站,就需要购买新的域名。当然,对于第一次建站的用户来说,这个选项可能不太适用;
  • 使用已购的域名:如果已经在其他地方购买了域名,比如Gname、Namecheap或Namesilo等便宜的域名商,也可以选择使用这些域名。不过,这样做的话,需要自己将域名解析到Hostinger主机上,虽然可以找客服帮忙,但可能需要一些额外的操作。

域名注册并解析

确定好域名后,下一个步骤是选择主机数据中心。这主要取决于客户群体所在的地理位置。如果全球都有客户,那么选择北美的数据中心就可以了。

点击“Finish setup”后,系统会开始安装WordPress。安装完成后,将看到以下页面:

域名注册并解析

  • Manage WordPress: 通过此链接进入WordPress后台进行管理和设置。实际上,以后无需再通过Hostinger后台进入WordPress管理员后台,只需访问自己的网站后台网址:https://yourdomain.com/wp-admin;
  • View Website: 如果使用的是Hostinger的免费域名,点击此链接可以预览网站。或者,也可以直接在浏览器中输入域名来预览(需先完成域名解析);

域名注册并解析

  • Control panel: 这是主机操作面板,可以在这里查看主机IP、安装WordPress、添加新站点、安装SSL等。

四、安装SSL证书

虽然网站已经搭建好,但还需要设置SSL证书才能开始真正的配置和自定义。要安装SSL证书,需要进入Hostinger控制面板(Control panel),然后在账号后台依次点击顶部菜单的“Websites”,选择要安装证书的网站,并点击旁边的“Dashboard”。

安装SSL证书

在左侧菜单中选择“Security”->“SSL”,然后按照提示操作即可。

安装SSL证书

Hostinger提供免费的SSL证书,可以选择要安装SSL证书的域名,然后点击“Install SSL”。稍后会弹出一个对话框告诉安装成功。此时刷新页面就可以看到SSL证书已经变为绿色并显示为“Active”。

安装SSL证书

为了验证证书是否真的安装成功,只需在浏览器中输入域名即可。如果成功的话,会在浏览器地址栏的前面看到一个安全锁图标。

安装SSL证书

ssl

接下来可以进入WordPress后台进行进一步的设置和自定义。

五、安装WordPress主题和插件

主题对于WordPress网站是必不可少的,而建立电商网站时,Woocommerce插件也是必不可少的。此外,还有一些其他插件也是不可或缺的。接下来,我们将介绍如何安装主题和插件。

1、安装主题模板

WordPress安装完成后会自带一些官方主题,例如Twenty Twenty-One(2021/2022),但这些官方主题主要是为博客设计的,不太适合用于建立电商网站,因此我们通常会删除它们。

安装WordPress主题和插件

进入WordPress管理后台后,在左侧菜单栏中点击“Appearance”>“Themes”,你会看到WordPress自带的三个主题。你可以保留一个已激活的主题,因为WordPress至少需要一个主题。等你安装完其他新主题后,可以删除剩下的自带主题。

WordPress的主题可以分为两类:免费和付费。免费主题可以直接从WordPress后台的“Themes”中下载安装。点击“Add New”后,会有成千上万的主题供你选择。对于新手来说,这里推荐几个优秀的免费主题,包括Astra、GeneratePress、Kadence等,可以直接点击安装并激活。

你也可以在WordPress.org官网找到这些主题。这些主题中有一部分是完全免费的,而大部分是免费+付费共存的模式,即免费版提供基本功能,如果需要更多功能则需要升级到付费版。

我自己使用的是Kadence主题,它是一款免费+付费的主题。这类主题的特点包括:

安装WordPress主题和插件

  • 因为有免费版,所以非常适合新手开始使用。在不确定哪个主题合适的时候,可以随意安装和卸载,不浪费成本;
  • 由专业的建站公司开发,代码简洁,大都是基于WordPress源码开发,SEO优化良好,网站加载速度快,体积非常小;
  • 可扩展性和自定义性强,基于Gutenberg或Elementor编辑器。这类主题都有很多现成的区块,这些区块只是页面某部分的一个模板,你可以任意修改和添加内容。

商城付费主题与前面提到的免费+付费共存的付费主题有所不同。前方提到的都是一些专业的开发团队开发的主题,而商城的主题大部分是个人或一两个人开发的主题。

WordPress主题商城有很多,但比较有名的如下:

Themeforest:最大的主题商城,几乎囊括了所有建站方式的主题,包括所有类型的网站模板,价格合理,一次性付费,终身免费更新。

Themeforest官网:https://themeforest.net/

以Kadence为例安装主题:

安装主题没有什么特别的技巧。在WordPress后台直接选择点击“Install”然后激活即可。如果在其他平台购买的主题,需要先下载下来,然后在“Themes”里面点击“Upload Theme”上传并激活。

以Kadence为例,在“Add Themes”中搜索Kadence并安装第一个最新的主题。点击安装并激活后,系统会提示你安装“Kadence Starter Templates”插件。根据提示安装所需的插件即可。

安装WordPress主题和插件

这个Starter Templates插件包含了二十多个整站设计模板,除了首页外还包括其他一些页面设计,如About、Contact等。你可以选择一合适的模板进行修改内容或者不选择模板甚至不安装插件自行设计网站。也就是说一个主题可以有无限个网站模板这就是这类主题的强大之处。

如果使用这类主题当然还是安装这个插件更好就算不用这里面的模板你可以参考对吧。Kadence还算现成模板比较少的假如你去看看Astra、Blocksy你会发现上百个都是一些利基模板Kadence也在添加更多的模板中。

一开始Kadence只会要求你安装“Kadence Starter Templates”点击安装左侧菜单“Kadence”下多了一个子菜单点击“Starter Templates”你可以根据他们的AI智能向导一步一步完成并导入模板。

安装WordPress主题和插件

如果不想使用AI智能向导可以选择使用“Classic Starter Templates”根据选择的建站工具不同模板也会不同主要有两个建站工具:

  • Gutenburg Block Editor:国内称古腾堡也就是这里的Block Editor这是WordPress自带的模块建站工具;
  • Elementor:应该算是第三方最强的WordPress建站神器了。

Elementor官网:https://elementor.com/

我选择WordPress自带的Gutenberg主要是因为wordpres的自带以及诸多免费插件包含很多以前需要付费的模块。选择好建站工具后就会跳转到模板页面Kadence的Gutenberg总共提供了9个模板针对不同行业以及不同类型的网站提前制作好的模板你只要选择其中一个导入即可。这里选择Print Shop因为这就是一个电商模板适合我们外贸独立站。

安装WordPress主题和插件

2、导入模板

在古腾堡编辑器的模板库中,你可以找到大约20多个不同风格的模板(数量还在持续增加),其中针对电子商务的模板不多,只有三个,其中一个还是付费的。不过,Print Shop这个模板相当不错,你可以尝试使用。当然,你也可以选择其他模板,然后自行安装Woocommerce插件来搭建电商网站,或者完全自定义设计每一个页面,使你的网站更具个性。

我们以导入Print Shop模板为例。点击该模板后,下一步会让你选择是只导入首页还是整站模板。建议选择整站模板,这样会导入一些预设的页面和必要的插件。此模板需要两个插件支持:Woocommerce和Kadence Block。你还可以选择网站的颜色方案和字体样式。

安装WordPress主题和插件

Kadence Block是一个非常强大的区块库插件,极大地增强了古腾堡编辑器的功能,让你可以轻松地创建个性化页面。如果你的主题没有自带类似的区块库,你可以在插件市场中搜索,会发现有很多其他区块库插件可供选择,不仅限于Kadence Block。

选择好颜色和字体后,点击“Full Site”继续导入流程。系统会提示你即将导入的内容,确认无误后点击继续进行导入,这个过程可能需要一些时间。如果之后你需要Woocommerce而当前模板未包含,可以随时安装。对于外贸独立站来说,Woocommerce插件是必不可少的,否则你无法上架产品。

导入完成后,点击“Finished! View your site”按钮,查看你的网站。此时网站上的内容都是模板预设的,到这里主题的安装基本完成。

3、安装插件

在前面安装主题和导入模板的过程中,我们已经安装了一些必要的插件。你可以在“Plugins”菜单下查看已安装的插件列表。此外,我还推荐你安装一些对网站功能完整性及日后运营至关重要的插件。点击“Add New”,可以通过搜索来安装新插件。

安装WordPress主题和插件

以下是推荐的一些插件:

  • Child Theme子主题插件:在网站设置完成前,为当前激活的主题创建一个子主题;
  • 推荐插件:Child Theme Wizard, WP Child Theme Generator;
  • 加速插件:可以优化网页加载速度;
  • 推荐插件:LiteSpeed Cache(如果你是Hostinger主机用户);
  • SEO插件:帮助提高网页在搜索引擎中的排名和可见度;
  • 推荐插件:RankMath, Yoast SEO, All in One SEO;
  • 社交插件:用于添加社交分享功能和快速登录;
  • 推荐插件:Sassy Social Share,Super Socializer;
  • 表单插件:用于添加邮件订阅表单;
  • 推荐插件:Contact Form 7,wpforms(如果你使用Kadence,则其区块内含此功能,无需额外安装);
  • 安全插件:增加一层额外的安全防护;
  • 推荐插件:Wordfence Security,All In One WP Security & Firewall;
  • GDPR插件:用于确保网站符合GDPR规定;
  • 推荐插件:GDPR Cookie Consent,LuckyWP Cookie Notice。

如果之前未安装Woocommerce,记得现在安装。其他你认为需要的插件也可以自行搜索并安装。安装插件很简单:搜索、点击安装、激活然后配置使用。

六、设置和自定义WordPress网站

这一步可能是建站过程中最耗时的部分,因为你需要根据业务需求定制网站的各种信息和外观。我只能告诉你在哪里进行编辑和修改,但具体实施需要根据你的业务需求来进行。

1、基本设置

从侧边菜单进入“Settings”,在这里你需要进行一些基本的网站设置。

General Settings: 包括网站标题(Title)和副标题(Tagline),根据自己行业和产品填写相应信息。网站标题一旦确定,尽量不要频繁更改。WordPress网址和站点网址最好保持一致,无论是否带有www。其他设置可保持不变;

设置和自定义WordPress网站

  • Writing: 主要涉及文章写作设置,可不作更改;
  • Reading: 设置网站首页和博客首页。底部的“Search Engine visibility”建议先勾选,避免搜索引擎抓取到未完成或低质量的页面,影响网站排名;
  • Discussion: 涉及文章评论设置,可默认不变;
  • Media: 媒体文件设置,保持默认即可;
  • Permalinks: 设置永久链接结构。推荐选择“Custom Structure”后应用“%postname%”或直接点击“Post name”,然后保存;

设置和自定义WordPress网站

  • Privacy: 添加隐私政策页面是必要的,特别是对于面向欧洲市场的网站,GDPR法规要求必须提供隐私政策。
    另外,根据你安装的主题和插件,可能还有其他设置选项出现在这里。例如,Kadence Block的设置也会出现在设置菜单中。记得仔细检查并根据需要进行配置。

2、自定义网站外观和布局

接下来,我们进入网站的外观设置阶段,也被称为前端设置。这部分设置将决定你的网站如何呈现给互联网上的访客。在“外观”选项中,最重要的就是“自定义”设置,它负责整个网站框架的视觉呈现。

设置和自定义WordPress网站

以Kadence主题为例,不同主题的具体设置项可能有所不同,但大体相似。逐项进行设置时通常不会遇到问题。下面是一些主要设置项的功能简介:

请注意,这里不能设置具体页面内容,要设置页面内容请到后台的Page里面找到具体的页面进行设置!

  • General(常规设置):每个主题都有这个设置项,包括网页默认布局、颜色、字体、侧边栏显示、按钮等。根据个人喜好进行调整,并实时查看效果。Breadcrumbs和Performance两项中的选项建议勾选;
  • Header和Footer(页眉和页脚设置):Kadence主题的页眉和页脚设计非常人性化,分为三行,每行都可以自由拖拽添加元素。与其它主题固定的页眉和页脚布局不同,Kadence的footer也可以使用古腾堡区块,让你更自由地建立自己想要的页眉页脚;

设置和自定义WordPress网站

  • Page Layout、Blog Posts和Search Results(页面布局、博客文章和搜索结果):这些分别设置WordPress后台的页面、博客(post)页面和搜索结果页面的布局。进行设置时,最好打开相应的页面对照调整;
  • Site Identity、Homepage Settings(网站标识、首页设置):Site Identity用于添加网站logo和图标,并可设置样式;Homepage Settings类似于常规设置中的阅读设置;
  • Woocommerce(电商设置):这是针对Woocommerce店铺的设置,包括各页面布局,如目录、单一产品页面、结账页面和用户账户页面,可以根据喜好或需求更改;
  • Additional CSS(附加CSS):这是用于更改网站布局和外观的层叠样式表,需要一定的代码知识,可以跳过;
  • Import/export(导入导出):完成所有设置后,可以导出设置保存,以防未来需要重新设置。

3、菜单和小工具

另外还有菜单和小工具(Menus & Widgets),这两项建议单独设置,它们在后台设置中也有单独的选项。

进入“外观”->“菜单”进行设置。菜单是网站导航的重要组成部分,像是一个窗口,引导访问者浏览网站的不同页面和栏目。

设置和自定义WordPress网站

在导入Kadence或其他任何主题后,系统一般会预设几个菜单,你可以直接编辑、添加或删除。通过点击每个页面旁边的小三角进行编辑或删除链接,添加新链接则从左侧的页面中选择然后点击添加到菜单。

菜单中的链接可以随意拖动来改变位置,或拖入二级目录中。每个链接都能单独设置显示名称,比如原页面名为“about”,你可以设置为“about us”等。新建菜单时,点击上图红框中的“Create a new menu”,命名以便未来使用,然后进行编辑。

小工具是WordPress的一个特色功能,通常用来设置侧边栏和页脚,有些主题可能增加其他位置,比如页眉。从WordPress 5.8版本开始,小工具的编辑器与页面编辑器统一,都采用古腾堡编辑器,通过添加block区块来进行编辑。因此,这里不详细介绍小工具的使用,后续会在添加页面部分详细说明。

设置和自定义WordPress网站

对于搭建WordPress外贸独立站,最后一步是对店铺进行设置,包括添加个人信息、付款方式以及物流设置等。这一步主要是关于你经营的一些信息设置,可能在物流设置部分稍显复杂,但有相关教程可以参考。

设置和自定义WordPress网站

网站的设置和自定义工作至此基本完成,WordPress后台还有一些其他设置,如果没有必要,最好不要随意修改。

七、WordPress添加内容

假设搭建网站如同建房子,那么上一步相当于完成了毛坯,这一步则是进行装修并添加家具用品。

1、添加页面

在导入Kadence模板时,系统自动添加了一些相关的页面。根据需要保留或删除这些页面。除Woocommerce自带的页面外,其他页面均可编辑、修改或删除。对于一个外贸网站或外贸独立站网站来说,确实需要添加一些页面以丰富网站内容,让客户更容易了解品牌和产品。

WordPress添加内容

添加新页面时,比如创建一个“关于我们”页面,根据图中编号了解每一项功能:

WordPress添加内容

(1)标题。

(2)添加Block(区块)有两个地方可以添加区块,如图的两个+按钮,根据需要添加所需模块,极大地丰富了网页设计。安装了Kadence后,会安装Kadence Block,实际上还可以到插件市场搜索其他区块插件,但Kadence Block已能满足大部分需求。

(3)对文本的设置,包括更改字体颜色、添加链接、下划线等。

(4)页面设置 包括发布时间、固定链接(permalink)、评论设置等。

(5)页面布局设置 随Kadence主题而来,具体情况取决于实际安装的主题。

(6)Kadence模块设置

(7)对Gutenberg Block这个网页编辑器的设置。

在页面编辑器中还可能出现其他随插件而来的设置项,比如SEO插件设置,这需要根据具体插件来决定。页面内容通常是在创建过程中自动保存的,但在紧急情况下离开前记得手动保存,以免丢失新加入的内容。创建完成后,可以先预览页面,确认无误后发布。

2、上传产品

在导入模板时,Kadence主题也会自动添加一些示例产品。先不要删除这些产品,可以参考它们的布局和设置。当然,在你自己的产品准备就绪后,需要删除这些示例产品,因为它们通常信息不全,且价格仅为示例。

WordPress添加内容

在Woocommerce中,添加新产品的过程相对直观。尽管Woocommerce的产品描述编辑器使用的是WordPress的经典编辑器,但许多WordPress老用户偏爱这种编辑器。如果你习惯于经典编辑器,可以在插件市场中寻找相关插件安装。我个人已经习惯了使用古腾堡编辑器,但在编辑产品描述方面,经典编辑器可能更为便捷且足够使用。以下是添加产品时的主要字段说明:

(1)产品标题

(2)产品数据设置:包括产品类型、价格、库存、运输、相关产品、属性(如颜色、尺寸)等。对于变体产品(Variable products),还可以添加不同颜色或尺寸的产品选项。

(3)Simple product:单一属性的产品,例如单一颜色、尺寸或型号。也可以添加虚拟产品,比如会员资格或数字下载。

Grouped:组合产品,比如一套衣服,可以作为一个组合销售。

External/Affiliate:外部或联盟产品,可以发布产品但链接至其他网站,适合推广自己的产品或通过推广他人产品赚取佣金。

Variable:变体产品,适用于有不同选项的产品,如颜色或尺寸不同的商品。

(4)产品图片:设置主图。

Product Gallery:产品图库,用于添加多张轮播图片。

(5)产品类目与标签:帮助归类和标识产品。

尝试上传一个变体产品作为示例,如上图所示。除了页面和产品内容外,你还可以撰写博客文章来丰富网站内容。WordPress最初是一款博客CMS,利用其强大的博客功能,可以撰写关于产品或行业的文章,这有助于通过搜索引擎吸引访问流量。文章的创建与页面编辑过程相似,都使用Block Editor。

WordPress添加内容

八、发布WordPress独立站

在上传了两到三个产品后,你可以去除后台“设置”中“阅读”选项卡下对搜索引擎的屏蔽,并提交网站到搜索引擎,以便它们抓取你的网页。记得定期更新产品信息。

发布之后,注意以下事项:

  • 避免随意更改网站名称、描述或其它框架性内容;
  • 不要频繁更换主题;
  • 保持页面和产品链接的简洁;
  • 使用SEO插件来优化网站;
  • 经常更新网站内容,每周添加两到三次新内容,可以是新产品或文章。

相关推荐:

外贸人需要掌握的七大技能

外贸在哪个平台做