主题样式

[scode type="yellow"]此页面仅记录本站修改样式的代码、内容。部分代码原作者已不能追查出处，敬请谅解。[/scode]

### 增加新表情的通用固定图片大小css样式

[collapse status="false" title="增加新表情的通用固定图片大小css样式（handsome放在外观设置-开发者设置-自定义 CSS）"]

```css
/* 表情包的样式 */
.emotion-nuoxian-Bilixhl{width:30px;} /*.emotion-表情包名称{width:宽度大小}*/
```

[/collapse]

### 底部版权css样式

[collapse status="false" title="底部版权css样式（handsome放在外观设置-开发者设置-自定义 CSS）旧版CSS，已弃用"]

```css
/* 底部页脚 */
.github-badge {
  display: inline-block;
  border-radius: 4px;
  text-shadow: none;
  font-size: 12px;
  color: #fff;
  line-height: 15px;
  background-color: #abbac3;
  /*margin-bottom: 5px; 不让上下居中的罪魁祸首 */
}

.github-badge .badge-subject {
  display: inline-block;
  background-color: #4d4d4d;
  padding: 4px 4px 4px 6px;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

.github-badge .badge-value {
  display: inline-block;
  padding: 4px 6px 4px 4px;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

/* 底部颜色 */
.github-badge .bg-blue {
  background-color: #007ec6;
}

.github-badge .bg-orange {
  background-color: #ffa500;
}

.github-badge .bg-red {
  background-color: #f00;
}

.github-badge .bg-green {
  background-color: #3bca6e;
}

.github-badge .bg-purple {
  background-color: #ab34e9;
}
```

[/collapse]

### 底部版权左侧html代码

[collapse status="false" title="底部版权左侧html代码（handsome放在外观设置-开发者设置-博客底部左侧信息）"]

```html

<img data-toggle="tooltip" data-placement="top" data-original-title="Copyright ©2021 nuoxian" src="/assets/icon/copyright.svg">

<a target="_blank" rel="noopener" href="https://beian.miit.gov.cn/" data-toggle="tooltip" data-placement="top" data-original-title="赣ICP备2020011953号-2"><img src="/assets/icon/beian.svg"></a>

<a target="_blank" rel="noopener" href="https://beian.mps.gov.cn/#/query/webSearch?code=36090202000205" data-toggle="tooltip" data-placement="top" data-original-title="赣公网安备36090202000205号"><img src="/assets/icon/beianmps.svg"></a>
```

[/collapse]

### 底部版权右侧html代码

[collapse status="false" title="底部版权右侧html代码（handsome放在外观设置-开发者设置-博客底部右侧信息）"]

```html

<a target="_blank" rel="noopener" href="https://myssl.com/nxvav.cn?from=mysslid" data-toggle="tooltip" data-placement="top" data-original-title="本站MySSL安全认证信息"><img src="/assets/icon/myssl.svg"></a>
```

[/collapse]

### 底部版权html代码补充内容

[collapse status="false" title="底部版权html代码补充内容"]

