有没有发现本站每一篇文章的下方都有一个非常非常非常可爱的打赏小按钮呢。没错,就类似微信公众号里的打赏功能。其实这个功能在Wordpress里很常见,下面就把适合Typecho打赏功能的代码和大家分享。
1577063404(12121212.png

<div style="social">
    <button id="rewardButton" disable="enable" onclick="var qr = document.getElementById('QR'); if (qr.style.display === 'none') {qr.style.display='block';} else {qr.style.display='none'}">
    <span>打赏</span>
    </button>
    <div id="QR" class="qr clearfix">
        <div id="wechat" style="display: inline-block">
            <a class="fancybox" rel="group"><img id="wechat_qr" src="http://img.wusail.com/wx.png" alt="WeChat Pay"></a>
            <p>
                微信打赏
            </p>
        </div>
        <div id="alipay" style="display: inline-block">
            <a class="fancybox" rel="group"><img id="alipay_qr" src="http://img.wusail.com/zfb.png" alt="Alipay"></a>
            <p>
                支付宝打赏
            </p>
        </div>
    </div>
</div>

把上面的代码放到post页面你喜欢的位置即可。
下面是CSS

.social{padding: 10px 0; margin: 20px auto; width: 100%; font-size:16px; text-align: center;}
#QR{padding-top:20px;display: none;}
#QR a{border:1px solid #000;}
#QR img{width:180px;max-width:100%;display:inline-block;margin:.8em 2em 0 2em}
#rewardButton{border:1px solid #ccc;line-height:36px;text-align:center;height:36px;display:block;border-radius:4px;-webkit-transition-duration:.4s;transition-duration:.4s;background-color:#fff;color:#999;margin:0 auto;padding:0 25px}
#rewardButton:hover{color:#f77b83;border-color:#f77b83;outline-style:none}

上面代码很多还不完善,根据自己需要再修改修改吧。

如何获取收款二维码

微信收款二维码获取流程

  1. 点开右上角的 +
  2. 收付款
  3. 我要收款
  4. 长按二维码即可保存图片

支付宝收款二维码获取流程

  1. 打开支付宝
  2. 收款(一般在下方,或者更多里面)
  3. 保存二维码

要想再美观 一点,可以把下载的图片统一下大小。

今天打开谷歌浏览器,在浏览器的顶部则弹出提示“自 2020 年 12月开始,Flash Player 将不再受支持。”,可以点击“了解详情”,查看具体的地址。
QQ截图20200101152639.png
没错,是时候放弃掉flash player这个毒瘤了,自从去年flash爆出退出中国定制版的广告,它的「毒瘤」口碑已经超过了百度的口碑了。
现在,作为全球市场占有量第一的浏览器 Google Chrome 正式宣布将不再支持flash player。

chrome放弃flash.jpg




- 阅读剩余部分 -

在制作typecho博客主题时,如果想在网站的侧边栏调用一定数量的博客最新文章列表其实是和WP里差不多的,使用Widget_Contents_Post_Recent这个widget即可调用,通过pageSize参数即可限制调用数量。下面直接有三种代码都可达成最新文章的调用。

方法一

<?php $this->widget('Widget_Contents_Post_Recent','pageSize=10')->parse('<li><a href="{permalink}"><span>{year}/{month}/{day}</span>{title}</a></li>'); 
?>

说明:

  • pageSize – 要调用的文章数量,默认调用后台“设置-阅读-文章列表数目”里设置的数量
  • {permalink} – 文章链接标签代码
  • {year} – 文章发布时间年份
  • {month} – 文章发布时间月份
  • {day} – 文章发布时间天
  • {title} – 文章标题

方法二

<?php 
    $this->widget('Widget_Contents_Post_Recent','pageSize=10')->to($recent);
    if($recent->have()):
    while($recent->next()):
?>
<li><a href="<?php $recent->permalink();?>"><?php $recent->title();?></a></li>
<?php endwhile; endif;?>

方法三

<?php 
    $recent = $this->widget('Widget_Contents_Post_Recent','pageSize=10');
    if($recent->have()):
    while($recent->next()):
?>       
<li><a href="<?php $recent->permalink();?>"><?php $recent->title();?></a></li>

三种形式的代码都差不多。我自己是使用第三种

方法是和WP上是一样的,先要选择自己喜欢的暗箱样式,一般都会选择FACEBOX、Lightbox当然其他的也一样。这些插件提供了一种简单的方式为图片、网页和多媒体添加灯箱功能。
1576825165(1).png
1、引用 FancyBox插件

<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<!--如果主题已经引用了jQuery库,可以忽略这条-->
<link rel="stylesheet" href="https://cdn.staticfile.org/fancybox/3.5.2/jquery.fancybox.min.css">
<script src="https://cdn.staticfile.org/fancybox/3.5.2/jquery.fancybox.min.js"></script>

2、给文章图片添加标签

<?php
    $pattern = '/\<img.*?src\=\"(.*?)\"[^>]*>/i';
    $replacement = '<a href="$1" data-fancybox="gallery" /><img src="$1" alt="'.$this->title.'" title="点击放大图片"></a>';
    $content = preg_replace($pattern, $replacement, $this->content);
    echo $content;
?>

用上面的代码替换post.php里的

<?php $this->content(); ?>

3、在头部或者尾部初始化

<script type="text/javascript">
    $(document).ready(function () {
        $( ".fancybox").fancybox();
    });
</script>

打完收工,其他插件方法是一样的,就是添加图片标签不太一样。

在function.php里添加

function thumb($obj) {
    $rand_num = 10; //随机图片数量,根据图片目录中图片实际数量设置
    if ($rand_num == 0) {
        $imgurl = "随机图片存放目录/0.jpg";
        //如果$rand_num = 0,则显示默认图片,须命名为"0.jpg",注意是绝对地址
    }else{
        $imgurl = "随机图片存放目录/".rand(1,$rand_num).".jpg";
            //随机图片,须按"1.jpg","2.jpg","3.jpg"...的顺序命名,注意是绝对地址
    }
    $attach = $obj->attachments(1)->attachment;
    if(isset($attach->isImage) && $attach->isImage == 1){
        $thumb = $attach->url;
    }else{
        $thumb = $imgurl;
    }
        return $thumb;
}

在需要处引用

<img src="<?php echo thumb($this); ?>"/>

function Postviews($archive) {
    $db = Typecho_Db::get();
    $cid = $archive->cid;
    if (!array_key_exists('views', $db->fetchRow($db->select()->from('table.contents')))) {
        $db->query('ALTER TABLE `'.$db->getPrefix().'contents` ADD `views` INT(10) DEFAULT 0;');
    }
    $exist = $db->fetchRow($db->select('views')->from('table.contents')->where('cid = ?', $cid))['views'];
    if ($archive->is('single')) {
        $cookie = Typecho_Cookie::get('contents_views');
        $cookie = $cookie ? explode(',', $cookie) : array();
        if (!in_array($cid, $cookie)) {
            $db->query($db->update('table.contents')
                ->rows(array('views' => (int)$exist+1))
                ->where('cid = ?', $cid));
            $exist = (int)$exist+1;
            array_push($cookie, $cid);
            $cookie = implode(',', $cookie);
            Typecho_Cookie::set('contents_views', $cookie);
        }
    }
    echo $exist == 0 ? '暂无阅读' : $exist.' 次阅读';
}

判断当前页面加载是否快速,通常是直接在浏览器中访问网站,看自己的直观感受是否快速。而客观的方法则是计算具体的页面加载时间并显示出来给看。
1576822875(1).png
1、在当前主题的functions.php文件添加下面的代码:

function timer_start() {
    global $timestart;
    $mtime     = explode( ' ', microtime() );
    $timestart = $mtime[1] + $mtime[0];
    return true;
}
timer_start();
function timer_stop( $display = 0, $precision = 3 ) {
    global $timestart, $timeend;
    $mtime     = explode( ' ', microtime() );
    $timeend   = $mtime[1] + $mtime[0];
    $timetotal = number_format( $timeend - $timestart, $precision );
    $r         = $timetotal < 1 ? $timetotal * 1000 . " ms" : $timetotal . " s";
    if ( $display ) {
        echo $r;
    }
    return $r;
}

2、在要显示加载时间的位置添加调用代码:

<?php echo timer_stop();?>

3、刷新页面即可显示加载时间。

由于经常使用QQ邮箱,发送大文件也方便就是过一段时间就会失效了,非常不方便。有时候想用的时候真是难受。只有存在微云里,直接转存就行,就是下载的时候太折磨人了。异常的慢,想要快就是要充值会员。
下面就分享一个非常简单的不花钱也能下载非常快的方法,就是用QQ传输微云文件,然后在聊天窗口下载就可实现,速度超快。
首先,在聊天窗口找到发送文件,选择微云文件;QQ截图20191016105812.png
之后,打开自己想要下载的文件,找个聊天框拖进去,或者点击聊天框的文件传输,发送微云文件
最后,点击传输上的下载(另存为)就可以飞速下载,一般都会比自己直接下载快得多,当然手机也可以操作但只能用电脑下载
看看下载速度QQ截图20191016110046.png