当前位置:文档之家› Joomla模板开发教程

Joomla模板开发教程

Joomla模板开发教程
Joomla模板开发教程

Joomla Template Tutorial

Last Updated Friday, 04 August 2006

在本教程中,我们将完成创建joomla模板这一步。Joomla是一个开放源代码Content Management System (CMS),该系统可以自由(真正的)使用并且由一个很强大的在线社区支持。具体地说,我们将创建一个模板,使用cascading style sheets(css)而不是表格来生产布局。这是一个很合理的目标,因为它意味着模板代码会更容易符合World Wide Web Consortium (W3C)标准。它装载的更快,更容易维持并能在搜索引擎中执行地更好。本教程稍后将讨论这些问题的细节,它包含以下章节。-什么是joomla模板?

阐述joomla模板执行的功能有哪些,不包含内容的模板与添加了内容到CMS的模板之间的区别。

-本地设计过程

设计过程与设计一个静态(x)HTML网页之间的不同之处。

-W3C与无表格设计

涉及到joomla中无表格设计和W3C标准,可用性与无障碍环境三者之间的关系。

-模板组件

joomla模板由什么文件组成,它们各具有什么功能。

-使用CSS创建布局

如何使用CSS代替表格来创建一个源定3栏的布局

-默认的joolma CSS

介绍基本的CSS样式,应该与joomla一起使用,还有被joomla core使用的类型预设名单。

-模块

如何放置,包含圆角新技术的类型模块。

-菜单

一个简单的策略用于生产精益的CSS菜单,模仿出那些用javascript写的菜单效果。

-隐藏栏目

如何控制什么时候显示栏,当没有内容时隐藏栏。

-结论

-附录A:提示与技巧

可变页宽度,圆角,文本成型模以及更多

{mospagebreak title=What is a Joomla Template?}

什么是joomla模板?

Joomla模板就是在joomla CMS里面的一系列文件,用来控制内容的显示。Joomla模板既不是一个网站,也不是一个完整的网站设计。该木板对于查看你的joomla!网站是一个基础。要生产出一个“完整”网站的效果,模板会和存储在joomla数据库中的内容密切合作。以下你可看到一个这方面的例子:

这个截图显示了与样本内容的使用。图B显示了模板,它可能看着与一个原始joomla安装一起,几乎没有内容。模板被格式化了,这样当你的内容被插入禁区时,将继承定义在模板中的样式表,比如连接类型,菜单,导航栏,文本大小和颜色等。注意图片和内容是如何联系的(人们的相片),该内容不是模板的一部分,而在标题那的图片是模板的成分。

为一个CMS使用一个模板,就像joomla一样,有很多优点和缺点:

-内容和外观完全分离,特别是当CSS用于布局时(因为反对在index.php文件中存在表格).这是网站主要标准的一个,符合现代网站标准.

-一个新的模板,因此对网站而言一个全新的外观可以立刻被应用上.这甚至可以和颜色图片一样有不同的内容地点/定位

-如果一个网站内部想有不同的版面配置,这很难实现.虽然不同的模板可以应用到不同的页面,这种内置的功能并不可靠.大多数设计者选择使用各种PHP代码来显示/隐藏栏取决于是否在那个位置公布了内容.(在提示与技巧中讨论到了).

{mospagebreak title=Localhost Design Process}

本地设计过程

你在强大的joomla网站上看到的页面并不是静态的.这就说明它是动态地从存储在数据库中的内容产生的.你所看到的页面是通过在模板中各种PHP命令创建的.这种设计阶段提出了一些困难.

现在使用一个”所见即所得”(WYSIWYG)的HTML编辑器已经很普遍了,比如Dreamweaver.这就意味着设计者不需要再对HTML进行编码.而在joomla模板设计过程中这是不可能的.所见即所得编辑器不能显示一个动态网页.这说明设计者必须”用手”编写代码,然后从一个服务端页面的PHP查看输出页面.只有web服务器拥有足够快速的连接,但是大多数设计者使用他们自己电脑上的”local server”.这是一款服务于设计者自己电脑上网页的软件.

没有办法”立刻”创建一个页面,它取决于设计者自己的背景.那些更图形化的页面在图形软件中比如photoshop制作页面的”形象”,然后将图形分开来使用(名为片和块).高技术的设计师往往直接跳到CSS 进行编码.然而,上面我们提到,joomla模板设计者是受限制的,他不能在相同的编辑器中立刻看到她/他编码的效果.改进的设计过程如下:

-在HTML编辑器中做出修改,保存修改

-在背景下由本地服务器来”运行”joolma

-在网站浏览器中查看编辑

-回到第一步

本地服务器选项

几个本地主机服务器可用:

- JSAS - Joomla Stand Alone Server. WAMP

支持个人电脑上windows系统下joomla的服务器.一个自身包含了Apache-MySQL-PHP服务器. https://www.doczj.com/doc/3a3264453.html,

-XAMPP

在Linux,Windows , Mac OS X和Solaris上安装Apache Distribution很简单.该包包含了Apache web server, MySQL, SQLite,PHP等.

https://www.doczj.com/doc/3a3264453.html,/en/xampp.html

JSAS确实有大量的广告在上面,应该会吸引你.

Easy CSS Styling

是设计过程更有效的令人满意的技术是为你正在设计的网页服务,然后拷贝粘贴源代码到一个编辑器中.例如,一旦你的CSS布局成立,你可以使用其中以个本地服务器来支持一个页面, View_Source,然后将它拷贝粘贴到你的编辑器中,现在你就可以很简单地使用CSS来为页面定义类型,且不需要重复上述步骤.

Some HTML Editor Options for Joomla Designers

对于那些不能支付商业编辑器比如Dreamweaver的人,这有一些免费的编辑器可用:

Nvu是一个坚实的选择,并确认已经建成..它还是一个Mambo/Joomla的延伸,会非常有用. Nvu是100%的开放源代码.这就意味着任何人都欢迎来免费下载Nvu,如果要做特殊的修改的话还包含源代码.你可以从Manboforge得到延伸版.是在这里建立完整的项目.

另外一个选在实际上也是一种验证, "CSE HTML Validator"是集HTML,XHTML,CSS,链接,拼写和无障碍环境检查于一体的验证.你可以在这里取得免费的html验证器版本.

请记住,这些都不是”所见即所得”的html编辑器.

{mospagebreak title=W3C and Tableless Design}

W3C与无表格设计

可用性,可访问性和搜索引擎优化都是用来形容今天万维网中高质量网页的词组,现实中,这三者之间存在大量的重叠,一个网页演示了其中一个的特征也就显示了三者的特征.最简单的方法来达到这三个目标就是使用W3C网页标准中的framework.

例如,一个(x)html语义结构的网站(xhtml解释文件,而不是它看来如何)很容易让某些视力不好的人在一个屏幕阅读器中阅读.对于一个搜索引擎spider阅读也很简单.Google在如何阅读你的网站方面是很盲目的.

一个符合W3C网站标准的网站有一个更好的基础使其变得可访问,可用以及搜索引擎优化.把这些想象成你家房子的建筑法规.一个拥有这些特性的网站会更强大,更安全.你可以用W3C HTML验证服务来核查你的页面.免费的.最简单的,一个符合W3C验证的网站运用(x)html语义结构并通过CSS将内容从外观中分离。

为了帮助你理解网站标准的来源,回顾历史是个好方法。实际上很多网页是针对旧版本的浏览器设计的。为什么?自从www开始后,浏览器不断地演变。新版本已经出现而旧版本已经消失(还记得Netscape?)。另一个复杂的因素是,不同的浏览器制造商(比如微软)试图让他们的浏览器以稍微不同的方式去解释html/xhtml。这导致了网站设计师不得不设计他们的网站以支持旧版本的浏览器而不是新版本。往往网页设计成与这些“遗留的”浏览器相匹配是必须的。

网站标准为所有的网页浏览器投入了一套共用的“规则”来显示一个网页。而推动这些标准的主要组织就是W3C,其负责人,Tim Berners-Lee在1989年发明了world wide web。

如果你问5个设计者:什么是web标准?将会有5个不同的答案。但是大多数认为它们是基于以下内容的:

-有效的代码,无论是html或者xhtml(或其它)

之前我们使用了一个创建结构代码的例子。描述制作网页代码时的标准已经发展成就有连贯性。在https://www.doczj.com/doc/3a3264453.html,中检查你的代码很简单.当你验证你的代码时确保你使用了正确的doctype.在Compass Design上的这篇文章描述了一个有效的joomla doctype.

-代码语义正确

我们前面提到,要有语义,即在网页中的(x)html只描述内容,而不是外观.特别是这就是指有结构组织h1/h2等的标记和只用表格来存放表格数据,而不布置一个网页.

-Cascading Style Sheets (CSS)

与有语义的代码密切相关的,是使用CSS来控制外观和网页的布局.CSS是添加样式(例如字体,颜色,间距)到web文件的一个简单机制. (Source: https://www.doczj.com/doc/3a3264453.html,/Style/CSS/). 它们存在与(x)html类似之处,这就可以让你将内容(语义代码)从外观(CSS)中完全分离. 有关这方面最好的例子是CSS Zen Garden,一个有相同语义的xhtml网站用不同的CSS样式以不同独特的方式成形.结果是很多网页看起来不一样但是却有相同的核心内容.

设计joomla强大的网站,要满足验证标准目前来说是相当大的挑战.在当前发布的一系列新闻中,1.0.X,使用了大量的表格来输出它的页面.它既不使用CSS来设计外观,也不产生语义化正确的代码.这个问题与事实混合在一起,也就是极少数的第三方开发者既使用CSS,也用表格来生成代码.然而,无表格设计与valid并不一样.它很有可能在网站上使用表格来验证, 这会使其更难.在joomla论坛上有一个很有用的线程,进入了解更多详情:

轻松的手法从joolma!输出标准中清除一些表格.

幸运的是, Joomla Core Development团队意识到了joolma这个问题.当1.5版本中从核心内容中移除表格没有变化,在1.6版本中已经定义了路线来记录地址.

无论如何.当创建一个模板时,核心内容仍然会采用,这样它变得方便(比如可升级的字体大小),实用(比如清晰的导航栏),搜索引擎优化(比如资源整齐).

{mospagebreak title=The Template Components}

The Template Components模板组件

为了了解模板的内容.我们开始查看一个空白的joolma模板.在这个文件中,包含了各种组成一个joolma模板的文件和文件夹.这些文件必须放在joolma安装程序的/templates目录下.因此,如果你安装了两个模板,我们的目录就会看起来像:

/templates/JS_Smoothportal

/templates/JS_Synergy

请注意模板的目录名必须和模板的名称一样.既然这样, JS_Smoothportal 和JS_Synergy,很显然它们是区分大小写的,并且不包含空格.传统上最初的设计者或者名字是用作前缀,在模板的目录中,有很多重要的文件:

/JS_Smoothportal/templateDetails.xml

/JS_Smoothportal/index.php

这两个文件名和位置必须和joolma脚本调用时一致.

-templateDetails.xml

(记录大写的”D”)当装载一个使用该模板的网页时,一个XML格式的元数据文件会告诉joomla!其他文件需要什么.它还详细介绍了作者,版权以及模板的组成文件(包括所有使用的图片).最后使用该文件是在管理员端安装模板时.

-index.php

这个文件是最重要的.它涉及网站并告诉joomla CMS在哪放置不同的组件和模块.它是PHP和(x)HTML

的结合.

几乎在所有的模块中,额外的文件都会使用到.像如下显示的那样对它们进行命名和定位是常规:

/JS_Smoothportal/template_thumbnail.png

/JS_Smoothportal/css/template_css.css

/JS_Smoothportal/images/

logo.png

-template_thumbnail.png

一个网站浏览器,模块的截图(往往减小到大约宽140像素,高90像素).安装完模板后,功能”Preview image”可在joomla1执行中看到.

Template Manager.模板管理者

- css/template_css.css

模板的CSS样式.文件夹的位置是可选的,但是你必须指定放在哪.请注意,文件名称只有在引用到index.php文件中时是重要的.你可以随意称呼它.通常显示的名字会被用到,但是我们稍后将看到存在其它CSS文件会有优势.

- images/logo.png

任意与模板匹配的图片.又是组织原因,大部分设计师把它放到图片文件夹中.这里我们将logo.png图片文件作为例子.

要添加模板(再次,存在于丰富的教程中),你要到自己网站的管理端,通过上传压缩文件安装模板.注意事实上你也可以一个个地添加文件(而不是压缩文件的形式).你必须把它们放到你网站上的.com/templates 中.

templateDetails.xml

templateDetails.xml必须包含模板组成部分的所有文件.以及作者和版权信息.有的显示在Template Manager的管理员后端.

如下是一个xml文件例子:

YourTemplate

March 06

Barrie North

GNU/GPL

compassdesigns@https://www.doczj.com/doc/3a3264453.html,

https://www.doczj.com/doc/3a3264453.html,

1.0

An example template that shows a basic xml details file

index.php

js/ie.js

template_thumbnail.png

images/header.png

images/background.png

template_thumbnail.png

css/base.css

css/norightcol.css

css/template_css.css

让我们来解释一下这些代码:

-mosinstall

XML文件的内容用于安装说明。选项类型type=“template”告诉安装者我们正在安装一个模板。

- name:

定义你模板的名称。你在这里输入的名字将被用来在模板目录中创建目录。因此,它不应该包含文件

系统不能识别的字符,比如空格。如果手动安装,你要创建一个目录与模板名相同。

- creationDate:

模板创建的日期。这是一个自由形态的区域,可以是任意像这样的格式:May 2005, 08-June-1978,01/01/2004等。

- author:

该模板作者的名字-大多时候是你的名字。

- copyright:

任何版权信息都进入这一部分。对于Developers & Designers来说是一本许可证,能在joomla论坛找到。

- authorEmail:

Email地址,能找到该模板的作者。

- authorURL:

作者网站的URL

- version:

该模板的版本

- files:

“files”部分包含了所有通用的文件,像模板的PHP源文件,模板预览的缩略图。每一个列出在这个部分的文件都由 括起来。还有一些额外的文件被包含进来,这里我们使用一个模板需要的JavaScript文件例子。

- images:

所有模板使用的图片文件都列在图片区。同样的,所有列出的文件由 括起来。文件的路径信息与模板的根目录息息相关,比如,如果你的模板在目录中名为'YourTemplate',并且所有的图片在'YourTemplate'里面的目录'images'中,那么正确的路径是images/my_image.jpg

- css:

样式表列在CSS区域。同样的,文件名被包含在 中,且它的路径与模板的根路径相关。使用大量由主template_css.css导入的样式表会很有帮助的。我们将在教程后面的内容中详细介绍。

The index.php

在index.php中到底有什么?它是(X)HTML 和PHP的结合,决定有关布局和页面外观的一切。

首先我们会研究取得验证模板的关键部分,在index.php文件顶端的DOCTYPE。这段代码在任意网页的顶端运行。在我们页面的顶端,我们把这段代码放到模板中:

"https://www.doczj.com/doc/3a3264453.html,/TR/xhtml1/DTD/xhtml1-transitional.dtd">

lang=""

xml:lang="">

一个页面DOCTYPE是基本组件的一部分,基本组件是由浏览器显示网页的那一部分,特别是,浏览

器如何解释CSS.为了让你领悟,从https://www.doczj.com/doc/3a3264453.html,上观察显示:

[information on W3C's site about doctypes is] "由geeks为geeks写的.当我说到geeks时,我并不是说普通的网站专业人员像你和我.我是指那些在她收到邮件的第一天使我们这些人看起来像Grandma的人.

无论如何,有一些doctypes你可以使用.基本上,doctype告诉浏览器如何解析页面.这里"strict" and "transitional"两个词开始四周浮动(float:left and float:right通常).本质上讲,自从有了WWW,不同的浏览器在不同程度上支持CSS.这就说明,比如, Internet Explorer不理解"min-width"命令是用来设置最小页宽.为了达到同样的效果.你必须使用CSS中的"hacks".

Strict是指html(或者xhtml)将解析成和标准规定的完全一样.一个transitional doctype是指页面将允许一些与标准不同的地方.

对于复杂的东西,有一种名为"quirks"样式,如果doctype是错误的,过时的,或者不存在的,那么浏览器会进入quirks模式.这是一个与后端兼容的尝试,所以比如Internet Explorer,会呈现出假装成IE4的页面。

不幸的是,有时候人们会意外地结束quirks模式。通常以两种方式发生:

-他们直接从WC3页面使用doctype声明,链接因此中断:

DTD/xhtml1-strict.dtd

除了它是WC3服务器上一个相关的链接外。你需要如上所示的完整路径。

微软建立了IE6,这样你就可以拥有有效的页面,但是是在quirks模式下。将一个"xml prolog"放在doctype 前面后,这就会发生。

关于IE6quirks模式部分是很重要的。在本教程中我们将只为IE6+设计,因此我们会确保它在标准模式下运行。这样可以减少我们之后必须处理的hacks。Xml prolog不管怎样都是没必要的,我们会注意之后joolma的发行情况然后把xml prolog停止掉。

要制作一个符合标准的页面,一个你能在顶端看到"valid xhtml"的页面,并不意味着很难编码,或者很难理解标签。它仅仅说明你使用的代码与你说的doctype匹配。仅此而已!把你的网站设计成符合标准可以在一定程度上减少成说明你所做的,然后做你所说的。

一些有用的链接:

- https://www.doczj.com/doc/3a3264453.html,/css/quirksmode.html

- https://www.doczj.com/doc/3a3264453.html,/stories/doctype

- https://www.doczj.com/doc/3a3264453.html,/QA/2002/04/Web-Quality

- https://www.doczj.com/doc/3a3264453.html,/index.php/topic,7537.0.html

- https://www.doczj.com/doc/3a3264453.html,/index.php/topic,6048.0.html

在index.php中又是什么呢?

首先让我们看看标题的结构,我们希望越小化越好,却仍然足够产生一个网站。我们将使用的标题信息是:

"https://www.doczj.com/doc/3a3264453.html,/TR/xhtml1/DTD/xhtml1-transitional.dtd">

xml:lang=""

if ($my->id) {

initEditor();

}

?>

这些都是什么意思呢?

确保文件不会被直接访问。

"https://www.doczj.com/doc/3a3264453.html,/TR/xhtml1/DTD/xhtml1-transitional.dtd">

xml:lang=""

关于这个上面我们已经讲到。""是从网站的整体配置上引入语言。

我们所使用的字符集,_ISO是一个特殊的用来定义字符集编码的常量。

if ($my->id) {

initEditor();

}

?>

这是一个脚本变量,如果一个用户登录到你的网站时,它非零。如果一个用户登录,WYSIWYG编辑器被预载进来。你可以,如果你愿意,经常预载该编辑器,但是总体上一个匿名的访客不需要添加内容。这样可以为你的网站的普通浏览节省一些脚本overhead。

标题信息再次在整体配置中设置。它包含以下标记(在默认安装的情况下):

A Complete Guide to Creating a Joomla Template

要阻止一个bug,即作为一个无样式内容的flash。Blue Robot的Details courtesy。注意这个可以是任意脚本文件,所以如果我们添加一个的话,我们可以移除这一行。

rel="stylesheet" type="text/css" media="screen" />

这一行为模板链接到CSS文件。PHP代码将返回当前模板的名字。这就生成"portable"这行。当你创建一个新的模板,你可以拷贝它(沿着整个标题代码)且不用担心编辑任何事情。

正如你稍后会看到,在temmplate_css.css文件中,我们将使用@import作为阻止网站与Netscape 4破裂的一种方式。使用旧版本浏览器的用户不能取得CSS样式表,因此将看到我们完全无样式的内容。如果你想配合这些浏览器,我们会有很多CSS hacks,于是我们这样做。一个空白的joolma 模板主体

这将非常简单,准备好了吗?

我们有一个合理的逻辑顺序:

-网站的名称

-路径

-顶端模块

-左模块

-主要内容

-右模块

-默认页脚模块

目的在于尝试并尽可能接近语义标记。从网站角度来看,它意味着网页可以由任何人,浏览器,spider 或者屏幕阅读器阅读。语义布局是可访问性的基石。

现在值得注意的是,在这里我们真正拥有的只是语义布局的可能性。如果一个向前进了,并且把随机的模块放到任意位置,就会引起一片混乱。对于CMS网站重要的的顾虑是,一个模板只是和内容的population一样好。正是这个问题经常使设计者在试图验证他们网站时犯错。

{mospagebreak title=Using CSS to create a layout}

使用CSS创建布局

我们将使用CSS来给Joomla模板制作一个三栏布局。并且会把它制作成一个流体布局。网站页面布局有两个主要的类型,固定的和流体的,这两种类型都提到如何控制页面的宽度。

页宽成为一个问题是因为人们上网所使用的浏览器分辨率。尽管百分比在下降,但是有20%的网民使用800 X 600的分辨率。主要的76%使用1024 X 768或者更高的分辨率(source:https://www.doczj.com/doc/3a3264453.html,).制作一个流体布局意味着你宝贵的网页将不会是一个1024分辨率狭窄的栏目,且在更小的显示器中都可视。

一个典型的设计可能会使用表来对页面布局。它们在你必须设计栏宽为百分比的情况下很有帮助,但是它们也有一些缺点:

-与CSS布局相比,它们有很多额外的代码。这将导致更长的加载时间(网民不喜欢)以及搜索引擎中更差的表现。该代码大致上可以双重大小,不仅仅是标记还有一些名为"spacer gifs"的东西。即使是大公司,有时候也会落入表陷阱中,被一份关于新https://www.doczj.com/doc/3a3264453.html,网站的contorversey看到。

-它们很难维持。要改变一些你必须弄清楚的,所有的td/tr正在做的东西。使用CSS,只要几行代码来检查。

-这些内容不能作为有序的资源。

很多网民在浏览器上看不到网页。那些使用一个文本浏览器或者屏幕阅读器浏览的人将从左上角到右下角进行阅读。这就意味着他们在看到中间栏即重要信息之前首先浏览标题和左栏的所有东西(对于一个3栏布局)。而一个CSS布局允许"source-ordered"内容,也就是内容可以在代码或者资源中进行排列。可能你最重要的网站访问者是Google,它为所有目地和意图使用了一个屏幕阅读器。

让我们看看使用CSS设置的布局。使用CSS你可以以很多方式放置元素(东西)。快速地介绍一个很好的资源Brainjar's CSS Positioning.

如果对于CSS你是新手,你至少阅读了"beginners guide to CSS".这里有一些建议:

Kevin Hale's - An Overview of Current CSS Layout Techniques

htmldog's CSS Beginner's Guide

Mulder's Stylesheets Tutorial

https://www.doczj.com/doc/3a3264453.html,

我们将使用浮点来布置内容。由于其最基本性,模板可能看起来像这样:

"https://www.doczj.com/doc/3a3264453.html,/TR/xhtml1/DTD/xhtml1-transitional.dtd">

xml:lang=""

if ($my->id) {

initEditor();

}

?>

CSS样式在文件的开头被定义来显示正在进行的事件,但是一般的它们是在template_css.css 文件中。

一切都载在一个名为#wrap的盒子或者元素中。该盒子在任何时间都拥有80%的可视宽度。

CSS Shorthand

通过使用”shortland”减少CSS的数量是可行的。这方面的一个例子就是应用于某个元素的填充和margin类型。

margin-top:5px;

margin-bottom:5px;

margin-left:10px;

margin-right:10px;

可以由如下代替:

margin: 5px 10px;

在最开始的类型定义中有”shorthand”类型。一旦你已经揣摩出该类型,填充shorthand版本然后删除long 版本。语法是:

这是一个例子,而非这个…..

font-size:1em;

font-family:Arial,Helvetica,sans-serif;

font-style:italic;

font-weight:bold;

line-height:1.3em;

有这个:

font:bold 1em/1.3em Arial,Helvetica,sans-serif italic;

在An Introduction to CSS阅读更多关于该语法的shorthand属性。

左边,中间和右边的栏均给出自己的元素。每个栏是浮动离开然后给出了一个百分比宽度加起来为100%.clear:在页脚的两种类型告诉浏览器”stop floating “并使页脚横跨这三栏。

要提高布局并给内容添加一些空间,我们需要添加一些列间距,俗称”gutter”.不幸的是,有个问题。你知道Internet Explorer并没有很正确地翻译CSS。有个问题就是不同地计算宽度。我们通过使用一些填充或者一些有宽度的边界来解决这个问题。要获得gutter,我们添加另一个

到列中。显示如下:

给CSS添加:

.inside {padding:10px;}

这个简单的布局是一个用于学习如何将CSS和Joomla一起使用的很好的例子。它给出了CSS超越表格基于布局的两个优点,较少的代码,很容易维持。然而,它并不是有序资源。因此我们必须使用一种更先进的布局名为”nested float”。有了他的允许,我们将使用一个由Dan Cederholm开发的布局,在本教程中有详细的描述。

Source Ordered Three Column CSS Layout

为了帮助解释我们如何做这个例子,让我们首先看一下结果。

[TO DO: PICTURE OF NESTED FLOAT HERE]

该页被分为两个主要floats,第一,#main-body左边浮动,#sidebar-2是右边浮动。这和我们以前做的一样,main-body浮动将首先出现在原代码中。现在,在main-body内部,我们有另外两个浮动;#content

是右边浮动,#sidebar是左边浮动。只要我们正确设置宽度,#content浮动就可以首先出现在源代码中。

现在我们源代码中的浮动顺序是:

#content

#sidebar

#sidebar-2

要知道宽度,我们现在需要做一点数学题。我们都希望每个边宽为25%,#sidebar-2很简单,它将是25%的边宽。然而#sidebar需要一个基于其在

内部一个75%的宽度来定义。它的宽度要为33%. 所以,33% of 75% = 25%

#content的宽度将成为剩余部分。我们会把它设置成66%.最后的1%我们会在#content和#sidebar 之间分割。

CSS会是:

#wrap {width:80%;}

#header {}

#footer {

clear:both;

}

#main-body {

float:left;

width:75%;

}

#sidebar-2 {

float:right;

width:25%;

}

#content {

float:right;

width:66.5%;

}

#sidebar {

float:left;

width:33.5%;

}

.inside {

padding:10px;

}

一些CSS设计师会建议通过让方柱略微小一点来建立以个很小的gutter。这有助于布局防止在Internet Exporer中被破坏。如果你希望很这样做,只要修改#sidebar-2的宽度为24%.

模板的代码如下显示。它在一个滚动框中,所以你可以拷贝并将其粘贴到index.php中。注意我们已经将CSS布局从头部删除。我们要把它放到一个单独的文件中。

"https://www.doczj.com/doc/3a3264453.html,/TR/xhtml1/DTD/xhtml1-transitional.dtd">

xml:lang=""

if ($my->id) {

initEditor();

}

?>

{mostitle=The Default Joomla CSS}

The Default Joomla CSS

目前所有我们的CSS都只是关于布局的。这将制作一个既漂亮又简单的页面,所以让我们添加一些格式吧。我们还会把所有index.php标题中的CSS移出到CSS文件中。

尽管这样会减慢你网站的速度一点点,但是让CSS 含有子文件将会更灵活,然后通过template_css.css 全部载入,一个例子看起来像这样:

/*Compass Design template CSS file*/

@import url("layout.css"); /*layout css file*/

/*

@import url("color.css"); color css file*/

