WordPress页面，如何上传动态HTML页面

Question

Ok, so I am just getting into programming, a little over a month so far. 好的，到目前为止，我才刚刚开始编程。 I am starting with Javascript. 我从Java语言开始。 At the moment, my goal is to get a small web application online (instead of just opening the local files with browsers as I currently am). 目前， 我的目标是使一个小型Web应用程序联机 （而不是像我目前那样仅使用浏览器打开本地文件）。 I have my own domain name, a hosting service, and use Wordpress to blog. 我有自己的域名，托管服务，并使用Wordpress撰写博客。

I read codex.wordpress.org/Pages on Wordpress which seems to indicate I can include additional webpages on my Wordpress. 我在Wordpress上阅读了codex.wordpress.org/Pages，这似乎表明我可以在Wordpress上添加其他网页。 Unfortunately that, nor other articles, have not gotten me closer to my goal. 不幸的是，这以及其他文章都没有使我更加接近我的目标。

So here is some specific context about me and my work: 因此，这是关于我和我的工作的一些具体情况：

Here is my git to my web application. 这是我的Web应用程序的git。 It is a dynamic quiz. 这是一个动态测验。
Dreamhost is my web hosting service and where I bought my domain through. Dreamhost是我的网络托管服务，也是我通过其购买域名的地方。
My wordpress site is www.briandavishall.com 我的wordpress网站是www.briandavishall.com

I am stuck as to what my next steps should be, I really don't know where to start. 我对下一步应该做什么感到困惑，我真的不知道从哪里开始。 I would appreciate some guidance on what I should do, what I need to learn to accomplish my goal, and any resource recommendations if they exist. 对于我应该做的事情，实现我的目标所需学习的知识以及任何资源建议（如果存在），我将不胜感激。

Edit: Here is what I did on my failed first attempt. 编辑：这是我对失败的第一次尝试所做的。

1.Added the following code to the <head> of the header.php file. 1.将以下代码添加到header.php文件的<head>中。

<?php wp_enqueue_script( "DynamicQuizJS" , plugins_url( ~/Documents/Coding/DynamicQuiz/DynamicQuizJS.js);); ?>

2.Linked/wrote this in the <head> of the page I wrote my HTML script. 2.在我编写HTML脚本的页面的<head>中链接/写了这个。 As you can see here , nothing happens, there is no dynamic quiz : 如您在这里看到的，什么都没有发生，没有动态测验：

<script type="text/javascript" src="DynamicQuizJS.js"></script>

3.I am still unsure of how to do the CSS file. 3.我仍然不确定如何制作CSS文件。 I want it to be a separate file that I link the html script to as opposed to tinkering the existing CSS that I want the rest of my blog to follow. 我希望它是一个单独的文件，可以将html脚本链接到该文件，而不是修改现有CSS，而我希望博客的其余部分都可以使用该CSS。 I haven't spent enough time figuring this out yet, am doing so now. 我还没有花足够的时间来解决这个问题，现在正在这样做。 Update to come 即将更新

Update 2 更新2

Embarrassingly, I still cannot accomplish my goal. 令人尴尬的是，我仍然无法实现我的目标。 I followed the suggested advice by Dave. 我遵循了戴夫的建议。 I added the two lines of code to the theme I am using (the 2012 theme) with a link to the correct local address on my computer. 我在正在使用的主题（2012年主题）中添加了两行代码，并带有指向计算机上正确的本地地址的链接。 I also used the same links in my html code that I added to a wordpress page via the text editor (not the visual editor). 我还使用了通过文本编辑器（而非可视化编辑器）添加到wordpress页面的html代码中的相同链接。 See comments below for more detailsl 有关更多详细信息，请参见下面的评论。

Answer 1

Not 100% sure what you are trying to accomplish, but if I understand correctly you want to add your custom app into your wordpress blog right? 不能100％确定您要完成的工作，但是如果我理解正确，您想将自定义应用添加到您的wordpress博客中，对吗？

