Joomla 一个实例建站过程

之前就想过写一个用 joomla的virtuemart组件制作外贸b2c零售网店的教程给大家分享，刚好最近要重新部署和策划公司的外贸b2c业务，趁着这个热乎劲，赶紧 把教程赶出来，不趁热打铁，很多事情是做不成的，大家都忙，免费的用心分享，希望大家喜欢和珍惜。我的目的是教会大家制作出一个像目标站http://www.vintagejewelrycheap.com/一 样的简洁实用外贸b2c网店，这只是我其中的一个网店。做外贸b2c应神秘低调，我本不该公开我的网店，不过么事，为了能让大家有个参照和了解是如何实现 的，就分享下，我始终相信你也会拿你最好的东西跟我分享。再说，我有N个网店，所卖产品各不相同，收入也各有高低，这个店对我来说么什么的，任何模仿甚至 超越也不会影响我的收入。再说，这个niche其实市场容量很小，其实你只要学会方法，结合自己身边的优势资源才是赚大钱的道理。

 

先搞清楚一个问题，为什么用virtuemart？其实外贸网店有非常多的开源网店程序，如zen cart,magento等，他们都是非常专业的购物车程序。其实就专业性来讲virtuemart是算不上号的，但是vm是joomla的一个扩展，凭 借着joomla这个载体，在seo上做得不错，对于有joomla基础的朋友来讲，用vm来搭建一个外贸网店是很顺手的。再者，相对于其他程序，你可以 利用下面要讲的软件来自己制作简单的网店模板，而不需要高超的css技巧，这也是我们用vm来做外贸网店的原因之一，因为我们的受众是一般css都不那么 强的初级站长们。

教程目录：

第一章 本地架设joomla系统并安装virtuemart
1.用xampp架设本地php运行环境
2.安装joomla及virtuemart

第二章 用artisteer软件制作简单合适的joomla模板
1.用artisteer制作joomla模板
2.上传并使用自己制作的joomla模板

第三章 添加必要栏目内容并进行设置

第四章 添加必要的扩展程序并进行设置

第五章 网店站内SEO
—————————————内容的分割线———————————————-

用xampp架设本地php运行环境
我们先要在本地搭建一个php程序的运行环境，因为joomla是基于php+mysql+apache的，现在国外非常多的流行cms都是基于这个的，如wordpress等，所以这个本地环境搭建起来之后可以给很多程序用。

下载xampp：
去http://www.apachefriends.org/zh_cn/xampp.html选择适合你pc操作系统的对应版本，哥用win7。

再选择安装文件格式，我用7zip的，你随意。

将下载得来的xampp-win32-1.7.7-VC9.7z文件解压到C盘根目录，得到c:/xampp文件夹，双击“setup_xampp.bat”开始安装，看指示按任意键。

再双击“xampp-control.exe”，安装并开启apache和mysql服务。

在浏览器地址栏中输入“localhost”，如果看到以下画面说明xampp is ready to go。

在c:/xampp/htdocs下新建一个叫mysite的文件夹用来存放我们即将安装的joomla程序，htdocs是所有网站文件的根目录，所有网站都要安装在这个文件夹下。到此xampp安装好了，php环境搭建完成。

安装joomla及virtuemart

去http://www.joomla.org/download.html下载1.5版本的joomla，最新的1.7虽新但支持扩展总不如1.5那么成熟，是1.5.23 Full Package。
再去http://virtuemart.net/下载1.1.9版本的virtuemart程序，这个你用1.1.8版本或者更早的也木有关系，随你方便。
在浏览器中输入http://localhost/phpmyadmin/来创建数据库，刚进去时是德文，将语言设置成英文。点databases标签来创建新的数据库。

将下载来的Joomla_1.5.23-Stable-Full_Package.zip文件解压到htdocs的mysite文件夹，这里就得到joomla系统的全部文件。
在浏览器地址栏中输入http://localhost/mysite来进行安装，安装语言选择english，点next，再点2个下一步，到数据库配置信息，填入刚才创建的数据库名mysite，hostname填localhost，用户名root，密码留空，下一步。

再点下一步，然后填写一些你的网站信息，因为是新手初装，记得点“install sample data”来添加默认的joomla内容，以便学习和理解。

点下一步，安装就完成了，然后去把c盘mysite文件夹下把installation文件夹整个删除即可。在浏览器地址栏中输入http://localhost/mysite/administrator/用户名为admin，密码就是刚才设置的密码。这样就登入到了joomla系统的后台，你可以选择在本地安装或者直接在主机空间上安装，新站我习惯在主机上直接安装调试，这个看个人习惯，无所谓。到此joomla程序安装完成。

安装virtuemart组件

