diff --git a/404.php b/404.php
new file mode 100644
index 0000000..f779600
--- /dev/null
+++ b/404.php
@@ -0,0 +1,16 @@
+
+
+
+
+
+
+
diff --git a/README.md b/README.md
index 6b377fb..9953363 100644
--- a/README.md
+++ b/README.md
@@ -1,2 +1,161 @@
-# ITStudioMainSite
-爱特工作室总站点、官网
+
+

+
+
+
爱特工作室总站
+
+
+
+
+
+## 📖 项目简介
+
+中国海洋大学爱特工作室官方网站 WordPress 主题。这是一个现代化、响应式的主题,支持暗色/亮色模式切换,融合海洋元素与 IT 风格。
+
+## ✨ 主要特性
+
+- 🎨 **现代简洁设计** - IT风格与海洋元素完美融合
+- 🌓 **主题切换** - 支持暗色/亮色模式,可根据系统主题自动切换
+- 📱 **响应式布局** - 完美适配 PC 端和移动端
+- 🌐 **多语言支持** - 支持中文/英文切换
+- ⚡ **性能优化** - 轻量级设计,加载快速
+- 🎯 **自定义文章类型** - 支持公告通知独立管理
+
+## 🚀 快速开始
+
+### 安装方法
+
+1. 克隆本仓库到 WordPress 主题目录:
+```bash
+cd wp-content/themes
+git clone https://github.com/itstudio-2002/ITStudioMainSite.git
+```
+
+2. 在 WordPress 后台激活主题:
+ - 进入 **外观 > 主题**
+ - 找到 "IT Studio Theme"
+ - 点击 **激活**
+
+### 主题配置
+
+#### 1. 导航菜单设置
+
+进入 **外观 > 菜单**,创建主导航菜单并分配到 "Primary Menu" 位置。
+
+推荐菜单结构:
+- 首页
+- 公告通知
+- 技术博客
+- 便民服务
+- 工作室介绍
+- 加入我们
+
+#### 2. 发布公告
+
+主题内置了"公告通知"自定义文章类型:
+1. 进入 **公告 > 新建公告**
+2. 填写标题和内容
+3. 发布即可在首页显示
+
+#### 3. 技术博客
+
+使用 WordPress 默认的文章功能发布技术博客:
+1. 进入 **文章 > 写文章**
+2. 撰写博客内容
+3. 发布后会在首页博客栏显示
+
+## 🎨 设计规范
+
+### 主题色彩
+
+- **海洋浅蓝色** (#f0f8ff) - 亮色模式背景
+- **海洋深蓝色** (#0a1929) - 暗色模式背景
+- **强调色** (#8e88c7) - 链接、按钮等
+- **中性色** - 灰度系列用于文本和边框
+
+### 页面结构
+
+- **Header** - 左侧 Logo,右侧导航栏、社交图标、主题切换按钮
+- **首页** - 工作室介绍、公告列表、博客列表双栏布局
+- **Footer** - 友情链接、联系方式、版权信息
+
+## 📂 文件结构
+
+```
+ITStudioMainSite/
+├── assets/
+│ ├── css/
+│ │ └── main.css # 主样式文件
+│ └── js/
+│ ├── theme-toggle.js # 主题切换功能
+│ └── main.js # 主要 JavaScript
+├── resources/
+│ ├── it_logo_2024.svg # 工作室 Logo
+│ ├── ouc-logo.svg # 海大 Logo
+│ └── ...
+├── style.css # WordPress 主题样式表(必需)
+├── functions.php # 主题功能文件
+├── index.php # 首页模板
+├── header.php # 头部模板
+├── footer.php # 底部模板
+├── single.php # 单篇文章模板
+├── page.php # 页面模板
+├── archive.php # 归档页面模板
+└── 404.php # 404 错误页面
+```
+
+## 🛠️ 技术栈
+
+- **WordPress** - 内容管理系统
+- **PHP** - 后端开发语言
+- **HTML5/CSS3** - 前端标记与样式
+- **JavaScript** - 前端交互逻辑
+- **SVG** - 矢量图标和 Logo
+
+## 🔧 开发指南
+
+### 本地开发环境
+
+1. 安装 WordPress 本地开发环境(如 XAMPP、MAMP 等)
+2. 克隆本仓库到 `wp-content/themes` 目录
+3. 激活主题开始开发
+
+### 自定义开发
+
+- 修改 `assets/css/main.css` 自定义样式
+- 编辑 `functions.php` 添加新功能
+- 创建新的模板文件扩展功能
+
+## 📝 使用许可
+
+MIT License - 详见 LICENSE 文件
+
+## 👥 关于我们
+
+**爱特工作室**成立于 2002 年,是中国海洋大学信息科学与工程学部领导主持下的技术性团队。
+
+🎯 **使命**: 发现人才,培养人才,输送人才
+
+🔗 **链接**:
+- GitHub: [github.com/itstudio-2002](https://github.com/itstudio-2002)
+- Email: contact@itstudio.club
+
+## 🤝 贡献
+
+欢迎提交 Issue 和 Pull Request!
+
+## 📄 更新日志
+
+### v1.0.0 (2026-02-05)
+- 🎉 初始版本发布
+- ✅ 基础主题功能实现
+- ✅ 响应式设计完成
+- ✅ 主题切换功能
+- ✅ 自定义文章类型(公告)
\ No newline at end of file
diff --git a/archive.php b/archive.php
new file mode 100644
index 0000000..8f1e973
--- /dev/null
+++ b/archive.php
@@ -0,0 +1,71 @@
+
+
+
+
+
+
+
+
+
+
>
+
+
+
+
+
+
+
+
+
+
+
+
+ |
+
+
+
+
+
+
+
+
+
+
+
+ →
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/assets/css/main.css b/assets/css/main.css
new file mode 100644
index 0000000..25be697
--- /dev/null
+++ b/assets/css/main.css
@@ -0,0 +1,626 @@
+.site-header {
+ background-color: var(--header-bg);
+ border-bottom: 1px solid var(--border-color);
+ position: sticky;
+ top: 0;
+ z-index: 1000;
+ transition: background-color var(--transition-speed), border-color var(--transition-speed);
+}
+
+.header-content {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 1rem 0;
+}
+
+.logo-container {
+ display: flex;
+ align-items: center;
+ gap: 1rem;
+}
+
+.logo-it {
+ height: 40px;
+ width: auto;
+}
+
+.logo-ouc {
+ height: 36px;
+ width: auto;
+}
+
+.main-navigation {
+ display: flex;
+ align-items: center;
+ gap: 2rem;
+}
+
+.nav-menu {
+ display: flex;
+ list-style: none;
+ gap: 2rem;
+ margin: 0;
+ padding: 0;
+}
+
+.nav-menu a {
+ color: var(--text-color);
+ font-weight: 500;
+ transition: color var(--transition-speed);
+}
+
+.nav-menu a:hover {
+ color: var(--accent-color);
+}
+
+.social-links {
+ display: flex;
+ align-items: center;
+ gap: 1rem;
+}
+
+.social-links a,
+.theme-toggle {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 36px;
+ height: 36px;
+ color: var(--text-color);
+ background: transparent;
+ border: none;
+ cursor: pointer;
+ border-radius: 50%;
+ transition: background-color var(--transition-speed), color var(--transition-speed);
+}
+
+.social-links a:hover,
+.theme-toggle:hover {
+ background-color: var(--gray-200);
+}
+
+[data-theme="dark"] .social-links a:hover,
+[data-theme="dark"] .theme-toggle:hover {
+ background-color: var(--gray-700);
+}
+
+.theme-toggle .sun-icon {
+ display: none;
+}
+
+.theme-toggle .moon-icon {
+ display: block;
+}
+
+[data-theme="dark"] .theme-toggle .sun-icon {
+ display: block;
+}
+
+[data-theme="dark"] .theme-toggle .moon-icon {
+ display: none;
+}
+
+.mobile-menu-toggle {
+ display: none;
+ flex-direction: column;
+ gap: 4px;
+ background: transparent;
+ border: none;
+ cursor: pointer;
+ padding: 8px;
+}
+
+.mobile-menu-toggle span {
+ display: block;
+ width: 24px;
+ height: 2px;
+ background-color: var(--text-color);
+ transition: all var(--transition-speed);
+}
+
+.hero-section {
+ padding: 4rem 0;
+ text-align: center;
+}
+
+.hero-content h1 {
+ font-size: 3rem;
+ margin-bottom: 1.5rem;
+ color: var(--accent-color);
+}
+
+.hero-description {
+ font-size: 1.125rem;
+ line-height: 1.8;
+ max-width: 800px;
+ margin: 0 auto;
+ color: var(--text-color);
+}
+
+.content-section {
+ padding: 3rem 0;
+}
+
+.content-grid {
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ gap: 3rem;
+}
+
+.announcements-column h2,
+.blog-column h2 {
+ font-size: 1.75rem;
+ margin-bottom: 1.5rem;
+ color: var(--text-color);
+}
+
+.subtitle {
+ font-size: 0.875rem;
+ color: var(--gray-500);
+ margin-left: 0.5rem;
+}
+
+.post-list {
+ display: flex;
+ flex-direction: column;
+ gap: 1.25rem;
+}
+
+.post-item {
+ padding: 1.25rem;
+ background-color: var(--header-bg);
+ border-radius: 8px;
+ border: 1px solid var(--border-color);
+ transition: transform var(--transition-speed), box-shadow var(--transition-speed);
+}
+
+.post-item:hover {
+ transform: translateY(-2px);
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+}
+
+.post-item h3 {
+ font-size: 1.125rem;
+ margin-bottom: 0.5rem;
+}
+
+.post-item h3 a {
+ color: var(--text-color);
+}
+
+.post-item time {
+ font-size: 0.875rem;
+ color: var(--gray-500);
+}
+
+.site-footer {
+ background-color: var(--footer-bg);
+ border-top: 1px solid var(--border-color);
+ padding: 3rem 0 1.5rem;
+ margin-top: 4rem;
+}
+
+.footer-content {
+ display: grid;
+ grid-template-columns: repeat(4, 1fr);
+ gap: 2rem;
+ margin-bottom: 2rem;
+}
+
+.footer-section h3 {
+ font-size: 1.125rem;
+ margin-bottom: 1rem;
+ color: var(--text-color);
+}
+
+.footer-links {
+ list-style: none;
+}
+
+.footer-links li {
+ margin-bottom: 0.5rem;
+}
+
+.footer-links a {
+ color: var(--text-color);
+ font-size: 0.9rem;
+}
+
+.footer-slogan {
+ font-style: italic;
+ color: var(--accent-color);
+ font-weight: 500;
+}
+
+.footer-bottom {
+ text-align: center;
+ padding-top: 2rem;
+ border-top: 1px solid var(--border-color);
+}
+
+.footer-bottom p {
+ font-size: 0.875rem;
+ color: var(--gray-500);
+}
+
+@media (max-width: 1024px) {
+ .nav-menu {
+ gap: 1.5rem;
+ }
+
+ .content-grid {
+ gap: 2rem;
+ }
+
+ .footer-content {
+ grid-template-columns: repeat(2, 1fr);
+ }
+}
+
+@media (max-width: 768px) {
+ .mobile-menu-toggle {
+ display: flex;
+ }
+
+ .main-navigation {
+ position: relative;
+ }
+
+ .nav-menu {
+ position: absolute;
+ top: 100%;
+ right: 0;
+ background-color: var(--header-bg);
+ flex-direction: column;
+ padding: 1rem;
+ border-radius: 8px;
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+ display: none;
+ min-width: 200px;
+ }
+
+ .nav-menu.active {
+ display: flex;
+ }
+
+ .hero-content h1 {
+ font-size: 2rem;
+ }
+
+ .hero-description {
+ font-size: 1rem;
+ }
+
+ .content-grid {
+ grid-template-columns: 1fr;
+ gap: 2rem;
+ }
+
+ .footer-content {
+ grid-template-columns: 1fr;
+ gap: 1.5rem;
+ }
+}
+
+@media (max-width: 480px) {
+ .logo-it {
+ height: 32px;
+ }
+
+ .logo-ouc {
+ height: 28px;
+ }
+
+ .hero-content h1 {
+ font-size: 1.5rem;
+ }
+
+ .social-links a,
+ .theme-toggle {
+ width: 32px;
+ height: 32px;
+ }
+}
+
+.single-post,
+.page-content {
+ padding: 3rem 0;
+}
+
+.entry-header {
+ margin-bottom: 2rem;
+ padding-bottom: 1.5rem;
+ border-bottom: 1px solid var(--border-color);
+}
+
+.entry-title {
+ font-size: 2.5rem;
+ line-height: 1.2;
+ margin-bottom: 1rem;
+ color: var(--text-color);
+}
+
+.entry-meta {
+ font-size: 0.9rem;
+ color: var(--gray-500);
+}
+
+.entry-meta .separator {
+ margin: 0 0.5rem;
+}
+
+.entry-thumbnail {
+ margin-bottom: 2rem;
+}
+
+.entry-thumbnail img {
+ width: 100%;
+ height: auto;
+ border-radius: 8px;
+}
+
+.entry-content {
+ font-size: 1.125rem;
+ line-height: 1.8;
+ color: var(--text-color);
+}
+
+.entry-content h2,
+.entry-content h3,
+.entry-content h4 {
+ margin-top: 2rem;
+ margin-bottom: 1rem;
+ color: var(--text-color);
+}
+
+.entry-content p {
+ margin-bottom: 1.5rem;
+}
+
+.entry-content a {
+ color: var(--accent-color);
+ text-decoration: underline;
+}
+
+.entry-content img {
+ max-width: 100%;
+ height: auto;
+ border-radius: 8px;
+ margin: 1.5rem 0;
+}
+
+.entry-content ul,
+.entry-content ol {
+ margin-bottom: 1.5rem;
+ padding-left: 2rem;
+}
+
+.entry-content li {
+ margin-bottom: 0.5rem;
+}
+
+.entry-content code {
+ background-color: var(--gray-200);
+ padding: 0.2rem 0.4rem;
+ border-radius: 4px;
+ font-size: 0.9em;
+ font-family: 'Consolas', 'Monaco', monospace;
+}
+
+[data-theme="dark"] .entry-content code {
+ background-color: var(--gray-700);
+}
+
+.entry-content pre {
+ background-color: var(--gray-200);
+ padding: 1rem;
+ border-radius: 8px;
+ overflow-x: auto;
+ margin-bottom: 1.5rem;
+}
+
+[data-theme="dark"] .entry-content pre {
+ background-color: var(--gray-800);
+}
+
+.entry-content pre code {
+ background-color: transparent;
+ padding: 0;
+}
+
+.entry-footer {
+ margin-top: 3rem;
+ padding-top: 2rem;
+ border-top: 1px solid var(--border-color);
+}
+
+.entry-categories,
+.entry-tags {
+ margin-bottom: 1rem;
+}
+
+.entry-categories a,
+.entry-tags a {
+ display: inline-block;
+ padding: 0.25rem 0.75rem;
+ margin-right: 0.5rem;
+ background-color: var(--gray-200);
+ border-radius: 4px;
+ font-size: 0.9rem;
+ color: var(--text-color);
+}
+
+[data-theme="dark"] .entry-categories a,
+[data-theme="dark"] .entry-tags a {
+ background-color: var(--gray-700);
+}
+
+.archive-header {
+ margin-bottom: 3rem;
+ text-align: center;
+}
+
+.archive-title {
+ font-size: 2.5rem;
+ margin-bottom: 1rem;
+ color: var(--text-color);
+}
+
+.archive-description {
+ font-size: 1.125rem;
+ color: var(--gray-500);
+}
+
+.posts-grid {
+ display: grid;
+ grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
+ gap: 2rem;
+ margin-bottom: 3rem;
+}
+
+.archive-item {
+ background-color: var(--header-bg);
+ border-radius: 8px;
+ border: 1px solid var(--border-color);
+ overflow: hidden;
+ transition: transform var(--transition-speed), box-shadow var(--transition-speed);
+}
+
+.archive-item:hover {
+ transform: translateY(-4px);
+ box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
+}
+
+.archive-thumbnail img {
+ width: 100%;
+ height: 200px;
+ object-fit: cover;
+}
+
+.archive-content {
+ padding: 1.5rem;
+}
+
+.archive-item-title {
+ font-size: 1.25rem;
+ margin-bottom: 0.75rem;
+}
+
+.archive-item-title a {
+ color: var(--text-color);
+}
+
+.archive-meta {
+ font-size: 0.875rem;
+ color: var(--gray-500);
+ margin-bottom: 1rem;
+}
+
+.archive-meta .separator {
+ margin: 0 0.5rem;
+}
+
+.archive-excerpt {
+ font-size: 0.95rem;
+ line-height: 1.6;
+ color: var(--text-color);
+ margin-bottom: 1rem;
+}
+
+.read-more {
+ color: var(--accent-color);
+ font-weight: 500;
+ font-size: 0.9rem;
+}
+
+.pagination {
+ display: flex;
+ justify-content: center;
+ gap: 0.5rem;
+}
+
+.pagination .nav-links {
+ display: flex;
+ gap: 0.5rem;
+}
+
+.pagination a,
+.pagination span {
+ padding: 0.5rem 1rem;
+ background-color: var(--header-bg);
+ border: 1px solid var(--border-color);
+ border-radius: 4px;
+ color: var(--text-color);
+ transition: background-color var(--transition-speed);
+}
+
+.pagination a:hover {
+ background-color: var(--accent-color);
+ color: var(--white);
+}
+
+.pagination .current {
+ background-color: var(--accent-color);
+ color: var(--white);
+}
+
+.error-404 {
+ padding: 6rem 0;
+}
+
+.error-content {
+ text-align: center;
+ max-width: 600px;
+ margin: 0 auto;
+}
+
+.error-title {
+ font-size: 8rem;
+ color: var(--accent-color);
+ margin-bottom: 1rem;
+}
+
+.error-content h2 {
+ font-size: 2rem;
+ margin-bottom: 1rem;
+ color: var(--text-color);
+}
+
+.error-content p {
+ font-size: 1.125rem;
+ color: var(--gray-500);
+ margin-bottom: 2rem;
+}
+
+.btn-home {
+ display: inline-block;
+ padding: 0.75rem 2rem;
+ background-color: var(--accent-color);
+ color: var(--white);
+ border-radius: 8px;
+ font-weight: 500;
+ transition: opacity var(--transition-speed);
+}
+
+.btn-home:hover {
+ opacity: 0.9;
+}
+
+@media (max-width: 768px) {
+ .entry-title {
+ font-size: 2rem;
+ }
+
+ .archive-title {
+ font-size: 2rem;
+ }
+
+ .posts-grid {
+ grid-template-columns: 1fr;
+ }
+
+ .error-title {
+ font-size: 5rem;
+ }
+}
diff --git a/assets/js/main.js b/assets/js/main.js
new file mode 100644
index 0000000..263f1e7
--- /dev/null
+++ b/assets/js/main.js
@@ -0,0 +1,31 @@
+const mobileMenuToggle = document.querySelector('.mobile-menu-toggle');
+const navMenu = document.querySelector('.nav-menu');
+
+if (mobileMenuToggle && navMenu) {
+ mobileMenuToggle.addEventListener('click', () => {
+ navMenu.classList.toggle('active');
+ mobileMenuToggle.classList.toggle('active');
+ });
+
+ document.addEventListener('click', (e) => {
+ if (!e.target.closest('.main-navigation')) {
+ navMenu.classList.remove('active');
+ mobileMenuToggle.classList.remove('active');
+ }
+ });
+
+ window.addEventListener('resize', () => {
+ if (window.innerWidth > 768) {
+ navMenu.classList.remove('active');
+ mobileMenuToggle.classList.remove('active');
+ }
+ });
+}
+
+document.addEventListener('DOMContentLoaded', () => {
+ const postItems = document.querySelectorAll('.post-item');
+
+ postItems.forEach((item, index) => {
+ item.style.animationDelay = `${index * 0.1}s`;
+ });
+});
diff --git a/assets/js/theme-toggle.js b/assets/js/theme-toggle.js
new file mode 100644
index 0000000..1769624
--- /dev/null
+++ b/assets/js/theme-toggle.js
@@ -0,0 +1,35 @@
+const themeToggle = document.querySelector('.theme-toggle');
+const html = document.documentElement;
+
+function getPreferredTheme() {
+ const savedTheme = localStorage.getItem('theme');
+ if (savedTheme) {
+ return savedTheme;
+ }
+
+ const systemPreference = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+ return systemPreference;
+}
+
+function setTheme(theme) {
+ html.setAttribute('data-theme', theme);
+ localStorage.setItem('theme', theme);
+}
+
+const initialTheme = getPreferredTheme();
+setTheme(initialTheme);
+
+if (themeToggle) {
+ themeToggle.addEventListener('click', () => {
+ const currentTheme = html.getAttribute('data-theme');
+ const newTheme = currentTheme === 'dark' ? 'light' : 'dark';
+ setTheme(newTheme);
+ });
+}
+
+window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', (e) => {
+ if (!localStorage.getItem('theme')) {
+ const newTheme = e.matches ? 'dark' : 'light';
+ setTheme(newTheme);
+ }
+});
diff --git a/footer.php b/footer.php
new file mode 100644
index 0000000..1eaa67e
--- /dev/null
+++ b/footer.php
@@ -0,0 +1,42 @@
+
+
+
+