您现在的位置是：首页 > cms教程 > WordPress教程WordPress教程
wordpress插入百度地图的嵌入代码写法
春翠2025-03-02WordPress教程已有人查阅
导读在电脑上新建一个文本文档（txt文件），命名为baidumap，并打开，回到百度地图创建网页上，获取代码，并复制代码粘贴进入baidumap.txt文件内，如果你希望这个地图兼容手机的宽度可以修改一
在电脑上新建一个文本文档（txt文件），命名为baidumap，并打开，回到百度地图创建网页上，获取代码，并复制代码粘贴进入baidumap.txt文件内，如果你希望这个地图兼容手机的宽度可以修改一下代码中的宽度：
找到代码中的如下代码：
修改好代码后，将这个baidumap.txt修改后缀为baidumap.html，将这个文件上传至你的网站根目录（网站根目录可以使用ftp上传，也可以在你的服务器控制面板的文件管理上传，根目录名一般是 或者 root或者htdocs又或者是web等，如果是在不明白，可以咨询你的服务器商）
步骤3：将百度地图嵌入你的WordPress网站页面或者文章中
上传好了之后，进入你想要置入百度地图的页面或者文章中，将编辑器切换到“文本模式”，输入以下代码：
这样的方式不管任何WordPress版本都可以放入，也不会因为升级而产生不可用的情况，可以放心使用。
找到代码中的如下代码：
<!-百度地图容器->
<div style="width:697px;height:550px;border:#ccc solid 1px;" id="dituContent"></div>
修改宽度（上方标红的代码为宽度）为100%，标黄代码为高度，可以修改数字,修改后如下：
<div style="width:100%;height:500px;border:#ccc solid 1px;" id="dituContent"></div>
这样就会在网站上显示宽度为100%高度为500像素的地图区域（你也可以将宽度设为98%，这样可能在某些主题上更加美观）修改好代码后，将这个baidumap.txt修改后缀为baidumap.html，将这个文件上传至你的网站根目录（网站根目录可以使用ftp上传，也可以在你的服务器控制面板的文件管理上传，根目录名一般是 或者 root或者htdocs又或者是web等，如果是在不明白，可以咨询你的服务器商）
步骤3：将百度地图嵌入你的WordPress网站页面或者文章中
上传好了之后，进入你想要置入百度地图的页面或者文章中，将编辑器切换到“文本模式”，输入以下代码：
<iframe width="100%" height="500" frameborder="0" src="/baidumap.html">
这样就可以轻松的将百度代码置入了，注意标黄的代码需要和修改过的高度和宽度一致（这里的高度不需要加px，直接数字即可）这样的方式不管任何WordPress版本都可以放入，也不会因为升级而产生不可用的情况，可以放心使用。
感谢您的认可和支持
微信
支付宝
本文标签：
很赞哦！ ()
相关教程
图文教程
centos7搭建wordpress的方法教学
随着计算机技术的普及，搞IT的越来越多，但是随着深入你会发现自己上了贼船，真的是一如IT深似海，从此妹纸是路人啊，当你越来越接近自己想想中的目标是
wordpress中文字体的修改方法
使用国外的wordpress主题，通常都是使用的Google字体，但是你用在中文网站上后，中文字都是宋体，与网站的主题很不搭调，怎么修改呢？
wordpress迁移服务器的方法示例
标签（空格分隔）： 未分类历经两天，从完全对服务器方面的内容不懂的小白终于将服务器给迁移了打开 第一步，将wordpress文件，以及数据库导出。打开到处的网站文件，第一级目录，里面有
wordpress地图插件的安装和使用方法
WordPress建站，那么恭喜你，有一款插件非常强大，能够让你在网页中自由的插入百度地图。Baidu Maps Plugin是一款能够自由的在WordPress页面中插入百度地图的插件。
相关源码
-
帝国cms7.5游戏门户H5小游戏网站模板源码免费下载基于帝国CMS7.5开发的H5游戏门户模板，为在线游戏平台设计。支持PC端与移动端同步生成，打造完整的游戏娱乐体验平台。查看源码 -
帝国CMS游戏应用APP推广下载站模板免费下载本模板为移动应用推广、手机游戏推广行业设计，集成H5游戏平台与APP下载功能，支持PC端与移动端自适应访问。专注于为应用开发商、游戏发行商提供专业的线上推广展示平台。查看源码 -
(PC+WAP)绿色产品环保设备垃圾桶厂家公司网站pbootcms模板为垃圾桶生产商、环保设备企业打造的高端响应式门户模板，基于PbootCMS开源内核深度开发。采用HTML5自适应架构，无缝实现PC与手机端数据实时同步与交互优化查看源码 -
(PC+WAP)绿色硅胶橡胶玩具制品营销型网站源码下载为硅胶橡胶制品及玩具行业打造的营销型网站模板，采用PbootCMS内核开发，通过模块化设计实现产品参数、安全认证、应用场景等专业内容的可视化呈现，助力企业建立可信赖的线上展示平台。查看源码 -
WordPress主题模板JustNews资讯博客类源码V5.2.2JustNews主题针对博客创作、自媒体运营及资讯发布类网站的需求而设计，提供专业的内容展示与管理方案。该主题集成前端用户中心功能，支持用户在前端界面发布和投稿文章，操作流程简洁高效。查看源码 -
帝国cms7.5个人博客资讯文章模板下载本模板简洁个人博客网站设计开发，采用帝国CMS内核构建，只需替换文字图片即可快速搭建专业网站。自适应手机端设计，数据实时同步，操作简单便捷。PHP程序确保安全稳定运行，帮助您以较低成本获取持续业务。查看源码
| 分享笔记 （共有 篇笔记） |