@import url("customize.css"); /*Use this file to customize your website*/

之前提到过,我们使用@import 是因为Netscape 4不理解这个命令。同时它也不理解CSS,因此它将视我们未设计格式的内容为一个文本浏览器。

所有与布局相关的CSS会在layout.css文件中。一旦设置好了,你只能离开它,并要知道你对其它样式表所作的任何改变不会有任何drastic。Color.css文件可能包含了与颜色相关的任意信息(它被指出与这里显示的一样)。你可以快速简单地做一些修改或者设置”color packs”.最后,我们所有的排版和Joomla样式将放在我们的customize.css文件中。

我们的layout.css文件现在是:

/*Compass Design layout.css CSS file*/

body {

text-align:center; /*center hack*/

}

#wrap {

width:80%; /*center hack*/

margin:0 auto; /*center hack*/

text-align:left;

}

#header {

text-align:left;

}

#footer {

clear:both;

}

#main-body {

float:left;

width:75%;

}

#sidebar-2 {

float:right;

width:25%;

overflow:hidden;

margin-left:-3px;

}

#content {

float:right;

width:66.5%;

Joomla! 3.3 - 基础指南1:从头开始 Joomla! 3.3 网站

Joomla! 3.3 - 基础指南1:从头开始Joomla! 3.3 网站 首先,要有计划 有两种类型的网站建设者。 第一种非常典型。客户询问, 我想弄个网站,要蓝色调的;需要多少钱? 他回答, 如果想要带日历的,需要花费$X,当然花$Y可以带个博客。 这种类型的网站建设者好比机械。客户需要什么,他就仅止于提供这样一个网站,而不去用自己的分析或多年经验帮助客户去解决问题。 第二种网站建设者则有望迎来更大的客户。当问到同样的问题,他会说,当然,我们可以把你的网站搞成蓝色调。你能和我谈谈你的机构,以及你的网站希望为此做些什么吗? 通过转而询问客户的机构和他们所需要解决的问题,你会和客户发展互信关系。这意味着完成网站是你和客户关系的开始,会导致进一步的合作,而不是和客户关系的终结。开展和老客户的业务要容易很多,远胜不停地寻找新客户。 如果你想成为第二种类型的人,更为成功的网站建设者,这里有些指南供你从头梳理你的Joomla! 3.3网站。 机构、用户和网站的目标 就从和客户讨论他们的机构开始,是要做商业网站、非盈利网站还是个人网站。你或许需要询问到以下问题,它们还有附加问题: ?机构目标是什么? (例如:结束世界饥饿,销售针织产品赚钱,为最新活动提供更新) ?机构创建日期和服务对象? ?机构为何需要网站? 网站已经存在还是新建? ?如果网站已经存在,那么保留老网站的价值何在? 你会给老网站添加些什么内容? 网站的信息是否仍旧定位准确,或者机构在网站最终改版后有无变化? ?谁来维护网站? (例如: IT员工、内部网管、兼有其它职责的秘书,或完全由你来负责更新) 除了以上问题,你可能会想提些附加问题以便全面了解客户,并寻求下面三个关键问题的答案: ?机构的目标是什么? ?网站的目标是什么,它是如何支持机构目标的? ?网站访客想从网站得到什么,这又是如何契合网站和机构的目标的? 从讨论中你应当识别某些需要用到的网站扩展类型(比如:带有"即将举行的活动"的日历模块;带有评论和标签的博客;带有PayPal界面的购物车)。 你还应当给网站开发个网站地图。这是对于网站所有页面和它们如何相互链接的详细说明。术语网站地图也指包含网站每个页面链接的页面。第一个网站地图可以在纸上画出所有的页面和导航结构,第二个网站地图就可以用诸如XMap 的扩展来生成。 有关网站规划的更多信息,我推荐下列资源: ?The Elements of User Experience, by Jesse James Garrett

Joomla一小时快速建站教程

Joomla! 2.5.x 一小时快速建站手册 Joomla!入门教程之建站实战——————————————————————————————————————本手册旨在演示如何用Joomla! 2.5.x 实现第一次快速建站。手册涉及的内容大致包括: ●删除示范站点数据; ●定制站点模版; ●添加网站内容。遵循CASH 工作流程: ?创建站点内容框架(C,Categorize 归类); ?添加内容(A,Add 添加); ?添加菜单及菜单项(SH,Show 展示); ●添加站点功能:创建交互式联系表单及投票功能; ●完成第一个Joomla!实例站点。 本手册所完成站点的首页效果如上图所示。该站点基于Joomla!2.5.x 示范站点,并依据客户需求进行精心调整。

会见客户了解客户需求 请允许我为你介绍你的第一位客户。这是一家名为CORBA(Collectors Of Really Bad Art)的俱乐部,喜欢收集一些看起来比较古怪甚至令人恶心的绘画和一些奇丑无比的其他形式的艺术作品。这些作品在专业人士看来通常只能被丢弃到垃圾堆中,或者是只能在慈善团体中售卖。这个俱乐部认为,丑陋的作品正因为其丑陋的一面而值得收藏。 当地报纸和电视台打算对CORBA 俱乐部进行报道,俱乐部负责人请你尽快为他们创建一个网站,并希望借此机会推广他们的理念以及让更多人了解俱乐部。 你也许不熟悉相关艺术领域,但这确是你展示建站艺术的大好机会。经沟通,你了解到CORGA 俱乐部对网站有如下需求: ●网站的外观需与俱乐部Logo 相配,配色需与俱乐部定制使用的信纸、信封等办公用 品相适应。 ●网站需呈现出组织结构良好的内容页,且便于日后俱乐部内容的扩充。 ●首页需展现出一些经过精选的新近收集的艺术品内容。 ●访客能有效的与俱乐部进行沟通,需构建一个在线交互式通信表单。 清除示范站点数据 (若安装Joomla!时未安装示范站点数据,此步可略过。) 为一睹Joomla!芳颜,初次安装时往往都会选择安装示范站点数据。当你将要准备搭建正式站点时,这些示范站点数据不但毫无用处,还显得碍手碍脚。不幸的是,Joomla!后台并没有“删除示范站点数据”的按钮。与其着手重新安装一个Joomla!空白站点,还不如手动删除这些“垃圾”来的更快些。要手动删除示范站点数据,只需两步即可。 如果你打算重新安装Joomla!平台进行建站,那么无需安装示例站点数据。 第一步,清除示例站点内容 首先需要清除示例站点内容,这包括三方面工作: ●实际内容:包括文章以及Joomla!用来组织文章的容器-‘类’。 ●链接到这些文章和类的菜单。 ●模块:一些预制的功能块,例如登录表单。 操作要点:清除文章和类 在文章管理中,将所有希望清除的文章放入回收站(Trash)。放入回收站的文章并没有在后台的数据库中真正被清除,日后仍可以恢复。若想永久清除回收站中的文章,首先将筛选条件中“选择状态”设定为“已转入回收站”,然后全选并执行右上角“清空回收站”操作。 用同样的方法可以在分类管理中清除所有的“类”。注意,需保留类名为“uncategorised”

joomla教程

1、首先下载Joomla 源程序 首页:https://www.doczj.com/doc/3a3264453.html,/download.html 下载:download 2、为论坛创建数据库。进入cPanel面板,选择mysqldatabase选项,新建数据库(数据库名:joomla),新建数据库用户(用户名:joo12 3、密码:123456),在下面将这个数据库用户添加到数据库中,并且指定权限为所有权限(ALL PRIVILEGES)(注意:数据库创建好后系统会自动在数据库名、数据库用户名前面加上你主机的用户名,比如我的主机帐户是XXX,那么数据库名就是XXX_joomla、数据库用户名:XXX_joo123) 3、用CuteFTP登陆空间,将Joomla解压上传到public_html目录下 6、在浏览器地址栏内输入joomla所在目录的网址,现在可以安装了。 7、选择语言,一般是选繁体中文或英文,这里选繁体中文(最后一个)如下图: 8、显示安装前的检查,直接单击下一步下图所示:

9、显示国际开源组织的授权规范,单击下一步 10、填写数据库信息:

数据库类型:mysql 主机名称: localhost 账号:qiwsoft0_joo123 密码:123456 数据库名称:qiwsoft0_joomla 数据表前缀:默认 填写好后单击下一步如图所示: 11、 FTP设定,一般是不需要的,空间上有FTP管理。单击下一步

12、网站设置: 网站名称:我的网站 E-mail:mail@https://www.doczj.com/doc/3a3264453.html, 管理员密码:admin 确认密码:admin 安装预设资料:单击就能安装 设定之后单击下一步下图所示:

K2安装及设置快速指南

Joomla文档中文翻译- K2 Wednesday, 17 March 2010 09:36 今天开始,文档教程翻译这块内容进入K2部分。感谢DeadFire同学提出的需求建议。 开搞。 K2是一款由JoomlaWorks开发的Joomla内容组件,为Joomla带来了类似CCK(Content Construction Kit)的功能;这边是JED中的K2索引页面,包括详细功能特色及截图演示等。话说对于CCK的概念,Drupal 玩家应该更熟悉些。 通过K2,我们可以使用更现代的方式来管理内容,将我们的Joomla站点打造成博客、分类名录或杂志型网站等。下面就是K2在安装及设置方面的快速指南,参考这些步骤,我们可以很容易的上手K2;来看看: 1. 到getk https://www.doczj.com/doc/3a3264453.html,下载最新版本的K2。 2. 通过Joomla的扩展管理安装K2组件。 3. 安装成功后,通过Joomla的组件菜单进入K2首页面板。 4. 创建Extra Field Groups,根据自己的内容需求进行命名,例如Blog、Catalog(名录)、Directory(目 录)等;大致的原则,就是每一个Extra Field Group都针对一种内容类别。 5. 根据我们的内容所包含的属性需求,为不同类别的内容创建Extra Fields,并分配到相应的Extra Field Group中。默认共有6种类别的fields,分别是text field、textarea、下拉菜单、多选菜单、单选按钮及链接,用来创建不同类别的内容额外属性。 6. 为我们的内容创建分类(Categories),并为每个分类绑定对应的Extra Field Group。 7. 创建用户群组(User Groups)。K2自带两个组别的用户:注册用户(Registere)和网站拥有者(Site Owner)。在群组设定页面中有相应的权限设定(Permissions),例如,如果我们需要某个组别的用户有权限在站点前台发布内容,那么可以将“Front-e nd item editing”和“Add items”设置为“Yes”;如果希望这些用户只能编辑自己发布的内容,那么将“Edit own items”设置为“Yes”,而“Edit All items”可以允许用户编辑全部内容。“Publish items”和“Post comments”分别用来设置用户发布内容和发布评论的权限。 8. 创建好用户群组并设置好相关权限后,就可以将现有的注册用户分配到相应的组别中了,并可 以为他们添加性别、描述、头像等个人信息。这些信息将显示在用户发表的内容的下面。 9. 可以预先为能够预计到的内容创建一些tag标签。 10. 在Joomla的菜单管理中创建新的菜单项并根据需要选择K2组件的不同类别,其中: ?“Item”类型对应着通过K2创建的某个单篇内容。 ?“Categories”会陈列出通过K2创建的某分类中的内容。 ?“Tag”用来显示通过K2创建的包含某tag标签的全部内容。 ?“User Page(blog)”用来显示某用户的个人页面,内容将以blog的形式输出。 11. 根据需求,可以在模块管理中创建或发布K2登录模块、K2评论模块或K2内容模块,用来显示 基于K2用户管理机制的登录表单、评论及评论表单、内容列表输出。

joomla模板完美开发教程

Joomla模板制作实战教程【一】-创建一个简单的模板 Joomla绝对是一款优秀的CMS,相较一些国产CMS她始终不能占据优势地位,很多人说Joomla做模板难、Joomla不支持静态生成、Joomla执行效率低等等,但其实Joomla团队为这些东西做了很多的功夫,细细研究不难发现,Joomla模板只需要会Html+CSS就行了,Joomla的静态生成其实就是System-cache(缓存插件),当做足了优化之后,Joomla的执行效率是相当可观的,如本站https://www.doczj.com/doc/3a3264453.html,(优化的方法会在后面的教程中提及) 话说Joomla模板难做,这是很多入门的学习者遇上的足以让他放弃Joomla的门槛,那么我要说的是Joomla模板一点不难,它的难点根本不在于“是否会PHP”,而是在于不敢钻研的心,那么为了砍掉这个所谓的“门槛”,我将为大家带来这个系列的模板实战教程。 做之前我们必须要准备这几样东西! 11、持之以恒的心 22、必要的HTML+CSS基础知识 33、熟悉了Joomla的使用方法、工作原理 44、一丝不苟的工作态度。 55、认认真真的看好教程,不要急着复制粘贴。 开始我们的模板制作(以Joomla 1.5.x为例,完结之后会推出Joomla 1.7.x相关教程) 安装好Joomla 1.5.x,在templates/目录下建立一个我们要制作的模板文件夹,命名为jk_joomlask,这时候在后台我们尚且看不到有jk_joomlask的这个模板选项。 *Joomla网站系统是基于utf-8编码编写的,所以以下所有操作的文件都务必保存为utf-8编码。 第一步我们需要让其在Joomla后台中显示这个模板选项,创建文件templateDetails.xml,不要担心会不会xml,很简单,根据官方文档给出的说明,照着写便是: JK JOOMLASK 2011-09-05 Joomlasker joomlasker(at)https://www.doczj.com/doc/3a3264453.html,

html模板,后台

竭诚为您提供优质文档/双击可除 html模板,后台 篇一:10个最好的免费php网站后台管理系统 1、joomla! 20xx年开源cms第一名!joomla!是使用php语言加上mysql数据库开发的软件系统,可以再linux、windows、macosx等各种不同的平台上执行。操作接口除了美观之外,也花了很多心力在设计这些接口的简易操作性。但初次使用者,需要花一点时间学习操作的方式,才能运用自如。 这款cms与drupal一样,在中国及其他国家的应用还是很多的,尤其公司。 官方网站: 4、dedecms 一款国内开源的cms,作者是一个个人,能做出如此功能的cms,是相当不错的,20xx版功能十分强大,希望能改善之前的数据量一大更新静态页就很慢的缺点。因为开源,有较多的玩家和拥护者。非常适合有一定编程基础的站长。 官方网站: 5、phpcms

一个综合的网站管理系统,由php+mysql构架全站生成html,能够快速高效地应用于linux和windows服务器平台,是目前中国linux环境下最佳的网站管理应用解决方案之一。现在已经被酷6收购。 官方网站: 8、hbcms 一个以php官方网站推荐的peaR+smaRty技术架构的cms,比较容易上手,适合没经验的新人做网站。没有下载,分类信息等模块,适合做文章为主的网站。全站生成静态页,默认附带了几套模板,可以方便的更换模板。个人企业都免费,无需授权。 官方网站:。 9、supsite 是盛康的产品,一款将论坛资源自动转换成门户网站的php程序系统,使用supesite,利用discuz!论坛,将自动 拥有一个功能完备的、资源丰富的站点系统;由论坛变成网站,一切都是自动完成,不需要任何干涉,轻轻松松实现建立网站的母的。 10、wordpress wordpress是一款非常优秀的php和mysql的blog软件,但是他完全可以当做cms系统来用。从wordpress官方最近几个版本的升级中可以看出,工作人员正在把wordpress向

joomla教程-多语言网站的设计教程

Joomla多语言网站就是同一网站里包含多种语言版本的内容,比如中文版,英文版… 网站用户可以通过网站提供语言切换器选择适合自己的语言。在 Joomla 中实现多语言网站并不需要安装额外的扩展,下面我们就介绍一下如何使用来实施多语言网站。 这篇文章介绍了使用Joomla 创建中英文双语的网站。 文章中所做的网站你可以从这里下载:?file/beeny7wx#?,安装过程中记得点击“安装示范内容”。请参考下面两个视频演示: 安装的视频教程 安装简体中文语言包的视频演示 大体的步骤: 1.开启“语言筛选”插件 2.添加网站语言 3.为不同语言创建各自的文章分类 4.在不同语言的文章分类里添加各自的语言版本的文章 5.为不同语言创建各自的菜单 6.在不同语言的菜单里添加各自的语言版本的菜单项 7.为不同语言创建各自的模块 准备 下载并安装Joomla ,官方下载地址:,注意安装过程中不要安装演示数据。然后下载并安装简体中文语言包?。 安装好以后,把简体中文设置为Joomla默认使用的语言。 开启语言筛选插件 打开扩展->插件管理,启用“系统 - 语言筛选”。 添加语言版本 打开扩展->语言管理,打开“内容”,点击工具栏上的“新建”。 标题:简体中文 本地语标题:简体中文 URL语言代码:zh 图像前缀:zh 语言标签:zh-CN 状态:已发布?? 点击“保存并关闭”。 创建文章分类 打开内容->分类管理,我们分别为中文与英文各自创建一个分类。 点击工具栏上的“新建”。 标题:新闻 别名:news-zh

状态:已发布 语种:简体中文 ?? 点击“保存并新建”再创建一个英文的分类。 标题:News 别名:news-en 状态:已发布 语种:English(UK) 点击“保存并关闭”。 为分类添加文章 有了分类以后我们在这两个分类里面各自添加一篇内容,一个是中文版的内容,一个是英文版的内容。 打开内容->内容管理,点击“新建”。 标题:你好世界! 别名:hello-world 分类:新闻 状态:已发布 语种:简体中文 在文章全文里输入一些内容:这是一篇测试文章。 点击“保存并新建” 。 标题:Hello World 别名:hello-world 分类:News 状态:已发布 语种:English(UK) 在文章全文里输入一些内容:This is a test article ! 选中这两篇文章,然后点击工具栏上的“精选”,把这两篇文章推荐到首页上显示。 创建菜单 有了文章以后,下面再去为不同的语言创建菜单。 打开菜单->菜单管理。 目前在菜单管理里面有一个默认的“Main Menu”菜单,在这个菜单里面有一个叫“Home”的菜单项。这个菜单项的语种选择的是“所有”。 下面我们分别为中文跟英文各创建一个菜单。 打开菜单管理,点击“新建”,先创建一个中文版的菜单: 标题:Main Menu - ZH 菜单类型:mainmenu-zh 说明:中文菜单

Joomla1.5系列组件开发教程

第一章Joomla!扩展开发:概况 你以前开发过动态网站但你的朋友告诉你有关Joomla!的事,所以你决定试一试。从美食网上那些著名的厨师中得到灵感后,你想建立一个简单的关于餐厅的网站。这个网站的安装比你期望要建立的内容管理系统要快速和平稳。 当你找到一个精美的模板并添加了一些菜单和一些内容后,你开始考虑增加 一些新的特性可以给你带来更多的访问量,甚至是利润。之后,你安装了购物车来买书,一个论坛来收集意见和一些边栏广告。 为什么扩展Joomla Joomla!不但能够处理内容文章,而且允许你干净整合各种复杂的应用。开发者为Joomla!开发各种扩展,如购物车、论坛、职位发布等。所有这些扩展能够运行在单个数据库、模板和核心。我们开发出来的扩展,界面是完全统一的。 当你正确地开发扩展后,你就不用登录数据库和做其他基本的配置。另外,你也可以分发你自己开发的扩展给别人与别人分享你的成果,不需要另外的编程和数据库操作。 自定义VS 扩展 Joomla!的代码是设计成可扩展的而不是直接修改它的核心代码。当有升级版本或者有补丁的时候,Joomla!才会升级它本身的核心代码,而你的扩展是不会被覆盖的。 如何扩展Joomla Joomla!支持三类扩展,每一类都有其特殊的用途。 组件 组件是最基本的,组件就是你所看到的页面的主要部分。Joomla!的设计是为每个页面加载和运行一个组件。因此,Joomla!核心的内容管理功能本身也是一个组件(例如: com_content)。 组件通常有强大的后台管理功能。后台通常用来创建和更新数据库记录。你也可以通过它允许网站管理员去上传图片或者视频文件。 模块

Joomla! 3.3 - 基础指南3: 为Joomla安装语言

Joomla! 3.3 - 基础指南3:为Joomla安装语言 本系列教学转自 Cocoate免费书库,英文原著由Hagen Graf编写,中文翻译由Derek Joe完成 至此,您的网站和控制面板还都只是英文版。这是Joomla的基础语言。安装时我们选择的语言,仅仅只在安装时起作用。 因为有很多Joomla用户的母语都不是英语,因此本章内容非常重要。 语言管理器 首先我们来看看怎么设置您想要的语言。当然现在我们的Joomla网站还没有多种语言,只有英文。 语言管理器(扩展→语言管理)分为四个部分: 1. 已安装- 网站前台 这里是一个已为网站前台安装的语言的列表。您可以将其中一种设置为网站前台默认的语言,激活或灭活其它语言(图1)。 图1: 网站前台的语言 2. 已安装- 后台管理 这里是一个已为网站管理后台安装的语言的列表。您可以将其中一种设置为网站后台默认的语言,激活或灭活其它语言(图2) 图2: 网站管理后台的语言 3. 内容 在此您可以设置某语言下的网站名称、元数据、语言代码,等等(图3)。

图3: 某语言的参数设置 4. 语言覆盖 您可以个性化语言词条。当您只需要改变少量词条的时候,这是非常有用的。 Joomla语言管理系统将词条,如“请登录以阅读文章”存储于如“COM_CONTENT_ERROR_LOGIN_TO_VIEW_ARTICLE”这样的变量中。如果您觉得这个词条的翻译不合您的心意,您可以在此覆盖它(图4)。您可以通过搜索找到某个词条对应的文本字串。 图4: 语言覆盖 安装一种新语言 在语言管理器前两项的左上方都有安装语言的按钮,点击后Joomla带您转至扩展→扩展管理→安装语言。如果您是第一次使用这一功能,您会看到所有可以使用的语言包。选择您想要的语言后,点击安装按钮即可。(图5).

一步一步傻瓜式Joomla建网站—后台管理(安装模板)

一步一步傻瓜式Joomla建网站—后台管理(安装模板) 作者:https://www.doczj.com/doc/3a3264453.html, 不会HTMl, 不会写码,没关系。只要你会打字和会一些简单的网上操作,没有基础的菜鸟一样可以自己建网站。 先介绍一下软件:Joomla是世界上最流行的一款“内容管理系统”开源软件之一。Joomla随着数以百万计的运行于各种的网站,该软件在全球范围内用于个人,小型和中小型企业,包括欧洲联盟,联合国和世界卫生组织在内的大型组织和世界范围内的3090政府网站都是用这款开源软件创建的。 上篇介绍搭建当地测试环境、Joomla的安装。接着继续Joomla的后台管理-安装模板 运行The Uniform Server后,打开一个浏览器,在地址栏中键入 http://localhost/myweb可以看到安装好的默认的网页模板;键入 http://localhost/myweb/administrator/进入后台的管理。 Use name: admin Password: 654321(在Joomla安装时主要配置页,输入的系统管理员用户名和系统管理员密码) 选择更换网页模板:

到“Extensions/Template Manager” 可以看到Joomla自带3个网页模板和2个后台模板, 点击前面对应模板的复选框,再点击上面的“Make Default”,保存你的选项。更换模板。 如果喜欢Joomla自带网页模板,也可以更换的其他的模板。(网上有很多免费的Joomla模板) 安装模板:将你挑选的模板下载到本地计算机。到“Extensions/Extension Manager”

全集教程全部地址大全

