Главная · Карта сайта · Поиск · Статьи · Компьютерные курсы · Обучающие программы · Открытые проекты · Веб-программирование · Создание интернет-сайта · Полезные ссылки · Глоссарий · Контакты · Декабрь 09 2016 22:14:53
Последнее опубликованное

Что такое Model-View-Controller
Pattern Model-View-Controller

Как создать свой веб-сайт
Как создать свой сайт в интернете

Разное
Статистика

Шаблон многостраничного сайта на PHP


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

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

Макет интернет-страницы с тремя колонками, заголовком и подвалом
Макет страницы с тремя колонками.

Части страницы, выделенные серым цветом, будем считать относительно постоянными, а основная часть будет предназначена для уникального в рамках всего сайта контента. В первую очередь необходимо описать API нашего шаблона, который будет представлен несколькими глобальными функциями и одним классом, инкапсулирующим в себе логику построения разметки шаблона с тремя колонками на основе DIV-верстки. Что-то похожее, но в более навороченном варианте представляет собой ядро любой CMS, такой как Wordpress, Joomla или Drupal. Ниже представлен исходный код файла global.php:

<?php
  $page=NULL;

  function open_page($title, $description, $keywords)
  {
   global $page;

   $page = new Page($title, $description, $keywords);
   $page->open();

   return $page; 
  }
  
  function close_page()
  {
   global $page;

   if ($page==NULL)
       return;


   $page->close();
   $page=NULL;
  }

  function get_page()
  {
    global $page;
    return $page;
  } 
   
  class Page
  {
   private $_title;
   private $_description;
   private $_keywords;    

   function __construct($title, $description, $keywords)
   {
     $this->_title = $title;
     $this->_description = $description;
     $this->_keywords = $keywords;
   }

   public function open()
   {
     echo "<!DOCTYPE HTML>\n";
     echo "<html>\n";
     echo "<head>\n";
     echo "<title>".$this->_title."</title>\n";
     echo "<meta http-equiv='Content-Type' content='text/html; charset=windows-1251'>\n";
     echo "<meta name='description' content='".$this->_description."'>\n";
     echo "<meta name='keywords' content='".$this->_keywords."'>\n";
     echo "<link rel='stylesheet' href='styles.css' type='text/css'>\n";
     echo "</head>\n";
     echo "<body>\n";     
   } 
     
   public function close()
   {
     echo "</body>\n";
     echo "</html>\n";
   }

   public function begin_header()
   {
     echo "<div class='frame'>\n";
     echo "<div class='header'>\n";
   } 

   public function end_header()
   {
     echo "</div>\n";
     echo "<div class='main'>\n";
   } 

   public function begin_left_side()
   {
     echo "<div class='main-side-left'>\n";
   }

   public function end_left_side()
   {
     echo "</div>\n";
   }

   public function begin_right_side()
   {
     echo "<div class='main-side-right'>\n";
   }

   public function end_right_side()
   {
     echo "</div>\n";
   }

   public function begin_center()
   {
     echo "<div class='main-center'>\n";
   }

   public function end_center()
   {
     echo "</div>\n";
   }

   public function begin_footer()
   {
     echo "</div>\n";
     echo "<div class='footer-proxy'></div>\n";
     echo "</div>\n";
     echo "<div class='footer'>\n";
   } 

   public function end_footer()
   {
     echo "</div>\n";
   } 
  }
?>

Исходный код global.php.

Класс Page содержит ряд методов, формирующих отдельные фрагменты разметки шаблона. Например, метод open() добавляет определение заголовка страницы, метаинформацию (теги meta), ссылку на определение каскадных таблиц стилей и т.п., а метод close() завершает разметку страницы. Все остальные методы являются парными: каждый из них формирует начальную begin_xxx() и конечную end_xxx() разметку соответствующего блока. Конструктор класса Page (метод __construct()) инициализирует поля класса такими параметрами страницы, как заголовок, описание и список ключевых слов.

