将静态网站转换为WordPress主题并导入所有现有内容

时间:2016-07-27 作者:Josip Ivic

我有一个网站是用html, cssjavascript 并且没有CMS。它看起来很棒,我的客户希望该网站的后台有wordpress,这样他就可以轻松地修改内容。所以,我有点被困在这里了。

我知道有一些插件可以导入写得很好的html,它们工作起来很有魅力。但是,我从来没有做过这种迁移。如何将整个网站转移到wordpress?有没有一种方法可以对整个网站进行自动抓取,并且可以很容易地导入js库,这样我就可以保留html中的所有类、div或span标记、css中的样式等?

2 个回复
最合适的回答,由SO网友:kaiser 整理而成

WordPress有一个完美的HTML>主题转换包装器:主题本身。可以找到所有信息in the Codex page.

只需将文件夹添加到wp-content/themes 目录(或除此之外注册的任何目录),并添加以下文件

  1. functions.php
  2. style.css
  3. index.php
  4. header.php
根据您的习惯themename 文件夹然后使用Plugins API 将一些回调附加到WordPress core的执行流中。这是定义基本内容的地方,例如添加样式表或脚本。您的示例functions.php:

add_action( \'wp_enqueue_scripts\', function() {
    // Register Stylesheets and Scripts in here
    // @link https://developer.wordpress.org/reference/functions/wp_enqueue_script/
} );
在您的header.php, 添加HTML的开始调用:

<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
    <?php wp_head(); ?>
</head>
Thewp_head(); 函数调用所有操作,这就是您注册的脚本和样式表将出现的地方。

在你身上index.php, 您将添加正文标记:

<?php get_header(); ?>
<body <?php body_class(); ?>>
    <!-- Markup from your HTML files -->
    <?php get_footer(); ?>
</body>
Theget_footer(); 函数将调用footer.php 文件(如果包括)。

最后,您只需添加Page templates 替换原始PHP文件。这些与index.php 除了一件事:标题注释。假设您添加了index.php, 将其重命名为about-us.php 并添加以下内容作为第一行:

<?php /** Template Name: About Us */ ?>
现在,当您在管理UI中添加一个新页面时,您可以选择这个新模板,您将有一个替换文件来替换一些现有的HTML文件。您甚至可以在管理UI页面编辑屏幕中调整slug。

所有这些都应该为您将HTML模板转换为有效的WordPress主题提供一个良好的开端。您可以稍后根据您的合同一点一点地将这些模板动态化,例如通过拆分重复的边栏,使菜单可调整,change the titlethe content.

SO网友:Andy Macaulay-Brook

这是可以做到的,你可以做一个快速(相对)的工作或花更多的时间在一个更好的网站->WP转换。我假设你可以写一个主题,否则这篇文章就会变成一整本书。如果不是的话,他们有很多在线指南&;你不需要成为一个完整的主题专家就可以开始这个转换。我们可以根据你的舒适程度调整我的答案。

这里有一种方法可以快速完成主转换,但将样式和脚本的适当包含等工作留到以后再做。从一开始到现在,你可能更喜欢做一份更严格的工作。

第1步-将站点放入WP中,希望您的HTML在整个站点中非常一致,并且您可以轻松识别常见的页眉和页脚。第一步是使用以下文件创建一个新主题:

风格css-您现有网站的样式,并添加适当的主题标题。php—headerfooter的HTML。php—页脚索引的HTML。php-标准WP索引。正确调用页眉和页脚的php

如果你的布局中有任何明显的边栏在整个站点中重复,那么也可以加入一些边栏文件。

确保页眉和页脚包含对wp\\u head和wp\\u footer的强制调用。作为检查表,您可以随时关注WP开发指南。

查看主页内容、页面标题和大部分内容的HTML结构。您希望将所有结构化HTML都放入模板中,这样将来就不会依赖于编辑内容的人来编写HTML。当您在一个关键页面(如果主页像通常那样有自己的布局,则不是主页)中标识了页面标题和内容后,您可以使用包含对\\u标题、内容的正确调用的循环来替换这些区域中的文本。您可以现在或在第一次转换后分离任何元数据,这是基于您的内容和处理方式的选择。

用您刚刚替换的标题和内容创建一个页面,看看它是什么样子!

您不会以“WordPress方式”引入JavaScript和样式,但这可以在以后实现。在这个阶段,只需确保主题中对它们的引用仍然可以解决问题,如果不能解决问题,请修复它们。

第2步-将HTML网站内容输入WordPress,我已经让人们在小型网站上手动执行此操作。工作正常。我也用过Stephanie Leary的HTML Import 2 但如果愿意,您可以在插件库中搜索其他插件。

如果您的站点包含的内容应该是帖子,甚至是自定义帖子类型,而不是页面,那么请批量导入并使用帖子类型转换器-John James Jacoby\'s 对我来说效果很好,我一直认为一个来自核心贡献者的插件可能会很好地工作。

现在,你应该有一个大致的工作站点,在这个阶段,它看起来像是一个写得很差的主题!接下来的改进包括正确编码nav,并以正确的方式包含样式和脚本,这是凯撒在回答这个问题时提到的。