系统自带模版在 emlog pro 1.8.0 底部信息错位问题暂时的解决方案

问题描述

作为一名 emlog 爱好者，笔者闲暇时间经常为 emlog 系统的 Github 仓库里（ https://github.com/emlog/emlog ）提 pr 和修修补补，就像其他知名的开源软件有源源不断的世界各地的技术人员为它们助力成长。

（pr 的意思大概就是，提交代码给仓库）

在前两天课余时间，为 1.8.0 版本进行维护开发时，一个疏忽，在一个 pr 中忘记将 default 模版底部的 <p> 标签转为 <div>，因此造成了一个很可笑的 bug，即如果后台设置了 ICP 备案，那么底部信息会恐怖的变成下图那样（底部内容向左对齐了，原先的是居中）。

这是因为，在修复群成员提出的一个反馈优化意见时，忽略了显示底部自定义内容的部分这里是 <p> 标签。下面的代码是 1.8.0 版本中的代码内容，可见到 < p > 中嵌套了 < div >。

位置 /opt/homebrew/var/www/my/0325/content/templates/default/footer.php

<div class="container">
	<p class="text-center">
		<?php
			if(!empty($icp)){
				echo '<div><a href="https://beian.miit.gov.cn/" target="_blank">'.$icp.'</a></div>';
			}
		?>
		<?= $footer_info ?>
		<?php doAction('index_footer') ?>
	</p>
</div>

前端界中众所周知，<p> 里面是不能插入块级元素的，比如 <div>、<p>、<pre> 等，所以这里的代码中 出现了 echo '<div><... 这种内容实在是荒谬。

当时没有看太多，也没进行测试，想当然的在 Github 的修改代码界面输入了 <div> ... 本以为就一个 HTML 而已，能出什么 bug，但没想到一个 1.8.0 一个大的版本号，出现这样可笑的 bug。

所以吸取教训！！！以后一定要在进行测试后再提交代码。幸好是前端，如果是后端的话，出现这样级别的 BUG 代码将会恐怖至极。

解决方案

当然，目前是有解决方案的。html 的 bug ，40% 可以用新增加的 CSS 解决， 60% 可以用新增加的 JavaScript 解决。

本 bug 在用户端的的解决即，在【系统后台】----【系统】----【设置】----【首页底部信息】添加如下代码。

<style>
 footer .container {
    text-align: center;
}
</style>

然后就行了，显示效果神奇般的就恢复正常了。

---

---

当然在未来的 1.8.1 中也有它的优化解决方案，就是把 < p > 改成 < div >。

其实在本地我原先的修改中，是已经更改成 < div > 的，并且还在 CSS 中进行了 div 的 CSS 样式（因为 p 元素默认有上下边距的），但提交代码时不知为何没提交上，所以 1.8.0 中的原来想法被迫要在 1.8.1 中实现。

当然，10 月 4 日早晨，经老王的提醒，其实这个多出来的 < div > 已经没有它存在的意义了。所以可以将 < div class="text-center" > 删除。把 .text-center 放在 .container 里。完美！等下次添加 feature 更新到 Github 仓库里。

当然这次 1.7.x --> 1.8.0 的更新还是挺不错的。修复了很多 bug，还有很多 feature。