有没有晓得 hexo 生成博客后的 fancybox 效果是怎么实现的,如下网址,不如大神的效果

2016-01-20 22:05:15 +08:00
 chuhemiao

附上网址: http://ibruce.info/reading/
请问下这个是怎样搞成的,有没有类似的文章,网上看了好多,都是一个版本,没一个说到正点上!!!!

7372 次点击
所在节点    Node.js
35 条回复
chuhemiao
2016-01-20 22:21:51 +08:00
没有人遇到这个问题吗?纠结了半下午了,按照不如的说法是新建一篇图片类的文章,但是现在是文章出来,图只有一张显示了,并没有显示成轮播的形式,是还要设置其它的什么吗?求告知!!
chuhemiao
2016-01-20 22:22:09 +08:00
chuhemiao
2016-01-20 22:22:53 +08:00
DualWield
2016-01-20 23:22:36 +08:00
fancybox 说的是轮播图吗? hexo 应该有一个 theme 文件夹,里面有一个 post 还是什么的忘了,就是 ejs 模板( html )如果是 html 的话,往里面放什么东西都是可以的吧~
Tiande
2016-01-20 23:25:25 +08:00
/themes/ur theme/_config.yml :
fancybox: true
Starduster
2016-01-21 00:21:28 +08:00
@DualWield 是那个点击查看大图, WP 里有个实现这个功能的插件叫 fancybox
chuhemiao
2016-01-21 10:22:40 +08:00
@DualWield 就是轮播图,/hexo/themes/pacman/scripts/在这下面有个 fancybox.js ,然后就是 pacman/source/有一堆针对 fancy 的 js 和 css 样式,没发现其它页面有。
agate
2016-01-21 10:22:41 +08:00
不是很理解你的问题. fancybox 不就是一个 jQuery 插件么? http://fancybox.net/
你在你自己模板里头添加就可以啦...
chuhemiao
2016-01-21 10:22:55 +08:00
@Tiande 这个已经加了
chuhemiao
2016-01-21 10:24:53 +08:00
@agate 是在 hexo 静态生成的,就是不知道那个要怎么用了,有说是在主题下的配置加上 fancybox: true,但这个加上还是没啥用
agate
2016-01-21 10:25:26 +08:00
agate
2016-01-21 10:25:56 +08:00
{% fancybox img_url [img_thumbnail] [img_caption] %}
这个不知道是不是你要的...
agate
2016-01-21 10:26:34 +08:00
我是觉得需要你主题支持啊...
zhangxiaoman
2016-01-21 10:30:12 +08:00
chuhemiao
2016-01-21 11:29:42 +08:00
@zhangxiaoman 已用过,还是感觉 pacman 比较简单点
chuhemiao
2016-01-21 11:30:13 +08:00
@agate 我用的是 pacman ,看文档说是支持的啊
chuhemiao
2016-01-21 11:39:01 +08:00
@agate ![img caption](img url),{% fancybox img_url [img_thumbnail] [img_caption] %}我用的是第一种,这样的效果是单张图,怎样成轮播的形式显示
Tiande
2016-01-21 12:17:44 +08:00
说这么多,不如把你的 _config.yml 贴出来。
谁知道少空格缩进之类的小问题会不会出现。
chuhemiao
2016-01-21 16:56:25 +08:00
@Tiande
# Hexo Configuration
## Docs: https://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/

# Site
title: 梦遥奇缘
subtitle: 想要,所以才去追寻--禾子
description: 梦遥奇缘,PHP,HTML,JS,Linux,YII,YAF,禾子,永远的呆,hexo,github,gitcafe,pacman,Laravel,CodeIgniter
author: 梦遥奇缘
language: zh-CN
timezone:

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://idiot6.com
root: /
permalink: :year/:month/:day/:title/
permalink_defaults:

# Directory
source_dir: source
public_dir: public
tag_dir: tags
archive_dir: archives
category_dir: categories
code_dir: downloads/code
i18n_dir: :lang
skip_render:
#root
root: /
# Writing
new_post_name: :title.md # File name of new posts
default_layout: post
titlecase: false # Transform title into titlecase
external_link: true # Open external links in new tab
filename_case: 0
render_drafts: false
post_asset_folder: false
relative_link: false
future: true
highlight:
enable: true
line_number: true
auto_detect: false
tab_replace:

