typecho实现QQ卡片链接，教程案例

昨晚上在typecho交流群讨论过的问题，就是如何让发到群里的网址自动显示卡片的形式，而不通过浏览器或者其它接口的分享。实现的方法其实不算难，主要是页面头部的meta申明，按道理一般的模板开发者都会的，不过鉴于还是新手太多，所以整理一篇教程也没什么关系（最近没什么东西好写）。值得注意的是，配置好了也不一定会立即生效，QQ存在缓存，可能要过一两天，另外部分网址，比如存在加载不出的超时链接，或者域名存在问题的，也不会显示。

代码如下，加入全局头部模板head标签内部：

<meta property="og:image" <?php if($this->is('post')||$this->is('page')): ?>
content="<?php showThumbnail($this,0); ?>"<?php else: ?>
<?php if ($this->options->logoUrl){ ?>content="<?php $this->options->logoUrl();?>"<?php }else{ ?>content="<?php $this->options->siteUrl(); ?>logo.jpg"<?php };?><?php endif; ?>>
<meta property="og:title" content="<?php $this->archiveTitle(array(
'category'=>_t('%s '),
'search'=>_t('包含关键字 %s 的文章'),
'tag' =>_t('标签 %s 下的文章'),
'author'=>_t('%s 的主页')
), '', ' - '); ?><?php $this->options->title(); ?>"/>
<meta property="og:description" content="<?php $this->options->description(); ?>">  
<meta property="og:url" content="<?php $this->permalink() ?>"/>  
<meta itemprop="name" content="<?php $this->archiveTitle(array(
'category'=>_t('%s '),
'search'=>_t('包含关键字 %s 的文章'),
'tag' =>_t('标签 %s 下的文章'),
'author'=>_t('%s 的主页')
), '', ' - '); ?><?php $this->options->title(); ?>">
<meta itemprop="description" content="<?php $this->options->description(); ?>">
<meta itemprop="image" <?php if($this->is('post')||$this->is('page')): ?>
content="<?php showThumbnail($this,0); ?>"<?php else: ?>
<?php if ($this->options->logoUrl){ ?>content="<?php $this->options->logoUrl();?>"<?php }else{ ?>content="<?php $this->options->siteUrl(); ?>logo.jpg"<?php };?><?php endif; ?>>

昨晚上有人提出了疑问，所以我慢慢的解释

1.关于图片的问题

<meta property="og:image" <?php if($this->is('post')||$this->is('page')): ?>
    content="<?php showThumbnail($this,0); ?>"<?php else: ?>
    <?php if ($this->options->logoUrl){ ?>content="<?php $this->options->logoUrl();?>"<?php }else{ ?>content="<?php $this->options->siteUrl(); ?>logo.jpg"<?php };?><?php endif; ?>>

以上代码og:image，代表你想要在卡片中显示的图片，我这里是对typecho的页面进行判断，如果是文章页和独立页面，则调用第一张设置的图片，而首页则调用logo，如果模板没在设置中定义logo，则调用在根目录的logo.jpg文件。但是存在问题的是以下代码。

<?php showThumbnail($this,0); ?>

这句代码是我写在function.php的方法，为调用文章的第一个图片附件，而不同的模板可能是不同的方法，所以如果要用，请将这一句改成自己所使用模板的缩略图调用方法，如果没有缩略图功能，可以参考typecho调用多张缩略图，非插件实现
相应的，最后一句itemprop="image"也是相同的含义。

2.关于标题的问题

<meta property="og:title" content="<?php $this->archiveTitle(array(
    'category'=>_t('%s '),
    'search'=>_t('包含关键字 %s 的文章'),
    'tag' =>_t('标签 %s 下的文章'),
    'author'=>_t('%s 的主页')
    ), '', ' - '); ?><?php $this->options->title(); ?>"/>

这句代码调用了不同页面的标题，根据typecho自带的判断，一般来说自己的模板都会在title有这类写法，所以直接参考那里的将这些判断修改即可。注意需要和网站本身的命名方式相同最好。

最后一些说明

1.这样的申明对部分搜索引擎也有效，比如360和搜狗，


2.在QQ里面如果没有显示效果，优先应该检查网站内是否有长时间无法加载的外部链接比如图片，css,js等。如果仍然不显示，那就是缓存，等待一段时间，如果还不行，那就是人品问题了。

【规则之树版权所有，转载注明来源】