Глобальные функции open_page() и close_page() инициализируют страницу и сохраняют ссылку на экземпляр класса Page в глобальной переменной $page, доступ к которой можно получить через глобальную функцию get_page(). Безусловно, здесь можно было обойтись и без классов, но мне хотелось на этом примере еще и продемонстрировать реализацию базовых концепций объектно-ориентированного программирования на PHP.

Исходный код формирования страницы, соответствующей данному шаблону, будет выглядеть примерно следующим образом:

<?php
  require_once "global.php";  

  open_page("Заголовок", "Описание", "Ключевые слова");

  include "header.php";
  include "left_side.php";
  include "right_side.php";

  get_page()->begin_center();

  echo "<div class='data'>Блок информации в основной части 1</div>";
  echo "<div class='data'>Блок информации в основной части 2</div>";
  echo "<div class='data'>Блок информации в основной части 3</div>";
  echo "<div class='data'>Блок информации в основной части 4</div>";
  echo "<div class='data'>Блок информации в основной части 5</div>";
  echo "<div class='data'>Блок информации в основной части 6</div>";
  echo "<div class='data'>Блок информации в основной части 7</div>";

  get_page()->end_center();

  include "footer.php";

  close_page();     
?>

Исходный код page.php.

До начала формирования разметки страницы необходимо подключить файл global.php, что указано в самой первой инструкции require_once. Далее мы инициализируем страницу вызовом глобальной функции open_page(), передавая значение заголовка, описания и ключевых слов страницы. После, с помощью инструкции include подключаем заголовок и боковые панели страницы и открываем разметку основной области вызовом метода begin_center() класса Page. Теперь можно сформировать основную разметку страницы, которая будет отображена в границах основной области. В заключении необходимо закрыть основную область вызовом end_center(), добавить разметку подвала и закрыть страницу с помощью глобальной функции close_page().

Все достаточно просто. Исходный код файлов header.php, left_side.php, right_side.php и footer.php приведен далее. Если для какой-то группы страниц вам понадобится изменить содержимое этих областей, то создайте специальные версии этих файлов и измените аргументы соответствующих им инструкций include в шаблоне страницы.

<?php
  get_page()->begin_header();

  echo "<h1 align='center'>Название сайта</h1>";

  get_page()->end_header();
?>

Исходный код header.php.

<?php
  get_page()->begin_left_side();

  echo "<div class='data'>Блок информации слева 1</div>";
  echo "<div class='data'>Блок информации слева 2</div>";
  echo "<div class='data'>Блок информации слева 3</div>";

  get_page()->end_left_side();
?>

Исходный код left.php.

<?php
  get_page()->begin_right_side();

  echo "<div class='data'>Блок информации справа 1</div>";
  echo "<div class='data'>Блок информации справа 2</div>";
  echo "<div class='data'>Блок информации справа 3</div>";

  get_page()->end_right_side();
?>

Исходный код right.php.

<?php
  get_page()->begin_footer();

  echo "<p align='center'>Информация об авторском праве</p>";

  get_page()->end_footer();
?>

Исходный код footer.php.

Результат обработки рассмотренного шаблона можно посмотреть здесь.



Компьютерные курсы и курсы программирования
Основы программирования

Курс для начинающих программистов на C# и VB.NET.

SQL 25™

Построение SQL запросов и работа с базой данных.

C# Quick Guide™

Программирование на C#. Краткое руководство.

RegEx

Применение регулярных выражений.

Plug-in архитектура

Примеры программной Plug-in архитектуры.

XML и его расширения

Язык разметки XML и его расширения с примерами.

HTML и разметка гипертекста

Языки HTML, XHTML и CSS с примерами разметки.

Основы веб-дизайна

Основы веб-дизайна: решения типовых задач верстки.

Программирование на PHP

Руководство по программированию на PHP для начинающих.

Справочные материалы

Шаблоны проектирования
Каталог шаблонов проектирования программных компонентов.

Рефакторинг кода
Каталог приемов рефакторинга программного кода.

Гость
Имя

Пароль



Забыли пароль?
Запросите новый здесь
.
Coding Craft. Все права защищены © 2011. Проект Инициативного Народного Фронта Образования - ИНФО-проект.