Untitled web-page

Автоматическое создание веб-страниц с помощью PHP

Если вы подпишитесь на услугу по ссылке на этой странице, Reeves and Sons Limited может получить комиссию. Смотрите наши заявление об этике.

В жизни бывают определенные моменты, когда вам нужна веб-страница, чтобы делать что-то большее, чем просто сидеть на ней, будучи веб-страницей. Он нужен вам, чтобы заработать себе на жизнь. Один из способов сделать это — заставить его работать на вас, чтобы вам не пришлось вручную кодировать каждое обновление или мод страницы. Самый простой способ научиться делать что-то подобное — это сделать это на самом деле, поэтому в оставшейся части этой статьи я покажу вам один из способов реализации системы, которая будет создавать для вас новые веб-страницы одним касанием кнопка. В этом сценарии мы предполагаем, что ваш клиент — ресторан, который хочет предлагать ваучеры на разные особые случаи в течение года. Но, конечно, они не хотят платить вам за обновление для них, поэтому вам лучше убедиться, что вы выставили им достаточный счет за эту систему автоматизации, которая будет делать обновления для них.

1. Сначала нам нужно создать базовый шаблон веб-страницы.

Screen Shot на 2016 05-30-1.56.52 А.М.

Это просто стандартный каркас веб-страницы. Вы можете дать ему имя, например, pageBuilder.php или что-нибудь в этом роде. Для этого не обязательно использовать PHP. Вы можете использовать другой язык программирования, но в этом примере мы сделаем все просто и сделаем все на PHP.

2. Добавить Bootstrap

Screen Shot на 2016 05-30-1.56.56 А.М.

3. Настроить контейнер

Screen Shot на 2016 05-30-1.56.48 А.М.

Чтобы все было аккуратно и аккуратно, мы должны определить контейнер, в котором мы будем хранить содержимое страницы.

4. Создание веб-формы

Определите веб-форму, и мы также добавим причудливое название в форму, которая является необязательной, но хорошей идеей.

Screen Shot на 2016 05-30-1.56.43 А.М.

5. Добавить поля формы

  • Фоновое изображение для страницы
  • Название праздника
  • Headline
  • Вступительная речь
  • Некоторая банальная цитата или дополнительная инструкция
  • Атрибуция для банальной цитаты
  • Стиль шрифта, используемый для каждого из четырех текстовых элементов обрамления (вdiviдважды).
  • Диапазон дат, согласно которому ваучеры действительны для
  • Предложите 1 и предложите 2, которые будут рекламироваться на ваучеры.
  • Дополнительные сообщения ваучера (например, условия)
  • Данные для ваучерных QR-кодов, которые будут сгенерированы

Screen Shot на 2016 05-30-1.56.00 А.М.

Screen Shot на 2016 05-30-1.55.54 А.М.

Screen Shot на 2016 05-30-1.55.36 А.М.

И после всех этих усилий мы получим страницу, которая выглядит примерно так:

Screen Shot на 2016 05-30-1.55.22 А.М.

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

Читайте также:  Поля для кодов html

6. Создайте файл процессора формы

После создания формы вам понадобится программное обеспечение, которое будет обрабатывать отправленные данные и что-то с ними делать. В этом случае мы будем использовать отправленные данные для создания нового HTML стр.

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

Файл должен быть назван так же, как и действие значение атрибута в объявлении формы, поэтому в нашем примере это будет voucherGen.php, и поскольку мы не указали путь, его нужно будет сохранить в том же месте, что и pageBuilder.php для его работы.

7. Инициализировать переменные

Данные, представленные из pageBuilder.php был возвращен как ассоциативный массив, называемый $ _POST, и все значения данных в массиве могут быть доступны через их управление формой HTML имя атрибуты. Поэтому инициализировать наши переменные на самом деле довольно просто. Это также необязательно, но это просто делает код более аккуратным и более легким для чтения. Вы, безусловно, можете работать напрямую с $ _POST если вы предпочитаете.

Screen Shot на 2016 05-30-1.55.15 А.М.

8. Используйте условные выражения, чтобы установить правильные значения шрифтов.

Сделав это раньше, вы сэкономите время и сэкономите проблемы позже. Мы просто проверяем, какие значения были выбраны, а затем заменяем их фактическими названиями шрифтов.

