官方系列教材 - B计划

实战Joomla从0搭建企业站

联系我们页面和关于我们页面实现基本类似。只不过通过我们会在联系我们页面中放置一个地图,方便客户找到我们公司。本文就将介绍如何在文章中插入百度地图

1,本节目标

实现练习我们这个页面,掌握在文章中插入模块的用户。

2,ZMAX地图组件


2.1 需要解决的问题

联系我们和关于我们这两个页面非常的相似,也是使用单篇文章来做的。他们之间的唯一的一个区别是,关于我们显示的是一张图片,而联系我们显示的是一个动态的百度地图。具体的对比,大家可以前往 目标网站查看。下面是目标网站联系我们的截图。

那么这个该怎么做。在Joomla中要实现这个效果非常的简单。你只需要安装ZMAX地图组件即可。 

2.2 安装ZMAX地图组件

打开应用市场,在搜索栏中输入关键 zmaxmap 或者 地图。即可找到ZMAX地图组件。直接在线安装即可。

2.3 使用ZMAX地图组件

在使用ZMAX地图组件之前,你需要填写你在百度开放平台获得APIKey. 进入组件 -> ZMAX地图组件。在组件的主页面的右边有一个选项按钮,点击即可进入到组件的配置界面:

在组件的百度地图APIKEY中填写你获得到的APIKEY.截图如下:

这样就完成了组件的配置了。

接下来的操作就和文章管理类似,在位置管理界面,点击工具栏上的新建按钮,进入到地址的编辑页面,在这个页面填写你要显示的地址。然后保存即可。在位置管理中就可以看到我们刚刚添加的地址了。

3,向文章中插入地图模块


新建一篇文章,将其标题设置为”联系我们“,在这篇文章中填写你内容。为了更好的管理文章,你可以先为其创建一个分类(截图中我新建了“其他”的分类),然后将这个文章放到分类中。这样就可以避免和我们先前创建的博客中文章混淆。下面是一个截图:

上面的文字内容不用多说。重点关注  {-loadmodule mod_zmaxmap,公司地图-} 这一段代码。这个代码的意思是 在显示的时候,其会被替换为 公司地图这个模块。

因此,接下来我们要做的就是准备一个 公司地图模块。

3.1 新建公司地图模块

在扩展 -> 模块管理 中新建一个模块,将模块的类型选择为ZMAX地图模块。选择完成后,对这个模块进行一些设置。截图如下:

对上面截图的说明:

1,在选择地点选项中,选择你需要展示的地址。这个会直接读取你在组件中新建的地址。

2,在位置这个选项中,我们输入的是 contact-us 这个字符串。其实这个字符串是任意的,只要不和模板的位置相冲突即可。(因为我们只希望这个模块出现在 联系我们这篇文章中,所以这个位置就不要和现有的模块位置重复,否则可能会在多个地方出现)

3, 最关键的一点,我们需要在菜单指派这个选项中设置其在联系我们这个页面上可以显示。否则不会出现。(由于,我们这个contact-us 位置是不存现在的模板中,因此,你将菜单指派设置为所有的页面也是没有问题)

这样我们的模块就准备完成了。

3.2 向文章中插入模块

在你需要插入模块的地方,点击编辑器上的按钮 (“模块”,如果语言包有问题,这里可能会显示的是“Module”)。如图:

在选择框中 选择“公司地图”模块,完成插入。

这样我们的文章就准备好了。

4,预览查看效果


和上一篇文章一样,前往菜单管理,找到联系我们这个菜单项,将其菜单项类似设置为单篇文章,然后选择我们刚刚新建的文章。保存后,刷新前台,你就会看到文章中包含百度了。如图:

作者: 樱木花道

Joomla程序员,从J1.5到J4.x始终都在做Joomla相关开发定制工作,有超过10年行业经验,国内Joomla扩展开发商ZMAX团队的核心成员

作者网站:ZMAX程序人

评论 (0)

  • 最新在前
  • 最佳在前

第4章 重新认识Joomla

第17章 实现支持栏目 - 资源下载页面

第19章 模板风格 - 让页面与众不同