Snapic Plus 2022 使用文档

2022-09-20

Snapic Plus 2022 使用文档


版本型号:Snapic Plus 2022
适用程序:Typecho
皮肤类型:主题模板
主题作者:Lopwon
作者博客:Lopwon.com
发布页面:Lopwon.com/snapic.html
官方演示:Snapic.cn
网友案例:(狮子鹅&影像)(岁月如歌)(Hello ~ 小雨点)(留言申请)

我要购买:Lopwon.com/snapic.html

重要提示:之前购买过 Snapic Plus 的小伙伴将免费获取 Snapic Plus 2022

1. 请将之前购买 Snapic Plus 的微信付款凭证截图发送至 Lopwon@qq.com 后,给你提供 Snapic Plus 2022 文件包。

2. 或者在你之前收取 Snapic Plus 文件包的邮件里,通过回复该邮件发送信息索取 Snapic Plus 2022 文件包。

主题说明

Snapic Plus 2022 是 Snapic Plus 的重制版,v4 为对应版本号。此版在 Snapic Plus 的瀑布流框架和布局的基础上,做了较大的升级更新,主要为:支持使用外链图片;支持显示外链视频;支持留言评论互动等等,详见以下(主题更新)。


主要功能

主题 Snapic Plus 2022 通过识别文章中的文本、图片和视频,在前台以瀑布流的方式呈现,其中,主题外观布局、功能设置等具有较强的可定制性(如:自定义显示或启用与否),适合以图片为主的博客使用,可以用于记录自己的生活影像等等。


主题更新

2022年09月27日 发布 Snapic Plus 2022(v4.0.2),升级更新明细如下:

1. 新增组图弹窗小图预览开关 2. 优化组图弹窗按键显示方式。

2022年09月23日 发布 Snapic Plus 2022(v4.0.1),感谢网友(ajiao)的建议。升级更新明细如下:

1. 新增文章页展示方式,有弹窗和新窗口方式可选 2. 新增文本文章摘要与其他文章摘要同步隐藏功能 3. 新增自定义评论头像服务源地址,避免访问受阻 4. 修正文章页不显示共享协议的问题 5. 优化弹窗大小

2022年09月22日 发布 Snapic Plus 2022(v4.0)。升级更新明细如下:

优化项。1. 优化功能代码 2. 优化样式代码 3. 优化后台设置 4. 优化外观细节

新增项。01. 首屏大图,新增随机显示功能 02. 图片来源,新增图片外链功能 03. 照片信息,新增显示 Exif 功能 04. 图片灯箱,新增更多自定设置 05. 组图封面,新增组图随机封面 06. 展示文章,新增显示文章内容 07. 文章互动,新增文章评论功能 08. 关于版块,新增插入链接功能 09. 视频版块,新增显示视频功能 10. 视频封面,新增视频随机封面 11. 视频播放,新增自动停播功能 12. 页脚版块,新增公安备案功能 13. 鼠标右键,新增显示共享协议 14. 列数可选,新增自定义瀑布流 15. 图片圆角,新增可调图片圆角 16. 外观可选,新增亮调暗调外观 17. 平滑滚动,新增页面平滑滚动 18. 逻辑判断,新增显示异常提示 19. 按需加载,新增脚本按需加载 20. 数据备份,新增主题备份功能

2022年03月12日 解决 Snapic Plus 适配至 Typecho 1.2.0(或开发版)。

2020年03月30日 解决 Snapic Plus 单篇相册无法读取附件除 jpg 以外的图片格式。

2020年03月21日 发布 Snapic Plus


使用方法
重要:主题 Snapic Plus 2022 独立运作,与主题 Snapic Plus 无关联,Snapic Plus 2022 的所有配置以本页为准。如果停用 Snapic Plus 后,可删除文件夹 SnapicPlus。

A 部署文件

请将主题文件夹 SnapicPlus_2022 上传至目录 usr/themes 中,在后台启用即可。

B 配置页面

一、首屏大图(可选项)。

