博客主页 🏗️
标签

WordPress

下的文章

Count:

计 3 篇
1117
Wing主题二开记录
Wing主题二开记录
分类: 未分类
简介:在问了原作者可以二开后,本来是打算先修改样式的,发现原本的Wing主题是没有后台设置页面,现有的设置都在自定义页面里通过使用WordPress的Customizer API实现于是先开始写一个后台设置,同时由于是二开版本,重命名为Wing Pre主题保留原作者署名并新建文档及GitHub仓库Wiki:待建GitHub:待建 2025/5/24优化部分逻辑——2025/5/23新建主题的theme options.php文件,添加主题后台页面——2025/5/22检查友链和评论,发现主题内置的gravatar镜像失效,全部替换为cravatar
286
足够简洁的Typecho迁移WordPress指南
足够简洁的Typecho迁移WordPress指南
分类: 未分类
简介:时间真是个圈,兜兜转转我又换回了Wordpress,并非typecho有什么不好,快还是蛮快的,只不过是逐渐失去了新鲜感,再加上typecho的教程有点少,所以我回归了wp。至于为什么不再用zblog,那玩意谁用啊!虽然这使得我这1h1g的腾讯云无忧机器变得有点慢,但是,前台看不出来嘛[笑]!刚好,我还能水一篇文章不是。 咳咳,正文开始:起初我是打算学网上的一些文章自己改数据库来着,但是当我打开我的数据库,发现工作量挺大。于是我开始找其他方法,本来听别人说wp里面就有typecho迁移WordPress的插件,搜索插件就行了。结果显然易见,啥也没有,白忙活一场,好在我提前都备份了。最后发现了一个用于Typecho的插件——ByeTyp插件地址:Github上传至typecho的插件目录将typecho的文章、分类、标签,甚至是评论都能转换成WordPress的格式。上传插件至typecho后,别忘记把文件夹改成ByeTyp,因为默认的名称是带版本号的,没有重命名会用不了。在控制台下拉的最底栏点击数据导出,你需要的WordPress文件就到手了。最后安装完WordPress,在后台 工具 导入这个位置,找到WordPress导入工具。安装导入就行了。
307
wordpress主题结构剖析之一
wordpress主题结构剖析之一
分类: 未分类
简介:我本来是打算最近不更新的,但是由于Sakurairo主题更新后的一堆问题,没有办法解决,总是陷入内循环,导致服务器高使用率和高负载。而我和Jack两个人都没解决。没办法,只能选择自己写主题,但是在此之前,由于之前没有写过WordPress主题,使得我决定在本章剖析一下WordPress的结构再谈开发主题的事情,顺便做一个笔记,免得自己,慢慢忘记了。之后再二开一个主题吧,至于是啥主题,暂时保密。WordPress的主题结构涉及到主题文件和目录的组织方式,主要分为四个部分,分别是:主题根目录、核心文件、模板文件、子目录和文件,首先是主题根目录:主题根目录:这是主题文件的最高级别目录,通常以主题名称命名。wp content/themes/your theme/在主题根目录中,除了核心文件(如style.css、index.php、functions.php)之外,还可以包含其他自定义文件和目录。在某些情况下,一些主题还包含子主题或样式化框架(如Bootstrap等)(Bootstrap确实蛮方便的)其次是核心文件: index.php:通常会使用WordPress函数(如get_header()和get_footer())调用其他相关模板文件。 functions.php:可以包含主题的自定义功能,如注册自定义菜单、添加自定义小工具区域、注册自定义文章类型等 style.css:除了元数据和自定义样式外,还可以包含其他CSS文件的导入和引用。 [precode]<?php /** * 主页模板 * 这是默认的模板文件,用于显示网站的主页内容。 * @package YourThemeName */get_header(); // 调用页眉模板?><div id="primary" class="content area"> <main id="main" class="site main"><?php if (have_posts()) : ?><?php while (have_posts()) : the_post(); ?><?php get_template_part('template parts/content', get_post_format()); ?> <! 调用内容模板,根据文章格式选择对应的模板部件 ><?php endwhile; ?><?php the_posts_navigation(); ?> <! 显示文章导航,上一页和下一页链接 ><?php else : ?><?php get_template_part('template parts/content', 'none'); ?> <! 如果没有文章,调用“无内容”模板部件 ><?php endif; ?></main><! #main > </div><! #primary ><?php get_sidebar(); // 调用侧边栏模板 get_footer(); // 调用页脚模板[/precode]这个是一个标准的index.php文件分别使用了WordPress的模板函数get_header()、get_template_part()、the_post()、the_posts_navigation()、get_sidebar()和get_footer()这些函数分别用于获取页眉模板、获取模板部件、获取文章信息、显示文章导航、获取侧边栏模板和获取页脚模板。其次是functions.php 文件[precode]<?php /** * 主题功能和自定义代码 * * 在这里可以添加主题的自定义功能、注册自定义菜单、添加小工具区域等。 * * @package YourThemeName */// 在主题初始化时执行的动作 function your_theme_name_setup() { // 启用文章特色图像支持 add_theme_support('post thumbnails');// 注册自定义菜单 register_nav_menus( array( 'primary' => '主导航菜单', 'footer' => '页脚菜单', ) ); } add_action('after_setup_theme', 'your_theme_name_setup');// 注册侧边栏 function your_theme_name_widgets_init() { register_sidebar( array( 'name' => '侧边栏', 'id' => 'sidebar 1', 'description' => '这是一个侧边栏小工具区域。', 'before_widget' => '<aside id="%1$s" class="widget %2$s">', 'after_widget' => '</aside>', 'before_title' => '<h2 class="widget title">', 'after_title' => '</h2>', ) ); } add_action('widgets_init', 'your_theme_name_widgets_init');// 添加自定义短代码 function your_theme_name_custom_shortcode() { // 声明一个简单的短代码,用于显示当前年份 function custom_year_shortcode() { $year = date('Y'); return $year; } add_shortcode('current_year', 'custom_year_shortcode'); } add_action('init', 'your_theme_name_custom_shortcode');[/precode]在这些代码中,可以根据我的注释看到引用了一些自定义功能:在 your_theme_name_setup() 函数中,我们启用了文章特色图像支持,并注册了两个自定义菜单。你可以根据需要修改或添加更多的菜单区域。在 your_theme_name_widgets_init()函数中,我们注册了一个侧边栏小工具区域,我们可以在这里添加其他小工具区域,并根据需要进行自定义。最后,在your_theme_name_custom_shortcode() 函数中,添加了一个自定义短代码。该短代码用于显示当前的年份。其次是我们的css样式文件,[precode]/* Theme Name: Your Theme Name // 主题名称 Theme URI: http://www.yourthemename.com // 主题官网链接 Description: This is a custom theme for demonstration purposes. // 主题描述 Author: Your Name // 作者姓名 Author URI: http://www.yourwebsite.com // 作者链接 Version: 1.0 // 主题版本号 License: GNU General Public License v2 or later // 主题许可证 License URI: http://www.gnu.org/licenses/gpl 2.0.html // 许可证链接 Tags: responsive layout, custom colors, custom header, custom background // 主题标签*/ html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, code, em, img, small, strong, ol, ul, li, fieldset, form, label, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; // 边距归0 padding: 0; // 内边距归0 border: 0; // 边框归0 outline: 0; // 轮廓线归0 font size: 100%; // 字体大小重置为浏览器默认大小 vertical align: baseline; // 垂直对齐归位 background: transparent; // 背景透明 }body { line height: 1; // 行高设置为1 } body { font family: Arial, sans serif; // 全局字体 color: #333; // 全局颜色 }h1, h2, h3, h4, h5, h6 { margin bottom: 20px; // 标题下边距 }a { color: #0066cc; // 链接颜色 text decoration: none; // 链接无下划线 }a:hover { text decoration: underline; // 鼠标悬停链接加下划线 } .site header { background color: #f5f5f5; // 页眉背景颜色 padding: 20px; // 页眉内边距 }.site title { font size: 24px; // 标题字体大小 font weight: bold; // 标题粗体 } .content area { width: 80%; // 主内容区域宽度 margin: 0 auto; // 水平居中 padding: 20px; // 主内容内边距 } .sidebar { width: 20%; // 侧边栏宽度 float: right; // 右浮动 background color: #f5f5f5; // 侧边栏背景颜色 padding: 20px; // 侧边栏内边距 }.widget { margin bottom: 20px; // 小工具下边距 } .site footer { background color: #f5f5f5; // 页脚背景颜色 padding: 20px; // 页脚内边距 text align: center; // 居中对齐 }.site info { font size: 14px; // 页脚信息字体大小 }[/precode]这只是一个基本的 style.css 示例,包含了一些常见的样式规则和选择器。在文件开头的注释部分,能根据自己的主题信息进行修改,包括主题名称、作者、版本等。紧接着是一些常见的 CSS 重置规则,用于清除默认样式。接下来是全局样式规则,定义了全局字体、颜色等属性。然后是一些特定部分的样式规则,包括页眉、主要内容区域、侧边栏和页脚的样式。 未完待续。。。。。
博客主页 拾光博客 让拾光先飞一会儿.
湘ICP备2022010501号-1 本站已运行 5 年 112 天 4 小时 37 分 自豪地使用 Typecho 建站,并搭配 MyDiary 主题 Copyright © 2021 ~ 2026. 拾光博客 All rights reserved.
打赏图
打赏博主
欢迎
搜 索
足 迹
分 类
  • 未分类
  • 技术教程