virtuemart是joomla系统的一个商城组件（component），joomla有3种类型的扩展，分别组件（component）， 模块（module）和插件（plugin），这些扩展都是为实现某些功能而存在的，实质和wordpress的扩展统称插件（plugin）是一样的， 只是叫法不同，复杂程度一般是递减的，plugin最简单。这里涉及到joomla系统的熟悉和使用了，不是我们讨论的重点，新手朋友可以自己学习 joomla系统，这里我不展开，不会的也可以去论坛http://www.cimhforum.com/讨论学习。

解压刚才下载的VirtueMart_1.1.9-COMPLETE_PACKAGE.j15.zip文件，得到 com_virtuemart_1.1.9.j15.zip和 modules，plugins，VirtueMart_1.1_Installation.pdf几个文件（夹）。这里我们要安装 com_virtuemart_1.1.9.j15.zip，modules文件夹下的 mod_virtuemart_1.1.9.j15.zip，mod_virtuemart_login_1.1.9.j15.zip这3个为必装，以下 的可以选装randomprod，topten，currencies，不过我们的目标站是安装了的，还有其他modules和plugins文件下的扩 展都可以安装或者不装，目标站还多了tag cloud插件是这里面木有的，需要的话大家可以自己去搜索下载，我也可以放出来下载，这些都是可选的，网站要添加什么功能看自己喜欢，不必拘泥于目标 站。
安装过程是登陆到后台，然后extensions，选择install/uninstall，浏览安装文件安装即可。将以上提到的文件一一安 装即可，只是在装第一组件时，在结束时请注意看提示，要初始化一下网店，别急着做别的事。到这里virtuemart组件就安装完成了。

用artisteer自己制作简单合用的joomla模板

artisteer是一款网站模板制作及生成软件，可以支持主流的cms，如joomla，wordpress，drupal等，也可以用来制作 html模板，这对于单页销售网站或者ppc项目的landing page制作非常好用。还有一些如用wordpress制作出来的单页网站也非常方便，我们完全可以用这个软件来轻易做出美观合乎自己心意的网站模板，最 重要的是它非常傻瓜，完全按按点点就能做出好看的模板，根本无需精通css+html+php网站设计。这对于木有设计功力的新站长来说将是很大的帮助。

artisteer是一款收费软件，可以访问其网站http://www.artisteer.com/进行购买，不过网络也有一些特殊可以使用的版本，这个你懂的，大家根据需要自己选择。可以使用2版的或者3版的，我个人使用的是2.4版本。

双击启动artisteer，在程序选择界面，我们选择joomla，以后要制作wordpress模板在这里选择wordpress即可，非常方便。

左上角的这些菜单按钮是我们主要要操作的对象区域，实际上artisteer已经将我们joomla网站几个主要区域要做成什么样都以标签进行分类管理，我们要对网站的哪个部分进行修改就去点击对应的标签，使得软件易用性和友好性很好。

第一个标签“推荐”实际上统管了之后所有标签里的功能，我们只要按“推荐的设计”按钮，软件就会随机使用后面的各个要素对网站模板进行重组，让我们 得到一个全新的，风格截然不同的模板。以此类推，我们可以使用推荐的颜色来改变颜色，推荐的背景，推荐的标题等等，来获取软件随机给我们配置的关于该部分 的随机样式。

当然，我们也可以根据自己的喜好来设计各个标签里包含的内容的样子。切换到“颜色和字体”标签，这里我们可以选择网站主题的颜色色调，亮度，网页主题的字体，样式和尺寸等，有非常多的选择，效果即时预览，无需改变任何代码。

再切换到“版面设计”标签，页面布局是指垂直方向的元素，如我们就按照目标网站的样式选择标题，导航栏菜单和内容3个部分的布局。列是指网站要做成横向的几栏式，我们也做成目标站的左中右三栏式，在底部的宽度选项里面可以设置这3栏的各自宽度。

切换到“背景”标签，这里我们可以对网站整体的背景进行设置和添加效果，我们可以选择软件自带的几十种背景组合，也可以上传使用我们自己的图片作为网站背景，这个功能对我们做成主题网店还是很方便的。这里根据自己喜好来选择填充颜色，炫光效果等。

切换到“表单”标签，这里将对网站模板整体大框架进行设置，如模板的宽度，目标网站是900px，可以选择顶部偏移像素，边框，阴影像素及效果等，大家根据需要自己设置。

切换到“标题”标签，可以对网站顶部的标题栏进行细致设置。如要不要有文字块，就是logo那个位置是文字的还是图像的。整个标题栏要多高，标题栏 的前景和背景，可以使用图片，也可以用色彩填充，这里我们一般使用一些跟网站主题相关的图片来进行设置，我们要上传自己已经做好的图片，如目标站顶部的图 片是自己制作并在这里上传使用的。

