- •«Затверджую»
- •На дипломну роботу студенту Гончару Роману Вячеславовичу
- •1.Тема роботи: Розробка «Landing Page» за допомогою препроцесора sass та cms «WordPress»
- •Анотація
- •В ступ
- •Розділ і аналітичний огляд літературних джерел
- •1.1 Система управління контентом WordPress
- •1.2 Системи управління контентом
- •1.3 Установка та налаштування cms WordPress
- •Розділ іі постановка задачі
- •2.1 Постановка та обгрунутвання задачі
- •Розділ ііі розробка landing page
- •3.1 Засоби які використовувались при створенні шаблона
- •3.2 Завантаження та керування темою у сms WordPress
- •3.3 Створення категорій та записів
- •3.4 Плагін MailPoet
- •Далі після натиснення на «Створити нову форму» відкриється вікно в якому можна налаштувати форму (Рис. 3.24).
- •Розділ іv Охорона праці
- •4.1. Шкідливі фактори, які впливають на користувача комп’ютера
- •4.2. Вибір монітора
- •4.3. Вимоги до приміщення
- •Висновки
- •Перелік використаних джерел
- •Додатки
3.2 Завантаження та керування темою у сms WordPress
Д
ля
розробки Landing
Page, блогу,
Інтернет-магазину на системі управління
контентом CMS
WordPress
необхідно використати тему. WordPress
вже має в собі каталог з темами (Рис.
3.15).
Рис. 3.15. Теми CMS WordPress
У CMS WordPress можна використовувати, як каталог з темами, які вже вмонтовані так і додавати власні теми. Для того, щоб додати власну тему потрібно завантажити її на сервер через файловий менеджер.
По – перше, для завантаження власної теми на хостинг можна скористатись FTP – клієнтом самого хостингу (Рис. 3.16). По – друге, можна скористатись допоміжним ПЗ для завантаження файлів на сервер наприклад: FTP – клієнт. FTP клієнт – це набагато зручніше та швидше. FTP – клієнт вмонтований в більшість універсальних файлових менеджерів (Total commander, FAR) [11].
Рис. 3.16. FTP – клієнт хостинга
Крім того, існують спеціалізовані програми для роботи з FTP, наприклад FileZilla і CuteFTP [11].
FileZilla Client — це вільна програма, багатоплатформний клієнт FTP з відкритим кодом (Рис. 3.17) .
Рис. 3.17. FTP – клієнт «FileZilla»
В даному випадку для завантаження теми використано FTP – клієнт «FileZilla». Нижче на рисунку зображено, як виглядає власна тема у WordPress (Рис. 3.18).
Р
ис.
3.18. Власна завантажена тема у WordPress
Теми WordPress це прості HTML / CSS шаблони з тегами WordPress, які розділені на окремі файли для функціональності сайту. У директорії сайту wp–content / themes створюється нова директорія (папка). Після цього копіюються папки з стилями CSS, скриптами JS, зображеннями та файлами теми такими, як [2]:
index.php (головна сторінка шаблона);
style.css (головна таблиця стилів);
header.php (шаблон «шапки» сайту; використовується при запиті);
footer.php (шаблон підвалу сайту; використовується при запиті);
function.php (набір функцій теми Wordpress);
Для того, щоб тема нормально функціонувала потрібно підключити всі CSS – стилі та JS – скрипти від теми. Для підключення CSS / JS потрібно у файлі function.php створити новий клас та підлючити CSS / JS:
function mystyle_scripts() {
wp_enqueue_style( 'MyStyle', get_stylesheet_uri() );
wp_enqueue_style('fonts', get_stylesheet_directory_uri().'/css/fonts.min.css.css');
wp_enqueue_style('header', get_stylesheet_directory_uri().'/css/header.min.css');
wp_enqueue_style('animate', get_stylesheet_directory_uri().'/css/animate.css');
wp_enqueue_style('f-awesome', get_stylesheet_directory_uri().'/fonts/font-awesome/css/font-awesome.min.css');
wp_enqueue_style('m-popap', get_stylesheet_directory_uri().'/css/magnific-popup.css');
wp_enqueue_style('s-style', get_stylesheet_directory_uri().'/css/slick.css');
wp_enqueue_style('s-style-h', '//cdn.jsdelivr.net/jquery.slick/1.6.0/slick.css');
wp_enqueue_style('s-style-them', get_stylesheet_directory_uri().'/css/slick-theme.css');
wp_enqueue_style('s-style-h-t', '//cdn.jsdelivr.net/jquery.slick/1.6.0/slick-theme.css');
wp_enqueue_style('main2', get_stylesheet_directory_uri().'/css/main2.css');
wp_enqueue_script('libs-min', get_template_directory_uri().'/js/libs.min.js', array('jquery'), false, true);
wp_enqueue_script('common', get_template_directory_uri().'/js/common.js', array('jquery'), false, true);
wp_enqueue_script('magnific', get_template_directory_uri().'/js/jquery.magnific-popup.min.js', array('jquery'), false, true);
wp_enqueue_script('slick', get_template_directory_uri().'/js/slick.min.js', array('jquery'), false, true);
wp_enqueue_script('script', get_template_directory_uri().'/js/script.js', array('jquery'), false, true);
wp_enqueue_script('wow', get_template_directory_uri().'/js/wow.min.js', array('jquery'), false, false);
wp_enqueue_script('Gmap', get_template_directory_uri().'/js/map.js', array('jquery'), false, true);
wp_enqueue_script('numcount', get_template_directory_uri().'/js/numcount.js', array('jquery'), false, true);
wp_enqueue_script('PageScroll2i', get_template_directory_uri().'/libs/pagescroltoid-1.5.7/jquery.malihu.PageScroll2id.min.js', array('jquery'), false, true);
}
add_action( 'wp_enqueue_scripts', 'mystyle_scripts'
