MoeClue~

Update does not exist.


Explore Me
MoeClue~
Update does not exist.
55
8
146
小米屏幕挂灯控制器拆解
入手了年轻人的第一个(不是)屏幕挂灯,当然要先拆拆拆了
3周前 · Moeka
SkyWorth/创维 4K显示器(28U1)简单测评
这应该是JD最低价格区间的4K显示器了吧?
1月前 · Moeka
400元高性价比HP小主机搭建家用NAS选购指南
作为优秀的年轻人,怎能不拥有一台超棒的NAS呢?更何况只需400元奥!
1月前 · Moeka
小米手环 APP通知提醒 未开启通知读取权限 的解决方法
小米手环 绑定小米运动 APP通知提醒 提示 未开启通知读取权限 解决方法今天刚刚换了小米手环4NF
3月前 · Moeka
【授权发布】Steam转区教程(虚拟机篇)
本文将介绍使用虚拟机进行Steam转区操作
3月前 · Moeka
为 Candy-Rebirth 主题添加 Open Graph 支持
TechnologyShare Moeka · 2年前

Open Graph通讯协定(Protocol)本身是一种制定一套Metatags的规格,用来标注你的页面,告诉我们你的网页代表哪一类型的现实世界物件。

先扔个Fork的项目地址:https://github.com/Hello-Moeka/Candy-Rebirth-Fork
感谢 零件Bokutake 提供修改方法

本修改方法针对 Candy-Rebirth 主题(本站主题)优化,其他主题请适度参考

  • 实现功能:(主要就是og:image的说明,其他标签都是直接调用Typecho的)

og:image:首页og获取网站icon,若无icon则获取Gravatar;文章页获取封面,若无封面则获取文章第一张图,仍没有则匹配首页规则。

  • 修改方法:

修改 header.php:

在<head></head>新增如下内容

<!-- 首页输出 -->
<?php if($this->is('index')): ?>
<meta property="og:url" content="https://moeclue.com/"/>
<meta property="og:type" content="blog"/>
<meta property="og:title" content="MoeClue~"/>
 <?php if ($this->options->logoURL){ ?>
        <meta property="og:image" content="<?php $this->options->logoURL(); ?>" />
    <?php }else{ ?> 
        <meta property="og:image" content="<?php echo gravatarUrl($this, 100); ?>" />
<?php      } ?>
<meta property="og:author" content="Moeka"/>
<meta property="og:site_name" content="MoeClue~"/>
<meta property="og:description" content="Welcome to Moeka's Blog"/>
<meta property="og:locale:alternate" content="zh_CN"/>
<?php endif; ?>

<!-- 文章和独立页面输出 -->
<?php if($this->is('post')||$this->is('page')): ?>
<meta property="og:url" content="<?php $this->permalink(); ?>"/>
<meta property="og:type" content="blog"/>
<meta property="og:title" content="<?php $this->title(); ?>"/>
<meta property="og:image" content="<?php showThumbnail($this); ?>"/>
<meta property="og:author" content="<?php $this->author(); ?>"/>
<meta property="og:site_name" content="<?php $this->options->title(); ?>"/>
<meta property="og:description" content="<?php $this->description(); ?>"/>
<meta property="og:locale:alternate" content="zh_CN"/>
<?php endif; ?>

修改 functions.php:

在末尾新增如下内容

function showThumbnail($widget)
{ 
    $random = gravatarUrl($widget);
    $attach = $widget->attachments(1)->attachment;
    $pattern = '/\<img.*?src\=\"(.*?)\"[^>]*>/i'; 
    if ($widget->fields->previewImage && $widget->fields->previewImage!=="") {
        $widget->fields->previewImage();
    } else if (preg_match_all($pattern, $widget->content, $thumbUrl)) {
        echo $thumbUrl[1][0];
    } else if (@$attach->isImage) {
        echo $attach->url; 
    } else {
        echo $random;
     }
}
function gravatarUrl($widget, $size = 40, $rating = 'X', $default = NULL, $class = NULL)
{
    $url = Typecho_Common::gravatarUrl($widget->author->mail, $size, $rating, $default, $widget->request->isSecure());
    return $url;
}

Tips:注意修改里面的信息为你自己网站的信息

  • 效果图:

效果图

有什么问题可以评论留言哦~

  评论
  • 您正在回复给 Poi