如何制作一款属于自己的wordpress主题

author author     2023-03-09     300

关键词:

工具/原料
本地测试环境搭建工具
WordPress安装程序
NotPad++文本编辑工具
HTML+CSS+PHP的基本知识
方法/步骤
使用XAMPP搭建本地环境,启动后的画面是这样的,关于使用方法,请善用百度

2.规划主题文件目录
这是完整的主题目录里应该包含的文件,包含了一些有用的扩展
方框里的内容是我们本文所必须的。

3.分离主题文件代码
根据我们前面设计的页面外观我们的主页的HTML代码可以是这样的:<code><html> <head> <title>Tutorial theme</title> <link rel="stylesheet" href="style.css"> </head> <body> <div id="wrapper"> <div id="header"> <h1>HEADER</h1> </div> <div id="main"> <div id="content"></div> <div id="sidebar"></div> </div> <div id="delimiter"></div> <div id="footer"> <h1>FOOTER</h1> </div> </div> </body></html>
</code>接下来,我们对这些代码进行模块分离,区分出header,footer,sidebar,index等内容。头部文件Header.php:<code><html> <head> <title>Book Review</title> <link rel="stylesheet" href="<?php bloginfo(\'stylesheet_url\'); ?>"> </head> <body> <div id="wrapper"> <div id="header"> <h1>HEADER</h1> </div>
</code>Header.php文件中的第4行我们更换了样式表的文件路径,这样主题就会自己判断并加载侧边栏文件sidebar.php<code><div id="sidebar"> <h2 ><?php _e(\'Categories\'); ?></h2> <ul > <?php wp_list_cats(\'sort_column=name&optioncount=1&hierarchical=0\'); ?> </ul> <h2 ><?php _e(\'Archives\'); ?></h2> <ul > <?php wp_get_archives(\'type=monthly\'); ?> </ul></div>
</code>Siderbar.php文件中分别输出了分类的列表和归档的列表。底部文件footer.php <code>
<div id="footer"> <h1>FOOTER</h1> </div> </div> </body></html></code>主题样式文件:style.css
<code>/*Theme Name: Book ReviewTheme URI: http://www.aidd.me/themeAuthor: the WordPress teamAuthor URI: http://www.ibooks.org.cn/*/body text-align: center; #wrapper display: block; border: 1px #a2a2a2 solid; width:90%; margin:0px auto; #header border: 2px #a2a2a2 solid; #content width: 75%; border: 2px #a2a2a2 solid; float: left; #sidebar width: 23%; border: 2px #a2a2a2 solid; float: right; #delimiter clear: both; #footer border: 2px #a2a2a2 solid; .title font-size: 11pt; font-family: verdana; font-weight: bold; </code>主题样式文件主要完成对主题外观的控制,这些只是最基本的样式控制文件,你可以根据自己的需要进行适合的修改以达到自己想要的效果。通过对最简单的HTML的不同控制,您会发现在以后的主题制作中如何优化代码,提高代码的通用性。主文件index.php:<code><?php get_header(); ?><div id="main"> <div id="content"> <h1>Main Area</h1> <?php if (have_posts()) : while (have_posts()) : the_post(); ?> <h1><?php the_title(); ?></h1> <h4>Posted on <?php the_time(\'F jS, Y\') ?></h4> <p><?php the_content(__(\'(more...)\')); ?></p> <hr> <?php endwhile; else: ?> <p><?php _e(\'Sorry, no posts matched your criteria.\'); ?></p><?php endif; ?> </div> <?php get_sidebar(); ?></div><?php get_footer(); ?></code>在主文件中,我们分别通过调用了get_header(),get_sidebar(),get_footer()实现了文件的整合,通过if判断是否存在日志文章,然后通过While循环来输出数据库中的日志文档。这虽然是一个最基本,最简单的主题,但通过主题的制作您能够会不断的发现问题,并通过请教百度,谷歌等搜索引擎来获取更多的知识。通过查CSS您可能获得更多的CSS控制的特效的技能或许您会发现BootStrap是如此强大。通过查找get_header,您会发现更多其独特的功能,你会发现wp_footer函数像WP_head()函数一样重要,通过查找侧边栏sidebar,您会发现原来可能通过小工具使侧边栏变得如此强大,通过查找文章类型,文章形式,分类法,你会发现原来WordPress可以完成你想要的任何功能。
参考技术A 供参考,其实摸清下面的窍门,修改成自己的网站信息,就是小菜了:

如何去掉”自豪的采用wordpress”字样

当你刚开始使用wordpress的时候在你的主页的右下角会有这么一行字
“自豪地采用wordpress”,你是可能很想把这行讨厌的玩意去掉。
其实这个很简单。
只需要找到主题文件夹(比如我使用的是twentyten)下的footer.php文件,删除掉文件的第35行代码,也就是
<?php printf( __(‘Proudly powered by %s.’, ‘twentyten’), ‘WordPress’ ); ?>
只要删掉这行代码,问题就解决啦,当然,如果你以后还想添加上,可以将其注释掉。

怎样制作wordpress手机主题

首先wordpress本身就自带手机主题Wordpress这个程序非常好,不仅有自动手机等移动端的自适应功能,还有很多模版供我们使用,其实你可以百度搜索wordpress主题就有很多了,而且都是手机的自适应的主题。 其实建议用收费的模... 查看详情

wordpress是用来干啥的?

  WordPress是一种使用PHP语言开发的博客平台,用户可以在支持PHP和MySQL数据库的服务器上架设属于自己的网站。也可以把WordPress当作一个内容管理系统(CMS)来使用。  WordPress是一款个人博客系统,并逐步演化成一款内容管... 查看详情

wordpress模板页制作教程

 写在前面的话:有很多WordPress小伙伴想制作不同风格的页面来满足自己的个性需求但是大多数模板提供的页面模板非常有限,该如何手动制作属于自己风格的模板页呢?其实,正如以上所说的,每个人都想拥有自己独特的风... 查看详情

如何定制属于自己的个性化win7主题

  好多人或许会厌倦win7一成不变的主题,在这里给大家分享一款小内存的修改神器。   所需软件win7stylebuilder(需要的朋友请联系qq1036644549)  参考网址https://jingyan.baidu.com/article/8ebacdf0cd7a4949f65cd5e9.html 1.首先安装wi... 查看详情

wordpress音乐主题always1.8

  WordPress响应式主题音乐主题个人博客杂志主题Always主题V1.8  Always主题V1.8是以Ajax加以CSS动画的方式,很好的将优雅的设计感和极度精简的代码同时表现了出来,进而缔造出这样一款十分经典的名为Alwaysforyou的WordPress博客主... 查看详情

怎样制作wordpress手机主题

参考技术A一、安装MobilePress插件在此之前,需要有个wordpress博客平台,然后按照下图的(图示一)安装MobilePress插件。MobilePress插件是一款自动识别访问设备的插件,它可以根据用户的设备来决定以什么样的主题来呈现内容,非... 查看详情

你想制作一款属于自己的游戏吗?

💂个人网站:【海拥】【摸鱼游戏】【神级源码资源网站】🤟前端学习课程:👉【28个案例趣学前端】【400个JS面试题】💅想寻找共同学习交流、摸鱼划水的小伙伴,请点击【摸鱼学习交流群】💬免费... 查看详情

求一款简洁的wordpress主题,需要国内主题,国外的不会操作后台?

本人想找一款网店主题,用来做淘宝客,但是找了很久都是国外英文版本的,操作很复杂,而且看不懂英语,希望有经验的朋友推荐一款国人的网店主题,谢谢!在线等待中!参考技术A太难了 参考技术B我有 查看详情

用wix制作属于自己的flash网站

Wix制作属于自己的Flash网站 Wix是一款新兴的在线应用程序,它可以帮助用户轻松的创建出绘声绘色的Flash网站,而不需要任何相关的专业知识。Wix是一家位于以色列的Startup开发的一款在线应用程序,它可以帮助那些没有任何相... 查看详情

wordpress引入css/js两种方法

WordPress引入css/js 是我们制作主题时首先面对的一个难点,任何一款主题都要加载自己的css,js,甚至很有可能还需要加载Jquery文件,网上方法特多,说法不一,我们今天借鉴wordpress官方最新的twentysixteen主题来学习总结一下WordPress... 查看详情

什么是wordpress?

1、WordPress是一种使用PHP语言开发的博客平台,用户可以在支持PHP和MySQL数据库的服务器上架设WordPress。2、可以使用WordPress搭建一个简单的独立博客,也可以把WordPress当作一个内容管理系统(CMS),用来搭建一个小门户网站。参... 查看详情

wordpress主题开发:制作面包屑导航

所谓面包屑,就是类似这种:首页>公司简介>发展历史展示网站树型结构,并让网站访问者随时知道自己所处的位置,方便返回上几级。将下面的代码添加到主题的functions.php://面包屑功能functionthe_breadcrumb(){echo‘<ulclass="b... 查看详情

大牛们是如何开发wordpress主题的?

...当初一开始看的是我爱水煮鱼博客上发布的一个教程->WordPress 查看详情

docker系列wordpress系列配置argon主题

参考技术A经过Docker系列WordPress系列选心仪的WordPress主题的学习,我们已经初步了解要怎么寻找和选择自己喜爱的WordPress主题,并且安装了一款颜值很高的主题argon。其实,argon有自己的参考文档。讲得都很清楚的!自己多翻看翻... 查看详情

如何仅更改 wordpress 主题中的文本?

】如何仅更改wordpress主题中的文本?【英文标题】:howtochangeonlytextinawordpresstheme?【发布时间】:2014-11-1818:17:34【问题描述】:我想将我的wordpress主题中的文本从LTR更改为RTL,<htmldir="RTL">我在header.php中实现了这段代码,它制... 查看详情

wordpress搭建自己的博客~

去官方网站下载wordpress,并解压缩。下载链接:https://cn.wordpress.org/wordpress是一款开源的PHP框架,搭建个人博客网站最实用的选择之一,甚至你都不需要懂PHP你就可以搭建自己的个人网站。提供强大的后台文章管理和插件及主题... 查看详情

如何进行wordpress的二次开发

WordPress是一款非常流行的开源内容管理系统,其二次开发可以帮助用户实现更加个性化的需求。以下是一些进行WordPress二次开发的建议:熟悉WordPress:在进行二次开发之前,需要对WordPress有一定的了解,包括其基本的架构、功能... 查看详情

手撸一款属于自己的maven插件,说干就干(代码片段)

...一篇大部分人都不会的技能,那就是我们自己动手写一款属于自己的Maven插件。好了,直接进入今天的主题吧。Maven插件的相关概念插件坐标定位插件与普通jar包一样包含坐标定位属性即:groupId、artifactId、version,... 查看详情