(视频) 《快速建立网站》 3.2 WordPress多站点及Azure在线代码编辑器 - 扔掉你的ftp工具吧,修改代码所有云端搞定

本文是《快速建立网站》系列的第6篇,若是你尚未看过以前的内容,建议你点击如下目录中的章节先阅读其余内容再回到本文。php

访问本系列目录,请点击:http://devopshub.cn/tag/wordpress-on-azure/html

1. 网站管理平台WordPress和云计算平台Azure简介 (6分钟视频 )
2.1 在Azure上建立网站及网站运行机制 (13分钟视频)
2.2 域名绑定操做和Azure负载均衡机制 (12分钟视频)
2.3 WordPress 初始化和网站管理功能 (11分钟视频)
3.1 WordPress 数据导入 (12分钟视频)
3.2 WordPress 多站点支持和Azure在线代码编辑器 (14分钟视频)
3.3 WordPress 多语言支持 Multisite Language Switcher (15分钟视频)
3.4 WordPress 主题安装和配置,美化你的网站 (15分钟视频)
4.1 为啥造软件不一样于造汽车,为啥是软件就必定会有Bug - 构建开发运维一体化(DevOps)(11分钟视频)
4.2 完结篇 – 应用运营vs.发射卫星,遥测(Telemetry) 技术 (13分钟视频)web

在上一节(3.1)中,咱们已经完成了数据导入。在这一节(3.2)中,我将对WordPress进行多站点升级,让个人中文内容放置在http://anb.io/ 这个主站上,同时在http://anb.io/en/ 上放置英文的内容。至关于在咱们的网站中建立了一个子站点,并且这个子站点具有和主站一样的功能,后续咱们添加了多语言切换插件后,就能够在主站上启用中文,在/en的子站上启用英文,造成一个多语言的站点群。sql

这部分的内容对于不具有开发经验的用户可能稍显复杂,由于咱们须要手动更新WordPress后台的代码。可是没必要担忧,在整个操做过程当中我不会使用任何的开发工具,全部的操做都在浏览器中完成。浏览器

请配合视频阅读本文

微软Visual Studio Online在线编辑器

为了可以完成WordPress多语言模式的升级,咱们须要对WordPress后台的代码文件进行简单修改。通常来讲,对网站后台文件进行修改须要通过下载-更新-上传的过程,可是借助微软Azure云计算中集成的Visual Studio Online的在线编辑器,咱们能够轻松的使用浏览器完成全部操做。服务器

启用Visual Studio Online在线编辑器:在Azure门户的网站仪表板上点击 配置微信

图:在Azure中切换到网站配置页面

在配置页面中找到 EDIT IN VISUAL STUDIO ONLINE 这个选项,点击打开,并保存配置app

图:在Azure中启用Edit in Visual Studio Online功能

回到 仪表板 页面,在右侧的 速览 中找到 在Visual Studio Online中编辑 连接,点击进入编辑器负载均衡

图:在Azure中进入Visual Studio Online "Monaco"在线编辑器

进入编辑器后,能够看到WordPress网站的文件列表会在左侧显示。
图:Azure上的Visual Studio Online "Monaco"在线编辑器运维

这里,咱们看到的是一个全功能的在线IDE(集成开发环境),不只仅支持对文件的简单编辑,也支持代码的智能分析和开发辅助。Visual Studio Online 在线编辑器的CodeName是”Monaco”,当前对Web开发所使用的语言环境支持很好,具体请参考如下视频和连接。

我在MVP ComCamp2015上的主题演讲中关于Monaco的演示视频:

注:这段视频中使用的一个Node.JS应用程序。视频的前半部分是对Visual Studio Online的开发平台部分进行介绍,后半部分才是对在线编辑器的介绍,同时也有和GitHub集成的演示。

预告:在本系列的最后部分(4.1)中,我还会介绍如何使用Visual Studio Online和Azure集成进行WordPress的代码管理及本地开发环境的构建。

MSDN Channel 9上的Monaco视频汇总
http://channel9.msdn.com/Series/Visual-Studio-Online-Monaco

Monaco开发团队的博客
http://blogs.msdn.com/b/monaco/

WordPress多站点模式升级操做

WordPress多站点模式属于WordPress的高级功能,在界面上没有直接配置的选项,必须经过修改后台代码激活。对于运营网站的同窗来讲,这是一个很是有价值的功能。

在咱们经常使用的各类网站上,咱们会常常看到多站点模式的应用,好比:新浪的多站点

http://www.sina.com.cn/ :这是主站,做为整个网站的第一入口
http://news.sina.com.cn/ :这是新闻子站
http://tech.sina.com.cn/ :这是科技子站

以上的多站点模式叫作:子域名方式,对于内容比较多的站点,咱们可使用子域名(也就是域名中的第一部分)来区分不一样的功能/内容区域。

再看下面新浪对于科技子站内的分类:

http://tech.sina.com.cn/internet/ :科技子站中的互联网内容
http://tech.sina.com.cn/tele/ : 科技子站中的电信类内容
http://tech.sina.com.cn/discovery/ :科技子站中的科普内容

以上这种多站点模式叫作:子目录模式,对于同一个大分类下面的小分类,就可使用子目录的方式来进一步划分。

固然,以上两种模式咱们既能够只使用其中一种,也能够混合使用。根据你的站点规模和工做模式本身选择。多站点模式不只仅影响你的用户如何消费内容,对于网站后台的工做模式也一样有影响,不一样类别的内容通常由不一样部门/专业的人员进行管理,对这些用户咱们须要进行权限的控制。使用多站点模式,咱们就能够很容易根据不一样部门/专业对不一样的用户进行管理,并进行逐级受权。因此,WordPress彻底能够做为企业门户的解决方案来使用。

多站点规划

从上面的例子能够看出,多站点是须要必定规划的,并且一旦启用多站点,其结构就难以调整,须要预先进行的计划才能够。

图:anb.io多站点多语言规划

按照个人规划,用户将以http://anb.io 做为统一入口,按照客户端所使用的不一样语言分别进入中文或英文的子站,中间使用多语言切换插件进行链接,造成如下的访问体验。

图:anb.io博客站点多语言切换效果

上图能够看到,同一片文章的两个不一样语言版本使用页面右侧的多语言切换工具进行连接,用户能够经过点击其中的语言选项跳转到相应的语言版本,WordPress也会根据用户所使用的浏览器的语言设置自动将第一次进入站点的用户直接定位到不一样语言的首页上。

注意两篇文章的url虽然不一样,可是能够很轻易的分别他们是属于不一样语言的,这样的格式也将对搜索引擎优化有所帮助。
http://anb.io/blog/opensource-freetools-crossplatform-mvp-comcamp2015-keynote/
http://anb.io/en/opensource-freetools-crossplatform-mvp-comcamp2015-keynote/

因为没有必要对全部的内容都提供2种语言的版本,相应语言的博客首页只会显示那些已经提供了当前语言的文章连接,以下图:

图:anb.io多站点首页能够根据语言显示不一样内容

WordPress多站点升级操做

首先,你能够经过WordPress的官方文档了解一下WordPress的多站点功能,里面列出了各类前提条件和主要操做步骤。可是由于WordPress的文章主要是针对Linux/Apache/Mysql环境写的,在Azure所使用的WordPress上进行操做的时候略有差别,对于本系列的所涉及的操做请看下文。

WordPress多站点模式文档:http://codex.wordpress.org/Create_A_Network

操做步骤

  1. 编辑wp-config.php文件,激活多站点升级模式使用以前打开的在线编辑器,在wp-config.php这个文件中找到如下代码/* That's all, stop editing! Happy blogging. */

    并在这行代码下面添加如下代码define( 'WP_ALLOW_MULTISITE', true ); 

     

    意思就是告诉WordPress:请激活多站点升级模式。以下图
    图:在WordPress中编辑wp-config.php文件激活多站点升级模式
    注意:Monaco中进行编辑时不须要保存的,它会自动完成保存操做。

  2. 修改完成后,切换回到你的WordPress的控制台首页,在Tools菜单下会出现Network Setup这个选项
    图:在WordPress中进入Tools | Network Setup页面
    选中这个选项便可进入多站点升级引导页面,引导程序首先会提示你须要将站点中的插件暂时关闭,才能完成升级。点击 deactivate your plugin连接,并将全部的插件deactivate,再回到这个引导页面。
    图:WordPress多站点升级须要deactivate全部插件
    这时,WordPress就能够进行多站点升级了,再如下页面中直接点击 install便可。
    图:启动WordPress多站点升级
    而后WordPress会提示你再次修改配置文件,此次须要修改的分别是wp-config.php和web.config文件。wp-config.php的修改以下:将以前咱们添加的那行代码替换成如下代码
    注:必定要替换,而不是保留原来的代码,以前那行代码只是激活升级模式,如今已经完成了升级,咱们须要对多站点模式进行配置。

     

    define('MULTISITE', true);
    define('SUBDOMAIN_INSTALL', false);
    define('DOMAIN_CURRENT_SITE', 'www.anblogs.net');
    define('PATH_CURRENT_SITE', '/');
    define('SITE_ID_CURRENT_SITE', 1);
    define('BLOG_ID_CURRENT_SITE', 1);

    注意以上define(‘SUBDOMAIN_INSTALL’, false),这里要使用false。由于咱们是使用子目录模式的多站点,而不是子域名方式的多站点。

    Web.config的修改以下:
    注:WordPress直接给出的配置文件是有错的,请使用如下配置完成修改。

    <rewrite>
    <rules>
    <rule name="WordPress Rule 1" stopProcessing="true">
    <match url="^index\.php$" ignoreCase="false" />
    <action type="None" />
    </rule>
    <rule name="WordPress Rule 2" stopProcessing="true">
    <match url="^([_0-9a-zA-Z-]+/)?files/(.+)" ignoreCase="false" />
    <action type="Rewrite" url="wp-includes/ms-files.php?file={R:2}" appendQueryString="false" />
    </rule>
    <rule name="WordPress Rule 3" stopProcessing="true">
    <match url="^([_0-9a-zA-Z-]+/)?wp-admin$" ignoreCase="false" />
    <action type="Redirect" url="{R:1}wp-admin/" redirectType="Permanent" />
    </rule>
    <rule name="WordPress Rule 4" stopProcessing="true">
    <match url="^" ignoreCase="false" />
    <conditions logicalGrouping="MatchAny">
    <add input="{REQUEST_FILENAME}" matchType="IsFile" ignoreCase="false" />
    <add input="{REQUEST_FILENAME}" matchType="IsDirectory" ignoreCase="false" />
    </conditions>
    <action type="None" />
    </rule>
    <rule name="WordPress Rule 5" stopProcessing="true">
    <match url="(^[_0-9a-zA-Z-]+/)?(wp-(content|admin|includes).*)" ignoreCase="false" />
    <action type="Rewrite" url="{R:2}" />
    </rule>
    <rule name="WordPress Rule 6" stopProcessing="true">
    <match url="^([_0-9a-zA-Z-]+/)?(.*\.php)$" ignoreCase="false" />
    <action type="Rewrite" url="{R:2}" />
    </rule>
    <rule name="WordPress Rule 7" stopProcessing="true">
    <match url="." ignoreCase="false" />
    <action type="Rewrite" url="index.php" />
    </rule>
    </rules>
    </rewrite>

    对web.config的修改是针对托管WordPress的Azure网站服务器进行的,以上的内容都是一些url重写规则,WordPress给出的配置在使用目录模式的时候没法正常工做,因此请必定使用本文给出的代码。

    注意:你须要修改的仅仅是配置节的内容,请保留其余内容,以下图
    图:WordPress多站点升级中对web.config的重定向模块进行配置

  3. 进行多站点配置,完成以上配置后,并重新登陆。你会注意到顶部的菜单发生了变化,请点击 My Sites | Network Admin | Dashboard进入到多站点管理控制台。图:进入WordPress多站点管理控制台
    多站点管理控制台从逻辑上看,是位于你全部子站点之上的根控制台,从此全部的插件/外观(主题)安装都须要使用这个控制台完成,而文章/内容的管理则要使用相应站点的控制台完成。如今让咱们添加咱们的英文站点,点击Sites | All Sites菜单,并在Sites页面中点击 Add New按钮

    图:WordPress中添加新的子站点
    在Add New Site页面中填写新站点的信息,Site Address就是你的新站点所处于的目录位置,后面就是站点名称和管理员邮箱。点击 Add Site 按钮,完成操做。

    图:WordPress子站点建立

    完成后再回到 Sites | All Sites 页面,你会看到如今有两个站点了。

  4. 前台分别打开这两个站点的地址,你会看到主站上由于以前导入了数据,因此文章会多一些,而新建的子站上只有Hello World这一篇文章

    图:WordPress多站点升级效果

到这里,咱们就完成了多站点升级的操做。在下一节(3.2)中,咱们将对2个站点进行不一样的语言配置,并安装多语言切换插件将两个站点连接到一块儿。

请关注微信公众号anb-io,每周推送内容,有技术也有生活,一块儿作个有情怀的程序猿。

图片:扫一扫微信订阅号,和你一块儿作一个有情怀的程序猿。

相关文章
相关标签/搜索