Генерація головної сторінки з використанням блоків, та формування головного меню
Автор: Саша Курята • Май 10, 2022 • Практическая работа • 2,443 Слов (10 Страниц) • 152 Просмотры
Метою даної практичної роботи буде генерація головної сторінки з використанням блоків, та формування головного меню. Будемо використовувати шаблон сайту створений Вам раніше. В практичній роботі будемо опиратися на «полегшений» шаблон із сайту getbootstrap, нам для прикладу вистачить.
І так для полегшення ми спростимо функції і структуру БД, ми не робимо реально робочий проект на який будуть заходити пару сотень людей в день, а для наочності нам вистачить. Отже визначаємось із структурою БД. Нам будуть потрібні (можливо не на цій практичній роботі, на слідуючих) такі таблиці:
∙ Block – будемо зберігати тут блоки, і наша сторінка по мірі необхідності буде брати звідси тексти блоків. Зараз описуємо лише вид блоку html (приклад нижче)
[pic 1]
∙ Menu – зберігатись будуть різноманітні меню, структура буде (поки що, немає гарантії що в подальших практичних не зміниться) такою
[pic 2]
∙ Page – тут будуть зберігатися тексти сторінок (статті). Лише головна сторінка буде мати окремий шаблон
∙ Product – тут будуть зберігатися описи товарів і додаткових їх характеристик
∙ Router – таблиця в якій будуть міститися залежності шляху та типу матеріалу, тобто якщо користувач прийшов за посиланням «Чорні_Носки» то в цій таблиці буде міститися що система має «віддати» користувачу, може опис товару, а може це бути і стаття про товар.
Три останні таблиці в практичний використовуватися не будуть, тому структуру ми прибережемо для наступних практичних робіт. Також поки що ми не розглядаємо таблиці адміністративної частини, щоб поки що не заплутатись.
І так, структура двох потрібних нам таблиць буде мати вигляд:
Таблиця тля блоків
CREATE TABLE `block` (
`id` int(10) unsigned NOT NULL AUTO_INCREMENT,
`title` varchar(512) DEFAULT NULL,
`block` text,
`type` varchar(128) NOT NULL,
`block_name` varchar(128) DEFAULT NULL,
PRIMARY KEY (`id`),
UNIQUE KEY `id_UNIQUE` (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=7 DEFAULT CHARSET=utf8;
Таблиця для меню
CREATE TABLE `menu` (
`id` int(10) unsigned NOT NULL AUTO_INCREMENT,
`name` varchar(512) DEFAULT NULL,
`link` varchar(512) DEFAULT NULL,
`menu` varchar(32) NOT NULL,
PRIMARY KEY (`id`),
UNIQUE KEY `id_UNIQUE` (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=4 DEFAULT CHARSET=utf8;
Дані таблиць наводити не доцільно, так як у Вас свій магазин, із своїми блоками та товарами – вони не співпадуть.
Тепер переходимо до шаблону сторінки, як вже було сказано, був взятий безкоштовний шаблон, і, він був перероблений до такого вигляду:
[pic 3]
Було вирішено трансформувати даний шаблон в магазин носків, отже після зміну контенту сторінки вийшло таке:
[pic 4]
Тепер наведемо html код із деякими поясненнями, нам потрібно знати що буде лишатися у вигляді статичної сторінки, а де саме будуть місця, які будуть вивантажуватися із БД, наприклад, як блоки.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Носкі в яких є душа</title><!-- Назву сторінки будемо брати із файлу налаштувань -->
<!-- Bootstrap core CSS -->
<link href="templates/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="templates/css/modern-business.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark fixed-top">
...