Snapic Page 使用文档

2021-06-26


版本型号:Snapic Page(单页版)
适用程序:Typecho
皮肤类型:页面模板
模板作者:Lopwon
作者博客:Lopwon.com
发布页面:Lopwon.com/snapic.html
官方演示:无
网友案例:向阳而长(失效) #点儿画廊

模板 Snapic Page 已停售,最新版本为 Snapic Page 2022(v2.0.x),请移步至《Snapic Page 2022 使用文档》。


模板说明

与主题版 Snapic Plus 相比,单页版 Snapic Page 不用改变自己现有的博客主题,也能通过建立独立页面,拥有相册的功能,支持单篇页面不断新增照片。综合网友建议,新增了一些功能,优化了一些样式。

1. 单页版 Snapic Page 适用于图片类相册,使用瀑布流(masonry)的方式延时加载(lazyload)展示图片集,同时支持图片灯箱(fancybox)效果。

2. 可以单独为每一张图片添加描述。

3. 理论上,可以建立很多个单页相册(如:官方演示里的三个相册同使用 Snapic Page 创建)。

模板更新

2021年06月26日 发布 Snapic Page


使用方法

A 部署文件

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

2. 将压缩包里的文件 Readme.txt 中的代码,复制粘贴到你的主题文件夹里的文件 functions.php 中。为避免操作错误,请将代码粘贴至最末端。

B 配置相册

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

1. 此编辑页面左侧的“内容文本框”里,选择性输入你对相册的介绍,将以摘要的形式展示在前台的置顶处。注意:摘要不支持超链接显示。

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

3. 此编辑页面右侧的“附件”里,请上传你需要展示的图片,不需要插入“内容文本框”中。

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

C 添加描述

1. 方法一:在以上提到的编辑页面右侧的“附件”里,上传你需要展示的图片后,依次点击每个图片附件的“编辑”(铅笔状图标),进入图片信息的编辑页面,在右侧的“描述”里,输入你对这张图片的介绍,提交修改即可。

2. 方法二:后台》管理》文件,也可以从这里进入图片信息的编辑页面,给每张图片添加描述。

D 新增图片

后台》管理》独立页面,打开你需要新增图片的相册(独立页面),继续在“附件”里上传图片即可。最新上传的图片将展示在前台的最前面。

E 图片外链

单页版 Snapic Page 相册,需要将图片以附件的形式上传。如果使用图床,需要自己通过插件并修改主题代码实现,请参考以下建议自行研究。

1)方法一:可以参阅用户“点儿”编写的教程 https://www.dianr.cn/80.html

F 使用技巧

1. 如何打开翻图功能?见文件 Snapic-Page.php 里的注释。

2. 如何替换加载动图?见文件 Snapic-Page.php 里的注释。

3. 如何在二级目录下的博客使用 Snapic Page 单页版相册?
修改文件 Snapic-Page.php 第67行两处,分别为 href 和 data-original 里的 $this 前,添加 /二级目录文件夹名称/ (注意包含前后两个斜杠)。

4. 如何把相册嵌入其他文章页中?详见 http://www.lopwon.com/2252.html

5. 如何让相册介绍支持超链接?
搜索文件 Snapic-Page.php 第52行,将 excerpt(255, '......') 替换为 content() 后,可以在后台该相册(独立页面)的编辑页面左侧的“内容文本框”里,按照正常操作插入超链接。需要注意的是,修改后,前台输出的相册介绍是正文内容,所以请勿在“内容文本框”里输入太多文本内容,也不要插入图片。如果执意要在“内容文本框”中插图图片,建议一张即可,同时需要在 css 中添加如下样式,以约束图片的宽度:

    .snapic-about img {
        width: 100%;
    }

6. 如何在文章编辑页显示附件缩略图?
将下面这段代码块放入 admin/file-upload.php 第25行 </div> 后。

    <p><img src="<?php $attachment->attachment->url(); ?>" alt="<?php $attachment->attachment->name(); ?>" class="typecho-attachment-photo" /></p>

Store

