Создание сайта на PHP – собираем новый ресурс играючи!

Создание сайта на PHP – собираем новый ресурс играючи!

От автора: создание сайта на PHP кардинально отличается от разработки обычных ресурсов. Этот язык чаще используется для добавления динамики и возможности быстрой замены всех составляющих. Мне почему-то сайты на PHP напоминают кубик Рубика, в котором поворот любой из граней «рождает» на свет совершенно новое сочетание цветов.

Основы динамики

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

Динамические сайты так быстро и глобально завоевали интернет благодаря PHP. До этого все ресурсы были статические. То есть их разметка загружалась только из одного источника (файла). Из-за этого затруднялось редактирование кода HTML и стилей. При этом добавление контента тоже требовало знаний языка гипертекста и CSS. И все потому, что такого понятия, как админка и CMS просто не существовало.

Сейчас для создания сайта на PHP с нуля не нужно даже знать основ сайтостроения. Через административную часть системы управления контентом (CMS) легко добавлять, удалять и редактировать не только контент, но и саму структуру шаблонов. А также полностью изменять внешний вид сайта путем инсталляции новой темы.

Но в этом заслуга не только PHP. В организации функционала динамического ресурса широко используется СУБД. Чаще всего – это MySQL. Сегодня я постараюсь продемонстрировать, как это связка (PHP-MySQL) используется при создании современных сайтов.

Пример для «издевательств»

Вот так выглядит веб-страница, которую мы будет сегодня распиливать на кубики для динамического «Рубика».

HTML примера:

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>Пример динамической веб-страницы</title>
  </head>
 <body>
  <div class="head"> <h1>Динамическая веб-страница</h1></div>
  <div class="container">
   <div class="menu">
    <h2>Меню</h2>
    <ul>
     <li><a href="1.html">Раздел 1</a></li>
     <li><a href="2.html">Раздел 2</a></li>
     <li><a href="3.html">Раздел 3</a></li>
     <li><a href="4.html">Раздел 4</a></li>
     <li><a href="5.html">Раздел 5</a></li>
    </ul>
   </div>
   <div class="cont">
    <h1>Название публикации</h1>
    <img style="float: right; margin: 0px 0px 15px 15px;border:double" src="1.png" alt="Динамический ресурс" width=200"/>
    <p>
 Какой-то текстовый контент
</p>
<p>
Какой-то текстовый контент 
</p>
   </div>
  </div>
  <div class="foot">Футер</div>
 </body>
</html>

Стили для примера создания динамического сайта на PHP я указывать не буду.

Режем на большие куски

Эстетов-профессионалов прошу строго не судить: шаблон страницы буду «резать» на большие куски. Всего у нас получится в проекте 5 файлов:

style.css

header.php

container.php

footer.php

index.php

Хотя нужно было бы в отдельном файле разместить и контент, и меню. Но цель данной статьи – продемонстрировать основы создания сайтов PHP на практике, показать принцип реализации. А эстетическая составляющая останется не задействованной :) .

Скопируйте приведенные файлы и сохраните их на стороне сервера в новой папке. Но перед этим правильно разнесите по ним «куски» разметки. В header.php войдет вся шапка HTML и слой head. С контейнером и футером, надеюсь все понятно. Также не забудьте в папку «зашвырнуть» изображение.

В index.php подключите все файлы проекта. Первая строчка кода задает кодировку всего сайта:

<?php
header('Content-Type: text/html; charset=utf-8');
include("header.php");
include("container.php");
include("footer.php");
?>

Уже было!

Вы правы. Данную процедуру я уже описывал, но приходится повторяться, чтобы более наглядно показать всю мощь PHP. А вот использование MySQL для вывода контента – этого еще не было :) . Кстати, программа для создания сайта на PHP, которую я использую, это PHP Expert Editor. Может не совсем безупречная, но я к ней привык.

Сначала с помощью phpMyAdmin создадим базу с таблицей для хранения текстовых публикаций. Структура моей таблицы приведена на следующем скриншоте.

Теперь приведу все содержимое файла container.php. Код, отвечающий за выгрузку контента из БД, расположен между тегами абзаца:

<div class="container">
   <div class="menu">
    <h2>Меню</h2>
    <ul>
     <li><a href="1.html">Раздел 1</a></li>
     <li><a href="2.html">Раздел 2</a></li>
     <li><a href="3.html">Раздел 3</a></li>
     <li><a href="4.html">Раздел 4</a></li>
     <li><a href="5.html">Раздел 5</a></li>
    </ul>
   </div>
   <div class="cont">
    <h1>Название публикации</h1>
    <img style="float: right; margin: 0px 0px 15px 15px;border:double" src="1.png" alt="Динамический ресурс" width=200"/>
    <p>
<?php

$load= mysqli_connect('localhost', 'root', '', 'site');
$res= mysqli_query($load, "SELECT post FROM `content` WHERE id=1");
while ($r= mysqli_fetch_array($res)) {
        echo $r['post'] . "<br />";
}
mysqli_close($load);
?>

</p>
<p>
<?php
$load= mysqli_connect('localhost', 'root', '', 'site');
$res=mysqli_query($load, "SELECT post FROM `content` WHERE id=2");
while ($r= mysqli_fetch_array($res)) {
        echo $r['post'] . "<br />";
}
mysqli_close($load);
?>
</p>
   </div>
  </div>

Этот код далек от идеала! Его можно было бы оформить в виде функции и поместить в отдельный файл. Но такая картина более наглядная.

На сегодня все. Мы научились с вами основам «динамичности» на PHP, рассмотрели основные приемы реализации. Конечно, до создания высоконагруженного сайта самому на языке PHP нам еще далеко, но начало этому уже положено. Так что скоро вы сможете самостоятельно разрабатывать программные «кубики-рубики»!

Интернет-магазин под ключ

Изучаем PHP, MySQL, JavaScript и верстку на примере создания интернет-магазина

Научиться

Метки:

Комментарии Вконтакте:

Комментарии Facebook:

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Я не робот.

Spam Protection by WP-SpamFree