Skip to content

Instantly share code, notes, and snippets.

@hudidit
Created March 11, 2014 07:03
Show Gist options
  • Save hudidit/9480876 to your computer and use it in GitHub Desktop.
Save hudidit/9480876 to your computer and use it in GitHub Desktop.
巴塞尔专题页面使用说明
一、专题页的全部文章都归于 special 分类。
二、巴塞尔钟表展的相关文章,全部要添加 basaier 这个标签(Tag)。
三、目前整个页面共分为 6 个段落(section),每个段落的文章都要添加与该段落相对应的 标签(Tag)。
每个段落与其标签的对应关系如下:
段落标题 标签
(1)图片轮播 section-1
(2)专家观潮 section-2
(3)揭秘私藏 section-3
(4)甄选至爱 section-4
(5)顶级指南 section-5
(6)图说鉴赏 section-6-1, section-6-2, ... , section-6-7
* 所有文章都要添加 basaier 这个标签,不要忘记。
四、每个段落的文章分别应该怎么发布,图片和文字才会显示在正确的位置?
下面是每个段落的文章当中的元素与最终显示在页面上的元素的对应关系:
(1)图片轮播
现在改成左右两栏布局:
左边是文字链接,显示最新的 2 篇文章的标题和摘要;
右边是图片轮播,显示较旧的 5 篇文章的缩略图(即特色图像)和标题。
注意事项:
(1)文章发布方式不变,即添加 basaier, section-1 这两个标签;
(2)每发布一篇新文章,左侧就会有一篇文章被移动到右侧的图片轮播,所以每篇文章都要设置缩略图;
(3)缩略图的推荐尺寸是: 宽:490px,高:265px;
(4)摘要的长度不要超过 70 个中文字符,超过的部分不会显示。
(2)专家观潮
文章元素 网页元素
特色图像 专家头像(最佳尺寸:宽 98px 高160px)
文章标题 专家姓名(最好不超过 6 个中文字符)
文章内容 专家评语(最好不超过 90 个中文字符)
* 最多显示最新的 12 个专家
(3)揭秘私藏
文章元素 网页元素
特色图像 链接图片(最佳尺寸:宽 316px 高 220px)
文章摘要 图片下方的文字
* 最多显示最新的 6 个
(4)无
(5)中国表情
(a)文字链接
文章元素 网页元素
文章标题 文字链接标题(粗体部分)
文章摘要 文字链接正文(不要超过 112 个中文字符)
* 给文章添加 section-5-top 标签,不添加 section-5 标签,文章就会显示为文字链接
* 只显示符合上述条件的最新的一篇
(b)图片链接
文章元素 网页元素
特色图像 链接图片(最佳尺寸:宽 332 高 442,主要显示人物的上半身)
文章标题 图片下方的文字(最好不要超过 14 个中文字符)
* 左侧大图会显示最新的一篇标签包含 section-5 的文章
* 最多显示 7 篇
(6)图说鉴赏
现在改成了 5 张图片的布局,4 张较小的图片在四个角上,1 张大图片在中间。
对应关系:
左上 section-6-1
左下 section-6-2
中间大图 section-6-3
右上 section-6-4
右下 section-6-5
小图的推荐尺寸是:宽:220px;高:350px;
大图的推荐尺寸是:宽:470px;高:750px。
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment