Реализуем редактор постов через админ панель

Rio-Shaman

03 Ноября 2011 г. 03:43

Здравствуй дорогой читатель! Приветствую на продолжение цикла статей посвященного созданию CMS блога! Сегодня мы будем писать редактор для нашей CMS. В прошлой статье мы писали форму добавления постов в базу данных, сейчас же нам предстоит организовать точно такую же форму, но цель ее будет вытащить из базы данных пост, и сохранить изменения которые мы с Вами внесем. Как и добавление постов, редактор будет выглядеть в виде простой формы. В скором будущем мы начнем писать bb коды для этой формы, но а сейчас она будет уметь лишь добавлять простой текст, и не более того...

Предлагаю начать с того, по каким ссылкам будут находится наши странички, которые мы сейчас создадим, и сколько страничек будет вообще! Отвечу с начало на вопрос: "Сколько страничек будет?" Их будет две, на первой мы будем видеть полный список наших постов, на второй же будет находится форма редактирования. Для того что бы писать ссылки, в будущем нашем коде, сразу объявим, что список постов будет находится по адресу index.php?page=all_content, а форма - index.php?page=edd_content&id=ID_поста. Узнавать номер поста будем через глобальную переменную GET['id']. Чует мое сердце, что эта глобальная переменная будет отвечать не только за ID поста, поэтому стоит определить ее в главном нашем файле index.php, но об этом мы поговорим ниже

Первая страница - Лист с постами

Для реализации этой страницы нам нужно создать шаблон. Я набросал html код, вот он:

<table width="600px" cellpadding="0" cellspacing="0" border="0" align="center">
    <tr>
        <td width="250px" height="30px" valign="top" style="font-weight:bold;">Название поста</td>
        <td valign="top" style="font-weight:bold;">Автор поста</td>
    </tr>
    
    [_while]
    <tr>
        <td width="250px" valign="top"><a style="font-weight:100;" href="/index.php?page=edd_content&id=[_id]">[_title]</a></td>
        <td valign="top">[_author]</td>
    </tr>
    [_while]
</table>

Разберем наши код-слова:

[_id] - ID нашего поста в базе данных
[_title] - Заголовок поста
[_author] - Автор поста
[_while]...[_while] - Все что между этими код-словами будет дублироваться в нашем модуле, ведь согласиться, у нас же будет не один пост

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

Назвал я этот шаблон allcontent.html и поместил в папку с шаблонами templates

Вторая страница - Форма

Пришло время создать шаблон формы. Она уж очень схожа с шаблоном который мы делали в прошлой статье. Но разница все же есть, во-первых необходимо добавить одно скрытое поле, которое будет передавать, в обработчик, ID нашего поста, так же нужно исправить название кнопки, добавить код-слова и переделать name у инпутов. Вот html код шаблона:

<table width="600px" cellpadding="0" cellspacing="0" border="0" align="center">
    <tr>
        <td width="100px" height="100px" valign="top" align="center">		
        <form action="?page=edd_content" method="post" name="form">
            <input name="edd_id_post" type="hidden" value="[_id]">
            <br>
            <input style="width:600px;" name="edd_name_post" type="text" value="[_title]">
            <br>
            <textarea style="width:600px;height:600px;" name="edd_txt_post" rows="10">[_text]</textarea>
            <input style="width:600px;" name="edd_author_post" type="text" value="[_author]">
            <br>
            <br><br><input type="submit" value="Редактировать пост">
        </form>		
        </td>
    </tr>
</table>

В основном код-слова схожи с предыдущем шаблоном, но в этом появилась новое [_text] - не трудно догадаться, что оно будет отвечать за текст самого поста.

Так же обратите внимание, что обработчик нашей формы будет лежать на странице index.php?page=edd_content

Назвал я этот шаблон eddcontent.html и сохранил в папке с шаблонами templates

Написание самого модуля

Давайте подумаем, что он из себя будет представлять? Я думаю стоит написать две функции, одна будет отвечать за вывод списка, вторая же будет отвечать за саму форму. Подключать этот модуль будем в случае если наша переменная $page равна "all_content" или "edd_content".

Написание модуля - функция вывода списка

Функция будет подключать наш шаблон allcontent.html
вырезать из этого шаблона все, что стоит между [_while]
после этот вырезанный кусок будем нашпиговывать информацией из базы данных
и в конце выведем результат функции на экран.

Вот код с комментариями:

function allcontent()//Функция вывода списка постов
{
$sm_read = file("templates/allcontent.html");//...подключаем шаблон
$sm_read = implode("",$sm_read);//функция file() возвращаем массив, поэтому склеиваем его

preg_match("/\[_while\](.*?)\[_while\]/s",$sm_read,$tamp_while);//Находим в шаблоне тут часть, которую будет ду вайлить

$result_index = mysql_query("SELECT id,author,title FROM blog ORDER BY id DESC");//Выводим из базы данных посты
$myrow_index = mysql_fetch_array($result_index);

do
{
    $copy_tamp = $tamp_while[1];//Сохраняем ту часть которая будет повторяться в отдельную переменную
    
    //Делаем замены код-слов
    $copy_tamp = str_replace("[_title]",$myrow_index[title],$copy_tamp);//Название поста
    $copy_tamp = str_replace("[_author]",$myrow_index[author],$copy_tamp);//Автор
    $copy_tamp = str_replace("[_id]",$myrow_index[id],$copy_tamp);//ID постов
    
    $list .= $copy_tamp;//Объединяем результат в одну переменную
}
while($myrow_index = mysql_fetch_array($result_index));

$sm_read = preg_replace("/\[_while\].*?\[_while\]/s",$list,$sm_read);//Вставляем в шаблон список постов

return $sm_read;//Выводим с генерированный html код
}

Функцию сохранил как allcontent.php в папке moduls

Написание модуля - функция вывода формы

Эта функция будет по id вытаскивать из базы данных всю информацию о посте, и сохранять ее форме, в общем то ничего сложно Вот код с комментариями:

function eddcontent($id)//Функция вывода выбранного поста
{
$result_index = mysql_query("SELECT * FROM blog WHERE id='$id'");//Выводим из базы данных пост
$myrow_index = mysql_fetch_array($result_index);

$sm_read = file("templates/eddcontent.html");//...подключаем шаблон
$sm_read = implode("",$sm_read);//функция file() возвращаем массив, поэтому склеиваем его

    $text_post = str_replace("<BR>","",$myrow_index[text]);//заменяем br в тексте на пустоту
    
    //Делаем замены код-слов
    $sm_read = str_replace("[_title]",$myrow_index[title],$sm_read);//Название поста
    $sm_read = str_replace("[_text]",$text_post,$sm_read);//Текст поста
    $sm_read = str_replace("[_author]",$myrow_index[author],$sm_read);//Автор
    $sm_read = str_replace("[_id]",$myrow_index[id],$sm_read);//ID постов

return $sm_read;//Выводим с генерированный html код
}

Добавил эту функцию в уже существующий модуль allcontent.php

Обработчик

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

//ОБРАБОТЧИК
//Объявляем переменные, если форма была отправлена
if($_POST['edd_name_post'])$edd_name_post = $_POST['edd_name_post'];
if($_POST['edd_txt_post'])$edd_txt_post = $_POST['edd_txt_post'];
if($_POST['edd_author_post'])$edd_author_post = $_POST['edd_author_post'];
if($_POST['edd_id_post'])$edd_id_post = $_POST['edd_id_post'];
//Объявляем переменные, если форма была отправлена

if($edd_name_post & $edd_txt_post & $edd_author_post)
{
    //Избавляемся от html кода
    $edd_name_post = htmlspecialchars($edd_name_post);
    $edd_txt_post = htmlspecialchars($edd_txt_post);
    $edd_author_post = htmlspecialchars($edd_author_post);
    //Избавляемся от html кода
    
    //Избавляемся от кавычки
    $edd_name_post = str_replace("'","&#039",$edd_name_post);
    $edd_txt_post = str_replace("'","&#039",$edd_txt_post);
    $edd_author_post = str_replace("'","&#039",$edd_author_post);
    //Избавляемся от кавычки	

    $edd_txt_post = str_replace("\n","<BR>",$edd_txt_post);//Заменяем переносы строки на тег <BR>
    
    //ОБНОВЛЯЕМ ПОСТ В БАЗЕ ДАННЫХ
    $edd_blog = mysql_query ("UPDATE blog SET text='$edd_txt_post',title='$edd_name_post',author='$edd_author_post' WHERE id='$edd_id_post'");
    //ОБНОВЛЯЕМ ПОСТ В БАЗЕ ДАННЫХ
    
    header("location: index.php?page=all_content");//Перенаправление
    exit;//на страницу списка постов
}
//ОБРАБОТЧИК

Добавил я этот кусок кода в файл allcontent.php перед нашими функциями allcontent() и eddcontent($id)

Подключаем наш модуль

Осталось дело за малым, подключить наш модуль к админке. Но прежде чем это сделать, хотел бы вернуться к разговору о глобальной переменной GET['id']. Откройте наш файл index.php и добавьте этот кусочек кода:

if($_GET['id'])$id = $_GET['id'];

перед:

if($_GET['page'])$page = $_GET['page']; else $page = "index";

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

Вернемся к подключению нашего модуля. У нас есть две функции. Функция allcontent() будет подключаться в случае если переменная $page равна "all_content", а функция eddcontent($id) - в случае если $page равна "edd_content" Вот код с комментариями:

//РЕДАКТОР КОНТЕНТА
if($page == "all_content" || $page == "edd_content")
{
include("moduls/allcontent.php");//Подключаем наш модуль
if($page == "all_content")$txt = allcontent();//Если пост еще НЕ выбран
if($page == "edd_content")$txt = eddcontent($id);//Если пост выбран
}
//РЕДАКТОР КОНТЕНТА

Вставляется этот кусок кода перед подключением нашего главного шаблона:

include("templates/index.html");

Редактируем шаблон "меню админ панели"

Осталось разместить ссылку, на список постов, на главной странице админ панели. Для этого открываем шаблон menu.html который мы создавали в прошлой статье, и добавляем ссылку:

<table width="600px" cellpadding="0" cellspacing="0" border="0" align="center">
    <tr>
        <td width="100px" height="100px" valign="top" align="center"><a href="?page=add_content"><img src="img/add_content.jpg" border="0px"></a></td>
        <td width="100px" height="100px" valign="top" align="center"><a href="?page=all_content"><img src="img/all_content.jpg" border="0px"></a></td>
        <td width="100px" height="100px" valign="top" align="center">&nbsp;</td>
        <td width="100px" height="100px" valign="top" align="center">&nbsp;</td>
        <td width="100px" height="100px" valign="top" align="center">&nbsp;</td>
        <td width="100px" height="100px" valign="top" align="center">&nbsp;</td>
    </tr>
</table>

Вот изображение кнопки: Кнопка

Заключение

Ну что ж, сегодня мы реализовали простейший редактор для нашей админ панели, в следующей статье мы скорее всего будем создавать bb коды для наших форм, так что не "переключайтесь", спасибо, что прочли статью, удачи Вам, у меня все!