51 条评论

  1. L L 1

    你好,因为我用的是Quark模板,本身没有functions.php,请问要怎么添加

    1. Lopwon Lopwon 博主
      @ L

      只支持Typecho博客程序的,如果是的话,可以自己新增functions.php。方法是WIN系统右键新建TXT文档,把后缀为txt的文档重命名为functions.php,把代码粘贴保存即可。

  2. 点儿 21

    申请加入展示区域
    https://www.****.cn/jpg.html

    感谢!Lopwon 作者的大力支持,完成图床储存方案搭建,稍后发出相关更改说明,以便更多人使用图床。
    同时再次感谢各位博主的认真解答,谢谢每一次的邮件都认真答复。

    1. Lopwon Lopwon 博主
      @ 点儿

      感谢支持,已添加。

      1. 点儿 21
        @ Lopwon

        大佬 ,搭配图床存储思路性操作教程已发,请查阅。
        https://www.****.cn/80.html

        1. Lopwon Lopwon 博主
          @ 点儿

          已添加,感谢!

  3. 3

    您好,能告诉我如何让独立页面变成主页吗,我不太懂这个,找了很久也没有找到方法。谢谢。

    1. Lopwon Lopwon 博主
      @ 枫

      自定义首页模板:添加@package index后,在后台》设置》阅读》站点首页,设置。

      自定义页面模板:添加@package custom后,在后台》管理》独立页面,编辑独立页面中的“自定义模板”,设置。

      1. 3
        @ Lopwon

        那个...为啥我的跟你们的不一样,没有gif。

        1. Lopwon Lopwon 博主
          @ 枫

          见本页“F使用技巧”第2点。

          1. 3
            @ Lopwon

            已知,谢谢!

    2. Lopwon Lopwon 博主
      @ 枫

      http://t.****.me/28.html

  4. 向阳而长 7

    大大 最近决定把博客迁回国内,安心备案,现在关站等广西通管局审核,所以展示站就访问不了了

    1. 子午 7
      @ 向阳而长

      我之前的网站一直是备案好的,后来阿里云的前置备案部,通知我说我的博客不是个人主页,让把我的备案号撤掉了。刚买的3年主机浪费了。

    2. Lopwon Lopwon 博主
      @ 向阳而长

      没事,只要不是长时间无法访问,就会留着链接。

      1. 向阳而长 7
        @ Lopwon

        终于备案好了

        1. Lopwon Lopwon 博主
          @ 向阳而长

          恭喜!

  5. C Cicada000 2

    想请问下具体怎么具体怎么使用图片外链,没找到相关插件,自己在这方面知识还很浅薄(捂脸

    1. Lopwon Lopwon 博主
      @ Cicada000

      我没有操作过使用图片外链,是有用户在主题版Snapic Plus实现过,单页版Snapic Page刚发布,还没有用户案例,你可以参考主题版的使用文档,尝试按照用户的方法操作研究下。http://www.lopwon.com/snapic-plus.html(页面内搜索“如何让主题支持外链图片”跳至相关内容)

      1. C Cicada000 2
        @ Lopwon

        了解了,待会去试试,谢谢您

  6. 我昨夜梦到 7

    借鉴了各位大大的模板,终于搭建完毕!现在过来申请个snapic-psge网友案例,地址:https://****.com/snapic.html。谢谢大大分享!

    1. Lopwon Lopwon 博主
      @ 我昨夜梦到

      已添加,你之前使用的是测试版,我重新给你发了一份正式版,没有太大改变,只修改了一些样式。

      1. 向阳而长 7
        @ Lopwon

        谢谢,收到了。谢谢

    2. 我昨夜梦到 7
      @ 我昨夜梦到

      打错字了...是Snapic-Page

  7. 我昨夜梦到 7

    祝贺开售!大大,替换加载动图的动图绝对地址有好看的推荐吗,感谢感谢

    1. Lopwon Lopwon 博主
      @ 我昨夜梦到

      可以使用 Snapic Plus 里的 loading.gif

      1. 我昨夜梦到 7
        @ Lopwon

        谢谢大大,完美解决

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