在首屏随机显示图片,可添加描述,可使用外链(建议使用大于宽 1920px 高 1080px 尺寸的清晰图片,对显示效果无要求的,可无视)。

1. 后台》管理》独立页面》新增,新建独立页面,除以下提到的事项外,其余正常操作即可。

2. 页面缩略名必须填入 topic,乱填无效!

3. 请严格按照以下格式要求在“内容文本框”中输入内容,才能在前台正确输出。

4. 格式:![图片描述](图片链接)

5. 示例:![Photo by Lopwon](http://cdn.snapic.cn/img/logo.png)。其中,每行开头的感叹号 ! 有无均可,第一对中括号的 Photo by Lopwon 为图片描述,第二对括号的 http://cdn.snapic.cn/img/logo.png 为图片链接。

6. 重要:格式由一对中括号 [] 和一对括号 () 组成,都是半角括号,不是中文全角括号。

二、首个格子(可选项)。

在最前方展示博客介绍和返回首页使用,相当于(关于)页面,每页都有。

1. 后台》管理》独立页面》新增,新建独立页面,除以下提到的事项外,其余正常操作即可。

2. 页面缩略名必须填入 about,乱填无效!

3. 在“内容文本框”中输入内容,无格式要求,支持使用纯文本、插入链接和图片(可使用外链图片)等。其中,如果有多张图片时,前台则随机显示其中一张。

4. 注意:图片需要插入“内容文本框”中,无格式要求。其中,只支持直链图片,后缀为(.jpg/.png/.gif/.bmp)。

三、文章格子(必选项)。

每个格子对应一篇文章,文章格子分为:单图文章、组图文章、视频文章和文本文章(无图片无视频)。四种文章类型都支持使用文本,其中,如果在文本内容中插入了文本链接,这些文本链接在格子里只输出摘要(无链接),在文章页面或评论弹窗里才显示文本链接。

1. 单图文章。文章中有一张图片,可使用外链图片,选择性输入文本介绍。

2. 组图文章。文章中有多张图片,可使用外链图片,选择性输入文本介绍。在后台》控制台》外观》设置外观,勾选(随机封面)后,可开启前台随机显示其中一张作为封面,点击后进入组图相册。

3. 视频文章。文章中有一条视频,可使用外链视频,选择性输入文本介绍。如果文章中有图片,将作为视频的封面;如果又是多张图片,将随机显示其中一张作为视频的封面;没有图片时,则默认以视频的第一帧作为封面。建议使用与视频比例一致的图片尺寸(如:视频截图),对显示效果无要求的,可无视。

4. 文本文章。文章中仅有纯文本,无图片也无视频。

5. 注意事项。无论图片或视频,都需要插入“内容文本框”中,无格式要求(如:可以用插入图片的方式插入视频)。其中,只支持直链图片或直链视频,图片后缀为(.jpg/.png/.gif/.bmp),视频后缀为(.mp4/.webm/.ogv)。

四、自定代码(可选项)。

独立存在的格子,启用后将在每页的第七个格子处显示,可录入文本,可插入代码,可做广告位等。

例,插入在新窗口打开的链接:
<p style="height:50px;font-size:1.2em;line-height:50px;"><a href="http://snapic.cn/" target="new">主题 Snapic Pllus 2022 演示</a></p>

C 配置主题

一、设置外观(可选项)。

后台》控制台》外观》设置外观,依喜好设置即可。

1. 加载动图。瀑布流需要在图片加载完成后获取该图片的高度,进而重新布局,在此之前是由占位图(加载动图)临时决定每个格子的高度。如果占位图(加载动图)的比例与实际图片相同(或相近),将大大减轻瀑布流重新布局时格子的漂移。例:所有图片的比例普遍为 3:2 时,占位图(加载动图)的比例为 3:2 时最理想;如果图片的比例五花八门,占位图(加载动图)的比例可以折中为 1:1 的比例。注:以上提到的是(比例)非(尺寸),即如果图片尺寸为(高 800px 宽 800px)时,比例则是(1:1),这时的占位图(加载动图)的比例如果设置为(1:1)时,尺寸可以是(高 300px 宽 300px)或(高 400px 宽 400px)或其他,当然,也需要考虑文件大小,小文件有利于快速显示占位图(加载动图)。若觉麻烦,主题后台设置的(加载动图)项,默认即可。

2. 头像服务。以下是 Gravatar 国内源镜像链接(访问链接,如果显示头像则有效可用):
https://cdn.v2ex.com/gravatar/
https://sdn.geekzu.org/avatar/
https://gravatar.loli.net/avatar/
https://cdn.sep.cc/avatar/

二、异常提示(说明项)。

在制作主题 Snapic Plus 2022 时,加入了一些逻辑判断的功能,用于在主题使用中的操作提示,遇到时,按照步骤进行即可。

三、兼容问题(说明项)。

鉴于各平台(如:电脑端、移动端、微软端、苹果端等)和各环境(如:谷歌浏览器、火狐浏览器、苹果浏览器、微信等)的特性各异,主题少部分功能或外观可能存在概率性地兼容问题,请知悉:

1. 图片。Exif 数据需要在图片加载完成后方能读取信息,只支持 jpg 或 tiff 格式且有 Exif 数据的图片,如果图片量过多或者网络不顺畅时,有可能出现无法显示的情况。

2. 视频。在微信环境下,视频不显示自身的静态第一帧作为封面,可以通过在文章中插入图片(如:视频截图)充当视频封面。

3. 滚动。有部分浏览器,过于倔强,对主题的丝滑滚动功能支持不佳,如:Mozilla Firefox

4. 错位。主题在 Apple 设备上,可能存在某些外观细节显示不良的情况,尤其是使用了 position: fixed 的地方(如:组图相册弹窗等)。由于作者没有 Apple 设备进行真机测试调整,所以,这些外观异常暂时无法修正,从用户的反馈来看,对使用影响并不算大,毕竟不是功能异常,而是在外观显示上。此时,可以尝试在主题设置里关闭(小图预览)功能。如果有小伙伴能协助处理这些小缺陷,可获赠作者制作的其他单页模板(款式待定)。

5. 音乐。主题 audio 标签只输出视频格式,所以,在使用音乐插件时,请使用歌单功能,勿使用直链 .mp3 功能。感谢网友(雾长安)的反馈。

D 使用技巧

1. 如何增强用户浏览的体验度?除了用户的网络情况(如:网速)外,合理的优化图片和视频的尺寸和大小,以及使用支持较大带宽的服务器(如:图床)存储图片和视频,可以大大增强用户浏览的体验度。建议如下优化:

① 使用 jpg 格式的图片,尺寸宽度控制在 1000px 以内,文件大小控制在 300kb 左右为宜。
② 使用 mp4 格式的视频,使用适当的比特率压缩,时长 1 分钟的视频,文件大小控制在 10mb 以内为宜。
③ 使用专为媒体文件存储的解决方案(如:七牛云),这类服务通常会有较大的资源访问带宽,以保障图片和视频的加载速度。需要注意的是:如果博客使用 https 加密协议时,图片和视频资源的链接也请务必使用 https 协议(勿使用 http)。

2. 如何自定义主题颜色样式?在后台》控制台》外观》设置外观,点选(自定样式)并按需编辑文件 SnapicPlus_2022/css/snapic.diy.css 即可,配色方案可参考 https://www.colorhexa.com/ 或 https://colorhunt.co/

3. 为什么图片或视频不显示?需要先自查图片或视频的链接是否正确,是 http 还是 https 或是使用了防盗链设置的链接,或是非直链的图片和视频链接。

4. 如何把附件里的所有图片一键插入文章中?可参考这篇教程 https://www.ruletree.club/archives/1324/ 请自行研究实现。

5. 为什么评论作者链接无效?由于主题使用弹窗方式加载评论框架,为避免在弹窗内直接打开外部链接,所以,主题默认设置不启用评论作者的链接。如果想开启此功能,需按照以下步骤操作:

① 打开主题文件 functions.php 搜索 Helper::options()->commentsShowUrl = false; 将 false 替换为 true
② 打开博客文件 var/Widget/Base/Comments.php 第 272 行,将 '>' 替换为 ' target="new">'
③ 以上替换注意有单引号,如果博客程序版本为 1.1-17.10.30 时,文件 Comments.php 的路径是 var/Widget/Abstract/Comments.php 在第 376 行,替换方式同上。
Store

34 条评论

  1. shawn shawn 5

    新版已换上。目前发现照片的EXIF信息显示时有时无。在设置文章显示数量为10时,大部分照片的EXIF信息都显示出来了,数量为999时,有很多照片的EXIF就不显示了。

    1. Lopwon Lopwon 博主
      @ shawn

      请看使用文档说明。

  2. 夏天 夏天 3

    已发购买凭证,求更新。

    1. Lopwon Lopwon 博主
      @ 夏天

      已发送。

  3. 雾长安 雾长安 4

    Snapic Plus 2022 怎么才能实现支持背景音乐插件啊。 自行放进去 导致 图片不显示 多图也拉出来了。。。

    1. Lopwon Lopwon 博主
      @ 雾长安

      主题不支持音频,可以尝试使用音乐插件。

      1. 雾长安 雾长安 4
        @ Lopwon

        尝试的音乐插件,启用后出现bug了,首屏大图正常显示,关于和正常文章单图不显示图片内容,多图的也是不显示图片内容而且不能像正常情况下收在一起,而是全部显示在一级里

        1. Lopwon Lopwon 博主
          @ 雾长安

          主题不支持音频,非Bug,如需音乐功能,需要自行研究。

        2. Lopwon Lopwon 博主
          @ 雾长安

          你用的哪款音乐插件?我测试这款(YoduPlayer)没问题呀?

          1. 雾长安 雾长安 4
            @ Lopwon

            QPlayer

            1. Lopwon Lopwon 博主
              @ 雾长安

              嗯,主题的 audio 的标签只输出视频格式,所以,只能使用有歌单功能的音乐插件,也就是不能使用包含直链 .mp3 的格式,而需要使用例如网易云音乐歌单的 id 形式,YoduPlayer 插件有这个功能。

              1. 雾长安 雾长安 4
                @ Lopwon

                嗯。感谢 使用你推荐的插件 完美了。感谢

  4. sensiribbed sensiribbed 6

    感谢大佬更新,已经从旧版迁移过来了,非常丝滑,可以申请案例吗。
    原来外观设置记得可以设置手机首页大图,现在手机页面首页大图和头像都没有显示。

    1. Lopwon Lopwon 博主
      @ sensiribbed

      已添加。看了下,我直接访问头像图片,链接不上,建议检查下图片的链接是否有效。嗯,新版取消了手机端单独显示自定义图片的功能,建议首页大图使用视觉焦点在中心的图片,这样在手机端的效果会好些。

      1. sensiribbed sensiribbed 1
        @ Lopwon

        感谢!已经弄好啦

  5. Linya Linya 2

    外链图片是否无法显示EXIF?
    测试的外链图片的EXIF都显示不出来,能确认用的图床外链是原图,外链地址下载下来可以看过EXIF信息。
    还是我上传方式不对?我是新建文章后通过图片按钮插入原图外链连接发表文章。我尝试了通过typecho自带的附件系统上传的图片可以正常显示EXIF信息……

    1. Lopwon Lopwon 博主
      @ Linya

      Exif 是实验性功能,目前发现和图片延迟加载功能有兼容问题,详见使用文档(兼容问题)说明项。

  6. 猫叔 猫叔 小伙伴29

    我也要上网友案例 哈哈哈

    1. Lopwon Lopwon 博主
      @ 猫叔

      已添加。

  7. 猫叔 猫叔 小伙伴29 noreply

    我好像留成了https的

Lopwon Festive 元宵节代码已上线

Powered by Lopwon POP