切换到“菜单”标签，这里可以对网站菜单进行设定，要搞成方的圆的，什么色彩，什么条纹，下拉菜单什么样式等等，一切跟菜单相关的都可以在这里设置，这也是我说的artisteer将各个功能区用标签进行管理，非常方便我们的操作和理解。

切换到“文章”标签，这里可以设置joomla系统的文章部分样式，如文章部分的背景色，字间距，行距，对齐方式。进而细化到文章标题的颜色，大 小，对其等等。还有一些文章里面的常用元素的样式设置，如超链接，引用，项目列表，表格等等文章相关的元素都可以在这里选择。还有一些joomla特有的 文章元素如打印，pdf，email等等，都可以在这里选择要不要使用及其样式。

切换到“边栏”标签，这里可以对除了中间内容栏目外的左右两边栏进行样式设定，大家根据自己喜好进行各个功能区的详细设置即可，效果即时预览，有了前面的基础相信这个也不是问题。

“竖直菜单”这个标签在joomla中未必会被使用，可以略过，也可以进行简单设置，这个看大家喜好，目标站未设定这个。

“按钮”标签里，可以对网页上需要使用的按钮样式进行设定，如大小，颜色，阴影等，大家集合自己网站的颜色进行设定，协调即可。

“页脚”标签里定义了网站底部版权部分的展示样式，木有什么困难，按照里面的提示设置即可。

好了，到这里我们就完成了joomla网站模板的制作过程，下面要将其导出到zip文件以便上传安装使用。点顶部“输出”按钮，再点“选项”，在属性里设置模板信息，你看着填写吧。

在“注脚”中，一般我们会把这2个勾去掉，让模板更干净一点。

然后在输出模板里填写要输出的名字，默认为zip文件即可。
到这里就完成了用artisteer软件制作joomla模板的过程，我们得到一个.zip格式的模板文件。

上传安装并使用自己制作的joomla模板

登陆后台，extensions，install/uninstall，浏览上步制作的模板zip文件，然后upload&install 即可。 接着要在extensions下面的template manager选择刚上传的模板，点击前面的小圆框选择它，然后点右上角的黄色五角星设置为默认模板。接着换到前台，刷新浏览器就可以看到网站前台已经换 成了自己制作的模板样式了。点击模板名，然后点右上角的预览，就可以看到这个模板对应的都有哪些模块位置了。
到这里就完成了joomla模板的安装启用过程。

添加栏目内容并进行设置

这里要添加的栏目是顶部导航栏的那几个项目，我们在后台menu manager里面创建一个“topmenu”主菜单，然后在menu items里面添加导航栏上的几个栏目，除了blog和sitemap外，其余的都是创建标准的文章格式，我们要先在content-article manager里面先添加上这些文章并编写好内容，以便在菜单项中调用这些文章作为栏目显示的内容。

这里注意的是默认模板的默认主菜单是显示在边栏的main menu，我们要将topmenu里的第一个项目改成“home”并设置为默认菜单，这样点home才能切换到网站主页，类型 front page才行。

blog栏目要选择category的blog layout来进行博客样式布局，这样才会调用该栏目下的所有文章。我们要在section manager和category manager里面分别创建一个叫blog的section和category，然后才能在菜单栏目中选择调用这个东西来进行展示。

sitemap栏目是在安装了网站地图组件xmap之后再进行调用展示的，这个要在扩展章节再讲到。

内容方面还有底部版权下面的privacy和terms两篇文章，我们要先在article manager里面创建这2篇文章，再在menu manager里创建一个主菜单，我叫website usage，然后在其菜单项中添加叫privacy和terms这2个菜单项。这两个菜单项都是article layout，分别选择在文章管理里创建的2篇文章即可。
底部的这2个链接是在模板管理里面的版权下面插入这2个链接的代码实现的。

rivacy Policies | Terms&Conditions

在模板管理里选择模板，然后编辑其html就可找到html编辑器，在底部版权部分的代码下面添加以上代码即可。
到这里就完成了主要栏目的添加和内容的编写过程。

添加必要的扩展程序并进行设置

以下扩展程序请去http://www.cimhforum.com/thread-10-1-1.html下载。
目 标站用到的扩展程序主要有：jce文字编辑器， jomcomment文章评论，seo之王-sh404，vm的coupon code，关键词到链接自动替换，去除virtuemart双重面包屑，网站地图xmap，域名301重定 向，magiczoom，easyping，SystemJSecure，virtuemart_tag_cloud，akeeba备份还原网站，产品同 步到google base等等，有些太细的我就么有添加，这里已经提到大部分了就够了，大家根据需要选择，也可以安装另外的扩展。
有些扩展的介绍和设置在这2篇文章中已有提及，不再赘述，请移步：

http://www.dingdelaotou.com/848.html

http://www.dingdelaotou.com/870.html