joomla 教程模板网站建设教程新手建网站从0开始 https://www.doczj.com/doc/3a3264453.html,/item.htm?spm=a1z10.1.w2233635214.1.fLbh0s&id=23303904378 电驴破解软件,无需账号,无需铜光盘,直接现下载链接,可试用 https://www.doczj.com/doc/3a3264453.html,/item.htm?spm=a1z10.1.w2233635214.3.fLbh0s&id=19373415088 电驴下载教程(无需账号,只要能联网就可以) https://www.doczj.com/doc/3a3264453.html,/item.htm?spm=a1z10.1.w2233635214.5.fLbh0s&id=175******** 动网论坛DVBBS论坛搭建,修改教程 https://www.doczj.com/doc/3a3264453.html,/item.htm?spm=a1z10.1.w2233635214.7.fLbh0s&id=19388327773 https://www.doczj.com/doc/3a3264453.html,/share/link?shareid=561188&uk=2015333979 欢乐视频闷抓四人斗地主|双升|双Q|辅助|记牌器 https://www.doczj.com/doc/3a3264453.html,/item.htm?spm=a1z10.1.w2233635214.9.fLbh0s&id=175******** c#语言全套高清培训视频教程入门到精通从零开始可试看 https://www.doczj.com/doc/3a3264453.html,/item.htm?spm=a1z10.1.w2233635214.11.fLbh0s&id=175******** https://www.doczj.com/doc/3a3264453.html,/share/link?shareid=559483&uk=2015333979 E易语言全套入门到精通精简高清视频教程送易语言源码 https://www.doczj.com/doc/3a3264453.html,/item.htm?spm=a1z10.1.w2233635214.13.fLbh0s&id=175******** https://www.doczj.com/doc/3a3264453.html,/share/link?shareid=561186&uk=2015333979 Visual C++ 6.0高清视频教程送Visual C++ 6.0 简体中文企业版 https://www.doczj.com/doc/3a3264453.html,/item.htm?spm=a1z10.1.w2233635214.15.fLbh0s&id=19389171509 织梦教程|织梦仿站教程|dede仿站教程|全套高清视频教程 https://www.doczj.com/doc/3a3264453.html,/item.htm?spm=a1z10.1.w2233635214.17.fLbh0s&id=175******** https://www.doczj.com/doc/3a3264453.html,/share/link?shareid=559487&uk=2015333979 photoshop教程cs4 ps教程|图片处理视频|ps自学高清视频教程试看 https://www.doczj.com/doc/3a3264453.html,/item.htm?spm=a1z10.1.w2233635214.19.fLbh0s&id=23330656915 https://www.doczj.com/doc/3a3264453.html,/share/link?shareid=559485&uk=2015333979 CAD教程CAD2010自学全套零基础教程autocad送制图软件

网站制作软件有哪些

网站制作软件包括: 一、菜鸟级网页制作软件 如果你是一个网页制作初学者,那么让FrontPage带你走进那绚丽多彩的网页制作世界吧! ①Microsoft FrontPage 如果你曾对Word很熟悉,那么相信你用FrontPage进行网页设计一定会非常顺手。使用FrontPage制作网页,你能真正体会到“功能强大,简单易用”的含义。页面制作由FrontPage中的Editor完成,其工作窗口由3个标签页组成,分别是“所见即所得”的编辑页,HTML代码编辑页和预览页。FrontPage带有图形和GIF动画编辑器,支持CGI和CSS。向导和模板都能使初学者在编辑网页时感到更加方便。 小编注:虽然介绍是这样说,但是小编我从来没有用过这款软件,我是直接就学了DreamWeaver,下面看介绍。 二、中级网页制作软件 如果你对网页设计已经有了一定的基础,对HTML脚本语言又有一定的了解,那么DreamWeaver是你不二的选择。 ①DreamWeaver 自制动态HTML动画的网页 DreamWeaver是一个很酷的网页设计软件,它包括可视化编辑、HTML代码编辑的软件包,并支持ActiveX、JavaScript、Java、Flash、ShockWave等特性,而且它还能通过拖拽从头到尾制作动态的HTML动画,支持动态HTML(Dynamic HTML)的设计,使得页面没有plug-in也能够在Netscape和IE 4.0浏览器中正确地显示页面的动画。同时它还提供了自动更新页面信息的功能。 DreamWeaver还采用了Roundtrip HTML技术。这项技术使得网页在DreamWeaver和HTML代码编辑器之间进行自由转换,HTML句法及结构不变。这样,专业设计者可以在不改变原有编辑习惯的同时,充分享受到可视化编辑带来的益处。DreamWeaver最具挑战性和生命力的是它的开放式设计,这项设计使任何人都可以轻易扩展它的功能。 小编注:对于初入门的人来说,这款软件还是有学的必要,以后对你制作div+css页面很有帮助,当时你必须结合学习以下三种脚本:html,css和javascript。因为这篇文章主要介绍软件,所以对脚本我就不多所,大家自己百度找教材看,比如搜索:html入门。 ②Fireworks,第一款彻底为Web制作者们设计的图片处理软件。 Fireworks的来头实在不小,它的出现使Web作图发生了革命性的变化。Fireworks是专为网络图像设计而开发,内建丰富的支持网络出版功能,比如Fireworks能够自动切图、生成鼠标动态感应的javascript。而且Fireworks具有十分强大的动画功能和一个几乎完美的网络图像生成器(Export功能)。它增强了与dreamweaver的联系,可以直接生成dreamweaver的Libaray甚至能够导出为配合CSS式样的网页及图片! 小编注:处理网页图片必备,大家好好学习。

Joomla! 3.3 - 基础指南4:Joomla设计、界面、颜色

Joomla! 3.3 - 基础指南4:Joomla设计、界面、颜色 本系列教学转自 Cocoate免费书库,英文原著由Hagen Graf编写,中文翻译由Derek Joe完成 模板是一个网站最重要的部分。它为网站提供外观设计,并吸引新访客在您的网站逗留和浏览。 什么叫设计? 设计作为名词,指的是通过一个计划或者绘画显示某事物的功能和前景,并在一定的环境达到某个特定的目标,并满足一系列的需求。 设计作为动词,指的是在一个设计环境下创造一个设计。 因此设计一词可以用于 艺术(“纯直觉的”、“内在的”、“自然的”、“我们感觉合适的”) 机械工程(一款新车的产品设计) 生产制造(计划和执行) 流程(业务流程建模) 什么是页面布局? 页面布局是“图片”设计的一部分工作,它主要解决一个页面的风格元素(如内容)以及这些元素的页面安排。以Joomla的专业术语来说,页面布局就是在预定的模板位置安排Joomla 的模块和组件。 什么是颜色? 颜色是人类的视觉财产,是我们称之为红色、绿色、蓝色等等视觉感觉的总称。常有些特定的颜色与文化如国旗的颜色相关。颜色的应用具有多样性,它们与文化的联系甚至与同一种文化不同年代的联系也是多元化的。 HTML颜色和CSS颜色有1600万种不同的颜色值。它们由红色、绿色、蓝色混合而成,每种颜色的最小值是0,最大值是255。这些值最终组合成超过1600万种不同的颜色(256 x 256 x 256)。 举例:黑色 = 16进制颜色中的#000000 = RGB颜色中的rgb(0,0,0) 有几个工具(如color scheme designer)可以帮助你为你的网站找到正确的颜色(图3)。

网上商城管理信息系统(仅供内部参考)

网上商城管理信息系统 网店管理系统顾名思义就是网上开店系统,作为电子商务的一种形式,是一种能够让人们在浏览的同时进行实际购买,并且通过各种支付手段进行支付完成交易全过程的系统,是电子零售商业的典型组织形式,是建立在因特网上的商场。一个可以让顾客用计算机购物、商人可以贩卖产品服务,又可以缩减维护实际店面管销成本的地方。它改变从传统的店面销售到网络上虚拟销售的一种模式,大大节约了购物之间的人力,物力。 一.系统概述 1.网络商店的定义 网店是电子商务的一种形式,常是指客户通过互联网下订单,采取一定的付款和送货方式,最终完成交易的一种电子商务形式。正如同在大型商场中租用场地开设商家的专卖店一样。但是由于是在网上开的店,所以较实体店铺经营而言,前期资金投入较少,而且受时间,场地等因素的影响较小而在今年来迅速兴起的一种购物方式。 网店系统开发语言:php平台,是全球最普及、应用最广泛的互联网开发语言之一。PHP语言可操作多种主流与非主流的数据库,支持面向对象的编程,支持多种开源代码,支持跨平台操作,而且完全免费,越来越受到广大程序员的青睐和认可。2.网上商店的发展趋势 网上商店的特别使其充满了活力和生命力,或许以后会取代传统商业成为交易 的主要方式,挑战着现在商业的模式。 然而,优势必须要依靠规模效应来体现,业务量越大,成本的优势越明显。然而,目前的情况是,目前网店多半规模较小,不少店主是为了兴趣,或者抱着尝试的态度来做。交易中拼的也是价格。此外网上商店尚未形成真正的市场,同业者之间既没有联合,也不存在竞争,各自为战,自生自灭,根本没能力同传统商业相抗衡。部分商店的营业额不及连锁超市的一个分店,更很难说服供应商给你最优惠的折扣。 另一方面,越来越大的就业压力迫使我们必须创新就业方式和途径,广开渠道解决就业问题。由于个人电子商务的尝试门槛低、投入成本小,给许多“待业在家、只能白手起家”的人群提供了就业机会,也可能成为致富机会,从而大大缓解我国就业压力。随着网络购物逐渐走俏,网络创业就业的容纳力将进一步扩大,社会应该有意识地鼓励各类人群参与到网络创业就业中去,包括发展中西部地区农村,在解决人口

