Initial commit: TechBlog Pro WordPress theme
Features: - Modern UI with dark mode support - Code highlighting with copy button - Auto table of contents - Reading time & views counter - Responsive design - Admin settings page - AJAX search
This commit is contained in:
Your Name
@@ -0,0 +1,191 @@
|
||||
# TechBlog Pro - WordPress Theme
|
||||
|
||||
一个专为IT技术分享设计的现代化WordPress主题，具有清爽的界面、强大的代码高亮支持和优秀的阅读体验。
|
||||
|
||||
|
||||
|
||||
## ✨ 特性
|
||||
|
||||
### 🎨 设计特色
|
||||
- **现代化UI** - 清爽简洁的设计风格
|
||||
- **暗色模式** - 一键切换深色/浅色主题
|
||||
- **响应式布局** - 完美适配各种设备
|
||||
- **流畅动画** - 细腻的过渡效果
|
||||
|
||||
### 📝 博客功能
|
||||
- **代码高亮** - 专门优化的代码块样式
|
||||
- **一键复制** - 代码块支持快速复制
|
||||
- **阅读时间** - 自动计算文章阅读时间
|
||||
- **阅读进度** - 顶部进度条显示
|
||||
- **文章目录** - 自动生成TOC目录导航
|
||||
- **阅读统计** - 记录文章浏览次数
|
||||
|
||||
### 🔧 技术特性
|
||||
- **SEO友好** - 语义化HTML结构
|
||||
- **性能优化** - 图片懒加载、平滑滚动
|
||||
- **键盘快捷键** - Ctrl+K 搜索、ESC 关闭
|
||||
- **AJAX搜索** - 实时搜索建议
|
||||
- **自定义小工具** - 分类、标签、最新文章
|
||||
|
||||
## 📦 安装
|
||||
|
||||
### 方法一：后台上传
|
||||
1. 下载主题zip文件
|
||||
2. 进入 WordPress 后台 → 外观 → 主题
|
||||
3. 点击「添加」→「上传主题」
|
||||
4. 选择下载的zip文件并安装
|
||||
5. 激活主题
|
||||
|
||||
### 方法二：FTP上传
|
||||
1. 解压主题文件
|
||||
2. 通过FTP上传到 `/wp-content/themes/techblog-wp-theme/`
|
||||
3. 进入 WordPress 后台 → 外观 → 主题
|
||||
4. 激活 TechBlog Pro 主题
|
||||
|
||||
## ⚙️ 配置
|
||||
|
||||
### 菜单设置
|
||||
进入 **外观 → 菜单**：
|
||||
- 创建一个新菜单
|
||||
- 选择「主导航菜单」位置
|
||||
- 添加分类/页面/自定义链接
|
||||
|
||||
### 小工具设置
|
||||
进入 **外观 → 小工具**：
|
||||
- **主侧边栏** - 文章页面右侧显示
|
||||
- **页脚栏 1/2/3** - 页脚三列布局
|
||||
|
||||
### 自定义设置
|
||||
进入 **外观 → 自定义**：
|
||||
- **首页横幅** - 设置首页标题和描述
|
||||
- **社交媒体** - 添加社交链接（GitHub、Twitter等）
|
||||
|
||||
### 代码块语言
|
||||
在编辑器中使用代码块时，设置语言可以显示对应的标签：
|
||||
```
|
||||
// 语言会自动显示在代码块左上角
|
||||
console.log('Hello World');
|
||||
```
|
||||
|
||||
## 🎯 推荐分类结构
|
||||
|
||||
适合IT技术博客的分类建议：
|
||||
|
||||
```
|
||||
├── Linux
|
||||
│ ├── 系统管理
|
||||
│ ├── Shell脚本
|
||||
│ └── 性能优化
|
||||
├── DevOps
|
||||
│ ├── Docker
|
||||
│ ├── Kubernetes
|
||||
│ ├── CI/CD
|
||||
│ └── 监控运维
|
||||
├── 编程开发
|
||||
│ ├── Python
|
||||
│ ├── Go
|
||||
│ ├── JavaScript
|
||||
│ └── 数据库
|
||||
├── 云计算
|
||||
│ ├── AWS
|
||||
│ ├── Azure
|
||||
│ └── 阿里云
|
||||
└── 网络安全
|
||||
├── 防火墙
|
||||
└── 渗透测试
|
||||
```
|
||||
|
||||
## 📁 文件结构
|
||||
|
||||
```
|
||||
techblog-wp-theme/
|
||||
├── style.css # 主样式表
|
||||
├── functions.php # 主题函数
|
||||
├── header.php # 页头模板
|
||||
├── footer.php # 页脚模板
|
||||
├── index.php # 首页模板
|
||||
├── single.php # 文章详情模板
|
||||
├── page.php # 页面模板
|
||||
├── archive.php # 归档模板
|
||||
├── search.php # 搜索结果模板
|
||||
├── 404.php # 404页面模板
|
||||
├── comments.php # 评论模板
|
||||
├── js/
|
||||
│ └── main.js # 主脚本文件
|
||||
└── README.md # 主题说明文档
|
||||
```
|
||||
|
||||
## 🛠️ 开发指南
|
||||
|
||||
### 添加自定义样式
|
||||
在子主题或自定义CSS中添加：
|
||||
|
||||
```css
|
||||
/* 自定义主色调 */
|
||||
:root {
|
||||
--primary-color: #your-color;
|
||||
--secondary-color: #your-color;
|
||||
}
|
||||
|
||||
/* 自定义代码块背景 */
|
||||
.post-content pre {
|
||||
background: #your-code-bg;
|
||||
}
|
||||
```
|
||||
|
||||
### 添加自定义功能
|
||||
在子主题的 `functions.php` 中添加：
|
||||
|
||||
```php
|
||||
// 添加自定义功能
|
||||
function my_custom_features() {
|
||||
// 你的代码
|
||||
}
|
||||
add_action('after_setup_theme', 'my_custom_features');
|
||||
```
|
||||
|
||||
## 🌐 浏览器支持
|
||||
|
||||
- Chrome (最新)
|
||||
- Firefox (最新)
|
||||
- Safari (最新)
|
||||
- Edge (最新)
|
||||
|
||||
## 📝 更新日志
|
||||
|
||||
### v1.0.0 (2024)
|
||||
- 初始版本发布
|
||||
- 暗色模式支持
|
||||
- 代码高亮和复制功能
|
||||
- 目录自动生成
|
||||
- 响应式设计
|
||||
|
||||
## 💡 使用技巧
|
||||
|
||||
### 快捷键
|
||||
- `Ctrl + K` / `Cmd + K` - 打开搜索
|
||||
- `ESC` - 关闭搜索/弹窗
|
||||
|
||||
### Markdown 支持
|
||||
主题完美支持 Gutenberg 编辑器中的代码块，建议使用 WordPress 内置的代码块功能。
|
||||
|
||||
### 图片优化
|
||||
- 建议文章图片宽度 780px
|
||||
- 使用 WebP 格式可提升加载速度
|
||||
- 主题自动支持图片懒加载
|
||||
|
||||
## 🤝 贡献
|
||||
|
||||
欢迎提交 Issue 和 Pull Request！
|
||||
|
||||
## 📄 许可证
|
||||
|
||||
GPL v2 or later
|
||||
|
||||
## 👨💻 作者
|
||||
|
||||
TechBlog Team
|
||||
|
||||
---
|
||||
|
||||
**享受你的技术写作之旅！** 🚀
|
||||
Reference in New Issue
Block a user