Админ-панель сайта

Что такое админ-панель

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

Админ-панель располагается на отдельной странице, которая имеет примерно такой адрес:

http://mysite.ru/adminpanel.php

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

Авторизация администратора

Авторизацию администратора можно сделать двумя способами. Если администраторов несколько, то в таблицу с пользователями можно добавить поле, в котором указывать, что пользователь является администратором. А можно в скрипте авторизации просто передавать права администратора конкретному пользователю. Мы используем второй вариант. Назовём страницу авторизации avtadministrator.html. Вот её код:

avtadministrator.html:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

<!DOCTYPE html>
<html>
<head>
<title>Страница</title>
<meta charset="utf-8">
</head>
<body>
<p>Авторизация:</p>
<form action="adminavt.php" method="post">
  <input name="login" placeholder="Логин">
  <input type="password" name="password" placeholder="Пароль">
  <input type="submit" value="Войти">
</form>
</body>
</html>

Форма отправляет данные в файл adminavt.php. Это скрипт авторизации. Его код такой:

adminavt.php:

1 2	<?php header('Content-type: text/html; charset=utf-8');

3
4
5
6
7
8
9
10
11
12
13

$login = $_POST['login'];
$pas = $_POST['password'];
if ($login == 'Viktor' && $pas == 1122)
  {
  session_start();
  $_SESSION['admin'] = true;
  $script = 'adminpanel.php';
  }
else
$script = 'avtadministrator.html';
header("Location: $script");

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

3, 4 - получаем логин и пароль из формы

5 - если они правильные

8 - записываем в сессию, что это администратор

9 - страница, на которую нужно перейти - adminpanel.php

11 - если логин или пароль неправильные

12 - то нужно вернуться на страницу авторизации

13 - переход на нужную страницу

Создание админ-панели

Админ панель выглядит примерно так.

adminpanel.php:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

<?php
header('Content-type: text/html; charset=utf-8');
session_start();
if (! $_SESSION['admin'])
header('Location: adminavt.php');
?>
<!DOCTYPE html>
<html>
<head>
<title>Страница</title>
<meta charset="utf-8">
</head>
<body>
<form action="newart.php" method="post">
<p>Название статьи:</p>
<input name="nameart">
<p>Текст статьи:</p>
<textarea name="text"></textarea>
<p>Текст ссылки в меню:</p>
<input name="menu">
<input type="submit" value="Добавить статью">
</form>
</body>
</html>

В начале идёт PHP скрипт, в котором проверяется, есть ли в сессии переменная admin. Если нет, значит в админ-панель входит пользователь, не являющийся администратором. Тогда происходит переход на страницу авторизации. Админ-панель представляет собой форму, в которую администратор вводит новую статью. Название статьи может быть длинным и ссылка на неё в меню сайта может отличаться от названия. Поэтому в форме есть поле для текста ссылки.

Перед добавлением статьи в базу данных нужно поместить текст статьи в теги . Сделаем это на стороне клиента, чтобы не расходовать ресурсы сервера. Добавим на страницу скрипт, в котором перед текстом статьи поставим тег , а после текста . Чтобы сохранились все абзацы, нужно вместо перехода строки закрыть тег и открыть новый. Вот код скрипта:

JavaScript:

24
25
26
27
28
29
30

var form = document.querySelector('form');
form.onsubmit = function ()
  {
  var text = form.text;
  text.value = '<p>' + text.value + '</p>';
  text.value = text.value.replace(/\n/g, '</p><p>');
  };

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

24 - находим форму

25 - обработчик события submit

27 - находим поле для текста статьи

28 - ставим перед текстом и после текста

29 - заменяем перевод строки на .

При желании можно добавить в обработчик проверку заполнения полей.

Форма запускает скрипт newart.php, который добавляет статью в базу данных. Вот код скрипта:

newart.php:

3
4
5
6
7
8
9
10
11
12
13
14

$name = $_POST['nameart'];
$text = $_POST['text'];
if ($_POST['menu'])
$menu = $_POST['menu'];
else $menu = $name;
$db = mysqli_connect('localhost', 'root', '', 'mybase');
$query = "INSERT INTO art (name, text, menu) VALUES ('$name', '$text', '$menu')";
$result = mysqli_query($db, $query);
mysqli_close($db);
if ($result)
echo 'Статья успешно добавлена';

В строке 5 производится проверка - указан ли текст для пункта меню. Если не указан, то используется название статьи. Это позволяет не писать текст для пункта меню, если он совпадает с названием статьи.

Мы рассмотрели создание самой простой админ-панели. Чтобы ею было удобно пользоваться в неё желательно добавить определённые возможности:

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

На основе данного примера Вы сможете сделать любую админ-панель для Вашего сайта.