Snapic Visual 使用文档

2022-05-02


版本型号:Snapic Visual(单页版)
适用程序:Typecho
皮肤类型:页面模板
模板作者:Lopwon
作者博客:Lopwon.com
发布页面:Lopwon.com/snapic-visual.html
官方演示:Snapic Visual
网友案例:(留言申请)

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

敬告:模板 Lopwon Visual 需要在新窗口单独使用,如果你在用的主题限制新窗口打开独立页面,请自行联系该主题作者,解除限制,感谢网友(浪荡子)的反馈。

模板说明

Snapic Visual 为 Typecho 单页媒体模板,相较于 Snapic Plus 主题和 Snapic page 模板,Snapic Visual 支持外链图片、音频和视频,新增单页留言评论,以满屏切换页面为主,类似时下流行的短视频 APP 界面。

1. 单页版 Snapic Visual 独立运作,不对你现有的主题产生影响,操作简单无需过多配置。

2. 可以单独为每一个媒体添加描述。

3. 理论上,可以建立很多个影像页面。

主要功能
1. 满屏切换。电脑端以滚轮或键盘按键翻页,移动端支持手势上下划屏翻页。

2. 支持外链。图片、音频和视频可以通过附件上传插入,也可以通过插入图片的方式添加。

3. 切换停播。影音类播放时,切换媒体页面或点击关于页面另外的影音后,自动停播上一条影音播放当前影音。

4. 延迟加载。图片具有延时加载功能,增强浏览体验。

5. 留言评论。支持单页留言评论。

6. 图集浏览。在关于页面集中展示图片、音频和视频,可自定义多种显示比例,点击后可查看大图和全屏播放影音。

7. 显示设置。依喜好通过自定义字段,设置外观布局。如:画面比例、展示或隐藏信息等。

功能详解

Snapic Visual 单页媒体模板,可以插入图片、音频和视频,支持添加描述,支持使用外链。模板由三个页面组成,依次为:媒体页面评论页面关于页面。其中,依喜好通过自定义字段,设置外观布局(图示)。

A 评论

需要说明下,此模板由于使用单页切换的方式展示媒体、评论和关于三个页面,且首屏为媒体页面。故在评论后,直接切换到了媒体页面,没有停留在评论页面,需要重新点击菜单导航的(评论)图标回到刚刚的评论位置。

B 媒体

支持图片后缀:.jpg/.jpeg/.png/.gif/.bmp/.tiff/.webp/.svg/.avif

支持音频后缀:.mp3

支持视频后缀:.mp4/.webm/.ogv(.ogv不支持手机端播放)

C 兼容(重要)

1. 影音的加载速度,有赖于你存储文件的空间带宽和浏览者的网络情况。模板默认设置视频预加载 preload 为 metadata,音频为 none,该属性在不同浏览器下的表现各异,请知悉。

2. 影音的自动播放,鉴于 Video 和 Audio 在各平台(如:电脑端、移动端、微软端、苹果端等)和各环境(如:谷歌浏览器、火狐浏览器、苹果浏览器、微信等)下的兼容性各异,通俗的说是:坑多!所以,模板默认不带有自动播放影音的功能,请知悉。

3. 视频预览图截取自第一帧,同时,在不同浏览器下展示的效果也各异,而音频则不显示封面,请知悉。另外,在微信环境下,视频预览图暂时无法展示,如果有解决方案,后续可能会修正。

4. 模板 Snapic Visual 无插件支持,使用中,建议关闭不需要的插件,以免显示冲突,尤其是自带影音功能的主题。

版本更新

2023年11月01日 发布 Snapic Logs v2.1 修正已知问题。

2023年10月06日 发布 Snapic Visual v2.0 修正已知问题,优化功能代码。

2022年07月30日 发布 Snapic Visual

使用方法

A 部署文件

1. 将压缩包里的文件夹 Snapic 及其内部的所有文件,和文件 Snapic-Visual.php 上传至目录 usr/themes 中的你的主题文件夹里。如:你的主题文件夹是 default,那么就上传至 usr/themes/default 里。

2. 在你的主题里的文件 functions.php 内搜索 themeInit 并在 {…} 内添加以下代码,作用是让模板 Snapic Visual 的评论不分页:

    if (strpos($archive->template, 'Snapic-Visual.php') !== false) {
        Helper::options()->commentsPageBreak = false; // 模板 Snapic Visual 评论不分页
    }

B 配置相册

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

1. 此编辑页面右侧的“自定义模板”里,请选择“Snapic Visual”。

2. 此编辑页面右侧的“高级选项”,在“公开度”选择“隐藏”后,可将此媒体(独立页面)的标题不展示在某些主题的分类菜单里。

3. 按以下介绍添加内容。

C 添加内容

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

