标签： wordpress建站

通过前面2篇文章的介绍，加上各位自己的摸索，相信你基本熟悉了Modernize主题特性。对于本主题模块化操作，我建议是大家将每个模块都添加一下，尝试着排版来熟悉它的功能。作为本主题的最后一篇介绍，我们讲一下排版时用到的一些短代码，另外还有主题面板里的一些设置。

 1，显示短代码按钮

默认情况下，短代码是隐藏的，如图点击展开所有按钮即可。这些短代码按钮相当于一个快捷操作，不使用这些按钮，我们依然可以在内容区域手动输入。当然了，如果不采用内容区域而采用模块拼接，就不需要了解大部分短代码的功能了。

2，排版时灵活使用divider和space短代码

默认的DIVIDER代码插入是[divider scroll_text=”SCROLL_TEXT”]，可将SCROLL_TEXT改为“Go to Top”，当然也可以不使用这个文字而直接采用[divider]，divider的作用是插入分隔线。但在实际操作时会发现，分隔两部分内容时，下面与分隔线的距离太近，显示很不协调。这里我们要使用到space短代码，紧接着上面的短代码加入：[space height=”10″]，数值“10”可任意修改。

3，更改portfolio为products

地址栏的URL中显示portfolio总是看着不舒服，改为products会比较顺眼，很高兴的是此主题支持我们在后台修改（很多主题并不支持）。进入主题面板即可看到如图，将其改为products，接着save changes。为确保修改生效，请进入setting ->Permalink，将固定链接先切换到默认项->保存，接着再切换到你预设的项目 ->保存。—-大家一定要注意这个操作，在很多涉及到修改源码/安装插件导致前台页面链接失效（出现404错误）时，这样的操作能够起到重置链接数据的作用。

4，启用自适应

Modernize是支持自适应的，意思是网站在手机和平板上都能自动适应屏幕而达到很好的浏览体验。默认是关闭这项功能，请进入主题面板开启ENABLE RESPONSIVE项。

5~N，占位编辑（根据用户和留言反馈，我们会将新的知识点归纳在此。欢迎大家在使用中将问题通过评论反馈，不要旺旺或QQ提问，谢谢配合！）

前言

Modernize主题既适合零基础者，也适合wordpress爱好者二次开发（很强的扩展性）；同时主题附带的portfolio模块支持侧边栏（左/右都可），有了这个模块，实现产品列表就方便多了，而很多主题是不支持portfolio页面侧边栏的，详细请看“第六节：发布产品前得知道Portfolio适合你吗？”；最后，页面和文章都可以通过内置小模块的拖拽来排版，操作简单易懂。

由于本人也是外贸人，另外做外贸站须为英文为主，所以建议大家做站时最好是选用英文wordpress后台，避免搜索引擎识别冲突。所以本教程的截图引用英文界面。

本教程并不是主题自带教程的翻译版本，但是在看本教程之前，如果你有足够的时间、精力和英文基础，我还是强烈建议大家看看自带的英文教程。英文教程是以旧版wordpress后台演示，并且没有导入演示数据的操作，所以对于初次接触者理解主题有一定的难度。本教程主要讲解快速安装和详细解说主题使用，力求做到初学者看完就能独立建站。

话不多说，正式开始！

安装

确保WORDPRESS安装在LINUX主机上，如果WP和主题安装出现问题，请先排查主机问题；

1），通过FTP安装主题

第1步：解压下载下来的压缩包，你会看到如下所示的一些文件；

document是自带英文教程，modernize-v3-15是主题文件夹，demo-xml.xml是演示数据，modernize-v3-15.zip是主题文件压缩包。

第2步，利用FTP工具，将modernize-v3-15文件夹上传到wp-cotent/themes目录下；

第3步，启用主题，安装完毕；

2），在WP后台面板安装主题

注：由于类似主题压缩包通常都超过2M，而一般的主机又限制上传文件不得超过2M，所以在WP后台安装有可能会不成功，所以只能使用FTP安装。

第1步，进入’Apperance -> Themes’；

第2步，点击’Add New’；

第3步，点击’Upload Theme’，上传modernize-v3-15.zip压缩包，完成安装，并启用主题；

导入演示数据

