wordpress修改背景 目标 目前是纯白色背景，修改背景后达到更好的展示效果 修改 在 外观 -> 自定义 -> 额外CSS 中增加如下内容 body{ background-image: url(https://xxx.xxx.xxx/wp-content/uploads/beams-components-24fbfee2.png); background-size: 2000px; background-position: center -600px; background-repeat: no-repeat; background-attachment: fixed; } 其中图片可以采用 1846x1256 分辨率大小，大小推荐在 400K 以内，尽量节省带宽

更换域名后wordpress图片失效 问题 在更换 wordpress 环境的域名后，文章中的图片无法显示，排查发现 图片都是绝对地址引用。所以需要想办法把图片地址修改为新地址 方法 可以使用 Go Live Update Urls 插件，在安装好后就使用默认勾选的内容，新旧域名可以不使用前缀，比如： 以前是 xxx.com , 现在修改为 yyy.com ，但是我不填 http 或者 https，这样统一修改即可 或者可以采用直接更新数据库的方式，不过需要一定的 mysql 知识，并且千万做好数据备份

wordpress 插件冲突致命错误 0x1 问题 配置插件 WP Githuber MD 的代码高亮、表情功能与主题 Wing 有一些冲突。在配置完后刷新页面，站点直接崩了，访问所有的页面都是致命错误，提示某一行php代码。 0x2 解决 首先尝试在服务器定位到了这个文件，然后把相关的代码注释掉，结果仍然不行。 于是在服务器相关的目录移除插件的文件夹，站点可以进入了，然后继续安装回 md 插件，但怎么也启用不了，怀疑是配置仍然存在，可能保存在数据库中。 既然这样，那只能临时更换主题，把插件启用后，关闭冲突的功能，之后测试正常了。

wordpress css样式修改 0x1 问题背景 我是安装了插件 WP Githuber MD 的，这款插件可以以 markdown 的风格编辑并且展示文章，但在使用了 Wing 主题后，发现表格预览是正常的，但是发布文章后不生效。 预览如下图： 发布后效果如下图： 根据现象来看，应该是 css 样式问题，编辑页面预览可能是用的一套 css，发布文章后可能是使用的主题的 css 了。并且还有一个问题是，使用了这个主题后md的代码部分字体颜色变成了红色，不太喜欢 0x2 如何解决 因为这个主题我也是比较喜欢的，所以尝试解决的方法是使用 wordpress 提供的额外CSS功能来修改当前的CSS，进入方法：找到主题->自定义->额外CSS。 修改代码字体颜色的方式 首先要找到具体渲染的代码，打开发布的文章，打开浏览器F12，切换到 Elements 中，定位到对应的元素，然后右侧切换到Style，这时候虽然看不懂具体是哪个代码渲染的颜色，但是我们可以手动匹配下，如下图： 我的代码字体是红色，那么我尝试修改上面两个红色为其他颜色，即可定位出到底是哪个生效，然后根据右上显示的请求资源 style.css 去服务器找到这个文件对应的行，把代码贴入额外CSS中，实际找到的如下： code { border-radius: 0.2rem; line-height: 1.25; padding: 0.1rem 0.2rem; background: #fcf2f2; color: #757575; font-size: 70%; } 有了这个代码，还可以修改字体大小等操作 增加或者修改表格样式 有了上面的经验，我在浏览器看了 Elements 表格的 css，但是这部分代码比字体的多，而且复杂，所以我直接在网上找了一个，还比较好用，如下： /** 解决主题覆盖了md表格样式的问题 */ table { display: block; width: 100%; overflow: auto; border-collapse: collapse; margin: 15px auto; /*外边距*/ } table thead tr { background-color: #f8f8f8; } table tbody{ border: 1px solid #dfe2e5; } table th { font-weight: 600; padding: 6px 13px; border: 1px solid #dfe2e5; } table tr { background-color: #fff; border-top: 1px solid #c6cbd1; } table tr:nth-child(even){ background-color: #fff; } table td { padding: 6px 13px; border: 1px solid #dfe2e5; } 其他样式定制 有了上面的成功案例，又再网上找了一些好玩的东西，比如修改滚动条颜色，如下： /**彩色滚动条样式*/ ::-webkit-scrollbar { width: 10px; height: 8px; } ::-webkit-scrollbar-thumb { background-color: #12b7f5; background-image: -webkit-linear-gradient(45deg, rgba(255, 93, 143, 1) 25%, transparent 25%, transparent 50%, rgba(255, 93, 143, 1) 50%, rgba(255, 93, 143, 1) 75%, transparent 75%, transparent); } ::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2); background: #f6f6f6; }

wordpress资源路径为绝对地址的问题 问题现象 因为网站还未备案，所以使用的是7443端口，但访问的时候除了第一个请求，其他请求全部丢失了7443端口，导致无法访问环境。 排查过程 一开始排查网络请求，发现是跳转后端口没有了，于是尝试在nginx上增加了部分反代时端口的适应配置，仍然无法解决，怀疑是页面本身有问题，检查页面源码，发现所有资源都是写的无端口的绝对地址，基本上能定位是这个问题 解决问题 修改wordpress前台页面文件wp-config.php,在require_once(ABSPATH . 'wp-settings.php'); 之前加入如下代码： $home = 'http://'.$_SERVER['HTTP_HOST'].'/'; $siteurl = 'http://'.$_SERVER['HTTP_HOST'].'/'; $conturl = 'http://'.$_SERVER['HTTP_HOST'].'/wp-content'; define('WP_CONTENT_URL', $conturl); define('WP_HOME', $home); define('WP_SITEURL', $siteurl);