免费WordPress主题定制修改

前言

对于此博客wordpress的主题我纠结很久。找了几个小时一直没发现自己满意的,不得不吐槽国内几款常见主题其实都不太好看,我在想当初为什么要买。对于挑选主题有点心得,哪天分享一篇找主题的方法和网站。

结果在wordpress后台一眼看到现在用的这款,感觉非常喜欢。因为免费也没主题后台管理,缺少很多功能。而且因为是英文主题,对中文汉字的适配也有点问题。但整体非常喜欢,也没办法。只能慢慢先用着再说。

这里我修改增强主题一些地方,其中的步骤方法,对所有免费主题都适用。所以在此记录下来,避免以后升级忘记。

Markdown语法 点击图片放大高亮

先看看效果吧,点击如下图片

这个功能其实可以用插件做到,比如

  • Easy FancyBox
  • FancyBox for WordPress

这些插件安装好以后只要在文章内插入图片,然后就行了。但是因为我平时都是使用 Markdown 语法写作插入图片。MD 语法经过 WordPress 解释器转成 Html 如下:

<img title="name" alt="name" src="url">

但是这些插件要求的样式如下:

<a href=""><img src="url"></a>

所以明显不适用,要将如上格式改成如下。不可能一张张手动修改,太累。

安装点击图片放大框架

这里并没有选择如上两个插件,使用网上 github 开源的一个框架。点击下载框架

解压到 WP 主题所在文件夹

/wp-content/themes/主题名/fancybox

header.php添加代码,放在</head>之前

<link href="<?php bloginfo('template_url'); ?>/fancybox/source/jquery.fancybox.css?v=2.1.5" rel="stylesheet" media="all" />

注意位置,是</head>而不是<head>

footer.php中添加代码,放在</body>之前

<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/fancybox/lib/jquery-1.10.1.min.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/fancybox/source/jquery.fancybox.pack.js?v=2.1.5"></script>
<script>
    // 给图片添加链接
    $(document).ready(function() {
        $("p img").each(function() {
        var strA = "<a id='yourid' href='" + this.src + "'></a>";
        $(this).wrapAll(strA);
        });
    });
    // fancybox
    $("#yourid").fancybox({
        openEffect    : 'elastic',
        closeEffect   : 'elastic',
    });
</script>

ok 到这里就没问题,亲测可行。 感谢 https://phower.me/code/133/

提高留存 链接新窗口打开

这点很常见,国外的主题点击链接都不会新开一个网页。可以说是很文明了 哈哈。但是要考虑国内人使用习惯,这样做很容易叉掉将网站关了。

没办法 只能自己添加代码达到这效果。

在主题后台编辑,选择 header.php</head>标签前添加如下代码

<base target="_blank"> 

好的 可以了。

 

本文由老郭种树原创,转载请注明:https://guozh.net/mianfeiwordpresszhutidingzhixiugai/

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注