修改WordPress的部分内容

本文转自 https://www.chiser.cc/ 所提供的多篇文章,转载时略有修改

引入阿里巴巴矢量图标库彩色图标

建立项目

前言

部分主题导航菜单会出现图标不显示以及菜单文字错位等情况,这里会说如何解决

方法/步骤

一、登录阿里巴巴矢量图标库,创建一个图标项目;【PS:FontClass/Symbol 前缀和Font Family必须为zm或者be,目前知道的就这两个,其余自测】

二、通过搜索自己需要的图标,加入到购物车;

三、把购物车里的图标添加到项目;

四、更新下代码,复制代码到后台——外观——主题选项——辅助功能——阿里图标库粘贴保存;

这里开始是Begin主题的设置方式,如果使用的是非Begin主题请直接前往”正式开始”部分

五、在后台外观——菜单——导航菜单复制图标代码粘贴保存;【PS:菜单没有CSS类(可选)在右上角顶部显示选项勾选CSS类】.

最终效果

注意事项

新增/删减图标、修改图标大小/名称等操作都需要更新代码,复制更新后的代码粘贴到阿里图标库


正式开始

获取JS代码

一、没有新建有阿里巴巴矢量图标库项目的参照上面文章所写的步骤来新建项目;

二、此次需要使用到Symbol,复制JS代码:

//at.alicdn.com/t/font_1126685_0dc7l0zgxsvr.js

引入JS代码

一、在当前主题目录funtions.php添加代码:

function add_stylesheet_to_head() {
    echo “\n<script type=’text/javascript’ src=’//at.alicdn.com/t/font_1126685_0dc7l0zgxsvr.js’></script>”;
}

二、以上JS链接自行替换

添加css样式

在当前主题目录下的header.php文件中/head前添加以下样式:

<style type=“text/css”>
.icon {
    width: 1em; height: 1em;
    vertical-align: -0.15em;
    fill: currentColor;
    overflow: hidden;
}
</style>

添加彩色图标

一、在WordPress后台>外观>菜单>导航标签添加以下代码:

<svg class=“icon” aria-hidden=“true”><use xlink:href=“#icon-Home”></use></svg>网站首页

二、其中class=”icon”对应FontClass/Symbol 前缀,icon-Home对应图标代码

添加自定义鼠标样式

方法/步骤

一、准备好.cur格式的鼠标样式,准备2个,一个是普通箭头样式一个是鼠标移动到链接处的手掌样式,你也可以个性化自己的鼠标样式

二、在当前主题header.php文件中的/head前添加以下样式:

body {    
    cursor: url(“https://www.coolpan.xyz/Images/Blog/MacOS.cur”), auto;    
}  
a:hover{  
    cursor: url(“https://www.coolpan.xyz/Images/Blog/Hand.cur”),pointer;  
}   
三、其中https://www.coolpan.xyz/Images/Blog/MacOS.cur 是正常状态下的鼠标样式的文件绝对地址,https://www.coolpan.xyz/Images/Blog/Hand.cur是鼠标移动到链接处的鼠标样式绝对地址

四、保存完毕后刷新网页即可看到效果

修改Gravatar头像

前言

因为Gravatar头像被墙,评论头像显示不出来,这时就需要通过其他方法调用Gravatar头像.

方法/步骤

当前主题目录下function.php文件添加以下代码.

//使用https方式(SSL)调用Gravatar头像
function get_ssl_avatar($avatar) {
   $avatar = preg_replace(‘/.*\/avatar\/(.*)\?s=([\d]+)&.*/’,'<img src=“https://cdn.v2ex.com/avatar/$1?s=$2” class=“avatar avatar-$2” height=“$2” width=“$2”>’,$avatar);
   return $avatar;
}
add_filter(‘get_avatar’, ‘get_ssl_avatar’);

PS:部分主题仅需通过后台设置完成此操作,无需修改代码

非插件实现站点地图

前言

相信不少数站长都是用插件实现HTML站点地图,分享下非插件实现站点地图.

HTML站点地图

一、新建一个sitemap.php文件,打开php文件粘贴以下代码:

<?php  
/** 
@package WordPress 
Template Name: 站点地图 
*/  
?>  
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>  
<html xmlns=“http://www.w3.org/1999/xhtml”>  
<head profile=“http://gmpg.org/xfn/11”>  
<meta http-equiv=“Content-Type” content=“text/html; charset=<?php bloginfo( ‘charset’ ); ?>” />  
<title>站点地图 – <?php bloginfo(‘name’); ?></title>  
<link rel=“canonical” href=“<?php echo get_permalink(); ?>” />  
<style type=“text/css”>  
body {  
    FONT-SIZE: 14px;  
    MARGIN: 0;  
    color: #000000;  
    background: rgba(255, 0, 0, 0);  
    background-image:url(“”);  
    background-repeat:repeat;  
    background-size: 100% 100%;  
    background-attachment:fixed  
}  
img {  
    border: 0;  
}  
a {  
    color: #2196f3;  
}  
li {  
    margin-top: 8px;  
}  
.page {  
    padding: 4px;  
    border-top: 1px #EEEEEE solid  
}  
.author {  
    background-color: #EEEEFF;  
    padding: 6px;  
    border-top: 1px #3f51b5 solid  
}  
#nav, #content, #footer {  
    padding: 10px;  
    border: 4px double #00bcd4;  
    clear: both;  
    width: 80%;  
    margin: auto;  
    margin-top: 10px;  
}  
</style>  
</head>  
<body vlink=“#333333” link=“#333333”>  
<h2 style=“text-align: center; margin-top: 20px”><?php bloginfo(‘name’); ?>站点地图</h2>  
<center></center>  
<div id=“nav”><a href=“<?php bloginfo(‘url’); ?>/”><strong><?php bloginfo(‘name’); ?></strong></a> &raquo; <a href=“<?php echo get_permalink(); ?>”>站点地图</a></div>  
<div id=“content”>  
<h3>文章</h3>  
<ul>  
<?php  
$previous_year = $year = 0;  
$previous_month = $month = 0;  
$ul_open = false;  
$myposts = get_posts(‘numberposts=-1&orderby=post_date&order=DESC’);  
foreach($myposts as $post) :  
?>  
<li><a href=“<?php the_permalink(); ?>” title=“<?php the_title(); ?>” target=“_blank”><?php the_title(); ?></a></li>  
<?php endforeach; ?>  
</ul>  
</div>  
<div id=“content”>  
<li class=“categories”>分类<ul>  
<?php wp_list_categories(‘title_li=’); ?>  
</ul></li>  
</div>  
<div id=“content”>  
<li class=“categories”>页面</li>  
<?php wp_page_menu( $args ); ?>  
</div>  
<div id=“footer”>网站首页: <strong><a href=“<?php bloginfo(‘url’); ?>/”><?php bloginfo(‘name’); ?></a></strong></div><br />  
<center>  
<div style=“text-algin: center; font-size: 13px”>Chiser丶</div>  
<div style=“text-algin: center; font-size: 11px”>最后更新:<?php $last = $wpdb->get_results(“SELECT MAX(post_modified) AS MAX_m FROM $wpdb->posts WHERE (post_type = ‘post’ OR post_type = ‘page’) AND (post_status = ‘publish’ OR post_status = ‘private’)”);$last = date(‘Y-m-d G:i:s’, strtotime($last[0]->MAX_m));echo $last; ?><br /><br /></div>  
</center>  
</body>  
</html>  

二、保存上传至当前主题目录下的page文件夹,【即页面模板目录】;

三、新建页面,模板选择站点地图发布,修改网址为sitemap.html即可;

评论

  1. xinsenz
    Windows Chrome 83.0.4103.116

    非插件实现站点地图,发布后,打开页面时显示遇到致命错误。。。

    1月前
    2020-7-12 22:15:46
    • Magneto 博主
      Windows Edge 83.0.478.61

      这个也是我转载的,就是进行了一些小修改,这个我也没试过😂

      4周前
      2020-7-14 18:45:47

发送评论 编辑评论

上一篇
下一篇