Расширение функциональности сайта с помощью перевода сайта из HTML в PHP. После осуществления таких преобразований, вы сможете вставлять код PHP в код страниц сайта и он будет работать.
Сайт экспортированный из программы Adobe Muse представляет собой код HTML. В этом видеоуроке рассказывается о том, как преобразовать файлы и расширения файлов сайта и перевести его в PHP. Смотрите видео:
В этом видео уроке мы рассмотрим, как из сайта, экспортированного из Adobe Muse в HTML сделать сайт, который будет работать на PHP.
Из HTML в PHP. Обзор подготовленного примера.
Допустим, у нас есть вот такой сайт, который я уже подготовил. Здесь у меня три страницы. Первая страница выглядит вот так. Здесь у меня один графический блок, текстовый блок и кнопка перехода «На страницу 2» со ссылкой. Следующая страница «2», просто так и называется. И здесь кнопка есть «На страницу 3» переход. И третья страница называется «3» и кнопка перехода снова «На страницу 1». Вот такой небольшой сайт я сделал. Небольшой пример.
Из HTML в PHP. Экспорт сайта в HTML.
И мы переходим в меню «Файл», выбираем «Экспортировать как HTML». Я задал название сайту «html-php.ru». И разместил его в папку на своем локальном сервере: “C:OpenServerDomainshtml-php”. Я выбрал эту папку. Этот локальный сервер работает у меня с PHP. И для того, чтобы показать, что сайт будет работать, я размещаю его именно сюда. Нажимаю кнопку «ок» для экспорта файлов в HTML. И сейчас сайт сразу запустился из папки «html-php» для просмотра, но сейчас он запустился не с сервера, а просто как обычно из папки, в которую мы экспортировали наш сайт из программы Adobe Muse.
Сейчас, естественно, будет все работать. И все страницы у нас в формате HTML. Если мы сейчас попытаемся запустить сайт с сервера, я напишу здесь: «html-php», то вы увидит, что сайт у меня запустился с OpenServer на моем компьютере из папки «html-php». Далее мы переходим по страницам, у нас открываются страницы уже с моего локального сервера. И тоже все работает, но в формате HTML. Как же нам преобразовать сайт в PHP?
Из HTML в PHP. Экспорт в HTML. Переименование ссылок страниц.
Давайте сейчас зайдем в Adobe Bridge, в папку расположения нашего сайта и выберем здесь все три файла, которые у нас с расширением .html. Заходим в «Инструменты», выбираем «Пакетное переименование». И здесь выбираем в первом окошке просто «Текст». Здесь выбираем «Текущее имя файла», ничего не меняем. Далее выбираем новое расширение, пишем здесь .php. И в последнем блоке оставляем просто «Текст». И здесь тоже ничего не вводим. Таким образом, мы получаем текущее имя файла: index.html. Новое имя файла: index.php. будет обработано файлов 3. Нажимаем «Переименовать». И наши файлы переименуются в «index.php», «page-2.php2 и «page-3.php». Все файлы стали с расширением .php.
Теперь мы заходим снова на наш сервер и пытаемся запустить наш сайт. Наш сайт, естественно запускается. Первую страницу «index-php» наш сервер нашел, но при переходе на страницу «2», уже наш сервер не находит данную страницу, поскольку страницы «page-2.html» уже не существует. Она теперь с расширением .php. Нажимаем «enter». Вот теперь эта страница. На страницу «3» мы тоже не сможем перейти, поскольку тоже она у нас с расширением .html. Если мы напишем здесь .php, то мы перейдем на страницу «3». И точно также сможем вернуться на страницу «1», но не вернемся, поскольку у нас файл «index» с расширением тоже .php.
Из HTML в PHP. Переименование ссылок внутри страниц.
Для того, чтобы у нас все заработало, нам необходимо в самих файла «index.php», « page-2.php» и «page-3.php» поменять внутри все ссылки – все расширения с .html на .php. Это мы можем сделать в программе Brackets или в любом текстовом редакторе для редактирования. Например, если мы сейчас перейдем в папку на моем компьютере, где расположены данные файлы, и сможем открыть с помощью редактора, например, Notepad++ файл «index.php». Здесь мы заходим в «Поиск» и «Замена». И заменяем все расширения .html на .php. Выбираем здесь «Заменить все». И видим, что у нас изменилась только одна ссылка. Давайте посмотрим, где она была расположена, давайте найдем ее с помощью поиска опять же. Не «Замена», а «Поиск», пишем: «php», нажимаем «Искать далее». И вы видите, что ссылка, которая у нас назначена на кнопку href=”page-2.php” стала, была href=”page-2.html”.
Таким образом, нам нужно поменять все ссылки во всех трех файлах. Мы открываем точно также страницу «page-2» уже открываем, давайте в другом редакторе, в Brackets . Идем в «Поиск», далее «Заменить», нажимаем найти «.html» и заменить на «.php». И нажимаем «Все», нажимаем «Заменить» и видим, что в тексте замена произошла успешно. Нажимаем сохранить данный файл. То же самое мы должны были сделать там, я, наверное, не сохранил. Давайте я еще раз открою, нажимаю «Ctrl+S» для того, чтобы сохранить. И давайте отредактируем третий файл. Делаем то же самое: «Поиск», «Найти», «Заменить». Нашли «.html» и заменим на «.php». Нажимаем «Все» и нажимаем «Заменить». Произошла замена у нас в строке «35». Опять «page-3.html» заменилась на «page-3.php». Нажимаем снова сохранить этот файл.
Из HTML в PHP. Просмотр результата.
И давайте теперь снова зайдем на наш локальный сервер. Здесь у нас уже будет первый запускаемый файл «index.php». После перехода по кнопке «На страницу 2», у нас должна открыться страница «page-2.php». Так оно и есть, вот вы видите здесь расширение файла .php. И при переходе на страницу «3», у нас снова «page-3» с расширением .php. И снова переходим на страницу «1». Все у нас работает. Все ссылки работают. Сайт работает.
Из HTML в PHP. Другие программы Adobe для редактирования файлов.
У программы Adobe есть еще программа «Dreamweaver». В ней можно точно также автоматически поменять все ссылки внутри данных файлов. Таким образом, вы получите сайт, который будет работать с расширением .php.
На этом все, дорогие друзья. Этот урок закончен. Надеюсь, он был для вас полезен и некоторым из вас пригодится. Подписывайтесь на мой канал, ставьте лайки и пишите комментарии внизу к этому видео. И до встречи в следующих видеоуроках!
Автор видеоурока
Дмитрий Шаповалов
О преобразовании HTML в PHP
Конвертер HTML в PHP была создана для онлайн преобразования HTML в PHP код. Это может пригодиться для вывода HTML кода через функции печати PHP, используемые в большинстве PHP CMS и Фреймворках, таких как WordPress, Yii, Laravel и т. д. Символы кавычек и обратной косой черты будут соответствующим образом экранированы с помощью обратной косой черты, поэтому строки будут печататься правильно.
Как это работает?
Просто вставьте свой HTML код в текстовую область выше и нажмите кнопку «Конвертировать», и вы получите код с PHP echo или print операторами в следующей текстовой области.
Пример преобразования HTML в PHP
Исходные данные (До):
<html> <head> <title>Your Title Here</title> </head> <body bgcolor="FFFFFF"> <center><img src="wtools.jpg" align="bottom"> </center> <hr> <a href="http://wtools.io">Best Online Web Tools</a>is a link to another nifty site <h1>This is a Header</h1> <h2>This is a Medium Header</h2> Send me mail at <a href="mailto:[email protected]">[email protected]</a>. <p> This is a new paragraph!</p> <p> <b>This is a new paragraph!</b></p> <br> <b><i>This is a new sentence without a paragraph break, in bold italics.</i></b> <hr> </body> </html>
Конечный результат (После):
<?php echo '<html> <head> <title>Your Title Here</title> </head> <body bgcolor="FFFFFF"> <center><img src="wtools.jpg" align="bottom"> </center> <hr> <a href="http://wtools.io">Best Online Web Tools</a>is a link to another nifty site <h1>This is a Header</h1> <h2>This is a Medium Header</h2> Send me mail at <a href="mailto:[email protected]">[email protected]</a>. <p> This is a new paragraph!</p> <p> <b>This is a new paragraph!</b></p> <br> <b><i>This is a new sentence without a paragraph break, in bold italics.</i></b> <hr> </body> </html>';
Или:
<?php echo '<html>'; echo '<head>'; echo '<title>Your Title Here</title>'; echo '</head>'; echo ''; echo '<body bgcolor="FFFFFF">'; echo '<center><img src="wtools.jpg" align="bottom"> </center>'; echo '<hr>'; echo '<a href="http://wtools.io">Best Online Web Tools</a>is a link to another nifty site'; echo '<h1>This is a Header</h1>'; echo '<h2>This is a Medium Header</h2>'; echo 'Send me mail at <a href="mailto:[email protected]">[email protected]</a>.'; echo '<p> This is a new paragraph!</p>'; echo '<p> <b>This is a new paragraph!</b></p>'; echo '<br> <b><i>This is a new sentence without a paragraph break, in bold italics.</i></b>'; echo '<hr>'; echo '</body>'; echo '</html>';
После преобразования вы можете применить PHP код к своему проекту или использовать его для каких-то других целей.
PHP — это встраиваемый серверный язык программирования. Большая часть его синтаксиса заимствована из C, Java и Perl. А также добавлена пара уникальных характерных только для PHP функций. Основная цель этого языка — создание динамически генерируемых PHP HTML страниц.
- PHP в HTML
- PHP в HTML с помощью short_open_tag
- PHP в HTML с помощью short__tag
- HTML в PHP с использованием echo
- PHP в HTML — расширения файлов
- HTML в PHP
При создании сложных веб-страниц вы столкнетесь с необходимостью объединить PHP и HTML для реализации конкретных задач. На первый взгляд это может показаться сложным, так как PHP и HTML являются двумя независимыми дисциплинами, но это не так. PHP предназначен для взаимодействия с HTML, и его код может быть включен в разметку страницы.
В HTML-страницы PHP-код включается с помощью специальных тегов. Когда пользователь открывает страницу, сервер обрабатывает PHP-код, а затем отправляет результат обработки (не сам PHP-код) в браузер.
HTML и PHP довольно просто объединить. Любая часть PHP-скрипта за пределами тегов <?php ?> игнорируется PHP-компилятором и передается непосредственно в браузер. Если посмотреть на пример, приведенный ниже, то можно увидеть, что полный PHP-скрипт может выглядеть следующим образом:
<head></head> <body class="page_bg"> Привет, сегодня <?php echo date('l, F jS, Y'); ?>. </body> </html>
Приведенный выше код — это обычный HTML с небольшим фрагментом PHP, который выводит текущую дату, используя встроенную функцию date. При этом весь HTML будет игнорироваться PHP-компилятором и передаваться в браузер без изменений.
Интегрировать PHP в HTML действительно очень легко. Помните, что скрипт — это HTML-страница с включением определенного PHP кода. Можно создать скрипт, который будет содержать только HTML (без тегов <?php ?>), и он будет нормально работать.
Более продвинутые методы:
<html> <head></head> <body> <ul> <?php for($i=1;$i<=5;$i++){ ?> <li>Menu Item <?php echo $i; ?></li> <?php } ?> </ul> </body> </html>
и результат:
Если нужно максимально сократить код, перед тем, как в PHP вставить HTML, вы можете использовать short_tags. В результате не нужно будет вводить <?php в начале кода, сократив это выражение до <?. Чтобы включить опцию, необходимо обновить файл php.ini и переключить значение параметра «short_tags» с «Off» на «On«. Хотя на большинстве серверов этот параметр уже включен, всегда лучше проверить это вручную. Проблема, которая может возникнуть при использовании коротких тегов — это конфликт при использовании XML. В XML синтаксическое выражение <? обозначает запуск функции обработки. Чтобы обойти эту проблему, можно использовать альтернативный тег <?=.
<html> <head></head> <body class="page_bg"> Hello, today is <?=date('l, F jS, Y'); ?>. </body> </html>
Имейте в виду, что если нужно создать сайт, совместимый с максимальным количеством платформ, при вставке PHP в HTML не стоит полагаться на short_tags.
Еще один способ интеграции HTML в PHP-файл — команда echo:.
Возможное, но не рекомендуемое использование:
<?php echo "<html>"; echo "<head></head>"; echo "<body class="page_bg">"; echo "Hello, today is "; echo date('l, F jS, Y'); //other php code here echo "</body>"; echo "</html>"; ?>
Это повлияет на подсветку разметки в большинстве редакторов. Поэтому необходимо выделять все двойные кавычки внутри HTML-кода с помощью обратной косой черты.
Файл, содержащий PHP в HTML, должен иметь расширение .php.Также можно настроить файл .htaccess для чтения PHP-кода в HTML-файлах без изменения расширения. Ниже приведены «обработчики«, которые нужно добавить, чтобы настроить эту функцию.
Для стандартно настроенного веб-сервера:
AddHandler cgi-script .html .htm
Для веб-сервера с запущенным FastCGI:
AddHandler fcgid-script .html .htm
Также можно использовать HTML-код в PHP-скриптах. Все, что нужно сделать, это при открытии страницы с помощью PHP изменить порядок открывающихся тегов HTML и PHP.
Использование HTML в PHP:
<?php $Fname = $_POST["Fname"]; $Lname = $_POST["Lname"]; ?> <html> <head> <title>Personal INFO</title> </head> <body> <form method="post" action="<?php echo $PHP_SELF;?>"> First Name:<input type="text" size="12" maxlength="12" name="Fname"><br /> Last Name:<input type="text" size="12" maxlength="36" name="Lname"><br /></form> <? echo "Hello, ".$Fname." ".$Lname.".<br />"; ?>
Такая вставка PHP в HTML позволяет использовать намного меньше кода. Здесь мы используем глобально $PHP_SELF, что позволяет использовать значения полей, указанные под ними, в том же файле. Как правило, для таких форм создается два файла: первый — сама HTML-форма, а второй — PHP-файл, который выполняет обработку.
Если у вас уже есть сложные PHP-приложения, которые используют большое количество файлов, и вы хотите упростить, этот метод может помочь.
Освоить азы PHP — очень просто. Убедитесь в этом, прочитав следующую статью:
Приходит время и каждый начинающий вебмастер понимает, что ему уже тесно в рамках простого HTML. Он осознаёт, что больше нельзя терпеть это ковыряние в каждой отдельной страничке, и пора уже автоматизировать процесс насколько это возможно.
И именно эту возможность предоставляет язык PHP. С его помощью можно собирать каждую страничку сайта из отдельных блоков (например шапка, меню, основной текст, рекламный блок, низ страницы). Таким образом сделав изменение в одном только блоке можно изменить его на всех страницах сразу.
Обычно первая мысль, которая возникает у вебмастера, знающего только HTML: «PHP — слишком сложно. Я пока обойдусь чем-нибудь попроще». Тогда возможно он начинает искать и натыкается на технологию SSI, которая также позволяет собирать страницу из блоков и даже разнообразить её с помощью условных операторов.
«О — это для меня! Это просто (всего несколько команд!) и позволяет делать всё, чего я не мог раньше. Не то что этот страшный PHP» — думает он и… совершает большую ошибку. Можете мне поверить, ведь я сам так и сделал — испугался PHP и создал большой сайт (300 страниц!) на основе SSI, о чём теперь очень жалею.
Теперь, когда сайт вырос, преимущество SSI (простота) оказалось недостатком. Эта технология слишком проста, чтобы сделать что-то большее, чем простая сборка страниц. И теперь перевод сайта на php удвоит количество страниц, поскольку придётся делать переадресацию, чтобы работали ссылки с других сайтов… Надеюсь Вы не повторите моей ошибки?
Но, вернёмся к самому переходу на PHP.
Шаг 1. Выбор хостинга
Первым делом для этого нужен хороший хостинг. Бесплатные не подойдут, лучше сразу выбрать качественный, чтобы потом не пришлось ругаться с техподдержкой.
Признаки хорошего хостинга: поддержка PHP, MySQL, SSI, WAP и вообще всего что только можно, ежедневный Back-Up (сохранение базы данных), гибкие тарифы, бесплатный домен и (важный момент) дружественная техподдержка, которая решит все Ваши проблемы быстро и без нервов.
Если у Вас ещё нет такого на примете, можете попробовать https://www.hts.ru, работаю с ними давно и претензий никогда не было.
Хорошо, хостинг выбрали, настроили (надеюсь :), скопировали на него свой многострадальный сайт. Что дальше? Как теперь перевести его на PHP?
Шаг 2 — самый простой. Переименование расширений
Просто переименуйте все расширения файлов Вашего сайта с html (или htm) на php. Так же, как обычно переименовывали все другие файлы. И соответственным образом переименуйте все ссылки на Ваших страницах, чтобы они указывали на файлы с новыми расширениями.
Если же Вам совсем не хочется трогать сами файлы, можно сделать иначе. Например, добавить в файл .htaccess
строку:
AddHandler application/x-httpd-php .php .shtml .html .htm
Получилось? Вуаля! Теперь Ваш сайт переведён на PHP. Он конечно ещё не использует всех возможностей PHP, но уже должен работать. Дело в том, что php-странички — это тот же самый HTML, в который по мере надобности вставляют кусочки php-кода. То есть Ваш сайт будет работать даже совсем без php-вставок.
С одним «но».
Он будет работать, если Вы загрузите его на хостинг и зайдёте на него так же, как и все остальные пользователи. Если же просто попытаться открыть страницу со своего компьютера (как делали это с HTML-страницами), то скорее всего ничего не получится.
Шаг 3. Установка веб-сервера
Здесь Вам понадобится специальная программа — веб-сервер, которая будет делать всю ту работу, которую делает сервер на Вашем хостинге. То есть если у Вас установлен свой веб-сервер, Вам не нужно будет загружать изменённую страницу на хостинг, чтобы посмотреть результат. Загрузите потом, когда она будет полностью готова. Таким образом:
Скачиваем и устанавливаем веб-сервер.
Шаг 4. Выделение блоков из структуры страниц
Выделяем блоки. То есть используем ту самую возможность, ради которой вообще всё это затеяли.
Это несложно. Просто смотрим на странички и выделяем на них повторяющиеся фрагменты. Как правило это:
- шапка сайта — его верхняя часть, содержащая логотип, название, возможно форму поиска или ещё что-то, что Вы решили вынести в начало страниц;
- горизонтальное — в нём обычно бывают ссылки на основные страницы сайта;
- вертикальное меню — удобно для структурирования множества ссылок, размещения рекламных блоков, новостей и т.д.;
- основной текстовый блок, обычно разный для разных страниц. Его не нужно никуда выделять, в него и будут вставляться все остальные блоки;
- необязательный правый вертикальный блок симметричный блоку меню;
- низ (ноги) странички, в котором принято размещать контактные данные, счётчики, рекламу и прочую вторичную информацию.
Когда все блоки определены — сохраняем их в отдельные файлы с расширением php и
называем как-нибудь романтично (например header, menu, footrr и т.д.).
Шаг 5. Вынос блоков в отдельные файлы
Вставляем блоки в основные файлы. Для этого изучим одну команду:
<?php include "https://www.ваш_сайт/header.php"; ?>
где:
<?php
— это начало любого блока с php-кодом
include "https://www.ваш_сайт/header.php";
— это собственно и есть команда вставки содержимого файла header.php
?>
— это конец блока с php-кодом.
Ничего сложного, правда? Просто меняете путь к файлу с нужным блоком и он будет вставлен в то место страницы, где вы поставили этот код.
Обратите внимание, что после команды стоит символ «;», означающий конец команды. В данном случае он необязателен, поскольку команда всего одна, но в будущем лучше о нём не забывать.
Теперь вспомним, что каждая наша страница уникальна, и у каждой свои теги TITLE, DESCRIPTION и т.д., мы же можем вставлять только одинаковые блоки. Непорядок. Здесь нам помогут переменные.
Шаг 6. Переменные
Посмотрите вот на эти строчки:
<?php
$title = "Тег TITLE Вашего сайта";
include "https://www.ваш_сайт/header.php";
?>
С её помощью я задал переменной $title
(все переменные начинаются с символа «$» — доллар) значение Тег TITLE Вашего сайта.
Затем команда include
вставляет в это место блок header.php и передаёт ему значение этой переменной.
И чтобы наш блок header.php принял переданную ему переменную, вставляем в него вот такой изменённый код тега TITLE:
<title><?php echo $title ?></title>
Думаю тег <title> Вы узнали сразу, а команда echo $title
просто вставила вместо себя значение переменной $title
.
По аналогии можно вставлять значения и остальных тегов.
Только одно предупреждение — если Вам нужно вставить кавычки — используйте апострофы для ограничения текста, который Вы передаёте.
Например:
$title = 'Официальный сайт «имени меня любимого»';
Но всё равно чего-то не хватает. А именно:
Шаг 7. Условные операторы
Условные операторы — это когда какое-то действие выполняется или не выполняется в зависимости от условий.
Эта возможность пригодится в нашем меню. Ведь в Вашем меню подсвечивается та страница, на которой в данный момент находится посетитель? Ему будет гораздо удобнее знать, где именно он в данный момент находится и куда может перейти.
Для этого нам снова потребуются переменные и один условный оператор:
<?php
if ($stranica == "ГЛАВНАЯ")
{
echo "<p>ГЛАВНАЯ</p>";
}
else
{
echo "<p><a href="index.php">ГЛАВНАЯ</a></p>";
}
?>
Что мы здесь видим?
if ($stranica == "ГЛАВНАЯ")
— это условие. Если оно выполняется — то в данном месте меню с помощью команды echo
вставляются обычные HTML-теги выводящие надпись «ГЛАВНАЯ».
else
— означает «иначе» — что произойдёт, если условие не выполняется. В данном случае при невыполнении условия надпись «ГЛАВНАЯ» будет ссылкой, ведущей на главную страницу.
То есть — если мы находимся на главной странице — нам не нужна ссылка ведущая на эту же страницу и мы закрываем её простым текстом.
{
и }
— ограничивают действие команд. В такие скобки можно поместить несколько команд (например если при выполнении условия у нас должно призойти что-то ещё кроме вывода одной строчки).
Ну, и чтобы проверить переменную — нужно её опять-же — задать. Для этого на всех страницах должны быть вот такие блоки кода:
<?php $stranica = "ГЛАВНАЯ"; ?>
где вместо ГЛАВНАЯ ставите разные метки для каждой страницы.
Кстати, эти же переменные можно использовать и при создании заголовка страницы и для тега TITLE, то есть — вставлять везде, где повторяется этот текст. Главное не переборщить и не запутаться.
Выводы
Ну вот, с помощью всего 7 шагов мы перестали бояться PHP и оптимизировали работу над сайтом, чтобы сэкономить кучу времени в будущем.
В качестве подспорья в работе над сайтами рекомендую программки:
RJ TextEd — редактор html и php кода помощник на все руки,
Шифратор e-mail — защищает ваши адреса от спам-ботов, собирающих e-mail’ы по сайтам.
P.S. Разрешается свободно копировать и цитировать данную статью при условии указания открытой активной ссылки на источник и сохранения авторства Руслана Богданова.
P.P.S. Если Вы всё ещё не уверены, что перевод на язык PHP сделает лучше Ваш HTML-сайт, посмотрите вот эту статью, возможно она переубедит Вас:
https://www.bestfree.ru/article/webdesign/language.php