大部分扩展都已提及，小部分的也很简单，大家安装后在后台捣鼓几下必定能懂，有疑问请去论坛讨论。
以下就目标站的程序及其实现做些简单的介绍，给大家点设置提示。

目标站分类导航Jewelry Categories是由virtuemart模块mod_virtuemart 展示的，分类在virtuemart后台category那里添加即可。包括list all products,product search,mini shoppping cart都是在这模块设置里设置的。

Currency Selector和Most Searched是virtuemart的2个插件，包里都有，下载安装设置即可。
Customer Login注册登录模块和Top Ten Products模块已包含在virtuemart扩展里，安装设置即可。
首页展示的这20个产品是virtuemart产品随机调用模块生成的，每次刷新网页都会看到不同的产品。具体设置如下：

产品推荐是在产品添加编辑里面加进去的，效果如：

在产品添加的最后一个标签related products里面添加即可。

目标站付款接受paypal（legacy）方式，在virtuemart的store-list payment methods-paypal(legacy)-configuration，paypal email里面输入你的paypal email账号即可。

目标站默认中国邮政小包邮费3.5刀，在store下的shipping module list-shipvalue，点configure ship method,我设置50刀以下收3.5刀邮费，50以上免邮费，设置如下：

要在checkout只显示这个付款方式要把这个method设置为默认shipping，其他方式如ups等都禁用掉，当然你可以添加并用。
优惠码使用的是awocoupon组件，要设置成目标站那样的效果：

要在awocoupon组件里设置一下，如订单超100刀，得15%折扣，可以如下设置，有几个优惠码就创建几个然后设置类似。

要在sitemap中展示网店所有产品还需要在menu manager中创建一个主菜单，如叫all products in shop，然后在xmap组件设置中将这个菜单加入到要生成的sitemap中才会站栏目里展示。
到这里主要的扩展已安装设置完成，有细节问题请去论坛或博客提问。

站内SEO

网站主体都设置完以后可以对网站进行结构和内容上的seo了。主要涵盖了以下几个要点，大家注意设置好，那么网店就有了一个比较好的seo基础了。
global configuration里面：site name就是你首页的title，这里嵌入关键词或者你喜欢的网站名，默认编辑器选择jce。

desc和keyword里面自己填写即可。

seo setting一般默认即可，sh404会控制一切，这里无需操心。

mail setting里填写自己的邮箱，设置如下：

在virtuemart的分类创建描述中要把描述写进去，这将作为该分类的描述并展示在该分类内容上方。另外，分类的名字也将作为该分类页面的第一个关键词，所以分类名也要考虑seo的需要，合理设置。分类页面：
title：分类名-网站名
desc：分类的描述
keyword：分类名，网站名，网站主页网址

产品页面的seo要素为：
title:产品名 | 分类名 | 网站名
desc:产品添加时填入的short description
keyword:产品名，分类名，网站名，网站首页网址
理解了这些，大家再根据实际情况编写合理的内容即可。
这里再插入一些virtuemart的重要设置，非核心的设置大家看看能懂，这些设置会给大家提供一些参考：
enable the cookie check一定不要勾，否则在url中会出现一些多余的部分，这是cookie check造成的，对seo么好处。

layout参考以下设置：

layout的configuration里参考：

设置一下都有哪些shipping模块，按照之前的说法，这里就选这个，你也可以选别的：

分4步结账：

结账时出现在paypal顶部的商店图在store information里设置上传：

注册时显示的条款也在这里下面填写：

最后，来看看sh404的设置，这才是对seo最为重要的一环。

插入产品id是为了避免万一多个产品名字相同时只展示一个产品，看目标站http://www.vintagejewelrycheap.com/105-vintage-pearl-ring-pearl-palace.html，url 结构为“domain/productid-product name.html”这样2J的结构绕过了分类更好，且不管产品名是否相同，id是唯一的，所以url肯定不会重复，避免了产品多了以后url混淆。 flypage name则完全木有必要出现，否则会破会完美的url结构。

要重新生成新的修改过的url请先清除原来的url，在url manager里面点purge，每次purge完之后，要重新去xmap组件点html格式的网站地图，否则将无法访问，么事的话不要purge，前期 改动可以，之后就不要管url了，除非做过大的链接结构变动。

好了，到此，sh404核心设置就算完成了，其他的根据跟人喜好进行设置，我只是以目标站为例演示功能设置，大家完全可以灵活应用，新手可以参照我的设置，当你不知道该怎么办的时候，把球传给会踢的人。

好吧，时间仓促，一天之内赶出来的教程，很多细节做的不到位，不过大致方面都提到了。这个教程对那些对joomla有一定经验的朋友会有比较大的帮 助，joomla新手们在应用这教程时会遇到一些joomla的基本操作问题，抱歉，这是这教程木有照顾到的地方，大家自己想办法解决。好了，如有问题博 客或论坛留言讨论。