下载最新版本 Joomla!
文章分类阅读
会员登录
最新评论
- 好好！一定要试试看的，其实我一 直很期待joomla整合dis cuz X1的！
作者： ultramankiki - 继承和传承，中国人喜欢，没想到 老外也喜欢。传承没有理由。我们 就当是joomla传承MAMB O，...
作者： ljoooooooo - 怎样去除Portfolio Design 的链接啊
作者： 11025 - 下载链接出错了，不能下载哦
作者： shrine - Content static静态化之后，页面上 的图片保存的是相对路径，再次浏 览的时候，就无法找到...
作者： babyfish
Joomla教程 Joomla! 1.5 教程 通过自定义页头 + CSS 实现 Joomla! 与 Tikiwiki 的外观整合| 通过自定义页头 + CSS 实现 Joomla! 与 Tikiwiki 的外观整合 |  |
| 作者：白建鹏 | |||||||||||||||||||||||||||||
| 2008-12-01 | |||||||||||||||||||||||||||||
Tikiwiki 是一款基于 php + MySQL 的 web 程序，尽管名称中有 wiki，但是其开发团队却称之为 TikiWiki CMS/Groupware，因为 TikiWiki 不仅有维基功能，还自带文章系统、论坛、图库、下载、bug 追踪、多用户博客、Newsletter（电子期刊）、地图（Google Maps）等等多种功能。 众所周知，到目前为止，Joomla! 还没有一款真正好用的 wiki 组件。尽管曾经有针对 Joomla 1.0.x 的 OpenWiki 和针对 Joomla 1.5.x 的 JoomlaWiki（实际上它们的核心仍然分别是 DocuWiki 和 MediaWiki），但是经过测试都不能顺利运行。考虑到 wiki 程序的特殊性，我认为选用独立 WiKi 程序比较方便。在与 MediaWiki 和 DocuWiki、BitWeaver 比较之后，我认为 TikiWiki 才是我们需要的 Wiki 程序。 本站的 Wiki 栏目就是用 Tikiwiki 搭建的。安装 Tikiwiki 之后，它的界面自成一体。当进入 wiki 栏目，则网站顶部的导航菜单就看不到了，因为 Tikiwiki 有自己的模板系统。这样既不方便访客切换到其它栏目，也不利于网站风格的统一。幸好在 Tikiwiki 中提供了一个功能叫“自定义页头”（Custom Header），可以帮助解决这个问题。本站借此实现了 Joomla! 与 Tikiwiki 的外观整合，今天就介绍这个方法与各位会员分享。
这个方法对于高手来说，根本不值一提。熟悉 Smarty Template 模板技术的设计人员，可以给任何一个 web 程序的页头添加 Joomla! 模板的顶部导航菜单，实现外观整合。但是，我不是高手。我相信大多数 Joomla! 用户都不是高手。因此，今天介绍这个方法就是为了方便和我一样属于入门级别的用户也能享用这个整合效果。 首先必须感谢 Tikiwiki 的开发人员，他们已经内置了“允许启用自定义页头”的选项。如果没有这个功能，那么全部手动调整虽然也能实现，但是多少有点困难。 已知条件： 1、Joomla! 模板是 JA Mercury，当前色彩方案是“绿色”（green）； 2、已安装 Tikiwiki 2.2 中文版，使用 Tikipedia 模板。 下面两张图展示了在操作之前的状况：大的粉红色区域显示了 Joomla! 模板的顶部 Logo 及导航菜单，小的粉红框则显示了 Tikiwiki 安装之后页面顶部的情况。可以看出，wiki 顶部没有 Joomla! 的 Logo 及导航系统。
我们的目标就是将大的粉红框中的内容添加到 Tikiwiki 的模板中。 查找目标源码首先，我们要知道想要添加的那部分页面内容的源代码。就以上图为例，我们在显示了 Joomla! 模板的论坛页面上点击右键，选择“查看页面源代码”，可以看到下面的样子：
将源代码与前台页面相对比，我们很容易就找出哪些代码代表的是顶部的 Logo 及导航菜单等内容。既然我们需要的是页面顶部，那么目标源代码就是从 <body> 元素之后开始。我们只要判断出在那一行代码处截止就行了。找到之后，复制这段源代码。 注意：提取源代码的过程中最重要的就是保证获得的代码是“自我关闭”的，就是说，有一个 <div>，就必须有对应的 </div> 将它关闭，否则移植后就会出错。 插入页头代码以管理员身份登录 Tikiwiki，点击菜单上的“Admin 首页”，然后点击“外观”，再点击“常规布局”，就看到了自定义页头的选项： 在“自定义网站标题”这里，勾选“启动”，然后在下面输入框中粘贴刚才获得的源代码。点击“应用”按钮，立即看到如下效果：
你看到上图第一个印象是什么？变形，丑陋，…… 对不对？这是为什么？我们来分析一下： 首先可以肯定，我们的大方向没错，因为我们想要的 Logo 图片和菜单链接都显示了。但是没有显示为正确的“样子”。我们应该想到，在 Joomla! 页面上，同样这些内容能够显示得很美观，是由于 CSS 控制了它们的“样式”。而当我们将这些源代码移植到 Tikiwiki 模板上时，这个模板并不受 Joomla! 的 CSS 控制，因此就变样了。 解决方法： 调用 Joomla! 的 CSS 来控制新页头外观我们都知道，一般在模板中调用 CSS 文件的命令是在 HTML 的 <head> 区域使用 <link> 元素来调用的。因此，我们必须找到哪个文件负责给 Tikiwiki 的模板输出 <head> 区域。 经过搜索，发现在 templates/styles/tikipedia/header.tpl 这个文件中（.tpl 文件是 Smarty Template 模板系统的专用格式）。 接下来要解决的问题是：我们调用哪些 CSS 文件到 Tikiwiki 的模板中？ 这还需要分析 Joomla! 页面的源代码。经过查看源代码，我们找到影响页顶内容的代码，不仅有 template_css.css 文件，还有对应当前色彩方案的 green.css 文件，还有控制菜单的 ja-splitmenu.css 文件，另外还有一个 ja_script.js 文件也控制菜单的行为。因此，我们必须把这几个文件都引入到 Tikiwiki 的模板文件中去。 我们在 Tikipedia 这个模板所对应的 header.tpl 文件中，找到 <head> 元素，然后在其后面插入从 Joomla! 页面源代码中复制出来的上述 CSS 文件和 JavaScript 文件的代码。上传修改后的 header.tpl 文件，然后刷新 Tikiwiki 页面，就会看到如下效果：
可以看出，页顶基本上载入了 Joomla! 模板的页头。不过有一个小小的问题：“联系”那个菜单项目跑到第二行了。这似乎提示我们：用来显示菜单的那个 <div> 宽度不够。 这个问题我尝试了好几次没有修复。后来得到本站高级会员 genous 的指点，用新建一个 CSS 文件的方法解决了。将新建的 CSS 文件还上传到 Joomla! 模板的 css 目录，然后在 Tikiwiki 的 header.tpl 文件中添加一行代码来调用它即可。 最终效果如下：
经验小结：经过这次外观整合操作，我有以下体会：
为何不开发 Joomla! 与 Tikiwiki 的桥接器？通过这次外观整合操作，我也再次思考了 wiki 程序与 Joomla! 核心之间桥接器的问题。原来我也期待有人能开发一个整合 Joomla! 与 Tikiwiki 的桥接器，但是现在我认为桥接器反而不好。原因是： 桥接器组件如果要将 wiki 程序嵌入整合到 Joomla! 模板中，就需要编写专门的 router 规则来重写 wiki 栏目的所有页面 URL。由于 wiki 程序的复杂和特殊性质，开发这样的 router 非常困难。 一个佐证就是：Joomla! 官方的文档库 wiki 就没有采用桥接器整合，而是独立安装的 MediaWiki。如果整合的理念正确，他们还发愁没有高手来开发桥接器吗？ 其实说穿了，桥接器无非两个主要功能：外观整合和用户同步。 今天我们已经实现了外观整合，相信你用这个方法完全可以实现与其它 wiki 程序的外观统一。那么，用户同步如何解决？ 我们看看 Joomla! 官方扩展库的一些作品就能得出一个结论：对于大型的、成熟的外部 web 程序，只需要针对 Joomla! 1.5 开发一个“身份认证插件”（Authentication Plugin）就行了。这样用户就能实现一次注册，多处登录。至于外观，还是用本文介绍的方法来整合。到目前为止，我们已经看到有人开发了针对 SugarCRM、DocuWiki、vTigerCRM 等独立 web 程序的验证插件。因此，如果有人能同样开发一个 Tikiwiki 的认证插件，我们用本文介绍的方法再实现外观统一，就完成了 Joomla! 与 Tikiwiki 的整合。
|
下载 Tikiwiki 维基/群组套件程序 4.0 多国语言版
评论
我建议你到本站 wiki 里面，亲手创建一个新的中文标题 的页面，然后同时体验一下中文链 接问题和页面翻译功能。我会为您 创建一个 wiki 帐号并通过 PM 发送给您。
一个简单的东西能被老白说得如此 复杂 i服了u 呵呵.
方法不一定适用于所有用户 因为具体根据本身模板的情况做出 定夺.
but wiki 比较适合全屏显示
评论的 RSS 供稿.