# Category & Tag
default_category: uncategorized
category_map:
tag_map:
# Date / Time format
## Hexo uses Moment.js to parse and display date
## You can customize the date format as defined in
## http://momentjs.com/docs/#/displaying/format/
date_format: YYYY-MM-DD
time_format: HH:mm:ss
rss: /atom.xml #rss 地址 默认即可
# Pagination
## Set per_page to 0 to disable pagination
per_page: 10
pagination_dir: page

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: pacman

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
- type: git
repo: https://github.com/chuhemiao/chuhemiao.github.io.git,master
- type: git
repo: https://gitcafe.com/chuhemiao/chuhemiao.git,gitcafe-pages
chuhemiao
2016-01-21 16:58:12 +08:00
@Tiande 主题配置文件
##### Menu
menu:
Home: /
Archives: /archives
About: /about
Mylife: /Mylife
## you can create `tags` and `categories` folders in `../source`.
## And create a `index.md` file in each of them.
## set `front-matter`as
## layout: tags (or categories)
## title: tags (or categories)
## ---

#### Widgets
widgets:
- category
- tag
- rss
- links
## provide six widgets:category,tag,rss,archive,tagcloud,links.
## modify links in `/layout/_widget/links.ejs`.

#### RSS
rss: /atom.xml ## RSS address.
#sitemap
sitemap:
path: /sitemap.xml
#baidusitemap
baidusitemap:
path: /baidusitemap.xml
#root
root: /
#### Image
imglogo:
enable: true ## display image logo true/false.
src: '//source.shengxuezixun.com/images%2Flogo.png' ## `.svg` and `.png` are recommended,please put image into the theme folder `/pacman/source/img`.
favicon: img/favicon.ico ## size:32px*32px,`.ico` is recommended,please put image into the theme folder `/pacman/source/img`.
apple_icon: img/pacman.png ## size:114px*114px,please put image into the theme folder `/pacman/source/img`.

#### Author Avatar Picture
author_img_enable: true ## display author avatar picture
dataURI: false
## if the picture's format is dataURI please set the value to true,otherwise set the value to false.
## convert an image into base 64 data URIs http://websemantics.co.uk/online_tools/image_to_data_uri_convertor/ .
author_img_data: ''
## paste the dataURI in ONE LINE and included it by ''.
author_img: /img/author.png ## size:220px*220px.
## if the picture's format is `.png` or `.jpg` instead of dataURI,you should set the `dataURI` value to false.

#### Font
ShowCustomFont: true
## you can change custom font in `variable.styl` and `font.styl` which in the theme folder `/pacman/source/css`.

#### Toc
toc:
article: true ## show contents in article.
aside: true ## show contents in aside.
## you can set both of the value to true of neither of them.
## if you don't want display contents in a specified post,you can modify `front-matter` and add `toc: false`.

#### Fancybox
fancybox: true
## if you use gallery post or want use fancybox please set the value to true.
## if you want use fancybox in ANY post please copy the file `fancybox.js`.
## in theme folder `/pacman/scripts` to your hexo blog folder `../scritps`.
#### Author information
author:
google_plus: ## eg:116338260303228776998 for https://plus.google.com/u/0/116338260303228776998
intro_line1: "I'm chuhe now I'm working gaeamobile" ## eg: "Hello ,I'm Larry Page in Google."
intro_line2: "Storage place on the past and the future" ## eg: "This is my blog,believe it or not."
weibo: 3292942135 ## e.g. 436062867 for http://weibo.com/436062867
twitter: ## e.g. yangjiansky for https://twitter.com/yangjiansky
github: chuhemiao ## e.g. A-limon for https://github.com/A-limon
facebook: ## e.g. yangjian for https://favebook.com/yangjian
tsina: ## e.g. 1664838973 Your weibo ID,It will be used in share button.
linkedin: ## e.g. in/jeffweiner08 for https://www.linkedin.com/in/jeffweiner08

#### Comment
duoshuo:
enable: true ## duoshuo.com
short_name: myoung ## duoshuo short name.

#### Share button
jiathis:
enable: false ## if you use jiathis as your share tool,the built-in share tool won't be display.
id: ## e.g. 1501277 your jiathis ID.
tsina: ## e.g. 1664838973 Your weibo id,It will be used in share button.

#### Analytics
google_analytics:
enable: true
id: UA-68661235-3 ## e.g. UA-1766729-8 your google analytics ID.
site: idiot6.com ## e.g. yangjian.me your google analytics site or set the value as auto.
## You MUST upgrade to Universal Analytics first!
## https://developers.google.com/analytics/devguides/collection/upgrade/?hl=zh_CN

#### Custom Search
google_cse:
enable: false
cx: ## e.g. 000561263943549425496:mrzrm0gr4kg your Custom Search ID
## https://www.google.com/cse/
## To enable the custom search You must create a "search" folder in '/source' and a "index.md" file
## set the 'front-matter' as
## layout: search
## title: search
## ---

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/252222

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX