如何免费将 HTML 网站转换为 WordPress? 指导
已发表: 2015-05-18一开始,所有网站都是用文本和静态 HTML 制作的。 没有 WordPress,需要将 HTML 网站转换为 WordPress或任何其他 CMS 系统。
许多企业仍然依赖简单的 HTML 网站来进行在线业务。 这些 HTML 站点本质上通常是静态的。 这意味着即使更改网站上的一个小细节也是通过编辑编码文件来完成的。
现在 20 多年后,网络是一个大不相同的地方。 WordPress 为超过 25% 的 Web 提供支持,正日益成为普通用户的首选内容管理系统 (CMS)。
网站要复杂得多。 它们为网站创建者和访问者提供了更丰富、更愉快的体验。 迁移到 WordPress 是否意味着重新开始并失去投入当前网站的所有时间、精力和金钱?
HTML 网站
无论您的网站是如何编码的,一旦访问者在您的网站上加载了一个页面,浏览器就会获取所有的点点滴滴(服务器端包含、来自另一个目录的图像等)并将它们全部放在一个最终的静态 HTML 中页。
即使页面上的某些元素仍然是动态的,代码本身也集中在一个位置,可以将其移动到仍然可以工作的 WordPress 页面中。 可能有一些例外,但对于大多数网站来说,这是真的。
即使您的站点由 somepage.php 组成,它调用名为 header.inc 的文件和名为 footer.php 的文件,当用户在浏览器中查看 somepage.php 时,生成的源代码都在一个地方,就好像它被手工编码为静态 HTML 页面。
这是将网站转换为 WordPress 所需的代码类型。 任何拥有 WordPress 安装和正确主题/插件的人都可以拥有一个具有先进设计和功能的现代网站。
从静态 HTML 站点迁移到 WordPress 的预备步骤
如果您准备切换到 WordPress,请注意以下四个步骤:
1. 分析您现有的 HTML 站点
检查您的网站是否有不相关或过时的内容,如果找到,请将其清理干净。 检查当前的导航系统并思考如何改进它。 进行 HTML 站点分析将帮助您决定应将哪些内容、特性和功能迁移到 WordPress。
这将清楚地了解您需要安装哪些插件才能在 WordPress 平台上获得相同的功能。
2. 了解 WordPress
WordPress 安装是一个非常简单的过程。 大多数网络主机提供一键安装。 如果不熟悉,最好阅读并告知您的网站将使用的新平台。
3. 备份你的 HTML 站点
强烈建议对静态站点进行完整备份,以避免在迁移过程中出现任何数据丢失风险。
4. 将 HTML 网站转换为 WordPress
假设您有足够的编码知识,并且您的站点很小,那么您面前的最佳选择是将您现有的 HTML 代码分成四个部分(页眉、页脚、侧边栏和内容),然后将每个部分的内容复制到其各自的 PHP 文件。
如果您的网站很大,您可以利用 HTML 到 WordPress 插件,如 HTML Import 2 或聘请某人将 HTML 转换为 WordPress。
如何将 HTML 网站转换为 WordPress 教程
您选择如何将静态 HTML 站点转换为 WordPress 站点无疑取决于您的个人偏好、所需的时间/金钱投资以及代码技能水平。
方法一
使用这种将 HTML 网站转换为 WordPress 的方法,您将保持网站的相同设计和外观。
1.从您当前的主机下载 HTML 页面。 使用 WinHTTrack 执行此操作。 这是一个很棒的免费工具,非常易于使用。 确保你也抓取了图片文件夹(或者你在旧网站上有图片的任何地方)。
2.在您的新网络主机上安装 WordPress 。
- 将您的永久链接结构设置为“帖子名称”(/%postname%/)
- 选中“不鼓励搜索引擎将此站点编入索引”框(直到一切都完成)
- 安装一些维护模式插件(如果你愿意),这样除了你之外没有人可以访问你的新 WordPress。
- 安装免费的 WordPress 插件 HTML Import 2。使用它来“上传”旧站点到您的新站点。 导入整个 HTML 页面目录的用户指南。
3.将您刚刚从步骤 1 下载的内容上传到您的新 Web 主机文件结构中。 将它们放在一个名为“html-files-to-import”的文件夹中。 将所有旧图像上传到新网站上 WordPress 中的媒体库。
4. 运行导入
5. 准备你的 DOS 命令提示符和 Excel
- 在 DOS 提示符下,导航到您放置 HTML 文件的位置(最简单的方法是将它们放在名为“yourwebsite”的文件夹中,然后将该文件夹放在 C:\ 驱动器中)。 然后,启动此命令: i. 目录 > 文件.txt
- 在 Excel 中打开 files.txt 文件。
- 现在到 Excel。 本质上,您将使用几个 Excel 函数,包括“连接”来呈现您将放入 HTML 文件中的“规范”代码。
- 在每个 HTML 文件中放置相应的规范代码。 您可以这样做,将其租给外包商,或聘请某人编写可自动执行此操作的 PHP 代码。
6. 将 HTML 文件上传到您的网络主机。 将它们放在新网站的 ROOT(即最上层)文件夹中。 不要忘记将图像文件夹也上传到 ROOT。
7. 确保一切在新站点上仍然有效。
8. 取消选中第 2 步中的复选框– “禁止搜索引擎将此站点编入索引”并禁用 HTML 导入 2 插件。
9.在您的注册商处更改 DNS 。
10. 确保您站点的 URL解析为正确的 IP(您的新 IP 而不是旧 IP)并且所有页面都正确加载。 您可能需要等待几个小时才能更新名称服务器。
11. 您可以稍后删除旧的 HTML页面,但没有任何必要。 您不会受到“重复内容”惩罚的影响,因为规范引用会解决这个问题。
您需要在 .htaccess 文件中添加重定向,将旧的“.html 页面”指向新的 WordPress 页面。
方法二
如果您的目标不仅是将静态 HTML 站点的内容导入 WordPress,还要复制当前的设计,这意味着您需要创建自定义主题。
它只涉及创建几个文件夹和文件,进行一些复制和粘贴,然后上传结果。 您将需要一个代码编辑器,例如 Sublime 或 Notepad++,并且可以访问您的 HTML 站点目录和新的 WordPress 安装目录。
1.创建一个新的主题文件夹和必要的文件。 在您的桌面上,创建一个新文件夹来保存您的主题文件。 将它命名为您希望识别主题的任何名称。
接下来,在您的代码编辑器中创建一些文件(它们都在您的新主题文件夹中):
- 样式文件
- 索引.php
- 头文件
- 侧边栏.php
- 页脚.php
2. 将现有的 CSS 复制到新的样式表 如果您想复制一个设计,这可能意味着您至少有一些要保存的 CSS。 因此,您要编辑的第一个文件是 Style.css 文件。
首先,将以下内容添加到文件顶部。
/* 主题名称:替换为您的主题名称。 主题 URI:您的主题的 URI 说明:简要说明。 版本:1.0 作者:你 作者 URI:您的网站地址。 */
在本节之后,只在下面粘贴您现有的 CSS。 保存并关闭文件。
3. 分离你当前的 HTML
这是将现有代码的一部分剪切和粘贴到您创建的不同文件中的过程。
- 首先,打开您当前站点的index.html文件。 突出显示从文件顶部到开头div class="main"标记的所有内容。 将此部分复制并粘贴到header.php文件中,保存并关闭。
- 返回到您的index.html文件。 突出显示side class="sidebar"元素和其中的所有内容。 将此部分复制并粘贴到您的sidebar.php文件中,保存并关闭。
- 在您的index.html 中选择侧边栏之后的所有内容并将其复制并粘贴到您的footer.php文件中,保存并关闭。
- 在您的index.html文件中,选择剩下的所有内容(这应该是主要内容部分)并将其粘贴到您的index.php文件中。 保存,但不要关闭。 但是,您现在可以关闭index.html文件并继续执行最后的步骤。 快完成了!
4.完成Index.php文件
要完成新主题的 index.php 文件,您需要确保它可以调用位于您创建的其他文件中的其他部分(除了主要内容)。
在 index.php 文件的最顶部,放置以下 php 行。
<?php get_header(); ?> |
然后,在 index.php 文件的最底部,放置这些 php 行。
<?php get_sidebar(); ?> |
<?php get_footer(); ?> |
现在你有了“循环”。 这是 WordPress 用来向访问者显示您的帖子内容的主要 php 位。 因此,创建新主题的 index.php 文件的最后一步是在内容部分添加以下代码。
<?php if ( have_posts() ) : ?> |
<?php while ( have_posts() ) : the_post(); ?> ( have_posts() ) : the_post(); ?> |
<div id= "post-<?php the_ID(); ?>" <?php post_class(); ?>> <?php post_class(); ?>> |
<div class = "post-header" > |
<div class = "date" ><?php the_time( 'M j y' ); ?></div> ); ?></div> |
<h2><a href= "<?php the_permalink(); ?>" rel= "bookmark" title= "Permanent Link to <?php the_title_attribute(); ?>" ><?php the_title(); ?></a></h2> ><?php the_title(); ?></a></h2> |
<div class = "author" ><?php the_author(); ?></div> ><?php the_author(); ?></div> |
</div><!-- end post header--> |
<div class = "entry clear" > |
<?php if ( function_exists( 'add_theme_support' ) ) the_post_thumbnail(); ?> ) ) the_post_thumbnail(); ?> |
<?php the_content(); ?> |
<?php edit_post_link(); ?> |
<?php wp_link_pages(); ?> </div> |
<!-- end entry--> |
<div class = "post-footer" > |
<div class = "comments" ><?php comments_popup_link( 'Leave a Comment' ><?php comments_popup_link( 'Leave a Comment' , '1 Comment' , '% Comments' ); ?></div> ); ?></div> |
</div><!-- end post footer--> |
</div><!-- end post--> |
<?php endwhile ; /* rewind or continue if all posts have been fetched */ ?> |
<div class = "navigation index" > |
<div class = "alignleft" ><?php next_posts_link( 'Older Entries' ); ?></div> ); ?></div> |
<div class = "alignright" ><?php previous_posts_link( 'Newer Entries' ); ?></div> ); ?></div> |
</div><!-- end navigation--> |
<?php else : ?> |
<?php endif ; ?> ; ?> |
保存您的index.php并关闭。 您的主题现已完成! 剩下的就是将其上传到您的 WordPress 网站。
5. 上传您的新主题
现在,您将在新的主题文件夹中存储创建的主题文件。 安装 WordPress。
将您的新主题文件夹放在/wp-content/themes/ 中。 导航到WP Admin > Appearance > Themes ,您应该会在那里看到新创建的主题。 激活它! 此时剩下要做的就是用旧网站的内容填充新的 WordPress 网站。
6. 将内容从 HTML站点复制到 WordPress
在 WP Admin 中,转到插件 > 添加新。 搜索 Stephanie Leary 的名为 HTML Import 2 的插件。 安装并激活此插件后,请按照其用户指南导入您的整个 HTML 页面目录。 在此之后,您的网站应该看起来像以前一样,只是在 WordPress 上运行。
使用现有的 WordPress 主题转换 HTML 站点(最简单的方法)
如果上述步骤看起来过于密集或耗时,还有另一种方法。 这是最简单的方法。
无需将现有的 HTML 设计转换为在 WordPress 上看起来相同,您可以利用 WordPress 市场中提供的数千个主题中的任何一个。
有免费主题和高级主题。 一旦你选择了你喜欢的主题(并下载了它的压缩文件包),安装/激活你的新 WordPress 主题。
完成此操作后,您将拥有一个新的 WordPress 网站和主题。 当您预览您的网站时,它将是空的。 是时候导入内容并完成将 HTML 网站转换为 WordPress 网站的过程了。
在 WP Admin 中,转到Plugins > Add New并搜索名为 HTML Import 2 的插件。按照用户指南导入您的整个 HTML 页面目录。 在此之后,您将拥有所有旧内容,但外观焕然一新。
4 使用主题匹配器将 HTML 转换为 WordPress
您也可以使用主题匹配器。 它提供自动 HTML 到 WordPress 的转换。 只需输入您的站点并选择适当的区域。 Theme Matcher 从您现有的网站获取图像、样式和布局。
5 HTML 到 WordPress 转换器服务
HTML to WordPress 将您的 HTML 设计转换为 WordPress 主题,而无需您编写一行 PHP 代码。
您可以选择服务计划,他们会将您的静态 HTML 网站转换为 WordPress。 此选项可以增加价格。 您还可以选择更便宜的转换器选项。
转换是完全自动化的,只需将“wp-”前缀转换器类添加到 HTML 中即可扩展主题的功能。
转换器为每个 HTML 文件创建模板并引用您的资产并填写所有那些必要的 php 函数。 使用 Bootstrap、Webflow、Dreamweaver 或任何您已经熟悉的工具/框架来创建网站。 只要网站是使用 HTML 制作的,您就可以将其转换为主题。
迁移后需要做什么?
转换完成后,您需要做一些事情来为您的 WordPress 网站提供最后的润色。
- 安装必要的插件 –要使用与 HTML 站点相同的功能来增强您全新的 WordPress 站点,请安装您觉得方便的插件。
- 检查并修复损坏的链接 -检查您的网站是否有损坏的链接(404 错误),如果找到,请修复它们。
- 设置自定义 404 错误页面 –添加自定义 404 错误页面以将访问者带到 WordPress 网站的相关部分,以防他们尝试访问任何不存在的 URL。
- 重定向链接 –要通知搜索引擎您的网站内容已移至新网址,请设置 301 重定向。 为此,您可以使用简单 301 重定向。
- 启用搜索引擎索引:转到 WordPress 仪表板中的“设置 –> 阅读”,然后选中“允许搜索引擎为此站点编制索引”以使您的站点被搜索引擎索引。
- 生成并提交 XML 站点地图:为确保您的站点尽快包含在搜索引擎结果中,请创建一个 XML 站点地图并将其提交给 Google。
WordPress 与 HTML – 优缺点
启动商业网站并不是一个简单的过程。 最大的困境之一是选择静态 HTML 站点还是选择 WordPress。
WordPress – WordPress 被认为是一个 CMS(内容管理系统)。 简化的 HTML 版本,供非技术用户添加和修改其网站上的内容。
CMS 站点通常是动态的,这意味着您更改内容的频率没有限制。 您可以更改从图片到整个文本的所有内容。
界面非常简单和用户友好,没有人需要任何特殊的培训来学习它。 CMS 市场竞争激烈,但 WordPress 每次都击败竞争对手。
在开始之前要记住的另一件事是 WordPress.com 与 WordPress.org 之间存在显着差异,因为后者是一个开源 CMS。 另一方面,WordPress.com 用作博客托管服务。
使用 WordPress 的优势:
- 它为您提供了数以千计的插件来为站点添加它所缺少的功能。
- 随时可以修改,没有人限制你。
- 与 HTML 设置相比,WordPress 的设置时间要少得多。
使用 WordPress 的缺点:
- 你不能只是设置它,然后忘记它。 它需要全职关注并不断更新软件、插件和主题。
- 黑客将攻击保护不力且未更新的网站。 如果您不跟上更新,您可能会面临网站根本无法运行的风险。
- WordPress 很简单,但对于初学者来说并不容易。 有许多在线教程和综合材料可以帮助您克服学习曲线。
HTML 静态网站——在没有模板之类的东西之前,制作网站的唯一方法是聘请编程专业人士为您制作。
因此,所有网站都构建为静态 HTML(超文本标记语言)。 重点是要有一个网站。 不要修改内容或其布局,因为您将不得不重新雇用 HTML 开发人员。
在 HTML 网站上,内容存储在静态文件中,这使得修改它非常困难。
HTML网站优势:
- 网站上线后,您无需对其进行更新或备份。 大多数情况下,该网站上的任何内容都无需更改。
- HTML 网站是基本且易于设置的网站。
- 它们的大小以及它们使用的资源比动态站点少的事实使它们与动态站点相比具有显着的速度优势,从而使它们加载速度更快。
HTML网站的缺点:
您需要专业的标记语言。 否则,您将无法对您的网站进行任何重大更新。 一遍又一遍地雇用 Web 开发人员会产生成本,即使您的网站很小,或者只显示微不足道的信息。
另一个重要的缺点是您无法添加插件,这意味着您面临着严重缺乏功能的问题。
如何将 HTML 转换为 WordPress 摘要
无论是需要从您的网站获得更多内容还是使用模板构建新网站,转换过程对于新手来说似乎都非常复杂。 耐心和知识会让你做你需要做的事情,并取得一定程度的成功。
一旦您的网站上线,您就可以为自己学会了如何做一些新的事情并能够将这些知识应用到您的网站而感到自豪。
希望以上至少一种方法可以帮助您将 HTML 网站转换为 WordPress。 如果您有任何其他方法或教程,请告诉我。 您是否曾经将 HTML 转换为 WordPress ,您对此有何经验?