您现在的位置是：首页 > 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.3怎么安装wordpress
一、安装并配置数据库1.安装mariadb#yum install -y mariadb-server mariadb2.启动数据库并设置开机自启#systemctl start mariadb &&systemctl enable mariadb3.初始
WordPress伪静态中文链接404错误怎么办
对于WordPress建站，虽然我们一直推荐用户使用linux系统，但是无可避免的依然会有很多用户由于种种原因选择了windows系统
wordpress中wp_nav_menu的使用方法
wordpress中wp_nav_menu怎么用？wordpress之wp_nav_menu使用说明wp_nav_menu()方法位于wp-includes/nav-menu-templates.php文件中。
WordPress内外网访问的解决方法
其实我是在局域网中搭建WordPress的，在服务器上搭好后，都是以http://localhost/wordpress/访问的，但是在局域网其他机器上用ip访问的话，wordpress就不能正常显示了，css什么的都不
相关源码
-
(自适应响应式)HTML5中小学早教教育机构类网站pbootcms模板下载基于PbootCMS内核开发的响应式模板，为早教中心、培训学校等教育机构打造，提供从技术架构到视觉呈现的全套网站建设方案。查看源码 -
(自适应响应式)黑色酷炫高端数码摄影pbootcms网站模板源码本模板基于PbootCMS开发，为摄影工作室、个人摄影师及摄影爱好者设计。采用深色系风格，突出摄影作品展示效果，适配各类数码设备浏览。适用于作品集展示查看源码 -
(PC+WAP)蓝色新能源环保太阳能光伏模板pbootcms下载新能源环保行业网站解决方案为太阳能光伏系统企业打造的专业网站模板，助力新能源企业高效展示产品与服务PbootCMS内核开发，源码开放可修改PC与手机端自适应设计查看源码 -
响应式HTML5家居建材办公家具桌椅pbootcms模板为家居建材、办公家具企业打造的响应式网站模板，同时支持多行业快速适配通过替换文字图片即可转型为其他行业官网，大幅降低开发成本。查看源码 -
宽屏自适应搬家家政快递物流公司网站模板该宽屏大气的响应式网站模板专为搬家公司、家政服务及物流快递企业设计，基于PbootCMS内核开发，通过自适应布局确保手机、PC等多终端体验一致，助力企业高效构建专业在线服务平台。查看源码 -
(自适应)简繁双语响应式服装服饰西装工装校服定制pbootcms模板本模板基于PbootCMS内核开发，为服装服饰行业量身打造，尤其适合西装定制、工装生产、校服订制等服装类企业使用。模板采用响应式布局设计，确保在手机、平板、电脑查看源码
| 分享笔记 （共有 篇笔记） |
