如何在Joe主题中设置QQ分享图片?

浅染
2025-11-22发布

让 QQ 分享显示自定义图片


图片[1] -  如何在Joe主题中设置QQ分享图片? - 浅染博客-浅染のBlog


方法一:通过主题设置直接插入(推荐给新手)

这种方法最简单,不需要修改任何代码文件。

  1. 登录你的网站后台
  2. 进入 “设置外观”,找到 “插入代码”
  3. 在主题设置中,寻找一个叫做 “自定义头部HTML代码” 的输入框。
  4. 将下面这段代码复制并粘贴到这个输入框里。

    <!-- 分享时显示的 Logo 图片(Open Graph 标签) -->
    <meta property="og:image" content="https://.jpg">
    <meta property="og:image:width" content="300">
    <meta property="og:image:height" content="300">
    <meta property="og:image:type" content="image/jpg">
    <!-- 结束 -->

    图片[2] -  如何在Joe主题中设置QQ分享图片? - 浅染博客-浅染のBlog

  5. 关键一步:将代码中的 https://.jpg 替换成你自己想要显示的图片的链接。
  6. 保存设置即可。

方法二:直接修改模板文件(适合有一定基础的用户)

如果你熟悉如何编辑网站文件,这种方法更直接。

  1. 通过 FTP 或服务器文件管理器,进入你的网站目录。
  2. 找到 Joe 主题的文件夹:/usr/themes/joe/ (或者你的主题文件夹名,比如 joe再续前缘)。
  3. 在主题文件夹中,找到并打开 module 目录,然后编辑 head.php 文件。
  4. head.php 文件中,找到 <head> 标签内的位置(大约在第 18 行附近,具体位置可能因版本而异)。
  5. 将同样的代码片段粘贴到这里。

    <!-- 分享时显示的 Logo 图片(Open Graph 标签) -->
    <meta property="og:image" content="https://.jpg">
    <meta property="og:image:width" content="300">
    <meta property="og:image:height" content="300">
    <meta property="og:image:type" content="image/jpg">
    <!-- 结束 -->

    图片[3] -  如何在Joe主题中设置QQ分享图片? - 浅染博客-浅染のBlog

  6. 同样,不要忘记替换图片链接,然后保存文件。

重要注意事项

  • 图片链接是否HTTPS:如果你的网站开启了 HTTPS,请确保图片链接也是 https:// 开头的,否则图片可能无法显示。
  • 图片尺寸:建议图片尺寸至少为 300x300 像素,以保证在各种设备上都有良好的显示效果。
  • 缓存问题:设置好后,QQ 可能会有缓存。你可以直接到QQ设置里清空缓存来刷新缓存并预览效果。

好了,以上两种方法都可以让你的网站在 QQ 分享时展示出漂亮的自定义图片了。选择一种你觉得方便的方法试试吧!

喜欢就支持一下吧
点赞 1 分享 赞赏
评论 共1条
OωO
取消
  1. 头像
    浅染 作者
     · 
    回复

    测试