學習能定位访客位置的地图 (三)
上面已经成功创建了具备定位访客功能的Google地图，下面将简单介绍如何将该地图嵌入到常见的BLOG中。
目前，为了满足博客用户体现自己个性的需求，博客提供商（BSP）提供的BLOG服务通常都具有模板编辑功能。区别只是有些BSP对模板限制更多一些，而另一些则让用户具有更多的自定义功能。
常见的BLOG中，自定义程度最高的应该是Google的Blogger.com和博客中国Blogcn.com。这两个BLOG允许完全的自定义，支持用户自行编写HTML，甚至支持直接往BLOG里加入JavaScript代码。因此使用这类BLOG的读者可以完全自己整理模板，把上述地图嵌入进去（当然如果觉得麻烦，也可以参照下面介绍的方法）。
除了上述自定义程度很高的BLOG外，还有些BLOG不允许在模板中使用JavaScript，比如新浪等门户网站提供的BLOG。对于这类有很好的模板编辑器，支持编辑HTML的BSP来说，最好的办法就是以IFrame的方式嵌入网页了。
首先必须找一个免费的无广告网页空间上传。这里推荐Google提供的Page Creator，可去http://pages.google.com申请开通服务（需要Google账号，没有的可在http://mail.google.com申请注册，具体过程在此省略，注册时有详细说明）。注册后无须创建任何主页，直接在图4.2所示界面右侧的“Upload Stuff”区域上传Blog地图文件“blogmap.html”即可。该文件的地址应为http://your-site-name.googlepages.com/blogmap.html，可用于网页引用（your-site- name是Page Creator中创建的站点名称）。
图4.2 右侧“Upload Stuff”区域可以用于上传文件
然后就需要把该网页嵌入相应的BLOG模板网站中，下面以新浪的BLOG为例给出相应的嵌入方法。
登录新浪BLOG，进入管理界面，依次打开“自定义设置”|“首页内容维护”|“自定义空白面板”|“进入编辑”。进入“自定义空白面板”管理界面后，单击“新增”按钮，进入“自定义空白面板”编辑界面。在“面板标题”输入框填写适当的标题，例如“访客位置”等。在“面板简介”文本域里选定“显示源代码”，并将以下代码复制到该文本域，并单击“保存”按钮，保存当前设置。
<div style="text-align:center">
<iframe marginWidth="0" marginHeight="0" frameBorder="0" scrolling="no" border="0" style="overflow:hidden; width:200px; height:150px" src="http://your-site-name.googlepages.com/blogmap.html">
</iframe>
<noframes>
本页面用于显示访客位置，若你看到此文本，说明你的浏览器不支持Frames
</noframes>
</div>
★ 注意 ★
当嵌入IFrame页面时，需要把“http://your-site-name.googlepages.com/blogmap.html”更换成真实的网页。另外，该地图的大小可在“style="overflow:hidden; width:200px; height: 150px"”中设定合适的“width”和“height”值解决（可能需要多次尝试才能找到适合当前模板的尺寸）。取消选定“显示源代码”可进行预览，但编辑的时候一定要处于直接编辑HTML代码的模式）。
成功添加地图后的BLOG如图4.3所示。
图4.3 左侧为可定位访客位置的小地图
这样，一个简单的、可以定位访客位置的Google地图就完成了。