MoeClue~

Update does not exist.


Explore Me
MoeClue~
Update does not exist.
57
8
159
华为5G随行WiFi Pro 开箱
2020年这5G飞速发展,咱也搞了个5G终端来玩玩,这次是开箱,测试等下回叭
1月前 · Moeka
京东京造 10000mAh移动电源拆解
今天我们不拆好的不拆妙的,简简单单拆个充电宝
2月前 · Moeka
小米屏幕挂灯控制器拆解
入手了年轻人的第一个(不是)屏幕挂灯,当然要先拆拆拆了
3月前 · Moeka
SkyWorth/创维 4K显示器(28U1)简单测评
这应该是JD最低价格区间的4K显示器了吧?
3月前 · Moeka
400元高性价比HP小主机搭建家用NAS选购指南
作为优秀的年轻人,怎能不拥有一台超棒的NAS呢?更何况只需400元奥!
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