本文目标：按照本建站教程的顺序操作，能够实现：基于全球份额最大的建站系统“wordpress”，从零搭建一个B2B外贸网站，且建站成本每年小于1000元（如果不计算自己投入的人力成本的话）。
买完后暂时不用做任何配置，继续下一步骤：买存放网站用的主机Siteground。
重点：我咨询了一下官方，GreenGeeks的价格越高的版本服务器性能越好，就跟汽车性能一样，在使用功能方面没有区别，有些主机的版本与功能挂钩，譬如Siteground的低配就没有动态缓存与手动备份等功能。
需要注意的是，GreenGeeks提供免费域名，但次年起要续费，价格$13.95/年，略贵，如果需要域名隐私，还要单独付费$9.95/年，所以我不建议在这里使用免费域名。
购买siteground注意事项：
买完后，出现如下界面时，就可以点击SETUPSITE按钮着手创建网站了。
再按下图序号依次操作：1.点选域名类型，2.输入刚才购买的域名，3.提交
提交后，系统会提示：“站点创建完成后需要我们去修改域名的DNS设置”，稍后我们去修改，此时点击continue继续下一步
按下图序号顺序依次操作：
进入下图界面后，不用add付费的服务，直接点击Finish按钮，网站便开始创建，大约需要2分钟，创建完成后，系统也会发邮件通知你。
站点完成后，我们获取下图中的2条NS记录
有时候安装过程会比较长，系统不会反馈上面的图，此时，你可以在收到站点创建成功的邮件通知后，在siteground中按下图序号操作，进入网站管理工具获取NS记录。
进入sitetools后，将看到如下界面，我们拿着这两条nameservers信息（简称NS），去修改域名的NS记录。
接下来对上文说到的三大域名注册商，分别介绍修改NS的方法。
按下图序号操作，在Namesever处点击edit
在修改界面，先清空已有的NS记录，从siteground中的复制NS记录黏贴到此处，注意不需要复制括号及其内部的IP，然后提交即可。通常需要48h生效，实际经过测试，大约5-10分钟大部分地区都能生效的。
在NS服务器处，点击修改DNS按钮
继续点击修改DNS服务器
从siteground中的复制NS记录黏贴到此处，注意不需要复制括号及其内部的IP，然后提交即可。通常需要48h生效，实际经过测试，大约5-10分钟大部分地区都能生效的。
在域名列表，点击下图中的小地球按钮
在弹出窗中点击clickhere
进入NS修改界面后，从siteground中的复制NS记录黏贴到此处，注意不需要复制括号及其内部的IP，然后提交即可。通常需要48h生效，实际经过测试，大约5-10分钟大部分地区都能生效的。
在域名解析配置完毕之后，我们直接访问域名网址，试试看能否打开网站。
当打开网站能看到下图所示界面，说明解析生效啦。
此时我们访问网站域名后，将在域名左侧发现多了一个锁状的安全图标及证书信息
方法1.通过网站后台管理地址进入
刚刚创建完网站时，可以直接通过这个地址访问；
在后文中，我们将修改该地址以提升网站安全，届时通过自己定义的地址进入。
此外，此处还能进行：修改密码、删除站点等操作，忘了密码也不怕~
2.勾选“建议搜索引擎不收录”，在站点建完之后再去掉勾选，以便让搜索引擎收录
3.修改后台界面语言为中文，方便使用
第一步，安装简体中文语言包
第二步，将sitelanguage改回English
如果你的站点不是英文的，而是西班牙语的，那么你就需要在这里安装西班牙语，并将sitelanguage设置为西班牙语。
第三步，在用户处修改语言为中文
此操作确保后台是中文的，网站前台看到的依旧还是英文，或你设置的其他语言。
安装主题的教程如下：
进入主题列表，点击添加按钮
找到主题后，点击安装按钮
安装完成后，点击主题下的启用按钮
启用完成后，提示新主题已经激活，点击访问站点查看效果
安装新主题后的网站样貌，如下图所示（嗯，很简单，几乎不像一个网站的样子）
主题安装好以后，我们把用不上的系统自带主题删除
在主题页面，点选需要删除的主题
在主题详情面板上，点击右下角的删除即可。
在安装建站插件之前，先把暂时不用的插件deactivate禁用，不需要的插件delete删除
对下图中的两个插件，分别点击deactivate禁用；
然后对wordpressstarter进行delete删除；
先列一下插件清单，请认准插件名称和作者，这样就不会装错了，如果用了我的模板站点，插件就都不用安装了；自学的话，请先装免费的，付费插件可联系我获取正版共享，付费插件不建议使用来路不明的破解版本，谨防恶意代码注入（譬如黑链）。
插件并非越多越好，选用的人多的、评价好的插件，安装够用的插件即可，过多插件会拖累网站速度，增加网站漏洞风险。
与安装主题方法的类似，步骤概述：搜索-安装-启用：
通过上传插件压缩包进行安装，步骤概述：上传-安装-启用：
暂时用不上的插件也可以不点“启用”，需要用的时候，在“已安装插件”列表中启用即可。
下面介绍一下部分插件安装时的注意事项
启用woocommerce时，将打开如下界面，直接点击notrightnow跳过
跳过后，回到后台界面，在上方有如下提示信息，依旧点击skipsetup跳过
如果看到下图的提示文案，请继续下一步
启用wordfence后会进入如下界面，按图序号所示，依次填写和选择，最后点击continue继续下一步
在此界面点击nothanks跳过，在站点的新生阶段只需要使用免费版的，若站点客流蒸蒸日上，就有必要考虑买付费版的了。
完成上一步后，回到wordpress后台将看到顶部的提示信息，点击clickheretoconfigure以设置防火墙
然后我们将看到如下界面，点击download.htaccess后就可以直接点击continue了
接下来就看到成功提示了，点击CLOSE即可。
回到后台还会看到这样一条提示，问我们是否要保持wordfence的自动更新，这里点击YES即可。
自此wordfence的设置就结束了，它会默默保护网站，防止恶意尝试登陆、注入等风险，有任何需要你知悉的事件都会发邮件通知你，当然这是免费版的，功力不如付费版的，也不可能防住所有风险。
具体步骤如下：
上传图片或导入模板时，wordpress及woocommerce会自动为图片生成很多种尺寸的图片，有不少尺寸我们压根不用上，白白占服务器空间
这些自动生成的图片并不能在wordpress的媒体库看到，需要在siteground后台查看，下图是wordpress的媒体库，只能看到原图
下图是siteground后台查看图片文件的方法，能看到系统为同一张图生成了很多不同尺寸的图片
所以在网站页面设计完、内容上传前，我们先禁用所有自动生成的图片；若马上可以上传内容了，我们可以根据设计情况，酌情放开部分图片尺寸，譬如在制作产品列表页时，我们用到了300*300px的图片，那么就在下面的代码中，将对应行的代码前加//注释掉或直接删除该行。
其中高级自定义字段插件在下文有实例，属于进阶功能，如果看过实例后，你觉得不需要对应功能，你也可以选择删除这个插件。
然后同理制作Products、Aboutus、Contactus、Blog页面，Catalogs或其他页面按需创建。
在页面列表中，将用不上的页面，如samplepage移至回收站进行删除。
进入外观》菜单界面，你将看到如下界面，我们将首页、samplepage分别删除，先忽略顺序问题，我们点击创建菜单按钮即可保存成功
保存成功后，我们依旧还在菜单页面，此时将显示位置设置为primary并保存菜单，那这个菜单就能默认出现在网站导航位置了。
下图就是此时网站上的导航，含网站名称、副标题和菜单
接下来，我们说一下如何从头创建一个新菜单，同时会介绍菜单排序方法
调整菜单顺序的教程：
如下图所示，左键点选并长按某个菜单后，上下移动即可调整排序；
左右移动可以调整层级，向左移动是提升层级，向右移动是降低层级，
譬如，以后添加了产品目录时，可以将产品目录添加到菜单，并向上移动放置于products菜单下，长按稍微向右移动，可将产品目录作为products的子菜单项。
菜单制作完成后，我们接下来制作全站通用的顶部header，并将菜单放入其中。
Header即导航菜单区域，操作步骤如下
导入完成后，内容、logo都可以先不管，下文将介绍Elementor编辑操作的细节，待整体框架都搭建完之后，再逐一调整
如下图所示，若你创建了多个菜单，且需要更换菜单，可以鼠标单击一下导航元素块，被选中元素块周围有蓝色线框，此时，左侧面板将会切换为：当前选中的元素块的操作面板，在面板的layout》menu中选择你所需的菜单即可。
接下来是保存header模板
网站的头尾都做好后，我们可以开始制作页面了。
首先需要对ELEMENTOR进行基础设置
接下来了解一下页面类别与结构
未标记*的页面：在上文创建菜单时，我们已经创建了空白页面，稍后直接用Elementor编辑即可。
标记*的是模板页，创建方法与上文的header、footer一样，中文名称后方的英文，即是对应的模板类型。
接下来开始逐一制作页面，就如同我们上文制作header一样，我们也是通过导入模板–整合拼接模板–修改模板细节的方式快速做出网站框架，记得多去看看国内网优秀同行的网站学习模仿。
进入页面>所有页面，找到home页面，点击编辑
在编辑home界面上，点击使用elementor编辑按钮
进入下图中的页面，页面中已经包含了之前做好的header和footer
也可以根据当前制作的页面类型来搜索，譬如输入homepage、contact、about，找到对应的模板；
若有喜欢的一个或多个模板，可以点击insert导入到页面中，结合实际需求进行删减调整；
下图是导入后的效果
建议不要在同一个页面导入过多模板，内容过多的页面会影响操作速度；
可以通过新建备用页面导入模板，再从页面中复制出需要的元素块到最终页面中，备用页面用完后删除掉。
复制元素块的方法如下：
点选模块后，其周围会出现蓝色细边框，此时点击鼠标右键，点击copy复制，然后在需要放置该元素块的地方，点右键Paste黏贴。
如下图所示，找到需要导入的页面模板，点击inserttemplate就可以将模板导入到页面中了。
页面框架完成后，可以点击下图中的2预览看效果，也可以点击1直接发布，因为站点目前是建设期，屏蔽搜索引擎抓取，也不担心被用户看到；
若站点完成并面向客户后，涉及大面积的修改时，就不建议直接点击1发布，而是点击2预览效果，保存时，点击1publish旁边的箭头>savedraft保存为草稿，在确认页面完成后，再点击发布。
其他操作项分别是：
看到这里，你可能迫不及待想自己调整一下界面上的元素，那么，你可以跳转到Elementor编辑功能教程的章节；
用上述教程，我们可依次完成首页、关于我们、联系我们的框架搭建，接下来，我们继续把产品与博客类页面框架的制作方法介绍一下，这样整站的页面结构就全部完成了，再开展细节调整所需的ELEMENTOR编辑功能教程。
此阶段不用准备好产品材料，待整站设计完成后，再根据下文中的网站内容发布要点上传产品。
按照该方法创建3个示例分类
创建完毕后将在分类页面右侧的列表中看到这些分类。
然后将这些产品目录加入到products的子菜单中，按下图中的序号顺序操作如，可以将产品、产品类别加入到“添加菜单项”栏目中，否则默认情况下，你在菜单项栏目中是看不到它们的。
然后，按照上文教过的移动菜单的办法，将产品分类放到Products下方作为子菜单。
保存菜单后去查看一下，将看到如下效果
还可以继续在产品页面的下方找到产品简短描述字段，输入示例内容，稍后可用于制作产品详情页模板
接下来我们可以采用复制产品的办法快速生成示例产品，按下图方式复制产品
复制后的产品默认是草稿状态，在页面上点击“发布”按钮即可，这样网站中才会显示。
你也可以在“全部产品”页面，点击产品下方的快速编辑，在展开的面板中将状态设置为已发布，点击更新保存即可。
创建完5条产品后，我们可以访问网站的products页面，就能看到产品已经上架了。
你也可以点击一条产品看看目前的样子，接下来我们就去添加产品详情页的模板
导入后，系统会自动选择一个产品数据嵌入，以便我们直观看到效果，但依然有一些看不到内容的元素，譬如价格、加入购物车，那是因为我们上传产品时没有填写对应内容，你可以挨个点击元素，查看左上角这些元素的名称，对无用的元素右键点击删除。
如果你想更换一个产品以预览效果，那么按照下图的数字顺序操作，以更换产品
最后，点击publish，点击addcondition为includeproducts，保存即可，然后我们就可以去预览一下效果了。
现在打开一个产品页面，是下面的样子，细节会在后文的实例中调整。
创建完产品详情页的模板后，我们开始做产品列表页的模板
这里有个操作小说明：从刚做完的singeproduct模板回到wordpress后台的方式如下，点击elementor左上方的按钮后，再点击下方的exittodashboard。
创建方法与上一节基本一样，只是模板类型选择productarchive，保存时添加默认条件，发布后访问Products页面，是如下效果，Elementor的产品模板比较简约。
博客可用于发布公司新闻、行业专业知识、成功案例等等，请根据你的实际情况规划分类。持续的发布博客是有益于GoogleSEO继而带来客户流量的，当然，博客内容需是尽可能对你的客户群体有价值、能帮助到他们的内容，简短无料的水文不会带来积极作用。
如果你没多少博客要写，也可以先不创建分类，以后内容逐渐多了，再添加。
按照该方法创建2个示例分类，创建完成后，可以参照上文添加产品分类到菜单里的办法，将博客分类加入到Blog菜单下。
创作方法与上文的产品单页类似
创建完博客详情页的模板后，我们开始做博客列表页的模板，方法与上基本一样，只是模板类型选择archive即可，此处不做赘述了。
创建完成后，我们再到网站访问一下blog菜单，查看一下是否生效。
至此，我们对网站页面的结构及搭建框架的方法有了系统的认知，你是否也找到了想要参照学习的同行网站呢？仿站是对建站新手而言最快的方式，而过往我们查看、导入的精美模板，查看这些元素块的设置，是熟悉Elementor编辑功能的最快的方式。那么接下来，我们来熟悉一下Elementor的常用编辑功能。
界面分为左侧工具区域与右侧内容制作区域
包含了所有元素、各种设置功能，点击右上角九宫格可展示所有元素。
元素分类：按Elementor的免费与付费区分，如Basic、Pro；按用途分：如woocommerce、wordpress等等。
元素搜索：输入元素的英文名可快速找到对应元素。
行与列都可以左键、右键操作，左键点选后，左侧工具栏将出现所选行或列的设置功能，右键点选后，可进行所选行或列的复制、黏贴、删除等操作，譬如可以通过复制列、方便的实现一行变多列。
section可以进行双层嵌套，即在section内再嵌入另一个section，操作方法是从左侧找到innersetion元素块拖拽到已有的setion内部。
鼠标左键点选元素，长按左键，移动鼠标到右侧内容区域的section内部，或者直接拖拽到灰色虚线区域，它将自动创建一个section：
若鼠标处显示禁止图标，则此处不能插入元素；
若鼠标处显示蓝色粗横线，则元素可插入蓝色粗横线处，可挪动鼠标到目标位置后，松开左键即可
左键点击元素后，左侧工具区将展示元素的修改面板，面板分为三栏：content、style、advanced，每栏里的配置项因元素不同而不同，同时又有一些共通的规律，如下。
style，即样式。通常用于修改元素的外观，如颜色、字体样式、图片效果、其他内容效果等。
advanced，即进阶/高级。通常用于修改元素的外部间距与内部间距、动画效果、背景、边框、位置、响应式、自定义CSS。
如下图所示，当你修改元素时发现：某个修改项旁边有个电脑图标，点击下拉后可展开平板、手机图标，那表示：这个修改项可以在不同设备上用不同的设置；若没有这些图标，那说明所有设备上都用相同的设置。
在元素上右键点击，将元素可保存为Global
给它命名并保存
需要使用时，点击左侧的global标签，像添加元素一样使用即可
参照模板中模块的设置，自己模仿做一个一样的。挨个查看元素的设置项，进行反复操作试验，
我们打开之前为产品详情页制作的singleproduct模板，进行逐一调整
在导入的模板中，产品图片是放在背景中的，这会导致无法使用相册功能，所以我们先将产品图片从背景中删除
接下来，我们用navigator功能来查找不容易发现的元素（比如即将删除的spacer元素），在内容区右键后找到navigator，点击后就能看到面板了，其中按页面构成顺序依次展示了行、列、元素，这里不仅可用于查找元素，也可以操作排序功能
我们发现此列中有个spacer元素，先删除此列中的spacer元素
然后我们在左侧找到productimages元素，并拖入该列
我们发现图片周围有大片空白，需要进行调整：
去掉间距后，我们进一步调整产品图片的设置，在前文中，我么能看到此处的产品相册图是紧贴的，此处按下图所示修改（下图是修改后的效果）
接下来我们看下其他设备上的效果
调整完产品图片后，我们调整右侧的产品简介，我在导入模板后，只保留了产品标题元素，其他的都删除了，现在我们按下图所示补充元素
我们注意到询盘按钮的颜色与主题不符，我们不用单独去为按钮设置颜色，可以采用主题样式的办法进行全局设置，这样以后用button元素时，都有统一的效果，当然，若别处需要用到个性化设计的按钮，你可以在button元素上设置，它将覆盖默认的全局设置。
询盘按钮除了上文的做法，还有另一种办法，稍微复杂一些
6.设置需要用户必须填写的字段，并显示*标记；你也可以在左侧新增字段，默认情况下是name、email、message三个字段，建议字段不要过多，降低用户填写难度
7.将调整完毕的form元素右键存储为Global元素，以便于在其他地方重复使用
8.发布表单，并将条件设为全站，保存即可，不需要设置其他（triggers或advancedrules）
9.回到产品模板页面，点击询盘按钮（下图中我换了一个示例网站，但操作都是一样的），在左侧按钮设置中，点击link右侧的dynamic按钮，在下拉选项中选择popup，然后继续点击popup，在setting中搜索并选中刚才添加的popup
10.此时，点击询盘按钮，将可见到询盘弹出窗口
接下来调整产品介绍的内容区域，主要是调整字体部分，从模板中导入的元素，通常都有自定义的设置，无法直接调用我们在themestyle中的默认设置，这会导致全站的字体混杂，不仅影响观感，加载过多的字体更影响网站的速度
恢复默认字体后的效果如下图所示，当然也没必要所有地方都统一用默认字体，适当的自定义字体能增加美观
接下来删除下面的upsell及其所在的section，因为咱们的B2B站点也用不上这个功能
最后，如果你希望客户能够提交产品评价，或者自己录入一些过往客户对你的产品评价，以助于更好的宣传你的产品，你可以增加productrating元素块。
如果你不想产品页面保留评价，那么你需要按下图所示，以关闭评价功能
接下来，你可以切换到平板、手机效果下看看网页是否正常，并酌情调整。至此我们就得到了一个满足基本需求的产品详情页了，如果想要更多的高级功能，那就进入下个环节，运用advancedcustomfiled高级自定义字段插件，为产品自定义字段，譬如：Q&A
依次输入字段标签，字段名称系统会根据字段标签自动生成，建议都用英文，选择字段类型为可视化编辑器，然后保存即可
保存后我们进入产品列表，编辑任一产品，发现在页面下方新增了上述字段，你也可以参照上述办法再增加一下你需要的其他字段，譬如brochure、whychooseus等等，然后在所选产品页面填充好QA的示例内容。
回到singleproduct模板的编辑页面，你可以通过访问任一产品页面，在页面顶部点击editwithelementor，并在展开的下拉面板中选中当前模板进入编辑。
在页面的末尾加上一个heading元素，设置title为QA，默认htmltag为h2，师不用修改的，一个页面可以有多个h2,但只能由1个h1，h1一般用作标题，h1-h6可以理解为章节标题的层级递进，类似总分关系，数字越小层级越高
然后在heading下方再加入一个texteditor元素，点击dynamictag，选中acffield（acf是advancedcustomfiled插件的首字母）
选中acffield后，在key中选择刚才添加的字段QA
若你刚才添加了qa的产品并非当前预览的产品，则你需要点击左下角的齿轮setting一下预览的产品，点击apply&preview按钮后即可看到qa已经添加成功了。
好了，关于这个elementor编辑的详细示例就讲解到这里，其他页面请自行多多探索，如有疑问可以联系我，收集到大家的常见问题后，我会继续补充到本文中。
需按照图片本意进行英文命名，不要用中文或乱码命名，这样不利于搜索引擎理解图片的内容，譬如：产品若有多张图片，可以采用同义词进行命名
一般是png、jpg，不同用途的图片尺寸和大小又有区别：
上文中已经介绍过图片大小建议，一般我们用手机或相机拍的照片，图片都是几M以上，这会严重拖累网站速度，进而流失用户。那么如果图片过大，该怎么处理呢？
第一步：线下压缩图片
图片数量多时，用photoshop的自动批处理功能
第二步：线上压缩图片
如果你的图片在1M以内，也可以考虑直接采用线上压缩图片，而跳过第一步的线下压缩，但要试验，确认一下线上压缩后的图片大小，是符合上文建议的，或者能在100K左右。
确保安装并启用了插件reSmush.itimageoptimizer，按下图所示配置：
此后每次上传图片都会自动处理，若需要优化安装插件之前的图片，请在上图中点击optimizeallpictures，或者在媒体库中按需手动优化。
诸如公司介绍视频、产品介绍视频、客户评价视屏、项目实施视频等等，请不要直接上传到网站的媒体库里，当面向国外用户时，请上传到Youtube，获取视频地址并放入到网站中需要展示的地方。
如果你同时要做中文站，我的建议是另建站，把服务器放到国内，速度会更快，依旧可以用wordpress建站，只是国内建站需要备案。
产品分类介绍、产品介绍、产品手册、产品项目信息、产品评价信息…
公司介绍文案、公司历史、公司资质、公司生产水平、公司贸易水平…
以上图文介绍信息可参照阿里巴巴国际站的同行店铺，在店铺中找到公司介绍页，它的信息结构已经被梳理的非常完善，当然你也可以参照优秀同行做准备，同时，更重要的是想目标客户之所需，内容要饱满，因为内容稀薄的页面不大会获得搜索引擎中的高排名，同时，也会降低用户的询盘意向。
每个页面可以理解为一篇作文，主旨就是核心关键词，就是你想要向用户传递的关键信息。
譬如，我们写一篇有关妈妈的作文，这个出题的意图就不精确，作文标题会有不同的取法：
那拿着妈妈这个词去谷歌里搜索，也会呈现很多类型不一致的结果，那么这个词作为页面核心关键词是不合适的，因为意图不明确，我们要找到搜索意图明确的关键词。
接下来以bottlecodingmachine为示例，在谷歌中搜索后，查看视频、图片、文字的搜索结果是否与产品趋于一致，如果大部分都一致，譬如还能看到阿里巴巴等B2B平台的搜索结果、同行的产品，那么词意是准确的。
有些人做的产品是2C的，譬如衣服的批发，那这种时候直接搜索衣服，会看到大部分是amazon等在线销售的网站，这种时候，定关键词时就要带上准确的意图词，譬如衣服批发商、衣服制造商等等。
通常一个产品可能会有多个同义名称，每个名称的用户搜索量是不一样的，这种时候，我们通常借助于工具来查询每个词的搜索量和排名难度，找寻搜索量大一些，排名难度低一些、搜索意图准确的的词。
我基于目前在用的kwfinder，示意一下操作过程
输入你的产品名称，设置好语言和区域（区域可以设定无，地区保留为空，即全球）
然后你将得到关键词建议、搜索量区间与竞争度（针对付费竞争）
此时，若勾选关键词加入方案中，你将得到更详细的数据
好的，说到这里，你已经知道页面关键词该怎么定了，关键词要放入页面标题（title）、页面的描述（metadescription）、页面的H1标签、页面的正文中进行自然而然的布局，语句要通顺，语境要自然，别为了加关键词而堆砌，这样会遭到算法的惩罚。
当你的站点内容都已经填充完成，三端（电脑、平板、手机）都进行了周密的检查，我们开始站内基础SEO教程。
设置logo：进入外观》自定义》站点身份，上传图标（即logo）和站点图标（上文说到的512*512px），最后记得点击右上角发布
接下来按照下述教程，逐一操作
完成上述内容后，站点可上线，开放收录吧、
进入设置》阅读，将建议搜索引擎不索引本站点去掉勾选，保存更改
还可以进入googlesearchconsole提交站点地图以助于加快收录