1. 简介:在“内容文本框”上方选择性输入你对媒体(独立页面)的介绍,可使用文本链接。

2. 原理:每行内容由 ![]() 组成,每行内容将对应输出前台的一个全屏页信息(媒体页面)和一个方块信息(关于页面)。

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

4. 重要:以上格式为 Markdown 插入图片的语法,前方必须包含 ! 半角感叹号。

D 使用技巧

1. 待补充……

E 配置模板

一、创建字段(可选项)

通过使用对应的自定义字段值,可以改变模板的布局和功能。打开你创建的相册(独立页面),按以下介绍依喜好设置即可。

1. 如果添加字段后,需要取消功能,则把对应的字段删除,或者把字段值留空。

2. 如果添加字段后,发现该字段对应的功能未生效,请先排查在用的博客主题是否也存在相同的字段名称。

3. 在设置名称为 svSetup 的字段,如果填入多个字段值时,使用半角逗号隔开,没有顺序要求。

作用

  • 头像徽标
  • 媒体比例
  • 显示设置

字段名称

  • svLogo
  • svMode
  • svSetup

字段值格式

  • 图片链接
  • 指定值
  • 指定值

字段值示例

  • http://snapic.cn/cdn/img/logo_w.png
  • y
  • mark,ycover

说明

  • 填入图片链接则导航和头像显示该图片,反之,导航为房子图标,头像为 Gravatar ,请确保该服务访问顺畅
  • 作用于关于页面媒体比例(宽:高),填入 x 则 3:2 显示,填入 y 则 9:16 显示,填入 z 则 1:1 显示
  • mark(显示角标)desc(显示摘要)vcover(视频宽度铺满)xcover(图片宽度铺满)ycover(图片高度铺满)
Store

19 条评论

  1. 又加 10

    我发给你邮箱

    1. Lopwon Lopwon 博主
      @ 又加

      Lopwon@qq.com

      1. 又加 10
        @ Lopwon

        已解决,现在完美显示。感谢感谢

      2. 又加 10
        @ Lopwon

        不行的。会报错。设置外观界面直接打不开。四个代码块,我都测试过的。代码块一是最合适的,但是显示会和原本模板错乱,

  2. 又加 10

    刚搭配好,原来设置界面,需要借助本身模板的设置界面,但是并不是所以模板都能合理匹配,我的就是。所以建议做成单独独立的设置方式。

    1. Lopwon Lopwon 博主
      @ 又加

      这个局限于 Typecho 的设定,因为所有模板需要共用一个 functions.php 配置皮肤功能。

      1. 又加 10
        @ Lopwon

        那么完全可以把这些设置移至在创建单页的左下角(自定义字段)位置,毕竟只会创建一个页面。functions.php虽然共用,但多多少少存在差异。能显示设置,但样式并非全都合理。或者 移至“设置-基本设置”

        1. Lopwon Lopwon 博主
          @ 又加

          函数文件 functions.php 可以起到全局设置模板功能,WordPress 或 ZBlog 有着同样的文件起到相似的作用。如果只用模板 Snapic Visual 创建一个页面,倒是可以使用自定义字段实现外观和功能定制。但是,模板 Snapic Visual 设计初衷是为了可以创建多个媒体页面(比如每次旅行所有拍摄的短视频单独创建媒体页面),所以使用 functions.php 全局定义外观和功能比较方便。另外,把功能转移至“设置-基本”里,需要操作博客核心文件,减低了模板的使用便捷性。

          1. 又加 10
            @ Lopwon

            刚发布,或许后期会弥补这些问题吧,只是我现在本身的模板设置问题,导致用不了,就很可惜了。

            1. Lopwon Lopwon 博主
              @ 又加

              没看明白,指的是模板 Snapic Visual 在你的主题下无法正常使用?还是……

              1. 又加 10
                @ Lopwon

                添加代码块,显示和本身模板冲突

                1. Lopwon Lopwon 博主
                  @ 又加

                  这个是预料中的,如果你的主题中已有 themeConfig 或 themeInit ,就按照操作说明的对应情况配置。如果可以,你把 functions.php 发送给我,我协助添加代码块。

  3. 宫廷 2

    快发布了吧,嘿嘿

    1. Lopwon Lopwon 博主
      @ 宫廷

      已发布。

    2. Lopwon Lopwon 博主
      @ 宫廷

      快了,本月底发布。

  4. j joshfix 1

    大概什么时间能制作好呢,想先付款预定。

    1. Lopwon Lopwon 博主
      @ joshfix

      已发布。

    2. Lopwon Lopwon 博主
      @ joshfix

      即将制作完成,欢迎协助完善。

    3. Lopwon Lopwon 博主
      @ joshfix

      最近在忙别的事情,不确定什么时候能做好。

准备下山 准备下山
Snapic Plus v5
使用 Lopwon POP 实现