崇文做网站:将模板转换为WordPress主题

2019.05.27 崇文做网站

114

仅仅因为你觉得WP转换过程令人望而生畏,就完全没有必要忽略互联网上大量的Web模板。将一个基本的Web模板转换为WordPress主题只需要一些切片和骰子例程以及一点耐心。以下是如何做到这一点:

第一步:打开模板的索引文件

这个过程的第一步就是简单地处理下载的Web模板需要做什么。最好的方法是打开站点的索引文件,通常命名如下index.htmhome.htm。这个文件看起来像一个标准的XHTML文档,使用<head><body>适当插入的标记。在Body标记中将有一个明确表示的页眉、导航区域、内容正文和页脚。这是在将一个简单的索引页面转换为一系列模板时的主要关注点。

用户应该关注的第一件事情应该是WordPressheader.php档案。这是一个文件,它显示页面的标题,宣布它的文件格式和编程语言,包括关键字,并显示mashad,导航和其他上面的信息。一般来说,页面的标题从DTD文档标记开始(查找声明XHTML1.1严格或类似文件的行),并在代码传递正文标记并显示导航链接之后结束。只需复制所有这些信息并将其粘贴到一个新的空白文本文件中即可。将该文件保存为header.php准备做些编辑。

WordPress需要将某些变量和信息放入页面标题中,这是一个相对简单的转换过程。最重要的是,页面的标题信息可以由WordPress软件自己动态修改,这取决于用户在站点中的登录位置。请记住,这个标题在每个WordPress页面上都使用,所以是静态的。<title>标签没用。找到那个<title>标记并将其替换为类似于以下示例的内容:

<title><?php bloginfo( 'name' ); ?> ); ?></title>

上面的标题将首先显示博客的实际名称(这是在WordPress仪表板中定义的),然后显示信息,如条目标题、页面名称或当前选定的类别。在页面标题和页面名称之间,它将显示“>”字符。实际上,它看起来像是“你的博客>你的网页”。这可以通过重新排列这两个标记,或者通过在wp_title.

接下来,wp_head必须添加标记,这将添加一些有关网站的关键信息,如当前WordPress版本和与当前显示的页面相关的任何RSS提要。这个变量非常简单:

<?php wp_head(); ?>

最后,标题必须定义一个pingback URL,并且它必须包括当前主题的样式表。这两行代码如下所示,并且必须放置在<head>标签:

<link rel="stylesheet" href="" type="text/css" media="screen" /><link rel="pingback" href="" />

现在可能是将主题包含的样式表文件重命名为名称的适当时机。stylesheet.css,这是将其放置在WordPress主题文件夹中的标准约定。现在是时候跳到下载的主题索引页的底部来定义页脚了。

用页脚关闭HTML文件

在文本编辑器中创建一个新的空白文件并将其命名为footer.php。在这个文件中,放置位于主内容区域下面的所有内容(主体和侧栏,或类似的功能)。这将包括基本的版权信息、主题作者信用以及</body></html>标签。请记住,您可以修改此页脚中的信息,以便删除作者的信用(尽管这不是很好),并插入您的站点的名称和版权信息。此外,必须将wp_fount变量放置到此文档中。在这里可以看到这个变量:

<?php wp_footer(); ?>

随着您的网站的信息添加到页脚,加上WordPress页脚标签到混合,是时候保存文档并关闭它。它现在可以和成品放在一起了。header.php文件和重命名的stylesheet.css在主题的包含文件夹中的文件。

创建WordPress页面的主要内容区域

到目前为止,主题已经放置在自己的文件夹中,其中现在包含了一个页眉、一个页脚和一个样式表。这实际上是将一个非WordPress主题分割成一个与软件的动态变量和PHP包含的主题一起工作的最困难的部分。接下来的两个步骤只需创建并包含一个侧边栏,并将标准WordPress循环引入主内容区域,以便读者可以查看条目、档案、类别和标签。

对于侧栏来说,事情很简单。定位当前侧栏代码(但不定位包含<div>标记)并将其从文件中删除,就像对页眉和页脚所做的操作一样。将该信息粘贴到名为sidebar.php它应该使用纯文本编辑程序创建,如本指南的前面步骤所示。根据您的喜好修改此侧栏的实际XHTML内容,然后添加以下代码,以便在此内容区域内放置WordPress小部件:

<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar() ) : endif; ?>

保存侧边栏文件,因为它现在已经完成,可以与主题的其他文件一起上传。接下来,返回到主题的主索引文件。这将成为index.php文件中的WordPress主题,并且也将保存为single.php, page.php, category.php,archive.php。由于这些模板通常打印相同的信息并具有统一的外观,因此index.php模板可以简单地用于提供它们的基本形式和功能。

需要做的第一件事是包含刚刚创建的WordPress侧边栏文件。这是通过使用标准WordPress变量来完成的。在侧边栏内容一旦定位的地方,只需粘贴以下简短变量即可动态调用sidebar.php您创建的文件:

<?php get_sidebar(); ?>

非那样做不行。侧边栏现在被调用并包含在每个WordPress页面中。现在,唯一剩下的就是将标准WordPress循环引入模板中,以便能够向最终用户显示条目、类别和其他信息。WordPress循环以最基本的形式出现,如下所示。

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?><h2 class="title"></h2>Posted on by<span class="the-content"><?php the_content(); ?></span><p>Posted in <?php the_category('; '); ?></p><?php endwhile; else: ?><p><?php _e('Sorry, there's nothing here for you to see!.'); ?></p><?php endif; ?>

使用大量WordPress变量可以极大地改变循环信息,对于那些不熟悉其可用的所有选项的开发人员来说,最好咨询WordPress Codex,以获得完整的文档,这些信息可以(而且应该)包含在循环中,哪些信息应该放在循环之外。但是,上面的示例将打印条目标题、日期、作者、内容和类别,并在用户到达已不存在或已移动到不同位置的帖子时提供错误消息。

模板文件中的一个小添加项

索引文件现在已经完成,可以作为WordPress主题使用,并且它已经保存为一个类别、存档页、单个条目页和动态内容页。它与页眉和页脚配对,所有这些文件都受制于主题样式表文件中的预定义信息,该文件已被重命名为stylesheet.css。一切似乎都结束了,但事实并非如此。现在必须做两件事。

第一个是创建一个注释模板,该模板包含读者在每个条目上提交的注释的默认外观。这个文件通常包含在WordPress主题中,但有时被排除在常规Web模板之外,而这些模板并不是作为博客而设计的。仔细阅读下载的主题附带的文件并搜索注释模板;如果存在注释模板,只需将WordPress注释变量放入注释循环中的模板中即可。如果不存在,那么是时候卷起袖子,从头创建一个评论模板了。

或者,在线有一些非常基本的、标准的注释模板,这些模板可以在这种情况下使用,并简单地包含在页面的主要内容区域中。确保只承担你的技能所能处理的设计承诺。

最后,主题必须上传并测试是否有任何bug。记住,这不是WordPress固有的主题,您的编码在某些地方可能是不准确的,或者您可能忘记在其他地方插入标记。确保整个程序集结合在一起,功能和外观一样好。这样的话,工作就完成了,下载的模板已经成功地转换成了一个令人惊叹和独特的WordPress主题。


最新案例

寒枫总监

来电咨询

18868949445

微信咨询

寒枫总监

TOP