第1步，进入’Tools -> Import’，安装wordpress导入插件并启用之；

第2步，利用此插件导入演示数据demo-xml.xml，可勾选导入演示图片。

第3步，等待3到5分钟，导入成功，会显示如下提示；

导入所花费时间根据双方服务器的速度决定，也可能会导入失败，在网络好的情况下多试几次即可，如果继续有问题，请排查服务器故障和权限问题。{上图所示的有些错误，请仔细分析，因为本主题兼容WOO COMMERCE插件，所以演示数据里含有商城数据，而我们并没有提前安装WOO插件，所以这部分数据导入时会失败，这并不影响我们建站，切勿纠缠此处。}

设置首页，菜单和其它

第1步，进入’setting -> reading’，将main设置为首页；

第2步，进入’Appearance -> menu’，设置主题预设的两个菜单（主菜单和顶部）；

第3步，进入主题面板’Modernize’，点击’Save Changes’（如果不操作这步就去查看网站首页，你会发现所有的图片会闪动，这是因为演示数据导入后没有与本站兼容而导致，通过点击SAVE CHANGES，有重置的作用。）；

好了，演示站的安装到此就结束了，请查看网站首页，发现除了FOOTER没有显示，其它的内容与官方演示几乎一样了，接下来我们了解主题的详细知识。

头部/边栏（SIDERAR）/FOOTER/COPYRIGHT

1），进入主题面板’Modernize -> Overall Elements -> Logo’，通过UPLOAD上传LOGO，另有三处MARGIN数值供填写，来调整LOGO的位置；

2），进入主题面板’Modernize -> Overall Elements -> Top Right Area’，可以填写内容（支持HTML），它们会显示在网站顶部右侧；

3），进入主题面板’Modernize -> Overall Elements -> Social Network’，可以填写社交媒体链接，它们会出现在网站的头部右侧；

4），进入主题面板’Modernize -> General  -> Sidebar’，新建侧边栏（上限数量未知，通常建立三五个足矣，须用英文名），现在很多主题都支持自定义SIDEBAR，这是主题扩展性的重要特征，这样我们可以对不同的页面、文章来显示不同的侧边栏。

5），FOOTER预设了6种形式，进入主题面板’Modernize -> General  -> Footer Style’，选定任一种形式；

6），进入主题面板’Modernize -> Overall Elements -> Copyright Area’，填写底部copyright内容（支持HTML）；

以上讲到的SIDEBAR，现在并不需要急于添加内容，但我们必须知道这里的设置只是第一步，接下来我们需要进入’Appearance -> Widgets ‘，将小工具拖拽（添加）到相应的SIDEBAR内。对于FOOTER，我们也是在Widgets里操作。

页面设置

1），在第3节第一步操作，我们完成了首页的设置，首页的名称是main，那我们现在进入这个页面（Pages -> All pages）进行首页制作；

2），进入main编辑页面时，为了便于接下来网站显示，建议将main名称改为Home，内容项此时是空的，这是因为本主题也支持模块拼接来排版，如下图所示；

接下我们看

【A】页面布局：默认的首页，并没有侧边栏，所以我们选择的是无侧边栏布局。但是不是首页就一定不需要侧边栏呢，答案是否定的，如www.wksolar.com，我们就是采用了Both sidebar的布局。这个需要根据实际需求而定，对于其它所有页面和文章，通常要么是只需要一个侧边栏就可以了（Right Sidebar 或者 Left Sidebar）。

【B】页面标题：首页不需要显示标题，其它页面视情况而定；

【C】页面内容：之前提到本主题也支持模块拼接来排版内容，如果不采用模块拼接来排版，那么也是可以使用短代码在内容区域排版。本首页采用的是模块拼接来排版，同时也显示页面内容（虽然内容为空）。建议：如果内容为空，此项设置为NO。

【D】幻灯片设置：主题预设有4种幻灯片，如果是简单的图片展示，建议使用FLEX幻灯，操作也比较简单。复杂些的采用LAYER SLIDER，这个操作有些麻烦，建议看自带英文教程来学习。

以上是默认首页的设置，大家可以任意调整设置后，再去刷新首页看看有哪些变化，这样的尝试方便快速理解主题的功能。

视频讲解

暂无，敬请期待！