SCANDAL - 个人博客、杂志和新闻模板 preview 1

SCANDAL - 个人博客、杂志和新闻模板

bookmark

SCANDAL 是一款静态响应式个人博客、杂志与新闻模板，提供 11 种配色方案，适合快速搭建文艺风格的内容展示网站。模板基于 Bootstrap，内置图片画廊、视频画廊、博客文章等页面模板，无需后端即可使用。

HTML

项目简介

SCANDAL 是一款静态响应式个人博客、杂志与新闻模板，提供 11 种配色方案，适合快速搭建文艺风格的内容展示网站。模板基于 Bootstrap，内置图片画廊、视频画廊、博客文章等页面模板，无需后端即可使用。

技术栈

  • HTML5 + CSS3（静态页面）
  • Bootstrap 3.x（响应式布局）
  • jQuery
  • Font Awesome
  • Owl Carousel（轮播）
  • Lightbox（图片灯箱）
  • Magnific Popup（弹出层）
  • Animate.css（动画效果）
  • Google Fonts（Droid Serif、Bungee Inline）

项目结构

text
scandalhtml-10/
├── Documentation/
│   ├── index.html          # 模板使用文档
│   └── assets/
│       ├── css/            # 文档样式
│       └── ...
└── Scandal/
    ├── black-color/        # 黑色主题
    │   ├── index.html      # 图片首页
    │   ├── index-slider.html  # 轮播首页
    │   ├── index-youtube.html  # YouTube首页
    │   ├── gallery.html    # 画廊页
    │   ├── video-gallery.html # 视频画廊页
    │   ├── about.html      # 关于页
    │   ├── contact.html    # 联系页
    │   ├── single-blog.html # 文章详情页
    │   └── assets/         # 各配色独立的资源
    ├── blue-color/         # 蓝色主题
    ├── gold-color/         # 金色主题
    ├── green-color/        # 绿色主题
    └── olive-color/        # 橄榄绿主题

核心文件说明

  • Scandal/black-color/index.html — 图片型首页，入口页面
  • Scandal/*/index-slider.html — 带幻灯片效果的首页
  • Scandal/*/index-youtube.html — 以YouTube视频为主视觉的首页
  • Scandal/*/gallery.html — 图片画廊展示页
  • Scandal/*/video-gallery.html — 视频画廊页
  • Scandal/*/assets/css/style.css — 各主题的主样式文件（控制配色）

快速开始

  1. 直接在浏览器中打开 Scandal/任意主题/index.html 即可预览
  2. 上线时将选定的配色文件夹（如 black-color/）内容上传至服务器 public_html 目录
  3. 所有外部资源（Bootstrap、jQuery、Google Fonts）均通过 CDN 加载，无需额外安装

使用建议

  • 模板提供 11 种配色，建议先在本地切换不同颜色文件夹对比效果，再决定最终使用哪套主题
  • 文章内容、图片等静态资源可直接修改 HTML 文件中的占位符文本和 src 路径
  • 若需添加后台 CMS，建议将现有 HTML 模板拆分复用静态头部、导航和底部片段
help_outline

常见问题