Well, there are 3 parts to it. 好吧，它分为三个部分。

Create the markup - HTML. 创建标记-HTML。 Just add a new page/post in Wordpress and add your HTML markup into the editor: Make sure you switch to 'text', and not the default, which is 'visual' 只需在Wordpress中添加一个新页面/帖子，然后将HTML标记添加到编辑器中即可：确保切换到“文本”，而不是默认设置，即“视觉”
Import your CSS - This is as easy as using the style editor inside wordpress: Appearance>Editor>Style.css or you could just ass your css in the root directory, aka theme folder and then style.css 导入Appearance>Editor>Style.css这就像在wordpress中使用样式编辑器一样容易： Appearance>Editor>Style.css或者您可以将CSS放在根目录中，又是主题文件夹，再放在style.css中
Javascript: Adding Javascript is just as easy. Javascript：添加Javascript同样简单。 You could just include the tags of your JS file into the header.php file of the theme. 您可以只将JS文件的标签包含到主题的header.php文件中。 If you are having issues with that, read the following post: http://codex.wordpress.org/Using_Javascript 如果您对此有疑问，请阅读以下文章： http : //codex.wordpress.org/Using_Javascript

UPDATE: 更新：

I think you are making this too complicated. 我认为您使这一过程变得太复杂了。

HTML: HTML：

Your html gets inserted into the Wordpress text editor(inside wordpress, under the blog page/post where you want your quiz displayed) - Make suer the tab is on "Text" and not "Visual". 将您的html插入到Wordpress文本编辑器中（在wordpress内部，您要显示测验的博客页面/帖子下）-使suer选项卡位于“文本”而不是“可视”上。

CSS and JS: CSS和JS：

Instead of adding your CSS to your Style.css file, you can just link BOTH your CSS and JS files in the header.php file 无需将CSS添加到Style.css文件中，只需在header.php文件中链接CSS和JS文件即可

Here is the header.php file for the twentytwelve theme: You can do the sam for your themes header.php file.. See my code just above the closing head tag 下面是twentytwelve主题header.php文件：您可以为您的主题header.php文件.. 看到刚刚结束标记上面我的代码做SAM

<?php
/**
 * The Header for our theme.
 *
 * Displays all of the <head> section and everything up till <div id="main">
 *
 * @package WordPress
 * @subpackage Twenty_Twelve
 * @since Twenty Twelve 1.0
 */
?><!DOCTYPE html>
<!--[if IE 7]>
<html class="ie ie7" <?php language_attributes(); ?>>
<![endif]-->
<!--[if IE 8]>
<html class="ie ie8" <?php language_attributes(); ?>>
<![endif]-->
<!--[if !(IE 7) | !(IE 8)  ]><!-->
<html <?php language_attributes(); ?>>
<!--<![endif]-->
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<meta name="viewport" content="width=device-width" />
<title><?php wp_title( '|', true, 'right' ); ?></title>
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
<?php // Loads HTML5 JavaScript file to add support for HTML5 elements in older IE versions. ?>
<!--[if lt IE 9]>
<script src="<?php echo get_template_directory_uri(); ?>/js/html5.js" type="text/javascript"></script>
<![endif]-->
<?php wp_head(); ?>

/*The Only part I added:Below*/
/************Just add your files here below******************/
<link href="yourstylesheet.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="yourJSfile.js"></script>

</head>

Just make sure your paths to your files are correct... 只要确保您的文件路径正确无误...

WordPress页面，如何上传动态HTML页面

问题描述

1 个解决方案

解决方案1
0 已采纳 2013-05-20 13:26:28

WordPress页面，如何上传动态HTML页面

问题描述

1 个解决方案

解决方案1 0 已采纳 2013-05-20 13:26:28

解决方案1
0 已采纳 2013-05-20 13:26:28