【教程】如何在Virtualbox中创建Windows XP的虚拟机

如果您觉得本站(的帖子,文章等)对您有帮助,觉得非

版本:Windows XP 4.设置内存大小 此处需要根据你自己的当前电脑配置决定何时的大小。一般做法为,小于物理内存的一半。我这里是8G 内存,此处分配3G 给虚拟机。 5. 创建爱你新的虚拟硬盘 qo 发表在《【整理】虚拟机的选择,VMWare 还是VirtualBox – 绝对推荐VirtualBox 》crifan 发表在《关于本人》 2012 年十二月 一二 三 四 五 六日? 十一 1234567891011121314151617181920212223242526 27 28 29 30 31 页面 个人已发布的作品 crifanLib – Crifan’s Library (C#/Python /PHP/C/…)Embedded Website Dotnet downloadSonstasteMusic(下载Songtaste 歌曲) v1.5 – 下载 Songtaste(ST)中正在播放的歌曲/单首歌曲/整张专辑 InsertSkydriveFiles v4.3 – a WLW Plugin to insert file into wlw from skydrive Python BlogsToWordPress v16.6 – 将百度空间(新版和旧版),网易163,新浪sina,QQ 空间,人人网,CSDN,搜狐Sohu,博客大巴 Blogbus,天涯博客,点点轻博客等博客搬家到WordPress BlogsToWordPress 的用法的举例说明 BlogsToWordPress 使用前必读 recSongtasteMusic – 推荐Songtaste 歌曲,用于生成包含推荐歌曲信息的HTML 表格 关于 关于本人关于本站 网站大事记 站点地图联系我 分类目录

h5后台模板

竭诚为您提供优质文档/双击可除 h5后台模板 篇一:10个最好的免费php网站后台管理系统 1、joomla! 20xx年开源cms第一名!joomla!是使用php语言加上mysql数据库开发的软件系统,可以再linux、windows、macosx等各种不同的平台上执行。操作接口除了美观之外,也花了很多心力在设计这些接口的简易操作性。但初次使用者,需要花一点时间学习操作的方式,才能运用自如。 这款cms与drupal一样,在中国及其他国家的应用还是很多的,尤其公司。 官方网站: 4、dedecms 一款国内开源的cms,作者是一个个人,能做出如此功能的cms,是相当不错的,20xx版功能十分强大,希望能改善之前的数据量一大更新静态页就很慢的缺点。因为开源,有较多的玩家和拥护者。非常适合有一定编程基础的站长。 官方网站: 5、phpcms

一个综合的网站管理系统,由php+mysql构架全站生成html,能够快速高效地应用于linux和windows服务器平台,是目前中国linux环境下最佳的网站管理应用解决方案之一。现在已经被酷6收购。 官方网站: 8、hbcms 一个以php官方网站推荐的peaR+smaRty技术架构的cms,比较容易上手,适合没经验的新人做网站。没有下载,分类信息等模块,适合做文章为主的网站。全站生成静态页,默认附带了几套模板,可以方便的更换模板。个人企业都免费,无需授权。 官方网站:。 9、supsite 是盛康的产品,一款将论坛资源自动转换成门户网站的php程序系统,使用supesite,利用discuz!论坛,将自动 拥有一个功能完备的、资源丰富的站点系统;由论坛变成网站,一切都是自动完成,不需要任何干涉,轻轻松松实现建立网站的母的。 10、wordpress wordpress是一款非常优秀的php和mysql的blog软件,但是他完全可以当做cms系统来用。从wordpress官方最近几个版本的升级中可以看出,工作人员正在把wordpress向

国内最常用的PHP+MySql免费CMS系统大全

网站内容管理系统(CMS)简单介绍: CMS(Content Management System),译为网站内容管理系统,大概2004以前,如果想进行网站内容管理,基本上都是靠手工维护,但千变万化的信息流,如果没有好的程序支持,继续靠手工完成是不可能的事,如果有一个好的系统来支撑你的网站,那将节省大量的人力物力,开发者就可能给客户一个软件包,可以用它定期人工修改网站,甚至是使用采集功能,大批量添加数据。只要你配置安装好,你的编辑,在线记者,更新员只要定期更新数据,剩下的事就交给CMS去处理。 2011年国内最常用的PHP+MySql免费CMS系统大全 1. DEDE -这是一款国内开源的cms,作者是一个个人,能做出如此功能的cms,是相当不错的。2007版功能十分强大,希望能改善之前数据量一大,更新静态页就很慢的缺点。因为开源,有较多的玩家和拥护者。非常适合有一定编程基础的站长。 官方:https://www.doczj.com/doc/3a3264453.html, 2. phpcms-一个综合的网站管理系统,由PHP+MYSQL构架全站生成html,能够快速高效地应用于LINUX和WINDOWS**器平台,是目前中国LINUX环境下最佳的网站管理应用解决方案之一。据传被酷6收购。 官方:https://www.doczj.com/doc/3a3264453.html, 3. 帝国网站管理系统-Ecms全称为"帝国网站管理系统",英文译为"Empire CMS"简称"Ecms".Ecms是基于B/S结构,且功能强大而易用的网站管理系统.是一个经过完善设计的适用于Linux/windows/Unix等环境下高效的网站解决方案。 官方:https://www.doczj.com/doc/3a3264453.html, 4. php168 -PHP168整站系统,代码全部开源,可方便的进行二次开发,功能模块可以自由安装与删除,个人用户免费使用。系统频道模块很多,适合作个人门户网站。较多页面没有生成静态页。如果你想建站,就义无反顾的选择它吧!!! 官方:https://www.doczj.com/doc/3a3264453.html, 5. HBcms :一个以PHP官方推荐的PEAR+SMARTY技术架构的cms,比较容易上手,适合没经验的新人做网站。没有下载,分类信息等模块,适合做文章为主的网站。全站生成静态页,默认附带了几套模板,可以方便的更换模板。个人企业都免费,无需授权。 官方:https://www.doczj.com/doc/3a3264453.html,/ 6. SupSite-一款将论坛资源自动转换成门户网站的php程序系统,使用SupeSite,并利用你现有的论坛,你将自动拥有一个功能完备的,资源丰富的站点系统;由论坛变成网站,一切都是自动完成,你不需要任何干涉。让你轻轻松松实现建立网站的目的。 官方:https://www.doczj.com/doc/3a3264453.html, 7. 曼波-MAMBO,一个国外的CMS系统,功能很强大,支持添加很多组件,模块;拥有丰富的模板.Mambo是一个网站内容管理系统(CMS),它是网站的后台引擎,使网站内容的创建、管理和共享更加简易。Mambo十分强大,但官方网站也承认,它不是典型的“门户”网站解决方案。 官方:https://www.doczj.com/doc/3a3264453.html,

100%可用不坑爹的BitNami GitLab安装教程

by Charles Wu 最近本人在经历了GitLab的一番折磨后终于搭建好了源码管理服务器GitLab,走了很多弯路被折磨了很久,为了总结此次的经验以及让广

PS:如何打开终端??似乎新安装的ubuntu在启动器里面没有快捷键。。。直接使用:CTRL+ALT+T 2.然后使用这个命令下载文件

在Ubuntu下双击该文件安装时提示不是文件所有者。先在文件右击鼠标->属性->权限,看看最下边“执行”是否让选择,如果让选择,选择上后可以直接安装,不让选择就需要进行下面步骤。 1.更改文件所有者,在控制台中输入: sudo chown -R username ./filename(R一定要大写) a)-R :递归文件夹内部的所有文件及文件夹 b)username:目标所有者名称(你登录系统的用户名)

c)filename:文件或文件夹名称 (你要修改的文件名) 1.更改文件权限,在控制台中输入: chmod +x ./XXX.run (XXX是指文件的名字) PS上门的步骤一般不需要执行,除非文件所有者和允许执行没有打勾3.安装.run文件 控制台输入: sudo ./XXX.run,或者双击文件运行,这里切记切记 ./

这里是填写你的服务器的域名或者ip地址,所以记得把你的git服务器设置为固定ip 一路Next就会自动安装了。。。只要步骤对还是很简单的 安装完后会自动启用管理界面,这个使用你最好把这个管理器做个快捷方式,我当时就是没做,关闭后就找不到了也懒得找,我后面都是

六、接着你就可以使用了 1.登录gitlab 创建用户组、项目等 2.使用git客户端生产你的SSHKey并且导入到gitlab

相关主题
文本预览