Screen Shot на 2016 05-30-1.55.10 А.М.9. Начните строить генераторную строку

На самом деле все, что нам нужно здесь сделать, это создать одну действительно длинную строку, которая будет содержать все необходимое для создания новой страницы. Мы будем использовать конкатенацию строк, чтобы сделать ее удобочитаемой и упростить просмотр, куда были вставлены значения данных. Это начинается с настройки базовой HTML-страницы:

Screen Shot на 2016 05-30-1.55.06 А.М.

Вы, наверное, видите, к чему мы идем. Обратите внимание на точку с запятой в конце. Это важно. Также любые точки с запятой, встречающиеся в тексте (как часть объявления CSS или клиентского скрипта), должны быть заключены в кавычки.

10. Начать добавление тела страницы в строку генератора

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

Screen Shot на 2016 05-30-1.55.00 А.М.

11. Напишите строку генератора в HTML

В этом случае мы жестко кодируем имя файла, но вы можете (и, вероятно, должны) сделать это поле в своей форме pageBuilder.

Screen Shot на 2016 05-30-1.54.55 А.М.

12. Добавить тестовую ссылку

Когда вы нажимаете кнопку BUILD IT, потому что она не перенаправляется на веб-страницу, как в обычной программе PHP, вам нужно добавить ссылку или что-то в этом роде и посмотреть, что получилось.

Screen Shot на 2016 05-30-1.54.50 А.М.

13. Создание пользовательского файла CSS

Вы можете сохранить дополнительные инструкции по стилю в этом файле, но на данный момент единственной важной является инструкция по стилю для основной див.

Screen Shot на 2016 05-30-1.54.45 А.М.

14. Создание и загрузка wrap.png

Чтобы это работало правильно, вам нужно создать одно полупрозрачное изображение в пикселях и назовите его wrap.png затем загрузите его по пути, указанному в custom.css .

Читайте также:  Django templates index html

15. Загрузите подходящие фоновые изображения и проверьте свой pageBuilder

Вы будете в восторге, узнав, что мы почти закончили, и теперь это просто вопрос тестирования и исправления любых возникающих ошибок. Выберите несколько красивых простых изображений, которые не слишком загружены и подходят для особых событий или случаев (в нашем примере это День матери и День отца). Загрузите изображения в папку, в которой вы храните изображения для своего веб-сайта. Затем заполните форму, нажмите кнопку и посмотрите, что произойдет. Вот пример формы со всеми заполненными полями данных.

Picture1

Это должно привести к созданию чего-то совершенно подобного:

Screen Shot на 2016 05-30-1.54.11 А.М.

Мы уже догадались, что вы не захотите вводить все с нуля, поэтому вы можете загрузить исходный код для pageBuilder.php и voucherGen.php в этом архива.

Вы можете применить эту технику создания файлов HTML в виде строк, а затем записать их в файлы во всех ситуациях. Только будьте осторожны, никогда не помещайте что-то подобное в рекурсивный цикл, иначе вы заполните свой жесткий диск и выйдет из строя сервер.

Источник

Как самостоятельно сделать сайт на PHP?

Перед тем, как сделать сайт на php , нужно предпринять меры предосторожности. Потому что ресурс может получиться крайне динамичным. Того и гляди, укусит!

PHP и HTML

Сейчас эти две дисциплины связаны почти воедино. Их тандем является основой, на которой построена « жизнь » большей части интернета. Конечно, в связке с html применяются и другие серверные языки ( Perl, ASP.NET ). Но их распространенность во всемирной паутине по сравнению с PHP , носит чисто эпизодический характер.

PHP и HTML

Для многих начинающих взаимосвязь между этими технологиями выглядит непонятной. С одной стороны статический html , который интерпретируется браузерами на стороне клиента. А с другой — программный язык, обрабатывающийся на сервере. Поэтому, перед написанием сайта на php с нуля, приведем простой пример взаимодействия этих двух технологий:

    Сколько сейчас времени? 
  • Сохраним файл на локальном сервере и откроем его в браузере. Затем нажмем на правую клавишу мыши и в контекстном меню выберем пункт « Просмотр html страницы ».

PHP и HTML - 2

Как видно на скриншоте, строка не отображается в html коде страницы. И в браузере, и в коде видны лишь возвращенные дата и время. А это значит, что скрипт был обработан на серверной стороне. Поэтому создание сайта на php кардинально отличается от написания простых html страниц.

Динамический сайт

Современные сайты бывают двух основных типов:

  • Статические – созданные лишь на основе html . Такие сайты не меняют свое содержимое в ответ на действия пользователей. Конечно, статический ресурс может реагировать на события и пользовательские действия. Но реализация динамичности страниц на стороне клиента имеет узкий диапазон применения, ограниченный возможностями Java Script .
  • Динамические – способны изменять свое состояние и содержимое — html страницы динамических сайтов формируются налету в момент выполнения кода в ответ на запрос пользователя, посланный им из браузера на сервер. Чаще всего генерация страниц на стороне сервера происходит с помощью кода, написанного на php .
Читайте также:  Javascript img load event

Динамический сайт на php состоит из следующих файлов:

  • index.php – является основным файлом проекта;
  • Шаблоны – включают в себя структуру той или иной части страницы ( шапки, подвала, основной части );
  • Файлы CSS – хранят в себе все стилевые описания ресурса.

Кроме этого проект сайта может состоять из файлов, хранящих в себе код функций и методов php . А также включать в себя базу данных.

В большинстве CMS источником контента для наполнения страниц, динамически сгенерированных на стороне сервера, служит база данных. Чаще всего применяется СУБД MySQL.

Как пишется сайт на PHP

Чтобы разобраться, как создается сайт на php , рассмотрим практический пример. Конечно, многое в нем упрощено, но весь механизм работы и этапы создания сохранены.

Имеется html сайт со следующей структурой и дизайном:

Как пишется сайт на PHP

.header < margin-left:auto; margin-right:auto; margin-bottom:10px; width:1000px; height:100px; border:1px solid #000000; background: #009966; background-image: url(img/1.gif); >.pages < margin-left:auto; margin-right:auto; width:1000px; >.content < margin-right:10px; width:806px; height:450px; border:1px solid #000000; background: #999999; float:left; >.sidebar < width:180px; height:450px; border:1px solid #000000; background: #FF9900; float:left; >.foot < clear:both; >.footer

Перед тем, как написать сайт на php до конца, весь html код нужно раскинуть по нескольким файлам:

  • В header.php войдет весь код с начала и до конца слоя « header »;
  • В footer.php – слой « foot » и « footer »;
  • В content.php – весь код, оставшийся посредине.

Теперь создаем основную страницу index.php , в которой будут размещены вызовы файлов, содержащие в себе код нужных элементов дизайна. Итого в основном файле оказалось всего 3 строчки скрипта:

А если просмотреть в браузере html код страницы, то вы увидите код первоначального исходника:

Как пишется сайт на PHP - 2

Конечно, этот вариант подходит лишь для генерации основной страницы сайта. Но если код боковушки убрать в отдельный файл, тогда шаблон можно использовать и для генерации внутренних страниц сайта.

Путь в обход

Но такая разработка сайта требует затраты сил, наличия специализированного программного обеспечения и знаний. Поэтому хотелось бы найти более легкий вариант. Тогда следует воспользоваться конструктором php сайтов.

Они представляют собой определенный набор шаблонов с расширенным диапазоном настроек. Из-за чего они сильно схожи с обычными CMS . Конечно, высокой уникальности дизайна будущего сайта никто не гарантирует, и в дальнейшем могут возникнуть проблемы с переносом и адаптацией ресурса на другой хостинговой площадке или платформе. Вот несколько проверенных вариантов таких онлайн-сервисов:

  • wix.com – дополнительно к конструктору предлагается бесплатный хостинг, подключение домена и оптимизация созданного сайта для работы на мобильных устройствах.

Путь в обход

С более подробным обзором популярных онлайн-конструкторов сайтов можно ознакомиться здесь. В интернете встречаются и десктопные версии конструкторов сайтов, но большая их часть платная.

Альтернативой таких онлайн-генераторов сайтов является использование CMS . По своей сути они тоже являются конструкторами сайтов.

Но генерация страниц ресурса происходит в них динамически. Наиболее популярные CMS :

Создание сайта с нуля на php подходит не для всех. А применение специализированных конструкторов не всегда дает ожидаемый результат. Поэтому оптимальным вариантом будет развертывание нового сайта на основе популярной CMS .

Источник

Оцените статью