使用WordPress免费搭建一个简单的外贸网站全过程图示教程(置顶)

WordPress是个开源博客软件，主要用来建博客网站，但是通过WordPress各种主题和插件，我们可以做企业站，内容发布CMS网站，B2C商城网站等等；当然我们也可以用WordPress建外贸网站，本文就将讲述使用WordPress搭建一个简单的外贸网站全过程。

为什么使用WordPress做外贸网站？

做外贸网站，都是为了更好地营销产品，网站外观，页面做得再好，如果没人访问都是白费力气。
WordPress做的网站符合搜索引擎优化的标准，用它可以最大限度的优化推广你的网站; 另外WordPress还有超多的优化插件，如 All in One SEO Pack(可以对网站站内内容进行优化)、Google XML Sitemaps(自动生成sitemap.xml 并提交给Google,Yahoo,Bing等国外主流搜索引擎)；这样你每更新一个产品，一篇文章都可以自动通知Google,Yahoo等，这些都对你网站的优化起到很大的作用，给你网站带来流量，带来订单。WordPress丰富的主题和插件也可以让我们做出多样的，美观大方的网站。

使用WordPress做一个简单外贸网站的实例教程

第一步：使用WordPress在网站空间或者本地电脑安装一个WordPress网站

如果你是在同一个空间商那里购买虚拟主机和域名，如SiteGround主机和域名，那么你可以根据文章《如何使用网站空间的建站功能建WordPress，Zen Cart网站》，使用空间的建站功能1小时快速建站；如果你虚拟主机和域名是分开购买的，那么可以参考文章《快速简单地使用WordPress建一个网站》按步骤在空间建站。

第二步：为安装好的WordPress网站安装做外贸网站所需的主题和插件

使用WordPress做外贸网站，主要有2个方法：方法一： 就是安装一个外贸网站主题（带产品列表功能），目前国内的外贸网站主题不是很多，而且有些收费也不便宜，国外适合用来做外贸网站的主题可以使用一些Business主题，但是他们的产品列表估计不适合产品比较多的外贸网站，而且这类主题也比较难找,这个方法做外贸站可以看文章《一个简洁易用的WordPress企业网站主题1天建外贸网站教程(置顶)》；方法二：就是借助一些支持WooCommerce的主题，然后加上WooCommerce 及相关电子商务插件来做外贸网站（有同学说这个方法是不是只能做在线B2C网店？其实不是，只要我们在输入产品资料的时候不输入产品价格，那么也就是单纯的展示商品的网站），这个方法相对简单点，主题和插件也好找，而且免费，适合要节约预算的外贸新手，这个方法还有一个好处就是有很多功能插件是基于Woocommerce来做的，这样我们可以给予网站更多强大的功能；如果主题和插件运用得当，也可以做出不错的效果来，本文就是根据这个方法来做外贸网站。在本例，我使用的主题与插件如下：

1. 主题：Vantage，免费主题，百度云盘下载地址（也可在WordPress网站后台可以搜索安装）;  如何安装主题可以参照文章《WordPress的主题与插件的安装使用》；
2. 插件：WooCommerce, Page Builder by SiteOrigin，Contact Form 7 , Meta Slider ,Product Enquiry for WooCommerce ,YITH Woocommerce Compare,WooCommerce Products Per Page;如何安装插件请参考文章《WordPress的主题与插件的安装使用》；

第三步：为外贸网站添加About Us, Contact Us, FAQs, Products ,Blog等页面

如何WordPress建外贸网站增加页面，文章，产品及类别，请看文章《WordPress添加页面，写文章，增加文章类别，增加产品和产品类别》

1. 通过Pages->Add New 添加About Us 页面 ，并为About Us添加预先准备好的企业介绍资料；
2. 通过Pages->Add New ,建一个Products页面，不用填写内容，然后使该Products页面与WooCommerce 的Products列表功能关联起来。关联的方法是：通过左侧菜单中WooCommerce->Setting->Products标签下,Product Archive / Shop Page选择Products页面；关联后再点击Products页面则会显示全部产品列表；(WooCommerce改版后，指定产品页面需要在WooCommerce->Setting->Products->Display标签下了);
3. 通过Pages->Add New 增加Contact Us页面: 插件Contact Form 7安装后，在该插件设置页面（在左侧功能菜单有个Contact链接)新建一个Contact Form(联系表单),填写该Contact Form的邮箱等信息，保存，然后复制其代码(shortcode)；然后在新建的Contact Us 页面填写公司联系信息，并粘贴刚在插件Contact Form 7中建立的联系表单的代码(shortcode)，如下图：（注：Contact Form 7 涉及到邮件发送，所以要求你的主机空间支持 mail() 函数，或者配合SMTP插件来使用。）
4. 通过Pages->Add New 增加FAQs页面，填写FAQs的各个问题与回答；
5. 通过Pages->Add New 增加一个Blog页面，并选择这个页面的模板（Template)为Blog Template,内容留空白；这是为网站留一个博客栏目；（有些别的主题不一定有blog template这个模板，则可以忽视这个页面，而采取另一种方法添加博客栏目，请看文章《如何给WordPress,Zen Cart外贸企业网站增加一个博客栏目》；
6. 安装WordPress和WooCommerce插件后，都会自动生成了些页面，如果不需要可以删除掉它们；在做你自己的网站的时候，你也可以根据自己需要增加其他页面；

