2013-05-20 2 views
0

Итак, я просто занимаюсь программированием, чуть более месяца. Я начинаю с Javascript. На данный момент, моей целью является получить небольшое веб-приложение онлайн (вместо того, чтобы просто открывать локальные файлы с браузерами, как я в настоящее время). У меня есть собственное доменное имя, услуга хостинга и использование Wordpress в блоге.Страницы WordPress, как загрузить динамические HTML-страницы

Я прочитал codex.wordpress.org/Pages на Wordpress, который, кажется, указывает, что я могу добавить дополнительные веб-страницы в свой Wordpress. К сожалению, это и другие статьи не приблизили меня к моей цели.

Так вот некоторые конкретные условия, обо мне и моей работе:

  1. Here является моим мерзавец в моем веб-приложение. Это динамичная викторина.
  2. Dreamhost - это мой веб-хостинг и где я купил свой домен.
  3. Мой WordPress сайт www.briandavishall.com

Я застрял, какие должны быть мои дальнейшие шаги, я действительно не знаю, с чего начать. Я был бы признателен за некоторые рекомендации о том, что я должен делать, что мне нужно, чтобы научиться достигать моей цели, и любые рекомендации по ресурсам, если они существуют.

Редактировать: Вот что я сделал при первой неудачной попытке.

1.Вставьте следующий код в файл <head> файла header.php.

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

2.Linked/писал в <head> страницы я написал свой HTML сценарий. Как вы можете видеть here, ничего не происходит, нет динамического викторины:

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

3.I утра до сих пор не уверены в том, как сделать файл CSS. Я хочу, чтобы это был отдельный файл, который я связываю с html-скриптом, вместо того, чтобы переделывать существующий CSS, который я хочу, чтобы остальная часть моего блога следовала. Я еще не потратил достаточно времени на это, теперь делаю это. Обновление прийти

Update 2

смущению, я до сих пор не может достичь своей цели. Я следовал предложенному советом Дейву. Я добавил две строки кода к теме, которую я использую (тема 2012), со ссылкой на правильный локальный адрес на моем компьютере. Я также использовал те же ссылки в своем html-коде, который я добавил на страницу wordpress через текстовый редактор (а не визуальный редактор). См. Комментарии ниже.

ответ

0

Не на 100% уверены, чего вы пытаетесь достичь, но если я правильно понял, вы хотите добавить свое пользовательское приложение в свой блог Wordpress правильно?

Ну, есть 3 части к нему.

  1. Создать разметку - HTML.Просто добавьте новую страницу/сообщение в Wordpress и добавьте свою разметку HTML в редактор: убедитесь, что вы переключились на «текст», а не по умолчанию, который является «визуальным»

  2. Импортируйте свой CSS - это так же просто а с помощью редактора стилей в WordPress: Appearance>Editor>Style.css или вы могли бы просто жопу свой CSS в корневом каталоге, иначе папку темы, а затем style.css

  3. Javascript: Добавление Javascript так же легко. Вы можете просто добавить теги вашего JS-файла в файл header.php темы. Если у вас возникли проблемы с этим, прочитайте следующую запись: http://codex.wordpress.org/Using_Javascript

UPDATE:

Я думаю, что вы делаете это слишком сложно.

HTML:

Ваш HTML Вставляется в текстовый редактор Wordpress (внутри WordPress, под страницу блога/пост, где вы хотите, чтобы ваш тест отображается) - Сделайте Суер вкладку на «Текст», а не «Визуальный ».

CSS и JS:

Вместо того, чтобы добавить ваш CSS в файл style.css, вы можете просто связать свои CSS и JS файлы в header.php файл

Вот заголовок .php файла для темы twentytwelve: Вы можете сделать Сэм для темы header.php файл .. Смотрите мой код прямо над закрывающим тегом

<?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> 

Просто убедитесь, что ваши пути к вашим файлам верны ...

+0

Это то, что я ищу, но я должен признать, что у меня все еще есть проблемы. В настоящее время отображается только html, а JS-скрипт и CSS не связаны. – user2279081

+0

Где вы разместили свой JS/CSS? Ваш CSS должен быть помещен в файл style.css. Его можно найти в папке темы (какую тему вы используете?), Или вы можете просто найти ее в разделе «Внешний вид»> «Редактор». Поместите свой CSS-код в самую нижнюю часть листа. Ваш JS можно поместить в файл header.php в папке темы. Он будет в корне папки темы. Я вижу, что вы не используете jQuery, поэтому нет необходимости обертывать JS в тегах jQuery ... Просто введите теги скрипта внутри в header.php, тем не менее, footer.php темы. – DextrousDave

+0

Дэйв, ты качаешься за помощь! Я оставил обновление того, что я сделал как редактирование выше. Я думаю, мой самый большой вопрос: какой синтаксис я использую, чтобы поместить CSS/JS в файл style.css file/header.php? И как это можно назвать в моем коде HTML-кода. – user2279081

Смежные вопросы