以下为鼠标移动到该内容上则会显示的内容（以下代码默认为在上方显示，因为handsome默认引用了Bootstrap提示框，所以以上底部版权css样式代码中没有引入Bootstrap提示框，若是其他主题则不能保证是否引用），可看具体使用方法链接：[Bootstrap提示框](https://www.cnblogs.com/xiaohuochai/p/7147288.html)

```js
data-toggle="tooltip" data-placement="top" data-original-title="Copyright ©2021 nuoxian"
```

[/collapse]

### 删除handsome默认的底部版权

[collapse status="false" title="删除handsome默认的底部版权"]

在 `/usr/themes/handsome/component/footer.php`中的第 `117`行

原代码：

```html
<footer id="footer" class="app-footer" role="footer">
    <div class="wrapper bg-light">
      <span class="pull-right hidden-xs text-ellipsis">
      <?php $this->options->BottomInfo();
      // 可以去除主题版权信息，最好保留版权信息或者添加主题信息到友链，谢谢你的理解
      ?>
      Powered by <a target="_blank" href="http://www.typecho.org">Typecho</a> | Theme by <a target="_blank"
                                                                                                      href="https://www.ihewro.com/archives/489/">handsome</a>
      </span>
        <span class="text-ellipsis">© <?php echo date("Y"); ?> Copyright <?php
            $this->options->BottomleftInfo(); ?></span>
    </div>

</footer>
```

改成以下：

```html
<footer id="footer" class="app-footer" role="footer">
    <div class="wrapper bg-light">
      <span class="pull-right hidden-xs text-ellipsis">
      <?php $this->options->BottomInfo();
      // 可以去除主题版权信息，最好保留版权信息或者添加主题信息到友链，谢谢你的理解
      ?>
      </span>
	  <span class="text-ellipsis"><?php $this->options->BottomleftInfo(); ?></span>
    </div>

</footer>
```

[/collapse]

### Typecho插件 Comment2Mail 默认发信模板样式修改代码

[collapse status="false" title="Typecho插件 Comment2Mail 默认发信模板样式修改代码"]

插件位置 `/usr/plugins/Comment2Mai/Plugin.php`

原作者插件文章地址：[typecho邮件提醒插件：Comment2Mai](https://www.hoehub.com/PHP/typecho-Comment2Mail.html)

作者插件项目地址：[Comment2Mail: typecho博客系统评论邮件提醒插件](https://gitee.com/HoeXhe/typecho-Comment2Mail)

原发信模板代码：

```html
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
</head>
<body style="width:100%;height:800px;background-color:#EEF3FA; font-size:14px;font-family:Microsoft YaHei;">
    <div style="margin:100px auto;background-color:#fff;  width:866px; border:1px solid #F1F0F0;box-shadow: 0 0 5px #F1F0F0;">
    <div style="width:838px;height: 78px; padding-top: 10px;padding-left:28px; background-color:#F7F7F7;">
        <a style="cursor:pointer; font-size:30px; color:#333;text-decoration: none; font-weight: bold;"
           href="{$options->siteUrl}">{$options->title}</a><span
            style="color:#999; font-size:14px;padding-left:20px;">{$options->description}</span>
    </div>
    <div style="padding:30px;">
        <div style="height:50px; line-height:50px; font-size:16px; color:#9e9e9e;">{$desc}</div>
        <div style="line-height:30px;  font-size:16px; margin-bottom:20px; text-indent: 2em;">
            {$commentText}
        </div>
        <div style="line-height:40px;  font-size:14px;">
            <label style="color:#999;">评论人：</label>
            <span style="color:#333;">{$comment->author} 邮箱: {$comment->mail}</span>
        </div>
        <div style="line-height:40px;  font-size:14px;">
            <label style="color:#999;">评论地址：</label>
            <a href="{$comment->permalink}" style="color:#333;">{$comment->permalink}</a>
        </div>
        <div style="line-height:40px;  font-size:14px;">
            <label style="color:#999;">评论时间：</label>
            <span style="color:#333;">{$commentAt}</span>
        </div>
    </div>
</div>
</body>
</html>
```

修改成以下内容（此代码可自适应）：

以下代码放在 `322`行，在 `很朴素的邮件风格`代码上方

```php
    /**
     * 获取文章标题
     * @param $cid 文章ID
     * @return mixed
     * @throws Typecho_Db_Exception
     */
    private static function title($cid)
    {
        $db = Typecho_Db::get();
        $widget = new Widget_Abstract_Contents(new Typecho_Request(), new Typecho_Response());
        // 查询
        $select = $widget->select()->select('title')->where('cid' . ' = ?', $cid)->limit(1);
        $article = $db->fetchRow($select, [$widget, 'push']); // 获取文章
        return $article->title;
    }
```

以下代码放在 `355`行，删除原发信模板代码并放入以下代码就行了

```html
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"/>
</head>
<body>

<div id="mailContentContainer" class="qmbox qm_con_body_content qqmail_webmail_only" style="">
<style type="text/css">.qmbox .qmbox style, .qmbox .qmbox script, .qmbox .qmbox head, .qmbox .qmbox link, .qmbox .qmbox meta {display: none !important;}.qmbox .biaoqing {margin: 0 .25em;vertical-align: bottom;height: 2em;}.qmbox .emailz{background-color:white;border-top:2px solid #12ADDB;box-shadow:0 1px 3px #AAAAAA;line-height:180%;padding:0 15px 12px;width:500px;margin:35px auto;color:#555555;font-family:'Century Gothic','Trebuchet MS','Hiragino Sans GB',微软雅黑,'Microsoft Yahei',Tahoma,Helvetica,Arial,'SimSun',sans-serif;font-size:14px;}@media (max-width:767px){.qmbox .emailz{width: 88%;}}</style>
<div class="emailz">  
<h2 style="border-bottom:1px solid #DDD;font-size:14px;font-weight:normal;padding:13px 0 10px 8px;"><span style="color: #12ADDB;font-weight: bold;">> </span>在<a style="text-decoration:none;color: #12ADDB;" href="{$comment->permalink}" target="_blank" rel="noopener">《{$comment->title}》</a>中，您有一条新的回复</h2>
        <div style="padding:0 12px 0 12px;margin-top:18px">  
            <p>时间：{$commentAt}</p>  
            <p style="background-color: #f5f5f5;border: 0px solid #DDD;padding: 10px 15px;margin:18px 0">{$commentText}</p>  
            <p>评论者：<span style="color: #12ADDB;">{$comment->author}</span></p>  
            <p style="background-color: #f5f5f5;border: 0px solid #DDD;padding: 10px 15px;margin:18px 0"> <a target="_blank" rel="noopener">{$comment->mail}</a></p> 
            <p>您可以点击 <a style="text-decoration:none; color:#12addb" href="{$comment->permalink}" target="_blank" rel="noopener">查看回复的完整內容 </a>，欢迎再次光临 <a style="text-decoration:none; color:#12addb" href="{$options->siteUrl}" target="_blank" rel="noopener">{$options->title}</a>。</p>  
        </div>  
</div>
</div>
</body>
</html>
```

![修改后的效果展示](https://vkceyugu.cdn.bspapp.com/VKCEYUGU-2fa930c8-feec-4942-ac88-ba3781377bb0/345216e8-5ba6-46ec-a506-d1a40e67e9eb.png)

[/collapse]

### 万能控制台

[collapse status="false" title="万能控制台（handsome放在外观设置-开发者设置-自定义输出body 尾部的HTML代码）"]

```js
<script type="text/javascript">
    console.clear();  //清空控制台
    console.log("\n %c 诺仙の客栈 | Copyright nuoxian.","color:#fff;background: linear-gradient(to right , #7A88FF, #d27aff);padding:5px;border-radius: 10px;");  //可写html代码
</script>
```

[/collapse]

### 标签排列整齐

[collapse status="false" title="标签排列整齐（handsome放在外观设置-开发者设置-自定义 CSS）"]

```css
/* 标签云排列整齐 */
#tag_cloud-2 a {
  border-radius: 5px;
  width: 32%;
}
```

[/collapse]

### Typecho的Sitemap插件 BaiduSubmit & Typecho Google Sitemap

[collapse status="false" title="BaiduSubmit & Google Sitemap 插件"]

插件下载地址：

Google Sitemap：[Typecho Google Sitemap - Suming blog](https://suming.org/map.html)

百度sitemap提交插件 for Typecho：[百度sitemap提交插件 for Typecho - 老高的技术博客 (phpgao.com)](https://blog.phpgao.com/typecho_plugin_baidusubmit.html)

[/collapse]

### 首页文章标题居中

[collapse status="false" title="首页文章标题居中（handsome放在外观设置-开发者设置-自定义css"]

```css
/*文章标题居中*/
.panel h2{
    text-align: center; 
}
.panel-small h2{
    text-align: center; 
}
.panel-picture h3{
    text-align: center; 
}
.post-item-foot-icon{
    text-align: center;
}
```

[/collapse]

### Typecho 支持emoji表情

typecho默认数据库不支持emoji表情，需要修改下数据库的编码来达到支持的效果

> typecho_xxx 的前缀请查看数据库中的表名，防止无法更改成功?

```sql
alter table typecho_comments convert to character set utf8mb4 collate utf8mb4_unicode_ci;
alter table typecho_contents convert to character set utf8mb4 collate utf8mb4_unicode_ci;
alter table typecho_fields convert to character set utf8mb4 collate utf8mb4_unicode_ci;
alter table typecho_metas convert to character set utf8mb4 collate utf8mb4_unicode_ci;
alter table typecho_options convert to character set utf8mb4 collate utf8mb4_unicode_ci;
alter table typecho_relationships convert to character set utf8mb4 collate utf8mb4_unicode_ci;
alter table typecho_users convert to character set utf8mb4 collate utf8mb4_unicode_ci;
```

执行上述sql语句来修改表的编码，如果用的是宝塔面板和MySQL数据库，一般有可视化的phpmyadmin界面，可以在phpmyadmin的控制台里面执行上面的语句，如果是服务器可以在服务器上连接mysql后执行。

最后将 Typecho 目录下的config.inc.php 配置文件中数据库定义参数中的 charset 为 `utf8mb4`：

```php
  $db->addServer(array (
      'host'      =>  localhost, 
      'user'      =>  'root',
      'password'  =>  'root',
      'charset'   =>  'utf8mb4', //修改这一行
      'port'      =>  3306,
      'database'  =>  ''
  ), Typecho_Db::READ | Typecho_Db::WRITE);
```

### 解决 Typecho 后台不显示头像的问题

[collapse status="false" title="解决 Typecho 后台不显示头像的问题"]

[scode type="green" size=""]因为Typecho默认采用gravatar默认源，但是国内无法访问的原因导致后台头像加载失败非常不美观，虽然前台可以显示，但是后台也要好看才可以[/scode]

在Typecho根目录的 `config.inc.php`任意一行插入以下代码：

```php
/** 自定义后台Gravatar头像 */
define('__TYPECHO_GRAVATAR_PREFIX__', 'https://cravatar.cn/avatar/');
```

[/collapse]

### 关于评论区显示需要输入真实邮箱的实现方法

找到自己的主题目录，我的主题是`handsome`，然后找到这个文件`主题目录/component/comments.php`，每个主题所在的位置都不一样。找到第`164`行并写入以下内容 `(请输入真实的邮箱地址便于接收回复)`

##### 原本代码

```html
<span class="required text-danger">*</span></label>
```

##### 改成以下内容

```html
<span class="required text-danger">* (请输入真实的邮箱地址便于接收回复)</span></label>
```

[collapse status="false" title="启用CDN后无法获取真实IP的解决方法"]

在 Typecho 根目录的 `config.inc.php` 文件添加以下代码

```php
/** 防止CDN造成无法获取客户真实IP地址 */
    if(isset($_SERVER['HTTP_X_FORWARDED_FOR'])) 
    {
        $list = explode(',',$_SERVER['HTTP_X_FORWARDED_FOR']);
        $_SERVER['REMOTE_ADDR'] = $list[0];
    }
```

[/collapse]

此页面仅记录本站修改样式的代码、内容。部分代码原作者已不能追查出处，敬请谅解。
</div>

### 增加新表情的通用固定图片大小css样式

<div class="panel panel-default collapse-panel box-shadow-wrap-lg"><div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#collapse-c07bb8af1381647a34bc0484ae6345a074" aria-expanded="true"><div class="accordion-toggle"><span style="">增加新表情的通用固定图片大小css样式（handsome放在外观设置-开发者设置-自定义 CSS）</span>
<i class="pull-right fontello icon-fw fontello-angle-right"></i>
</div>
</div>
<div class="panel-body collapse-panel-body">
<div id="collapse-c07bb8af1381647a34bc0484ae6345a074" class="collapse collapse-content"><p></p>

```css
/* 表情包的样式 */
.emotion-nuoxian-Bilixhl{width:30px;} /*.emotion-表情包名称{width:宽度大小}*/
```

### 底部版权css样式

<div class="panel panel-default collapse-panel box-shadow-wrap-lg"><div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#collapse-c3b294d49f27391700884ec554362e7329" aria-expanded="true"><div class="accordion-toggle"><span style="">底部版权css样式（handsome放在外观设置-开发者设置-自定义 CSS）旧版CSS，已弃用</span>
<i class="pull-right fontello icon-fw fontello-angle-right"></i>
</div>
</div>
<div class="panel-body collapse-panel-body">
<div id="collapse-c3b294d49f27391700884ec554362e7329" class="collapse collapse-content"><p></p>

.github-badge .badge-subject {
  display: inline-block;
  background-color: #4d4d4d;
  padding: 4px 4px 4px 6px;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

.github-badge .badge-value {
  display: inline-block;
  padding: 4px 6px 4px 4px;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

/* 底部颜色 */
.github-badge .bg-blue {
  background-color: #007ec6;
}

.github-badge .bg-orange {
  background-color: #ffa500;
}

.github-badge .bg-red {
  background-color: #f00;
}

.github-badge .bg-green {
  background-color: #3bca6e;
}

.github-badge .bg-purple {
  background-color: #ab34e9;
}
```

### 底部版权左侧html代码

<div class="panel panel-default collapse-panel box-shadow-wrap-lg"><div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#collapse-69d72c266717f0c2271fe09cb6dcafa451" aria-expanded="true"><div class="accordion-toggle"><span style="">底部版权左侧html代码（handsome放在外观设置-开发者设置-博客底部左侧信息）</span>
<i class="pull-right fontello icon-fw fontello-angle-right"></i>
</div>
</div>
<div class="panel-body collapse-panel-body">
<div id="collapse-69d72c266717f0c2271fe09cb6dcafa451" class="collapse collapse-content"><p></p>

```html

<img data-toggle="tooltip" data-placement="top" data-original-title="Copyright ©2021 nuoxian" src="/assets/icon/copyright.svg">

### 底部版权右侧html代码

<div class="panel panel-default collapse-panel box-shadow-wrap-lg"><div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#collapse-c94a23dc80b7e471cc4fb4cf7486941372" aria-expanded="true"><div class="accordion-toggle"><span style="">底部版权右侧html代码（handsome放在外观设置-开发者设置-博客底部右侧信息）</span>
<i class="pull-right fontello icon-fw fontello-angle-right"></i>
</div>
</div>
<div class="panel-body collapse-panel-body">
<div id="collapse-c94a23dc80b7e471cc4fb4cf7486941372" class="collapse collapse-content"><p></p>

### 底部版权html代码补充内容

<div class="panel panel-default collapse-panel box-shadow-wrap-lg"><div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#collapse-a0dae9059563df45446060e3d69417c499" aria-expanded="true"><div class="accordion-toggle"><span style="">底部版权html代码补充内容</span>
<i class="pull-right fontello icon-fw fontello-angle-right"></i>
</div>
</div>
<div class="panel-body collapse-panel-body">
<div id="collapse-a0dae9059563df45446060e3d69417c499" class="collapse collapse-content"><p></p>

```js
data-toggle="tooltip" data-placement="top" data-original-title="Copyright ©2021 nuoxian"
```

### 删除handsome默认的底部版权

<div class="panel panel-default collapse-panel box-shadow-wrap-lg"><div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#collapse-b5603062dfcee69c56d282f22522cc8457" aria-expanded="true"><div class="accordion-toggle"><span style="">删除handsome默认的底部版权</span>
<i class="pull-right fontello icon-fw fontello-angle-right"></i>
</div>
</div>
<div class="panel-body collapse-panel-body">
<div id="collapse-b5603062dfcee69c56d282f22522cc8457" class="collapse collapse-content"><p></p>

在 `/usr/themes/handsome/component/footer.php`中的第 `117`行

原代码：

</footer>
```

改成以下：

```html
<footer id="footer" class="app-footer" role="footer">
    <div class="wrapper bg-light">
      <span class="pull-right hidden-xs text-ellipsis">
      <?php $this->options->BottomInfo();
      // 可以去除主题版权信息，最好保留版权信息或者添加主题信息到友链，谢谢你的理解
      ?>
      </span>
	  <span class="text-ellipsis"><?php $this->options->BottomleftInfo(); ?></span>
    </div>

</footer>
```

### Typecho插件 Comment2Mail 默认发信模板样式修改代码

<div class="panel panel-default collapse-panel box-shadow-wrap-lg"><div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#collapse-7f6684b8df8867bb88f9cef30331f11942" aria-expanded="true"><div class="accordion-toggle"><span style="">Typecho插件 Comment2Mail 默认发信模板样式修改代码</span>
<i class="pull-right fontello icon-fw fontello-angle-right"></i>
</div>
</div>
<div class="panel-body collapse-panel-body">
<div id="collapse-7f6684b8df8867bb88f9cef30331f11942" class="collapse collapse-content"><p></p>

插件位置 `/usr/plugins/Comment2Mai/Plugin.php`

原作者插件文章地址：[typecho邮件提醒插件：Comment2Mai](https://www.hoehub.com/PHP/typecho-Comment2Mail.html)

作者插件项目地址：[Comment2Mail: typecho博客系统评论邮件提醒插件](https://gitee.com/HoeXhe/typecho-Comment2Mail)

原发信模板代码：

修改成以下内容（此代码可自适应）：

以下代码放在 `322`行，在 `很朴素的邮件风格`代码上方

以下代码放在 `355`行，删除原发信模板代码并放入以下代码就行了

![修改后的效果展示](https://vkceyugu.cdn.bspapp.com/VKCEYUGU-2fa930c8-feec-4942-ac88-ba3781377bb0/345216e8-5ba6-46ec-a506-d1a40e67e9eb.png)

### 万能控制台

<div class="panel panel-default collapse-panel box-shadow-wrap-lg"><div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#collapse-8573d7608e13e8380e916a6aab9075c596" aria-expanded="true"><div class="accordion-toggle"><span style="">万能控制台（handsome放在外观设置-开发者设置-自定义输出body 尾部的HTML代码）</span>
<i class="pull-right fontello icon-fw fontello-angle-right"></i>
</div>
</div>
<div class="panel-body collapse-panel-body">
<div id="collapse-8573d7608e13e8380e916a6aab9075c596" class="collapse collapse-content"><p></p>

### 标签排列整齐

<div class="panel panel-default collapse-panel box-shadow-wrap-lg"><div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#collapse-8f93c7e735ed0e2c8e41a735d775175c38" aria-expanded="true"><div class="accordion-toggle"><span style="">标签排列整齐（handsome放在外观设置-开发者设置-自定义 CSS）</span>
<i class="pull-right fontello icon-fw fontello-angle-right"></i>
</div>
</div>
<div class="panel-body collapse-panel-body">
<div id="collapse-8f93c7e735ed0e2c8e41a735d775175c38" class="collapse collapse-content"><p></p>

```css
/* 标签云排列整齐 */
#tag_cloud-2 a {
  border-radius: 5px;
  width: 32%;
}
```

### Typecho的Sitemap插件 BaiduSubmit & Typecho Google Sitemap

<div class="panel panel-default collapse-panel box-shadow-wrap-lg"><div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#collapse-02197538ac5693909f8fc56903454bd021" aria-expanded="true"><div class="accordion-toggle"><span style="">BaiduSubmit & Google Sitemap 插件</span>
<i class="pull-right fontello icon-fw fontello-angle-right"></i>
</div>
</div>
<div class="panel-body collapse-panel-body">
<div id="collapse-02197538ac5693909f8fc56903454bd021" class="collapse collapse-content"><p></p>

插件下载地址：

Google Sitemap：[Typecho Google Sitemap - Suming blog](https://suming.org/map.html)

百度sitemap提交插件 for Typecho：[百度sitemap提交插件 for Typecho - 老高的技术博客 (phpgao.com)](https://blog.phpgao.com/typecho_plugin_baidusubmit.html)

### 首页文章标题居中

<div class="panel panel-default collapse-panel box-shadow-wrap-lg"><div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#collapse-993e06ebbb66b64ad14fc0e70ca9e04c45" aria-expanded="true"><div class="accordion-toggle"><span style="">首页文章标题居中（handsome放在外观设置-开发者设置-自定义css</span>
<i class="pull-right fontello icon-fw fontello-angle-right"></i>
</div>
</div>
<div class="panel-body collapse-panel-body">
<div id="collapse-993e06ebbb66b64ad14fc0e70ca9e04c45" class="collapse collapse-content"><p></p>

### Typecho 支持emoji表情

typecho默认数据库不支持emoji表情，需要修改下数据库的编码来达到支持的效果

> typecho_xxx 的前缀请查看数据库中的表名，防止无法更改成功?

最后将 Typecho 目录下的config.inc.php 配置文件中数据库定义参数中的 charset 为 `utf8mb4`：

### 解决 Typecho 后台不显示头像的问题

<div class="panel panel-default collapse-panel box-shadow-wrap-lg"><div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#collapse-348232a769296ea79139b47696380a9a61" aria-expanded="true"><div class="accordion-toggle"><span style="">解决 Typecho 后台不显示头像的问题</span>
<i class="pull-right fontello icon-fw fontello-angle-right"></i>
</div>
</div>
<div class="panel-body collapse-panel-body">
<div id="collapse-348232a769296ea79139b47696380a9a61" class="collapse collapse-content"><p></p>

因为Typecho默认采用gravatar默认源，但是国内无法访问的原因导致后台头像加载失败非常不美观，虽然前台可以显示，但是后台也要好看才可以
</div>

在Typecho根目录的 `config.inc.php`任意一行插入以下代码：

```php
/** 自定义后台Gravatar头像 */
define('__TYPECHO_GRAVATAR_PREFIX__', 'https://cravatar.cn/avatar/');
```

### 关于评论区显示需要输入真实邮箱的实现方法

##### 原本代码

```html
<span class="required text-danger">*</span></label>
```

##### 改成以下内容

```html
<span class="required text-danger">* (请输入真实的邮箱地址便于接收回复)</span></label>
```

<div class="panel panel-default collapse-panel box-shadow-wrap-lg"><div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#collapse-4dcae54753d1a94ac1980a6a84f0526e85" aria-expanded="true"><div class="accordion-toggle"><span style="">启用CDN后无法获取真实IP的解决方法</span>
<i class="pull-right fontello icon-fw fontello-angle-right"></i>
</div>
</div>
<div class="panel-body collapse-panel-body">
<div id="collapse-4dcae54753d1a94ac1980a6a84f0526e85" class="collapse collapse-content"><p></p>

在 Typecho 根目录的 `config.inc.php` 文件添加以下代码