第四步：为外贸网站通过WooCommerce 的Product功能增加产品类别和产品；

要先添加商品类别（add category),然后才添加商品（add product)，不然你添加商品的时候就没办法选择产品分类了；添加商品(add product)时，编辑商品，在商品编辑页面右侧可以选择商品类别，商品图片是在添加featured product,添加多个图片是gallry;

1. 增加产品类别：安装WooCommerce 插件并启用后，在左侧菜单列表中有Products一项，点击该项下面的Categories选项进入添加产品类别页面：
2. 添加各类商品：还是左侧功能菜单Products一项，点击该项下面的Add Product进入增加商品页面，填写商品信息，选择产品类别，上传产品图片等，如图：
3. 产品在网站上的显示是通过自定义顶部导航，侧边栏，把产品类别放在顶部导航，侧边栏上，点击相应的分类则显示相应的产品，见下面的设置；

第五步：为网站调整，自定义顶部导航，底部导航，还有右侧边栏的内容

如何调整，自定义顶部导航，底部导航和侧边栏，请看文章《调整，自定义WordPress网站顶部导航，底部导航和侧边栏》；

1. 顶部导航：通过左侧功能菜单 外观（Appearance)->菜单(Menu)创建一个顶部导航菜单(命名为Top Menu),把About Us,Products,FAQs,Blog等页面添加到该菜单，并把产品类别(product categories)下面的各个产品category添到菜单,然后拖动到Product页面下做为二级菜单;另外添加个自定义链接(Links)到菜单（点击该自定义链接Custom后面那个箭头打开编辑这个Link的Title为Home，链接URL是到网站域名）；然后拖动各菜单调整显示顺序，保存并指定位置为Primary Menu，一定要指定位置，不然不生效，不在导航显示；如果在Appearance->Menus中没有Products Categories这些可以添加到菜单的，请在Menus页面中点击右上角的Screen Options，勾选上Products Categories；另外，右边要View All来浏览所有的页面，或者产品类别；
   
2. 底部小工具菜单：我的主题Vantage支持底部多个竖栏，一般在外观（Appearance)->小工具(Widgets)那里，把小工具(Widget)加到Footer边栏即可；方法一：通过添加几个Text小工具，然后修改Text的标题为Product, Company,Support等等，并在Text文本框内添加链接代码 (支持Html代码，链接代码写法为：<a href=”页面网址”>链接的瞄文本(页面标题)</a> ），链接到网站其他页面；方法二：先在外观（Appearance)->菜单(Menus)那里创建几个菜单，分别为Company,Products,Support,添加页面，产品分类等到这几个菜单，保存，不用指定位置；然后在外观（Appearance)->小工具(Widgets)那里，添加三个自定义菜单（Custom Menu）小工具到Footer边栏，每个自定义菜单（Custom Menu）小工具分别命名为Product, Company,Support，并分别选择前面创建的Company,Products,Support三个菜单，这样就不用像方法一那样写代码了。
3. 右侧侧边栏：在外观（Appearance)->小工具(Widgets)那里，把WooCommerce Product Search, WooCommerce Product Categories, WooCommerce Recently Viewed , WooCommerce Top Rated Product和Text等小工具(Widget)分别添加到右侧侧边栏(Sidebar)，各个小工具都可以重新命名标题，分别命名为：Search Prouct, Product Categories, Recently Viewed, Top Rated Product和Contact Us, Text小工具命名为Contact Us后，在文本框里添加公司联系信息(支持Html代码）；Text小工具常用到的html代码请看《一些常用的Html代码（WordPress侧边栏Text小工具常用到）》。

第六步：为网站做个特色的首页

由于我的主题Vantage本身有个已经做好的首页模板(Home Page)，而我也觉得不错，我就在它原来的首页模板上稍做调整修改，增加内容就可以了(Appearance->Home Page那里设置为ON)。如果你不想使用自带的Home Page,没关系，我们可以自己建一个，在Pages->Add New新建个页面，命名为Home Page ，Template选择为Page Builder Home,然后在后台Settings->Reading->Front page displays->A static page->Front Page选择创建的Home Page 设为首页；

（只要安装了 Page Builder by SiteOrigin，我们都可以自己制作一个个性的静态页面(page,比如：Home)，然后将其设置为首页(在后台Settings->Reading->Front page displays->A static page->Front Page选择创建的那个静态页面Home) ,请看《自定义一个WordPress外贸网站首页》）；

1. 使用插件Meta Slider为首页插入Slider；在插件Meta Slider设置页面创建New Slider，设置参数，按照设置的Slider图片的尺寸（宽度1020不改动，高度可以修改为300），使用产品图片做出4幅幻灯片图片，并分别添加这4幅图片到Slider，填写这4个幻灯片分别链接到的页面的URL（目标URL), 保存；制作幻灯片图片见文章《如何使用Photoshop制作Banner，Slider幻灯片图片》；然后在Apprance->Theme Settings->Home(如果改版了，请看customize选项里面）标签下的Home Page Slider选择刚才创建的Slider名称，保存后即可在首页显示你的幻灯片了；
2. 修改外观（Apprance）->Home Page(这个是该主题特有的），Home Page里面有几框，每个框里面有个小工具（widget） 编辑页面Home Page,添加一个Row,1 Column,然后往这个Row添加Vantage Headline小工具 ，添加后，点击选中该小工具，你可以看到可以对该小工具进行Edit,Duplicate,Delete等操作；如：Vantage Headline 也是一个小工具，我点击它，然后Edit它为自己想要的内容；
3. 修改Apprance->Home Page(这个是该主题特有的）下面的Post Loop (PB) 再在页面Home Page添加一个ROW,1 Column,然后往这个Column添加Post Loop(PB)小工具，这个是循环展示你的帖子，产品的模块，我把它标题修改为Our Products,显示方式Template选为：Grid，然后在Build Post Query里面选择Post Type为Products，即展示的是商品，每页显示商品Posts Per Page 为8(4的倍数）；
   
4. 修改Apprance->Home Page(这个是该主题特有的）下面的Circle Icon 再在Home Page添加1个Row,3个Column,然后三个Column分别添加1个Circle Icon, 点击Edit修改Circle Icon的标题和内容，我分别改为：Kitchen Project, Service Center, Catalogue Download，并分别添加简介，和Learn More链接到其他页面；也可以通过编辑框左上角上继续添加Widgets多添加几个Circle Icon.
5. 还可以参考《使用WordPress免费搭建一个简单外贸网站全过程图示教程的补充》中，给首页添加个产品类别展示；

第七步：上传网站logo，修改网站标题，修改网站底部版权信息等等；

1. 修改logo: 这个可以在Apprance->Theme Settings->logo(如果改版了，请看customize选项里面）标签上修改；一般logo使用.png格式为好，请看文章《如何自己做个简单的网站logo》如何制作一个网站logo.
2. 修改网站标题：在网站后台左侧导航菜单：Setting->General 里面修改；
3. 修改网站底部版权信息：在网站后台左侧导航菜单中：Appearance->Editor进入主题代码修改功能，在右边Templates列表（网站主题文件）下选择Footer(parter/footer.php) , 找到原来主题的版权信息的代码，把对应的内容修改为自己的; 本主题Vantage也可以在Appearance->Themes Setting->General标签下修改; Vantage版本升级后，直接修改版权信息代码会出错，那么我们可以把版权信息的代码 Disable 它，操作如图所示。

以上就是使用WordPress做个简单的外贸网站的全过程，这只是比较简单的网站，还有些要完善的地方，如果你需要别的外观，你可以通过安装其他的主题来实现；同时，做好网站后，大家可能还需要Live Chat,需要SEO优化功能，需要添加社交网络分享按钮，这些都可以通过安装插件来实现，在《用WordPress建外贸网站可能会用到的一些企业主题与插件》一文中，我列了些大家在做外贸网站可能需要要用到的主题和插件，并在以后发现有好的主题和插件时也会在该文分享，所以该文也会保持更新。还有些功能需要通过在网站的主题模块里面添加代码来实现，可以看文章《如何给网站添加代码以及修改CSS来改变字体大小等》。另外，针对要修改首页产品显示图片不完整，重新自定一个首页产品分类，我在《使用WordPress免费搭建一个简单外贸网站全过程图示教程的补充》中做了些补充。

另外，如果是使用XAMPP建的网站，那么你就需要购买网站空间，购买空间请看《如何购买虚拟主机，购买虚拟主机流程，外贸主机推荐》一文，然后把建好的本地电脑WordPress网站迁移到网站空间，如何迁移网站请查看《网站搬家：如何把本地电脑WordPress网站迁移到虚拟主机》一文。

最后网站做好效果如下（www.kitch.cn)：

原创文章，转载请注明： 转载自DIYzhan.com-从零开始自己做外贸网站和海外网络营销
本文链接地址:https://www.diyzhan.com/2014/02/wordpress-building-trading-site-sample/