ChSTU repository
ChSTU repository preserves and enables easy and open access to all types of digital content including text, images, moving images, mpegs and data sets
Learn More
Please use this identifier to cite or link to this item:
https://er.chdtu.edu.ua/handle/ChSTU/6908Full metadata record
| DC Field | Value | Language |
|---|---|---|
| dc.contributor.advisor | Карапетян , Анаіт Радіківна | - |
| dc.contributor.author | Вихристенко, Володимир Сергійович | - |
| dc.date.accessioned | 2026-01-26T12:17:17Z | - |
| dc.date.available | 2026-01-26T12:17:17Z | - |
| dc.date.issued | 2021-06-16 | - |
| dc.identifier.uri | https://er.chdtu.edu.ua/handle/ChSTU/6908 | - |
| dc.description.abstract | Метою даної кваліфікаційної роботи є розробка інформаційної системи для фотографа. Вона являє собою сукупність програмних засобів та методів, що мають за мету представлення результатів діяльності фотографа. В першому розділі сформульовано задачу, відображено аналіз аналогів, на основі якого виявлено характеристики, які повинен містити програмний продукт, щоб надати користувачам функціонал, який не буде гіршим від аналогів. Другий розділ описує характеристики сайту: основні задачі, системні вимоги, стандарти вхідних та вихідних параметрів. В третьому розділі відображено особливості реалізації програмного продукту та етапи його створення. | uk_UA |
| dc.language.iso | uk | uk_UA |
| dc.subject | web-ресурс | uk_UA |
| dc.subject | WordPRess | uk_UA |
| dc.subject | розробка | uk_UA |
| dc.subject | інформаційна система | uk_UA |
| dc.subject | веб-орієнтована | uk_UA |
| dc.title | Створення Web-орієнтованої інформаційної системи для фотографа | uk_UA |
| dc.type | Bachelor Thesis | uk_UA |
| Appears in Collections: | 126 Інформаційні системи та технології (Web-технології, web-дизайн) | |
Files in This Item:
| File | Description | Size | Format | |
|---|---|---|---|---|
| РЕП_БАК_Вихристенко_Web-1711.pdf Restricted Access | 4.4 MB | Adobe PDF | View/Open Request a copy |
Items in DSpace are protected by copyright, with all rights reserved, unless otherwise indicated.
Extracted text
МІНІСТЕРСТВО ОСВІТИ І НАУКИ УКРАЇНИ
ЧЕРКАСЬКИЙ ДЕРЖАВНИЙ ТЕХНОЛОГІЧНИЙ УНІВЕРСИТЕТ
ФАКУЛЬТЕТ ІНФОРМАЦІЙНИХ ТЕХНОЛОГІЙ І СИСТЕМ
Кафедра інформаційних технологій проектування
Пояснювальна записка
до кваліфікаційної роботи
бакалавра
(освітньо-кваліфікаційний рівень)
на тему: «Створення Web-орієнтованої інформаційної системи для фотографа»
Виконав: студент 4 курсу, групи Web-1711
Спеціальності 126 «Інформаційні системи та
технології»
ОП «Web-технології, Web-дизайн»
Вихристенко В.С.
(прізвище та ініціали)
Керівник Карапетян А.Р.
(прізвище та ініціали)
Рецензент
(прізвище та ініціали)
Черкаси 2021 року
Черкаський державний технологічний університет
(повне найменування вищого навчального закладу)
Факультет інформаційних технологій і систем
Кафедра інформаційних технологій проектування
Освітній рівень бакалавр
Спеціальність 126 «Інформаційні системи та технології»
Освітня програма Web-технології, Web-дизайн
ЗАТВЕРДЖУЮ
Зав. кафедри ІТП
________ Прокопенко Т.О.
«___» __________ 2020 року
З А В Д А Н Н Я
НА КВАЛІФІКАЦІЙНУ РОБОТУ СТУДЕНТУ
Вихристенко Володимиру Сергійовичу
(прізвище, ім’я, по батькові)
1. Тема роботи Розробка інформаційної системи для компанії фотографа
Керівник роботи Карапетян Анаїт Радіківна, к.т.н., доцент кафедри ІТП
(прізвище, ім’я, по батькові, науковий ступінь, вчене звання)
Затверджені наказом Черкаського державного технологічного університету від
«___» _____________ 20__ року №_____
2. Строк подання студентом роботи _______________________________
3. Вихідні дані до роботи CMS WordPress; Photoshop
теорія розробки Web-орієнтованих систем; теорія управління проектами
4. Зміст розрахунково-пояснювальної записки (перелік питань, які потрібно
розробити)
Вступ; 1 встановлення цілей створення сайту та проблеми, яку вирішить
його створення; 2 Дослідження предметної галузі та технічне завдання;
3 Реалізація інформаційної системи для фотографа; Висновок;
Додаток; Список використаних джерел.
5.
6. Консультанти розділів роботи
Розділ Прізвище, ініціали та посада Підпис, дата
консультанта Завдання Завдання
видав прийняв
7. Дата видачі завдання
КАЛЕНДАРНИЙ ПЛАН
Строк
№ Назва етапів кваліфікаційної роботи виконання
з п
/ етапів примітка
роботи
1 Підготовча стадія
1.1 Постановка задачі
1.2 Підготовка завдання
1.3 Погодження завдання
1.4 Затвердження завдання
2 Основна стадія
2.1 Підбір матеріалів
2.2 Аналіз шляхів рішення поставленої задачі
2.3 Розрахунок основних параметрів роботи
2.4 Вибір кінцевого варіанту проектного
рішення
2.5 Оформлення первісної редакції роботи
3 Заключна стадія
3.1 Узгодження прийнятих проектних рішень
з керівником
3.2 Оформлення пояснювальної записки роботи
в кінцевій редакції
3.3 Попередній захист роботи
3.4 Затвердження роботи
3.5 Рецензування роботи
3.6 Захист роботи
Студент дипломник ______________ Вихристенко В.С.
(підпис) (прізвище та ініціали)
Керівник роботи ______________ Карапетян А.Р.
(підпис) (прізвище та ініціали)
АНОТАЦІЯ
Метою даної кваліфікаційної роботи є розробка інформаційної системи
для фотографа. Вона являє собою сукупність програмних засобів та методів, що
мають за мету представлення результатів діяльності фотографа.
В першому розділі сформульовано задачу, відображено аналіз аналогів,
на основі якого виявлено характеристики, які повинен містити програмний
продукт, щоб надати користувачам функціонал, який не буде гіршим від
аналогів.
Другий розділ описує характеристики сайту: основні задачі, системні
вимоги, стандарти вхідних та вихідних параметрів.
В третьому розділі відображено особливості реалізації програмного
продукту та етапи його створення.
Загальний об’єм роботи __сторінки, __рисунків, __таблиць, __джерел
інформації.
КЛЮЧОВІ СЛОВА: Веб-ресурс, WordPRess, Сайт, Дизайн.
ANNOTATION
The purpose of this qualification work is to develop an information system for
the photographer. It is a set of software tools and methods aimed at presenting result
of the photographer work.
The first section reflects the current task, show the analysis of analogues, based
on which the characteristics that must contain a software product to provide users
with functionality that is not worse than in the analogues.
The second section describes the characteristics of the Web-page, these are:
basic tasks, system requirements, standards of input and output parameters.
The third section reflects the features of the software product and its stages of
creations.
The project contains __ sheets, __illustrations, __tables and used __sources of
information.
KEYWORDS: Web-resource, WordPress, Web-page, Design.
АННОТАЦИЯ
Целью данной квалификационной работы является разработка
информационной системы для фотографа. Она представляет собой
совокупность программных средств и методов, имеющих целью представить
результаты работы фотографа.
В первом разделе сформулировано задачу, проведен анализ аналогов, на
основе которого определены характеристики, которые должен содержать
программный продукт, чтобы предоставить пользователям функционал, не
представленный в аналогах.
Второй раздел описывает характеристики Web-страницы: основные
задачи, системные требования, стандарты входных и выходных параметров.
В третьем разделе отражены особенности реализации программного
продукта и этапы его создания.
Общий объем работы __страниц, __рисунков, __таблиц, __источников
информации.
КЛЮЧЕВЫЕ СЛОВА: Веб-ресурс, WordPress, Сайт, Дизайн.
ЗМІСТ
ВСТУП …………………………………………………………………............5
1 ВСТАНОВЛЕННЯ ЦІЛЕЙ СТВОРЕННЯ САЙТУ ТА ПРОБЛЕМИ, ЯКУ
ВИРІШИТЬ ЙОГО СТВОРЕННЯ …………………………………………....7
1.1 Встановлення цілей створення сайту ..……………………………….7
1.2 Встановлення цільового сегмента клієнтів ..…………………………8
1.3 Аналіз аналогів сайту ………………………………………………….10
1.4 Обґрунтування типу розробки Web-вузла ....………………………...12
1.5 Висновки до розділу 1 ……………………………..………………..…17
2 ДОСЛІДЖЕННЯ ПРЕДМЕТНОЇ ГАЛУЗІ ТА ТЕХНІЧНЕ ЗАВДАННЯ..19
2.1 Характеристика предметної галузі ……………………………………20
2.2 Аналіз аналогів CMS …………………………………………………..21
2.3 Постановка задачі ……………………………………………………...19
2.4 Сфера застосування ………………………………………………........23
2.5 Функції системи ……………………………………………………......24
2.6 Зв’язок із зовнішнім середовищем ……………………………………24
2.7 Вимоги до обчислюваного середовища ………………………………25
2.8 Вибір програмного середовища розробки ……………………………26
2.9 Висновки до розділу 2 ………………………………………………….40
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
3 РЕАЛІЗАЦІЯ WEB-ОРІЄНТОВАНОЇ ІНФОРМАЦІЙНОЇ СИСТЕМИ ДЛЯ
ФОТОГРАФА ………………………………………………………………....41
3.1 Розробка Web-орієнтованої інформаційної системи ……………….41
3.2 Адміністрування Web-орієнтованої інформаційної системи
та її інтерфейс ….…………………………………………………….…...49
3.3 Висновки до розділу 3 ………………………………………………..80
ВИСНОВКИ …………………………………………………………………..81
ДОДАТОК А Web-орієнтована інформаційна система. Специфікація …..75
СПИСОК ВИКОРИСТАНИХ ДЖЕРЕЛ ……………………………………91
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
СПИСОК СКОРОЧЕНЬ ТА УМОВНИХ ПОЗНАЧЕНЬ
HTML (Hyper Text Markup Language) – мова розмітки гіпертекстових
документів
CSS (Cascading Style Sheets) – каскадні таблиці стилів
CMS (Content Management System) – система керування вмістом
PHP (Hypertext Preprocessor) – гіпертекстовий препроцесор
SEO (Search Engine Optimization) – пошукова оптимізація сайту
MySQL – система керування реляційними базами даних
JS (JavaScript) – мова програмування
API (Application Programming Interface) – прикладний програмний інтерфейс
HTTP (Hyper Text Transfer Protocol) – протокол передачі даних
HTTPS -
БД – база даних
БЗ – база знань
ActiveDirectory -
OpenOffice -
Microsoft Office –
CSV –
Excel –
XML –
LiveJournal –
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
ВСТУП
Розвиток Web-галузі стає все більш стрімким та приваблює все
більше клієнтів та розробників. Інтернет став найбільш ефективним
засобом реклами та він є одним з важливіших елементів нашої
цивілізації. Інтернет може задовольнити усі потреби сучасної людини –
це покупки, укладання угод, пошук клієнтів і тп. Було обрано задачу
створити Web-сайт фотографа. Для створення Web-сторінок потрібні
трендові рішення у дизайні та розробці самої структури, також
використання додаткових інструментів, щоб пришвидшити результат.
В сфері фотографії булу виявлено велику потребу в сайтах з
оновленим дизайном, неординарним у розумному плані. В наш час
велике число сайтів фотографів є застарілими та непридатними до
оновлення. Потрібно, щоб сайт був адаптований під усі системи. Також
потрібно, щоб сайт легко можна було адаптувати під вимоги замовника.
Як варіант можна використовувати системи управління вмістом
сайту з відкритим вихідним кодом WordPress. Дана система не є новою,
але для того, щоб розробник створив сайт, а замовник в майбутньому міг
його редагувати самостійно – це кращий варіант.
Метою роботи є створення Web-сайту для фотографа, за допомогою
WordPress. Використовуючи його, замовник з легкістю зможе редагувати
свої сторінки у майбутньому.
Web-сторінки повинні мати такі характеристики:
- оптимізована графічна та текстова інформація;
- зручна навігація;
- зручний інтерфейс;
- адаптивність до усіх пристроїв;
- кросбраузерність.
Актуальність полягає у використанні усіх можливостей CMS
WordPress для створення якісної Web-орієнтованої інформаційної
системи, яку зможе редагувати, доповнювати та наповнювати контентом
людина, яка далека від знань азів програмування.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Також актуальність створення полягає у підтримці процесу
інформатизації клієнтів фотографа, що забезпечить доступ до інформації
про його унікальність, портфоліо, ціни, сприятиме висвітленню його
діяльності та формуванню позитивного іміджу.
Об’єктом дослідження є можливості CMS WordPress, етапи
створення Web-сайту за його допомогою.
Предметом дослідження є створення Web-орієнтованої
інформаційної системи, що в майбутньому буде обслуговуватися
людиною без знань азів програмування.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
1 ВСТАНОВЛЕННЯ ЦІЛЕЙ СТВОРЕННЯ САЙТУ ТА
ВСТАНОВЛЕННЯ ПРОБЛЕМИ, ЯКУ ВИРІШИТЬ ЙОГО СТВОРЕННЯ
1.1 Встановлення цілей створення сайту
Даний етап є одним з важливіших у створенні сайту тому, що
неможна дійти поставленої цілі, якщо вона поставлена невірно. Від цілі
буде залежить увесь наступний процес створення вашого сайту, кожен
його етап. Тому до поставлення цілі треба підійти з максимальною
серйозністю. Правильно поставлена ціль – це вже половина успіху.
Створення сайту для фотографа Рєшмеділова Валерія переслідує
наступні цілі:
1) Допомогти фотографу затвердитися в мережі Інтернет.
Наявність свого Web-сайту покращує репутацію фотографу
серед потенціальних клієнтів.
2) Стати інструментом поширення інформації про фотографа, про
його здібності, послуги. Повноцінний Web-сайт представляє
усім користувачам матеріали (документи, аудіо-,
фотоматеріали), необхідні для формування позитивної думки
про фотографа.
3) Збільшити кількість клієнтів. Через те, що в Інтернеті відстань
не має принципового значення, фотограф, за допомогою сайту,
може залучити більшу кількість потенційних клієнтів, які
цікавляться фотографією.
4) За допомогою сайту можливо не тільки швидко відповідати на
повідомлення, які виникають у замовників, але й формувати базу
поширених запитань.
5) Дізнаватися думки про фотографа. За допомогою сайту можливо
провести різні опитування, аналізи, з ціллю виявлення
відношення у цілому до фотографії.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
1.2 Встановлення цільового сегмента клієнтів
Сегментація – розподіл ринку на групи, що володіють схожими
характеристиками, з метою вивчення їх реакції на той чи інший товар або
послугу.
Сегмент – група покупців, що володіє схожими потребами,
бажаннями і можливостями. Поділ ринку на різні сегменти і їх подальше
вивчення дозволяє компаніям сконцентрувати свою увагу на найбільш
перспективних, з точки зору прибутковості, сегментах.
Цільова аудиторія – певна по будь-якою ознакою група
користувачів, до залучення якої зацікавлен автор.
Визначення та пошук цільової аудиторії фотографа – один з
основних питань при створенні сайту. Правильна відповідь на нього
гарантує сайту успішність і привабливість.
1) Вибір сегмента ринку:
- тип цільової аудиторії – цільова аудиторія в сфері людей, що
мають відношення до фотографії (люди захоплюються
фотографією), бажаючі зберегти важливі моменти в житті;
- тип відвідувачів – відвідувачі від 14 до 45 років;
- тип мотивації – любов до фотографії, бажання зробити якісну
фотозйомку, бажання зберегти особливі моменти життя.
2) Портрет цільової аудиторії:
- географічні: щільність – будь-який населений пункт;
- демографічні: вік від 14 до 45 років;
- економічні: рівень доходу – середній або вище середнього;
- психологічні: люди, що мають відношення до фотографії або
люди, які мають бажання отримати якісні фотозйомки.
- поведінкові звички: інтерес до всього нового, незвичного і в той
же час інформаційно корисного.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
1.3 Аналіз аналогів сайту
У цьому розділі будуть розглянуті і проаналізовані сайти-аналоги
фотографів.
Схема аналізу:
1) Зовнішній вигляд;
2) Структура і навігація;
3) Контент (вміст);
4) Юзабіліті;
5) Головні цілі дизайну;
6) Рекомендації щодо поліпшення дизайну.
Проведемо аналіз офіційного сайту фотографа Марини
Скутіной (http://www.marinaphoto.ru). Не зовсім вдале доменне ім’я
– не містить назву, не відразу зрозуміло чому присвячений сайт.
Хіба, що фотографії представлені на головній сторінці дають мале
уявлення про те де ми знаходимося.
Рисунок 1.1 – Головна сторінка сайту Марини Скутіної
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Другорядної сторінки, як такої не має, представлено лише
портфоліо.
1) Кольорова гамма сайту добре підібрана. Білий, чорний і жовті
кольори добре поєднуються один з одним, але дане поєднання
зухвале, інформація в активному полі майже не читається.
2) Навігація даного сайту не зовсім зручна, оскільки кнопки не
названі своїми іменами, наприклад: кнопка фотограф веде на
головну сторінку. Інформація надана по розділах – за альбомами
фотографій.
3) Основна мета даного сайту – надання інформації про фотографа
Марини Скутіной.
4) Даний сайт доступний для всіх платформ і браузерів. Уся
інформація на сайті буде зрозуміла для його відвідувача.
5) Сайт не зовсім зручний і зрозумілий в експлуатації, але на ньому
досить добре і цікаво представлені роботи, за рахунок цього
можна закрити очі на навігацію.
6) Дуже хороший сайт, приємний у роботі, цікаве оформлення, дає
додаткове уявлення про фотографа.
Проведемо аналіз сайту «Андрей@Шишов фотограф»:
Вдале доменне ім’я – має Ім’я та також одразу зрозуміла сфера
діяльності.
Рисунок 1.2 – Головна сторінка сайту Андрія Шишова
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
1) Сайт витримано у білому кольорі – кольорі свята та весільного
плаття. Присутні вкраплення чорного для виділення посилань, а
також білий служить фоном. В цілому вдала кольорова гамма.
2) Навігація сайту зручна, присутня на усіх сторінках. Інформація
надана по розділах, що дозволяє швидко знайти необхідне.
3) Основна мета даного сайту – надання інформації про фотографа
і надання його портфоліо.
4) Даний сайт доступний для всіх платформ і браузерів. Зміст сайту
зрозумілий для відвідувачів.
5) Сайт зручний і зрозумілий в експлуатації. Негативних емоцій не
викликає.
6) У цілому, вдалий варіант виконання сайту, ось тільки білого
забагато і прогалин. Їх можливо прикрити зображенням або ж
корисною інформацією.
Проведемо аналіз сайту «фотограф Дмитрий Судаков»:
Вдале доменне ім’я, містить назву та також зрозуміла сфера
діяльності автора.
Рисунок 1.3 – головна сторінка сайту Дмитра Судакова
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
1) В оформленні сайту є багато білого, присутні вкраплення
коричневого та бежевого. Не зовсім вдалий варіант кольорової
гамми, виглядає занадто просто.
2) Навігація сайту не зовсім зручна, відсутня на кожній сторінці.
Інформація надана за альбомами, що не дає можливості швидко
знайти необхідне.
3) Основна мета даного сайту – надання інформації про фотографа
і надання портфоліо.
4) Даний сайт доступний для всіх платформ і браузерів. Зміст сайту
зрозумілий для відвідувачів.
5) Сайт простий в експлуатації. Негативних емоцій не викликає.
6) Сайт хороший в плані кількості представлених робіт, але
виглядає занадто просто. Можна додати картинок, анімації,
яскравих кольорів.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
1.4 Обґрунтування розробки типу Web-вузла
Найчастіше сайти діляться на наступні категорії (види):
1) Сайт-візитка – зазвичай складається з декількох сторінок і має
унікальний, але простий і функціональний дизайн. Ідеально
підходить для компаній які хочуть розмістити інформацію про
себе і свої послуги в Інтернеті. Основні розділи сайту: «Про
компанію», «Продукція або послуги», «Прайс-лист», «Контактна
інформація». Сайт-візитка використовується підприємствами,
організаціями та приватними особами.
2) Корпоративний інформаційний Web-сайт – необхідний для
автоматизації внутрішнього документообігу, обліку показників
компанії, управління персоналом, може бути оснащений
функціями обміну інформацією між віддаленими філіями.
Корпоративний сайт позитивно впливає на репутацію та імідж
компанії. Дизайн повинен відповідати фірмовому стилю
компанії. Найчастіше, включає «адміністраторську частину» для
створення і зміни контенту, що дозволяю менеджеру або
секретарю компанії додавати або змінювати новини,
інформаційні статті, довідкові та іншу інформацію на сайті.
Використовується мінімум графіки, основний упор йде на текст.
3) Корпоративний іміджевий Web-сайт – ідеально підходить для
забезпечення іміджевої присутності в Інтернеті. Сайт служить
для надання докладної інформації про компанію, історії торгової
марки, відомостей про послуги які надає компанія або про
товари які вона постачає. Корпоративний сайт зазвичай містить
стрічку новин компанії, засіб публікації інформації про рекламні
та торгівельні акції, інформацію для преси та інші відомості.
Нерідко корпоративні сайти поєднують інформацію про
компанію з каталогом продукції. Використовується
ексклюзивний оригінальний дизайн. Процентне відношення
тексту та графіки 50/50.
4) Інтернет-магазин, він же Мережевий магазин, Електронний
магазин, Internet shop, E-shop – інтерактивний Web-сайт який
рекламує товар або послуги, приймає замовлення на покупку,
пропонує користувачеві вибір варіанту розрахунку, який
виписує рахунок на оплату, що є одразу підтвердженням
замовлення. При цьому адміністратор магазину зобов’язаний:
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
- Організувати доставку товару;
- Проконтролювати розрахунки з покупцем за поставку.
5) Інформаційний сайт – досить великий віртуальний масив
інформації, що включає в себе безліч різних тематичних розділів
меншого розміру, або кілька самостійних проектів. Є для клієнта
основним джерелом інформації, нагадує енциклопедію або
спеціалізований журнал.
6) Ігровий портал – складний розважальний інтерактивний проект,
який передбачає більшу відвідуваність і ресурсоємність.
Персональний проект – особистий проект, містить все, що
завгодно і оформляється в будь-якому стилі, який найбільш
повно зможе розкрити й відобразити тематику сайту.
7) Контент-проект – це сайт, як правило некомерційної
спрямованості, який являє собою зібрання текстів, статей та
інших матеріалів, основне завдання якого – залучення
відвідувачів з певної тематики. Надалі, цей трафік зазвичай
перенаправляється на комерційні сайти і, по суті, контент-проект
використовується, як рекламний майданчик. Може бути
виконаний у вигляді інтернет-бібліотеки, енциклопедії або
довідника. Кожна окрема сторінка сайту контент-проекту дає, як
правило, незначний трафік, однак загальний трафік ткого сайту
може бути дуже значним. Контент-проект, за умови розміщення
на ньому відповідної за тематикою реклами, дає найякісніший і
тематичний трафік на комерційні сайти партнерів (а значить і
конвертацію відвідувачів і покупців) тому, що ця тема з дуже
високою часткою ймовірності буде цікава більшості
відвідувачів, які прийшли з сайту контент-проекту. Також може
являти собою освітній або розважальний ресурс.Промо-сайт – це
сайт створений спеціально для просування будь-якого товару
або послуг або основного сайту компанії. Промо-сайт – це
майже завжди не основний сайт компанії, винятком тут може
бути тільки промо-сайт, створений фірмою спеціально для
просування одного конкретного продукту або товарної групи.
Причина цього лежить в оптимізації сайту з метою отримання
більш високих місць в рейтингах пошукових машин, які дають
сайту (а значить – компанії) більшу кількість відвідувачів, а
значить більший дохід. Промо-сайт зазвичай добре оптимізують
під пошукові машини, для яких він в основному і призначений.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Справа в тому, що з точки зору оптимізації набагато вигідніше
створити кілька сайтів з більш вузькою і націленою тематикою,
та оптимізувати їх кожен за своєю специфікою. У загальному
підсумку, віддача від вкладення коштів у створення основного
сайту компанії зростає багаторазово.
8) Сайт-форум може бути самостійним сайтом, а може бути
розділом сайту. Найчастіше сайт-форум робиться на під домені
основного сайту і призначений для організації спілкування
відвідувачів сайту між собою і з адміністраторами сайту. Сайт-
форум може бути зручним способом набору контенту для
основного сайту. Нові теми, відкриті на форумі можуть бути
використані в якості анонсу нових статей для стрічки новин
основного сайту або анонса статей, витяги з яких можна
використовувати для поштової розсилки. Використовуючи сайт-
форум спільно з поштовою розсилкою, можна швидко
збільшити відвідуваність основного сайту. Таким чином, сайт-
форум – хороший інструмент для проведення маркетингових
досліджень ринку і розкручування основного сайту.
9) Блог – це сайт, який представляє собою інтернет-щоденник, або
журнал, який ведеться на зразок стрічки, при цьому на кожну
тему блогу відвідувачі можуть залишати свої коментарі-
повідомлення, доступні з головної сторінки відповідної теми.
Блог зазвичай дуже часто оновлюється, з цієї причини він може
набагато частіше індексуватися пошуковими машинами, ніж
звичайні сайти. Блог часто використовується для спілкування
людей об’єднаних певними загальними інтересами, і в цьому,
чимось, нагадує форум. Самі останні події в світі часто раніше
з’являються на різних блогах, і тільки трохи пізніше в
повідомленнях новинних інтернет-видань. Загалом можна
говорити про те, що блог є дивним гібридом стрічки новин,
гостьової книги і форуму одночасно.
Виходячи з поставлених перед створенням сайту цілей і завдань,
сайт фотографа Рєшмеділова Валерія підходить під категорію «1», тобто
«Сайт-візитка».
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
1.5 Висновки до розділу 1
В першому розділі було здійснено аналітичний огляд існуючих сайтів
фотографів, та детально їх проаналізовано. Виявлено недоліки в аналогічних
сайтах. Загалом проблемні місця – кольорова гамма, навігація, зміст. Також
було описано різні види сайтів, та обрано один для наших задач. Їм виявився
«сайт-візитка», за цим варіантом і будемо створювати даний сайт. Також було
поставлено цілі для створення сайту, за допомогою яких розробка в декілька
разів буде легше.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
2 ДОСЛІДЖЕННЯ ПРЕДМЕТНОЇ ГАЛУЗІ ТА ТЕХНІЧНЕ
ЗАВДАННЯ
2.1 Характеристика предметної галузі
Фотографія дуже різноманітна галузь. Є дуже багато видів зйомки,
тому потрібно зазначити характеристики, які повинен мати сайт.
Характеристики, які повинен мати сайт людини, яка займається
фотографією/зйомками:
- ідею (мається на увазі у дизайні);
- зрозумілість;
- простота (у дизайні, але не завжди це рішення є вдалим);
- змістовність;
- форма зворотнього зв’язку;
- простота оновлення (щоб замовник у подальшому міг сам
адмініструвати сайт);
- відображення цінової політики.
Web-сторінка з такими характеристиками буде цінною у сфері
зйомок/фотографії.
Фотограф - це не просто професія, це стиль життя. Кожен фотограф,
що займається комерційною зйомкою, повинен володіти різнобічними
якостями, тому що в наш час, на жаль, неможливо заробити на життя,
займаючись одним яким-небудь видом зйомки. Основні напрямки
монетизації діяльності фотографа: з одного боку - це фотожурналістика і
документальна фотографія. Це свого роду інтелектуальний high-end, і до
того ж грошей тут набагато менше. А з іншого - це комерційний high-end:
fashion-зйомка і весільна фотографія. це найбільш затребуване і годує велику
кількість фотографів, в тому числі і підробляють цим час від часу
фотожурналістів. окремо - комерційне фото-освіту. Часом вчити фотографії
вигідніше, ніж фотографувати. Мабуть, більш значуща за обсягами
замовлень - це все-таки приватна клієнтура. Все залежить від здібностей
фотографа до Самопросування, самомаркетінгом. Фотограф - це в основному
Фрілансерські робота, і фотограф повинен бути не два в одному, а, скажімо,
сім в одному - і фотограф, і маркетолог, і сам собі агент, і ще багато чого.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Web-сторінки у галузі зйомок/фотографії
Головною ціллю Web-сайту у сфері зйомок/фотографії є показати свої
роботи, для того щоб у подальшому зацікавити більше клієнтів. Також не
можна забувати про те, що даний тип сайту буде просувати замовника у
мережі. Наявність особистого сайту задає одразу гарну думку про майстра.
Гарно зроблений сайт з легкістю зацікавить відвідувачів продивитися
роботи фотографа, що є головним аспектом у створенні. Якщо ж люди будуть
дивитися роботи майстра, то скоріш за все вони у подальшому йому
подзвонять за для детальної інформації.
За останні декілька років виїзні фотосесії, фотосесії у парках, у студії
набули чималого попиту. Дуже багато людей почали наймати фотографів,
щоб зберегти важливі моменти свого життя. Тому можливість продивитися
роботи майстра онлайн дає нам перевагу у зацікавленні клієнтів.
Web-сторінка буде реалізована за допомогою CMS WordPress. CMS –
це інформаційна система або програма, що забезпечує організацію сумісного
процесу створення, редагування та управління контентом. Також є плагіни,
які надають можливість, в подальшому, після розробки сайту розробником,
редагувати його самостійно власником сайту, без залучення додаткових
інвестицій для пошуку розробника.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
2.2 Аналіз аналогів CMS
CMS (Content Management System) – це спеціалізоване ПО, призначене,
по-перше, для автоматизованої розробки динамічних сайтів, а по-друге, для
їх підтримки. Але інтернет-проект створюється один раз, а ось контент на
ньому доводиться редагувати постійно. Тому з точки зору людини, що
забезпечує оновлення інформації на сайті, CMS – це система управління
змістом проекту або, в повсякденній термінології, движок сайту. CMS-
системи дозволяють не тільки оперативно публікувати важливу інформацію,
а й організувати чітку і прозору систему підготовки документів до
публікації.
Системи управління сайтом або CMS – дуже важливі сьогодні. Для
найбільш чіткого розуміння даного терміна слід його пояснити: так, CMS в
перекладі з англійської означає «Система управління контентом», тобто,
вмістом сайту. На сьогоднішній день CMS являє собою найбільш простий і
зручний спосіб створити свій сайт і здійснювати управління ним. CMS – це
програми для Web-сервера, які суттєво спрощують створення і підтримку
роботи сайту.
Сайт по своїй суті являє собою Web-додаток, у якому постійно
потрібно оновлювати і додавати інформаційне наповнення. Система
управління контентом дозволяє без особливих зусиль наповнювати сайт
текстами, картинками, створювати необхідну кількість сторінок і видаляти
їх. Застосування CMS дозволяє управляти сайтом навіть тим, хто не
знайомий з мовами програмування, не знає html-код і, відповідно, не має
спеціальних навичок. Крім того, CMS зазвичай включає в себе всі необхідні
для наповнення сайту скрипти: фотогалереї, системи коментарів,
голосування та інші.
Історія управління контентом почалася з управління документами в
класичному розумінні цього слова – текстовими файлами. У міру розвитку
поняття «документ», системи управління документами стали називати
системами управління контентом, підкреслюючи здатність таких систем
управляти інформацією незалежно від форми її подання, а також
відокремити інформацію або контент від документа-форми. Однак
абстрактно управляти інформацією неможливо – вона обов’язково повинна
бути представлена в будь-якій формі. Намагаючись управляти контентом, ми
неминуче прийдемо до управлінням документами. Системи управління
контентом, дійсно, «навчилися» розділяти управління документами
(зберігання, зміна і т.п.) і їх представлення кінцевому користувачу.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Саме поняття «управління контентом» спочатку міцно асоціювалося з
процесом публікації та оновлення інформації на Web-сайтах – була потрібна
технологія, що дозволяла б стежити за її актуальністю. Тому, як синонім до
content management часто використовують Web content management. В
результаті чого термін content management розширився: їм стали позначати
управління не тільки інформацією на сайті, але й всіма розрізненими і
різноманітними фрагментами корпоративної інформації.
Якщо сайт складається з десятка сторінок, то керувати ним можна. Але
підтримувати html сайт, що складається з декількох десятків і сотень
окремих сторінок, дуже складно, а іноді, практично неможливо. Щоб
полегшити життя власникам сайтів, були розроблені спеціальні програмні
засоби, які дозволяють управляти структурою сайту і його контентом.
Класифікувати CMS-системи можна за різними критеріями.
Основними з них є ціна, простота у використанні, рівень безпеки,
функціональні можливості.
Створити найпростішу CMS-систему може навіть початківець-
програміст. Найпростіший скрипт, що виконує завантаження інформації в
базу даних і відображення її за запитом користувача на певній сторінці сайту
на перший погляд наближено нагадує CMS-систему. Але різниця цього
скрипта і реальної системи управлінням сайту приблизно така ж, як між
велосипедом «Україна» і сучасним авіалайнером.
Перш за все, CMS бувають комерційні і з відкритим кодом, тобто
безкоштовні. Різниця між ними, напевно, не стільки в грошах, скільки у
витраті на розробку зусиллях. Безкоштовна система вимагає набагато більше
уваги при розробці проекту. Настільки, що може виникнути питання: чи є
сенс робити це самому або все є придбати комерційну версію?
Також безкоштовні системи досить часто накладають суттєві
обмеження на дизайн сайту і дуже рідко створюються як уніфікований
продукт. Як правило, вони є чиїмось рішенням якихось приватних завдань.
Очевидно, що народжене в таких умовах ПО може добре вирішувати
завдання створення такого ж роду сайтів, але може бути абсолютно не
пристосоване для вирішення завдань іншого плану, скажімо, електронної
комерції.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
У безкоштовних систем є й свої переваги. Вони цілком можуть підійти
для невеликих проектів за стандартним набором функцій. Якщо в
запропонованому переліку можливостей немає якоїсь функції, то завжди
можна звернутися до ентузіастів цієї системи за порадою. Як правило, для
найпопулярніших систем розроблена достатня кількість додаткових модулів
самих різних видів. Ці ж ентузіасти завжди допоможуть порадами по
налаштуванню системи. Нарешті, безкоштовні системи менш вимогливі до
умов хостингу проекту.
Комерційні ж системи сильні, перш за все, своєю оперативною
технічною підтримкою, своєчасними безкоштовними оновленнями,
можливістю поступового придбання додаткових модулів і впровадження їх у
свій інтернет-проект. Перед тим, як поцікавитися функціоналом і вартістю,
подумайте про інтуїтивно зрозумілий інтерфейс адміністративного розділу і
зручність роботи з системою для некваліфікованого користувача.
Для кращого розуміння можливостей сучасних CMS-систем, їх
відмінностей і можливостей розглянемо кілька найбільш популярних CMS-
систем: Bitrix, Joomla, WordPress.
Кожна з систем управлінням сайту має свої переваги і недоліки,
причому їх наявність мало залежить від того платна вона чи безплатна.
Оскільки переваги систем управління сайтом в основному мало
відрізняються один від одного: величезний функціонал, регулярні
оновлення, підтримка (для платних систем) і велика спільнота користувачів,
готових допомогти в їх освоєнні, ми розглянемо в основному недоліки таких
систем.
Програмне забезпечення «1С-Бітрікс: Управління сайтом» - один з
лідерів серед CMS в доменній зоні .ru.
Переваги системи 1С Бітрікс:
1) Великий функціонал. У переважній більшості випадків можна
обійтися взагалі без втручання в код і без якихось зайвих рухів. У
пакет Бітрікс входить більше 30 модулів, які дозволяють управляти
інформаційним наповненням, мати і вести великі БД і БЗ, різні
комунікаційні здібності, а також вести продаж товарів через
інтернет, є модулі для комплексного обслуговування проекту.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
2) Окремим пунктом можна відзначити можливість гнучкої інтеграції
з іншими системами і програмними комплексами. Залежно від
завдання можна використовувати різні модулі для інтеграції з
ActiveDirectory, OpenOffice і Microsoft Office. Підтримка
вивантаження і завантаження даних в наступних форматах: CSV,
Excel, XML та інших.
3) Безпека. Є велика кількість способів контролю доступу до ресурсів і
окремих баз даних, забезпечення цілісності інформації, що
зберігається, а також конфіденційності. Унікальний активний
фільтр захисту, посилена авторизація, антивірус, захист відвідувачів
і багато іншого.
4) Продуктивність і масштабування. Ще одна сильна сторона
платформи 1С Бітрікс: за результатами навантажувальних тестувань
1 сервер здатний обробляти порядку декількох мільйонів запитів.
Це обумовлено відмінно опрацьованою внутрішньою архітектурою
платформи, кешуванням даних, а також деякими унікальними
рішеннями. У 10 версії підтримується власний програмний Web-
кластер. Він дозволяє розподіляти БД Web-додатків на кілька різних
серверах і динамічно змінювати навантаження між ними.
5) Платформа написана на кросплатформенній мові програмування
PHP, що дає можливість встановлювати сайти на практично будь-
якому поєднанні системного і апаратного програмного
забезпечення.
6) Багатосайтовість та багатопортальність. Як і у випадку з WordPress,
Бітрікс вміє розгортати кілька ресурсів під однією системою
управління, однією системою розмежування прав доступу і
авторизації. Дозволяє використовувати загальну аналітику і
рекламні поля, загальні сховища даних. При цьому ресурс буде
знаходитися на єдиному сервері.
У той же час, і ця система не позбавлена свої недоліків. Тут
відображені деякі з них:
1) Бітрікс є вельми повільною і вимогливою до ресурсів системою,
особливо в порівнянні з безкоштовними CMS-аналогами.
2) Найчастіше Бітрікс створює зайве складні SQL-запити.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
3) Ряд користувачів відзначає, що система складна і перевантажена,
навіть найпростіші дії типу створення сторінки вимагають досить
високої кваліфікації адміністратора системи.
4) Система буває нестабільною. Можливі проблеми, пов’язані з
оновленням версії CMS.
5) Бітрікс позиціонується, як найскладніша і безпечна система, однак в
ній були виявлені потенційні уразливості (втім, вони були
оперативно виправлені).
Бітрікс позиціонується, як система, яка не вимагає знання
програмування – але грамотне доведення сайту до готовності без знання мов
програмування майже неможливе. Деякі користувачі відзначають, що API
Бітрікс є досить складним для освоєння.
«1С-Бітрікс: Управління сайтом» в порівнянні з іншими системами
складна для самостійного вивчення. Бітрікс використовує застарілу і невдалу
архітектуру – занадто великий відсоток даних зберігається на сервері у
вигляді файлів.
Наслідком невдалої архітектури системи є навантаження на сервер, яке
створюється в процесі створення бекапа (оскільки, як уже було зазначено,
значну кількість даних зберігає на сервері у вигляді файлів).
Від співробітників або представників 1С-Бітрікс досить складно
домогтися безкоштовної допомоги, в той час як в інших спільнотах,
особливо в спільнотах безкоштовних CMS-систем, можна з легкістю знайти
допомогу у однодумців.
Документація для 1С-Бітрікс схильна оновлюватися вкрай повільно.
Крім недоліків стовно безпосередньо роботи системи є недоліки які
проявляються в витратах на підтримку. Наприклад, Бітрікс має завищені
вимоги до хостингу.
Під Бітрікс, як правило, потрібно вибирати спеціальний тариф на
хостингу, тільки тоді система буде працювати нормально. А тарифи такі
коштують значно дорожче в порівнянні зі звичайними. Тому використання
Бітрікс – це реально дорого.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Через це, використовувати Бітрікс для сайту з 5 статичних сторінок, як
мінімум нерозумно і марнотратно.
Joomla є однією з найпопулярніших систем управління сайтом. Вона
істотно спрощує створення сайту. За допомогою CMS Joomla будь-яка
людина, що не володіє глибокими знаннями сучасних web-технологій, може
створювати потужні динамічні сайти.
Переваги Joomla:
1) Безплатність. Мабуть, це найбільший плюс. Початківці
сайтобудівники, які прочитали статті про заробіток в Інтернеті, на
початковому етапі свого розвитку, не готові витрачати гроші на
придбання комерційних CMS.
2) Всі вихідні коди Joomla є відкритими. Користувачі можуть вносити
в них будь-які зміни. Ця перевага системи є одним із серйозних
недоліків, оскільки сприяє швидкому знаходженню вразливостей
системи і як наслідок злому сайтів.
3) Простота установки CMS і зміни дизайну сайту. В Інтернеті можна
скачати безліч як платних, так і безкоштовних шаблонів для CMS
Joomla.
4) Достаток всіляких модулів і компонентів для цієї CMS.
5) Регулярне оновлення Joomla, а також безперервне створення нових
компонентів і модулів до неї.
6) Для установки CMS Joomla підходить переважна більшість
хостингів.
7) Наявність великої кількості ресурсів з підтримки користувачів цієї
CMS, в тому числі і україномовних.
Недоліки Joomla:
1) Одним з недоліків Joomla можна назвати труднощі при переході на
більш нову версію, коли можливе порушення деяких встановлених
компонентів, причому можливо лише послідовне оновлення через
проміжні версії.
2) Для ранніх версій Joomla актуальна і складність у встановленні
оновлень. На щастя, в останній версії реалізований автоматичний
пошук та установка оновлень.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
3) Joomla є лідером в числі систем-улюбленців зломщиків. Сайти на
цій системі досить часто піддаються атакам. Не останньою
причиною тут є і недостатньо висока захищеність системи, але
ситуація постійно покращується завдяки оперативній роботі
спільноти Joomla.
4) Складність освоєння. Доводиться визнати, що функціональність і
універсальність завжди вимагають деяких зусиль від користувача
для їх засвоєння. Вникнути в процес роботи з CMS не вийде так
легко.
5) Загальним недоліком, властивим для всіх безкоштовних систем, є
відсутність служби підтримки, але натомість користувач отримує
сотні навчальних матеріалів і посібників, а також десятки
майданчиків (форуми і т.п.) для обміну досвідом та вирішення
виникаючих проблем.
Переваги WordPress:
1) WordPress не просто так отримала репутацію надзвичайно простої у
використанні системи. Завдяки встановленим шаблонам користувач
може за кілька кліків розгорнути працездатний блог, а
підключивши кілька необхідних плагінів, ми отримаємо вже
повноцінну CMS. Крім того, користувачеві абсолютно не потрібно
знання HTML для роботи з сайтом. Це ідеальна платформа для
новачків.
2) Починаючи з версії 3.0 WordPress надає дуже зручні навігаційні
меню, значно підвищуючи юзабіліти сайту. При цьому меню і
сторінки легко налаштовуються, дозволяючи краще адаптувати сайт
під конкретні потреби.
3) Існують сотні безкоштовних тем, які можна застосувати на своєму
сайті. При бажанні завжди можна придбати ексклюзивні теми за
додаткову плату.
4) WordPress в поєднанні зі спеціальними плагінами дуже добре
дружить з SEO. В результаті ваш сайт має набагато більше шансів
отримати нових відвідувачів через пошукові системи.
На даний момент існує більше 13000 безкоштовних плагінів,
доступних для завантаження. Питання з можливістю розширення
функціоналу недоречне.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Недоліки WordPress. На жаль, не всі зміни всередині сайту
виконуються в WordPress так легко. Наприклад, якщо вам потрібно змінити
або видалити дати постів, то без деяких додаткових знань тут вже не
обійтися.
Незважаючи на те, що існує безліч готових шаблонів для WordPress,
деякі користувачі захочуть створити власні унікальні шаблони, і тут не
обійтися без знань CSS. У той же час ті, хто володіє подібними навичками,
цілком можуть віддати перевагу більш універсальній CMS.
Універсальність WordPress прихована в сотнях доступних плагінів.
Завдяки їм функціонал цієї CMS наблизився до таких систем як Drupal та
Joomla. Однак, установка занадто великої кількості плагінів може негативно
позначитися на швидкості завантаження сторінок. Найчастіше виникають
ситуації, коли для досягнення необхідного функціоналу буде потрібна така
кількість плагінів, що раціональніше буде вибрати іншу платформу.
Часті оновлення, які можна віднести як до недоліків, так і до переваг
системи. У будь-якому випадку, всі оновлення мають на меті підвищити
надійність, безпеку і юзабіліті системи, хоч і доставляють при цьому деяку
незручність адміністраторам сайтів.
Основним недоліком WordPress, як втім і всіх безкоштовних систем з
відкритим кодом, є їх слабка зломостійкість і як наслідок, необхідність
постійного контролю нововиявлених вразливостей, постійний і бажано
оперативний контроль оновлень. В іншому випадку сайти на основі даної
системи перетворюються на розсадник вірусів.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
2.3 Постановка задачі
Задача полягає у створенні Web-орієнтованої системи для фотографа,
яка дасть можливість клієнтам переглянути всі послуги, що пропонує його
компанія, а також в майбутньому сайт буде придатний до редагування
персоналом без знань програмування.
Сайт повинен завантажуватися швидко та мати можливість
розширюватися в майбутньому без втручання розробників. Відвідувач сайту
зможе переглянути усі послуги, що пропонує компанія та залишити заявку
на зворотній зв’язок. Сайт повинен містити інформацію про компанію та
обличчя проекту. Також на сайті мають бути контактні данні та адрес.
На сайті повинні бути такі сторінки:
1) «Головна»;
2) «Про нас»;
3) «Наші послуги»;
4) «Портфоліо»;
5) «Контакти».
Головна сторінка має містити останні новини про компанію (1,3), не
багато інформації про послуги (2), щоб зацікавити відвідувачів. Та
можливість підписатися на e-mail розсилку компанії (4). Також не потрібно
забувати про меню навігації (5), яке повинно бути на кожній сторінці.
Рисунок 2.1 – Макет головної сторінки сайту
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Сторінка «Про нас» має містити такі блоки інформації:
- блок інформації про саму компанію (1);
- блок інформації про останні новини компанії (2);
- блок інформації про засновників компанії (3);
Рисунок 2.2 – макет сторінки «Про нас»
Сторінка «Наші послуги» має містити інформацію про послуги, які
надає компанія.
Рисунок 2.3 – макет сторінки «Наші послуги»
Макет сторінки «Портфоліо» буде виглядати так само, як сторінка
«Наші послуги». Але на сторінці будуть міститися найкращі роботи
компанії.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Сторінка «Контакти» має містити адрес компанії, номер телефону та e-
mail. Також на сторінці має міститися форма зворотнього зв’язку.
Рисунок 2.4 – макет сторінки «Контакти»
2.4 Сфера застосування
Головна ціль даного продукту – розповісти про компанію, про її
послуги та показати портфоліо. Було зроблено розрахунок на те, що сайтом
будуть користуватися люди, зацікавлені в продукції компанії, а також
адміністратори, які завдяки простоті та зрозумілості CMS WordPress
самостійно зможуть оновлювати інформацію на сторінках.
Також потрібно враховувати, що для економії часу на розробці сайту,
було використано також такий продукт, як «BeTheme». Що є за стосунком
для CMS WordPress, це допоможе компанії в умовах пандемії зекономити на
заробітній платі для розробника. Є кілька шляхів реалізації цього проекту:
- писати сайт з нуля;
- створити за допомогою аналогів CMS WordPress;
- також можна використовувати конструктори сайтів
Є також альтернативне рішення поставлених до проекту задач – це
створення сайту за допомогою CMS WordPress. Так як використовуються
плагіни, робота буде виконана значно швидше ніж використовуючи інші
способи, що буде коштувати замовнику значно дешевше, а також завдяки
простоті системи, в майбутньому адміністратори зможуть оновлювати
інформацію без виклику програмістів.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
2.5 Функції Web-орієнтованої системи
Web-орієнтована система повинна виконувати такі функції:
- відображення роботи компанії
- містити послуги компанії
- надавати контактну інформацію та місце розташування
- мати форму «Зворотнього зв’язку»
Вихідними даними для Web-орієнтованої системи є підготовлений
контент для сторінок, що будуть створені на вимогу замовника.
2.6 Зв’язок із зовнішнім середовищем
Формати і протоколи обміну для вихідних даних
Вихідні дані потрібні для форми «Зворотнього зв’язку», ці текстові
дані вводяться за допомогою елементів інтерфейсу, є обмеження на поля
вводу до меж, що відповідають вимогам для надання правдивої інформації,
що спрощує роботу менеджера по фільтрації відправлених заявок. Для
доступу до Web-орієнтованої системи використаний розширений протокол
https для підтримки шифрування в цілях збільшення безпеки. HTTPS (аббр.
Від англ. HyperText Transfer Protocol Secure) - розширення протоколу HTTP -
HTTPS не є окремим протоколом. Це звичайний HTTP, що працює через
шифровані транспортні механізми SSL і TLS. HTTP являє собою спосіб
передачі гіпертекстових документів. Для збору даних потрібно, щоб
спочатку користувач ввів правдиву інформацію у систему, потім це
обробляється PHP-скріптами. Звідти дані передаються на пошту, на обробку
адміністратору проекту.
Формати та правила користування Web-орієнтованою системи
Як вже було описано вище особисті дані користувача, задаються за
допомогою елементу інтерфейсу типу форми, через що не мають
помилкових значень.
Для використання сайту відвідувач повинен мати вказані нижче
програмні та апаратні засоби. Сайт представляє собою систему, що
відображає продукт діяльності компанії та має інформаційний характер є
візиткою компанії, користувачу не треба і не можна нічого змінювати. Якщо
користувачу потрібно швидко переключитися між сторінками можна
скористатися меню-навігацією, а для того щоб поспілкуватися з
менеджером/адміністратором треба скористатися формою «Зворотній
зв’язок».
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
2.7 Вимоги до обчислюваного середовища
Склад та конфігурація апаратних засобів
Для того щоб комфортно використовувати Web-орієнтовану систему
потрібно мати комп’ютер з монітором або ноутбук, телефон чи планшет.
Мінімальні вимоги до комп’ютера за наступними вимогами:
- процесор: Intel Pentium 4 / Athlon 64;
- жорсткий диск: 350 мб вільного простору;
- процесор з тактовою частотою: 1,3 ГГц;
- оперативна пам’ять: 512 мб;
- відеокарта: дискретна чи інтегрована.
Дані вимоги взято з розрахунком використання сучасних браузерів.
Програмні засоби
Для використання даної Web-орієнтованої системи необхідно мати
комп’ютер з встановленою OC Windows XP SP2, Windows Server 2003 SP1,
Windows Vista, Windows 7, Windows 8, Mac OS X 10.6, Mac OS X 10.7, Mac
OS X 10.8, Mac OS X 10.9, GNU/Linux та інш.
Необхідний сучасний браузер, що підтримує JavaScript (ОС також має
підтримувати цей браузер) все інше забезпечено системою.
2.8 Вибір програмного середовища розробки
Для створення програмного продукту відповідно до поставлених задач,
було обрано CMS WordPress, застосунок BeTheme, плагіни: Contact Form 7,
Force Regenerate Thumbnails, Really Simple SSL, Slider Revolution, WPBakery
Page Builder, Yoast Duplicate Post та наступні технології: HTML5, CSS3,
JavaScript, YandexBrowser.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
CMS WordPress
Більше 30% сайтів працюють на WordPress, і ця цифра збільшується з
кожним днем. Вам ймовірно знайомі такі ресурси, як Forbes, The New
Yorker, Vogue, People Magazine і The Wall Street Journal. В основі цих
інформаційно-розважальних порталів лежить WordPress. Він же
використовується для Білого Дому і NASA.
CMS Wordpress – це найпопулярніший движок, за допомогою якого
успішно функціонують різні платформи, починаючи від блогів і закінчуючи
найпопулярнішими майданчиками світу.
Якщо ви плануєте проектувати сайт, вам не обійтися без WordPress. Це
доступний і легкий у використанні інструмент. Не обов'язково бути IT-
генієм, щоб розібратися з тим, як працює система. Базове розуміння
WordPress-функціоналу - все, що потрібно знати для формування
приголомшливого проекту.
Спочатку WP був створений для ведення блогів. У 2003 році Метт
Мулленвег і Майк Літтл розробили систему управління контентом, щоб
люди ділилися інформацією в інтернеті. Але, незабаром, функціонал і
можливості платформи збільшувалися, перетворюючи її в універсальний
конструктор для сайтів будь-якого виду.
Зараз Wordpress – це найпопулярніша система в світі. Її активно
використовують для створення публікацій, дизайну, віджетів та інших
елементів, з яких складається сайт. Простіше кажучи, все, що потрібно для
формування онлайн-ресурсу може бути згенеровано за допомогою
WordPress. Чи потрібно для цього знати мови програмування? Буде плюсом,
але зовсім не обов'язково!
WordPress - ідеальне рішення для новачків, які хочуть запустити свої
перші проекти. Як ми говорили раніше, знання мов програмування не
обов'язкове, так що не варто записуватися на курси "Програмування для
чайників" та інші інтенсиви. База плагінів, число яких поповнюється щодня,
дозволяє отримати сайт в найкоротші терміни, не докладаючи великих
зусиль.
WP-конструктор також користується попитом серед досвідчених
розробників, які за рахунок відкритого коду движка і детальної документації
можуть удосконалити функціонал своїх проектів самостійно. WordPress
працює з основними мовами програмування: HTML, CSS, JavaScript і PHP,
на якому був написаний конструктор.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Хто б не взявся за розробку сайту на WordPress, простота
використання і комплексні функціональні рішення відповідають потребам і
навичкам кожного.
Давайте пройдемося по базовим властивостями WordPress.
Використовуючи цей движок, ви можете:
- створювати, редагувати та видаляти сторінки;
- взаємодіяти з контентом за допомогою текстового редактора
Gutenberg, який працює в візуальному і html режимах;
- підключити або відключити коментарі, вибрати потрібний формат;
- придумати відповідний для вашого бізнесу URL;
- додавати різні рубрики, RSS стрічки і вікна введення пошукових
запитів;
- редагувати зображення;
- керувати медіа-файлами.
Само собою, це тільки мала частина можливостей WordPress.
Основний багаж властивостей привносять шаблони, віджети і плагіни. Вони
значно розширюють функціонал сайту, і спрощують процес його створення.
CMS Wordpress – це конструктор, який підійде для створення простого
блогу. Використовуючи плагіни, можна запросто проектувати більш складні
сайти. Плагін являє собою невеликий скрипт, який додає різні функції в
будь-який проект. В офіційному каталозі WP близько 57 тисяч безкоштовних
варіантів, не рахуючи безперервно зростаючого числа преміум модулів.
Завдання, які вирішують плагіни, варіюються від забезпечення безпеки
до удосконалення юзабіліті. Більш того, власники сайтів можуть прибрати
спам в коментарях, поліпшити показники SEO і багато іншого. Будь-яка
функція, яку ви б хотіли бачити на своєму сайті ймовірно вже представлена
у вигляді плагіна. Раніше встановлені розширення не вимагають
переустановлення після кожного апдейта. Однак, їх краще деактивувати
перед оновленням системи.
Як говорилося вище, знаючи мову PHP, користувачі без зусиль
адаптують готові рішення під свої потреби. Навик програмування – не є
обов’язковим атрибутом, але буде істотним плюсом. І ось чому: велика
кількість розширень призводить до перевантаження сервера, некоректної або
повільної роботи ресурсу.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Як нейтралізувати невигідну для вашого бізнесу ситуацію? Вибрати
тариф на хостингу дорожче. Це вирішить проблему надмірного
навантаження на сервер. Додавання плагіна кешування - ще один спосіб
усунення цього недоліку. Плюс WordPress в тому, що кожен знайде для себе
оптимальне рішення. Все залежить від уподобань та кваліфікації.
Крім розширень, на WordPress є різні теми. Застосовуючи їх, ви не
тільки зміните вигляд сайту, але й активуєте нові функції. В арсеналі WP
більше 10 000 варіантів. Система готових шаблонів поповнюється день у
день і представлена платними та безкоштовними опціями.
Рисунок 2.5 – сайт CMS WordPress
Для швидшої та якіснішої розробки було використано за стосунок для
CMS WordPress «BeTheme».
BeTheme для CMS WordPress
Betheme - одна з найпопулярніших тем WordPress на ThemeForest, і
причина її найгарячіших продажних номерів полягає в тому, що її можна
використовувати для створення будь-якого веб-сайту, починаючи від веб-
сайту професійного портфоліо і закінчуючи сайтами малого бізнесу, або
навіть ви можете створювати приголомшливі блоги або Інтернет-магазин.
Він постачається із 500+ попередньо розробленими макетами веб-сайтів, що
відповідають потребам різних бізнес-ринків. Ви можете легко імпортувати
будь-який демонстраційний сайт та налаштувати його своїми унікальними
способами. Більше того, у нього є свій конструктор сторінок, Maffin builder,
який володіє надзвичайними настроюваними можливостями та допомагає
вам легко створювати голос власного бренду.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
BeTheme укомплектований усіма тими багатими можливостями, яких
можна очікувати в преміум темі WordPress. Більше того, видатний BeTheme
оснащений готовими та чуйними макетами для сітківки, які безперешкодно
відображаються на всіх типах настільних та мобільних пристроїв. Деякі інші
важливі особливості, які залежать від його чудової продуктивності, - це
підтримка карт, підсторінок та макетів Google. Також ви можете
налаштувати розділ нижнього колонтитула та змінити показ піктограм
соціальних медіа. Дизайн сайтів можна створити без використання будь-яких
кодів, а привабливі макети настільки привабливі, що заважають відвідувачам
займатися, і відвідувачі повертатимуться знову і знову, щоб побачити нові
зміни.
Рисунок 2.6 – BeTheme банер
HTML5
Браузерів, як таких що мають підтримку HTML5 на сьогоднішній
момент не існує, є лише деякі, поступово розширюються можливості
HTML5, які і включені до складу сучасних браузерів, оскільки мова ще не
повністю визнаний. На цій стадії існує і негативна сторона цієї мови і вона
полягає в складності веб-розробників «вгадати» підтримує обраний браузер
всю реалізовану ними функціональність веб-сайту.
Отже, наведемо список та короткий опис основних категорій
функціональних можливостей, які охоплюються в HTML5:
Ядро HTML5. Ця частина містить нові семантичні елементи, поліпшені
елементи управління для веб-форм, підтримку відео і аудіо, а також полотно
для малювання на JavaScript.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Ранні можливості HTML5. На самому початку, в первинній
специфікації HTML5, використовувалися можливості, що вимагають
JavaScript, але самими видатними є додатки, що працюють в автономному
режимі, локальне зберігання даних і звичайно ж обмін повідомленнями.
Можливості HTML5. Це можливості нового покоління, що включають
геолокацію та CSS3, спочатку вони не були стандартом HTML5.
Через перехід підтримки HTML від однієї організації W3C до іншої
WHATWG, а потім назад, виникла досить надзвичайна ситуація. З технічної
точки зору організація W3C відповідала за визначення, що саме є офіційним
HTML5, а що навпаки. І в той же самий час група WHATWG не припиняла
свою роботу, розробляючи і придумуючи все нові можливості мови. На
сьогоднішній день вона воліє називати його НЕ HTML5, а просто HTML,
пояснюючи це тим, що HTML буде продовжувати і в майбутньому в якості
«живого» мови.
Так як HTML є «живим» мовою, то веб-сторінка ніколи не застаріє і не
перестане працювати в пізніших версіях. Так само для HTML ніколи не
зажадає номер версії, а веб-розробникам не знадобиться в майбутньому
оновлювати свою розмітку від однієї версії мови до іншої, що б вона
працювала на нових браузерах.
Перевагою цього стандарту є можливість в будь-який час, додавати в
мову HTML нові елементи мови, тим самим даючи розробникам браузерів
вибір, чи використовувати нові елементи в своїх продуктах або відмовитися
від них, вважаючи їх недоцільними, так само змоги не будуть прив'язані до
якого-небудь стандарту HTML.
Рисунок 2.7 – логотип HTML5
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
CSS3
CSS використовується творцями веб-сторінок для завдання кольорів,
шрифтів, розташування окремих блоків і інших аспектів представлення
зовнішнього вигляду цих веб-сторінок. Основною метою розробки CSS було
розділення опису логічної структури веб-сторінки (яке проводиться за
допомогою HTML або інших мов розмітки) від опису зовнішнього вигляду
цієї веб-сторінки (яке тепер проводиться за допомогою формального мови
CSS). Такий поділ може збільшити доступність документа, надати велику
гнучкість і можливість управління його поданням, а також зменшити
складність і повторюваність в структурному вмісті. Крім того, CSS дозволяє
представляти один і той же документ в різних стилях або методах виведення,
таких як екранне уявлення, друковане подання, читання голосом
(спеціальним голосовим браузером або програмою читання з екрану), або
при виведенні пристроями, що використовують шрифт Брайля.
Як відомо, HTML-документи будуються на підставі ієрархії елементів,
яка може бути наочно представлена в деревовидної формі. Елементи HTML
один для одного можуть бути батьківськими, дочірніми, елементами-
предками, елементами-нащадками, сестринськими.
Елемент є батьком іншого елемента, якщо в ієрархічній структурі
документа він знаходиться відразу, безпосередньо над цим елементом.
Елемент є предком іншого елемента, якщо в ієрархічній структурі документа
він знаходиться десь вище цього елемента.
Нехай, наприклад, в документі присутні два абзаци p, що включають в
себе шрифт з напівжирним шрифтом b. Тоді елементи b будуть дочірніми
елементами своїх батьківських елементів p, і нащадками своїх предків body.
У свою чергу, для елементів p елемент body буде не тільки предком, але
безпосередньо і батьком. І крім того, ці два елементи p будуть
сестринськими елементами, як мають одного і того ж батька - body.
В CSS можуть задаватися, за допомогою селекторів, не лише
поодинокі елементи, але і елементи, які є нащадками, дочірніми або
сестринськими елементами інших елементів (див. Підрозділ «види
селекторів»).
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
У перших трьох випадках підключення таблиці CSS до документа
(див. Вище) кожне правило CSS з таблиці стилів має дві основні частини -
селектор і блок оголошень. Селектор, розташований в лівій частині правила,
визначає, на які частини документа поширюється правило. Блок оголошень
розташовується в правій частині правила. Він міститься в фігурні дужки, і, в
свою чергу, складається з одного або більше оголошень, розділених знаком
«;». Кожне оголошення є поєднанням властивості CSS і значення, розділених
знаком «:». Селектори можуть групуватися в одному рядку через кому. В
такому випадку властивість застосовується до кожного з них.
селектор, селектор {
властивість: значення;
властивість: значення;
властивість: значення;
}
У четвертому випадку підключення таблиці CSS до документа (див.
Список) правило CSS (що є значенням атрибута style тега, на який воно діє)
являє собою перелік оголошень ( «властивість CSS: значення»), розділених
знаком «;».
Рисунок 2.8 – логотип CSS3
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
JavaScript
Гіпертекстова інформаційна система складається з безлічі
інформаційних вузлів, безлічі гіпертекстових зв'язків, визначених на цих
вузлах і інструментах маніпулювання вузлами і зв'язками. Технологія World
Wide Web - це технологія ведення гіпертекстових розподілених систем в
Internet, і, отже, вона повинна відповідати загальним визначенням таких
систем. Це означає, що всі перераховані вище компоненти гіпертекстової
системи повинні бути і в Web.
Web, як гіпертекстову систему, можна розглядати з двох точок зору.
По-перше, як сукупність відображуваних сторінок, пов'язаних
гіпертекстовими переходами (посиланнями - контейнер ANCHOR). По-
друге, як безліч елементарних інформаційних об'єктів, що становлять
відображаються сторінки (текст, графіка, мобільний код і т.п.). В останньому
випадку безліч гіпертекстових переходів сторінки - це такий же
інформаційний фрагмент, як і вбудована в текст картинка.
При другому підході гіпертекстова мережа визначається на безлічі
елементарних інформаційних об'єктів самими HTML-сторінками, які і
грають роль гіпертекстових зв'язків. Цей підхід більш продуктивний з точки
зору побудови відображуваних сторінок "на льоту" з готових компонентів.
При генерації сторінок в Web виникає дилема, пов'язана з
архітектурою "клієнт-сервер". Сторінки можна генерувати як на стороні
клієнта, так і на стороні сервера. У 1995 році фахівці компанії Netscape
створили механізм управління сторінками на клієнтській стороні,
розробивши мову програмування JavaScript.
Таким чином, JavaScript - це мова керування сценаріями перегляду
гіпертекстових сторінок Web на стороні клієнта. Якщо бути більш точним,
то JavaScript - це не тільки мова програмування на стороні клієнта. Liveware,
прабатько JavaScript, є засобом підстановок на стороні сервера Netscape.
Однак найбільшу популярність JavaScript забезпечило програмування на
стороні клієнта.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Основна ідея JavaScript полягає в можливості зміни значень атрибутів
HTML-контейнерів і властивостей середовища відображення в процесі
перегляду HTML-сторінки користувачем. При цьому перезавантаження
сторінки не відбувається.
На практиці це виражається в тому, що можна, наприклад, змінити
колір фону сторінки або інтегровану в документ картинку, відкрити нове
вікно або видати попередження.
Назва "JavaScript" є власністю Netscape. Реалізація мови, здійснена
розробниками Microsoft, офіційно називається Jscript. Версії JScript сумісні
(якщо бути зовсім точним, то не до кінця) з відповідними версіями
JavaScript, тобто JavaScript є підмножиною мови JScript.
JavaScript стандартизований ECMA (European Computer Manufacturers
Association - Асоціація європейських виробників комп'ютерів). Відповідні
стандарти носять назви ECMA-262 і ISO-16262. Ці стандарти вимагають
визначається мова ECMAScript, який приблизно еквівалентний JavaScript
1.1. Відзначимо, що не всі реалізації JavaScript на сьогодні повністю
відповідають стандарту ECMA. В рамках даного курсу ми у всіх випадках
будемо використовувати назву JavaScript.
Рисунок 2.9 – банер JavaScript
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
YandexBrowser
Особливості яндекс.браузер. Головною особливістю даного браузера є
його інтеграція з сервісами самого Яндекса: поштою, перекладачем,
«Яндекс.Діск» і пошуком. У оглядач спочатку вбудовані переглядач PDF-
файлів, офісних документів (починаючи з версії 14.2) і програвач Adobe
Flash Player. Є можливість синхронізації закладок, розширень, паролів,
налаштувань браузера між різними пристроями, а також резервного
копіювання цих даних на «хмарному» сервері «Яндекса». У процесі
введення тексту в адресний рядок він відправляється на сервер Яндекса в
якості пошукового запиту, і результати пошуку додаються в список
автодоповнення.
Розумна рядок. У яндекс.браузер адресний рядок поєднана з пошукової
та називається через деяких корисних можливостей «Розумній рядком».
Серед них - автоматичний висновок адреси сайту при наборі його назви (для
популярних сайтів). Виправляється розкладка клавіатури при неправильному
введенні. Крім того, пошукові підказки браузера автоматично дадуть
відповідь на прості запити (кількість непрочитаних листів, рахунок матчів,
погода і т. Д.). Подібна функціональність є унікальною для яндекс.браузер і
відсутній у конкурентів.
Режим «Турбо». Спочатку повідомлялося про застосування в програмі
технології Turbo, створеної компанією Opera, для прискорення роботи з
HTTP при використанні повільних каналів зв'язку. Починаючи з версії 14.10
доступно Турбо 2.0 з можливістю стиснення онлайн-відео відразу під час
його перегляду.
Табло. Табло - це панель швидкого запуску сторінок, які відвідуються
найчастіше. Табло з'являється кожного разу при відкритті нової вкладки. Для
деяких сайтів плитки-віджети можуть показувати додаткову інформацію
(наприклад, кількість непрочитаних листів, рівень пробок або повідомлення
з соціальних мереж).
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Безпека. У браузер вбудований сервіс перевірки посилань і сайтів на
предмет безпеки. Офлайн користувачем файли перевіряються на шкідливість
системою, створеною в «Лабораторії Касперського». Яндекс розробив
технологію активного захисту користувачів Яндекс. Браузера Protect.
Перегляд документів. Браузер дає можливість перегляду документів у
форматах doc, rtf, ppt, pdf; також підтримуються формати ePub, fb2 і fb2.zip,
що перетворює браузер в програму для читання електронних книг.
Переклад веб-сторінок. Оглядач має власний інтерфейс для
використання служби автоматизованого перекладу від Яндекса для
перекладу як окремих слів, так і веб-сторінок цілком.
Жести мишею. У версії 13.10 з'явилася підтримка жестів мишею. В операційній
системі Windows жести потрібно робити при утриманні правої кнопки миші, в
Mac OS з однокнопочні мишею жести здійснюються натисненням Ctrl і кнопки
миші. Можливо і управління комбінаціями клавіш миші: якщо, утримуючи
праву кнопку миші, натиснути ліву, можна перейти назад; якщо утримуючи
ліву, натиснути праву, здійснюється перехід вперед.
Рисунок 2.10 – логотип браузера
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Список плагінів
Contact Form 7
Contact Form 7 може управляти численними контактними формами, де
ви можете гнучко налаштовувати вміст форм і пошти з досить простий
розміткою. Форми мають вбудовану підтримку Ajax відправки, CAPTCHA,
спам фільтра Akismet і не тільки.
Force Regenerate Thumbnails
Як регенерувати ескізи. Ви можете використовувати плагін Force
Regenerate Thumbnails, як альтернативу. Як випливає з назви, воно сприяє
регенерації ескізів, видаляючи старі розміри зображень, тому WordPress
змушений регенерувати зображення. Цей плагін також сумісний з інтернет-
магазинами WooCommerce. Майте на увазі, що на момент публікації цей
плагін не оновлювався протягом останніх 3 основних версій, тому
використовуйте його з обережністю. Не забудьте протестувати його в
режимі постановки або локального тестування, перш ніж використовувати
його на своєму веб-сайті. Причина, по якій вам потрібно було б
використовувати цей плагін над плагіном «Regenerate Thumbnails», полягає в
тому, що останній просто змінює розмір зображень і не видаляє старі
розміри зображень, якщо не встановити прапорець. Але якщо у вас виникли
проблеми з цим, ви можете спробувати ескізи Force Regenerate.
Really Simple SSL
Really Simple SSL автоматично виявляє ваші налаштування і
налаштовує ваш веб-сайт для роботи через https. Щоб зберегти малий обсяг,
налаштування залишені на мінімальних значеннях. Весь сайт буде
перенесено на SSL.
Slider Revolution
Головною особливістю Slider Revolution є функція «листкового
пирога», або можливість накладення елементів слайдера один на інший.
Схожа система використовується в Adobe Photoshop. На відміну від
останнього, кожному шару в Slider Revolution можна призначати анімацію і
хронометраж.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
WPBakery Page Builder
WPBakery Page Builder for WordPress (Visual Composer) - це
популярний візуальний конструктор сторінок для WordPress, розроблений
компанією WPBakery Inc в 2013 році. Використовується для створення
landing page. Уже тоді їм користувалося 25000 розробників. У 2019 це число
перевалило за 1500000 чоловік. Плагін поставляється як разом з купленими
темами безкоштовно, так і платно.
Yoast Duplicate Post
Ви коли-небудь хотіли швидко зробити копію публікації в WordPress,
щоб працювати над деякими змінами без ризику зіпсувати опубліковану
публікацію? Вам потрібен простий спосіб продублювати сторінку для нової
послуги чи товару? Вам пощастило, адже це лише деякі способи
використання плагіна Yoast Duplicate Post. Плагін Yoast Duplicate Post - це
один із тих плагінів WordPress, який, здається, робить одне і робить це
надзвичайно добре. По суті, плагін Yoast Duplicate Post дозволяє просто
зробити копію публікації або сторінки. Це воно! Але це відкриває цілий
спектр можливостей - від створення повного редакційного потоку до
швидкого створення цільових сторінок для підвищення SEO.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
2.9 Висновки до розділу 2
У другому розділі розглянуто предметну область, оглянуто
технічне завдання, проведено дослідження використаних застосунків та
ін. Описано критерії щодо якості Web-орієнтованої системи фотографа.
Окреслено сферу застосування програмного продукту. Визначено
основні функції Web-орієнтованої системи. Охарактеризовано вимоги
до обчислюваного середовища, склад та конфігурація апаратних засобів,
вимоги до програмних засобів.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
3 РЕАЛІЗАЦІЯ WEB-ОРІЄНТОВАНОЇ СИСТЕМИ ФОТОГРАФА
3.1 Розробка Web-орієнтованої системи
Перший крок при створенні сайту у CMS WordPress це вибір назви
сайту.
Рисунок 3.1 – вибір назви сайту
Наступний крок – вибір дизайну.
Рисунок 3.2 – вибір дизайну
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Далі необхідно обрати стиль тексту.
Рисунок 3.3 – вибір стилю текста
Важливий крок у початковому створенні – вибір домену.
Рисунок 3.4 – вибір домену
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Передостанній крок – вибір особливих послуг.
Рисунок 3.5 – вибір послуг
Останній крок у початковому створенні сайту – вибір плану.
Рисунок 3.6 – вибір плану
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Після того як сайт збудується буде можливість продивитися
навчальний туторіал.
Рисунок 3.7 – стрілка вказує саме на туторіал
Для того щоб додати якийсь елемент необхідно відкрити меню
додавання елементів (рис. 3.8).
Рисунок 3.8 – меню додавання елементів (зліва)
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Налаштування «Header», для того щоб викликати меню налаштування
необхідно зайти у «Preview» та клацнути на «Edit header».
Рисунок 3.8 – меню «Preview», тут знаходиться кнопка «Edit header»
Рисунок 3.9 – меню налаштування «Header»
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Пункт налаштування «Header» сайту «Site identity» (рис. 3.10).
Рисунок 3.10 – «Site identity»
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Рисунок 3.11 – налаштований «Site identity»
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Налаштування кольорів «Colors and Backgrounds» (рис. 3.12).
Рисунок 3.12 – Colors and Backgrounds
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Налаштування у «Header» «Menu». Підпункт «Primary» (рис. 3.13).
Рисунок 3.13 – «Primary»
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Рисунок 3.14 – Налаштований пункт «Primary»
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Рисунок 3.15 – налаштування контенту
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Налаштування «Widget» у «Header» (рис. 3.16).
Рисунок 3.16 – готовий результат налаштування віджету
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Налаштування «Homepage Settings» у «Header» (рис. 3.17).
Рисунок 3.17 – «Homepage Settings»
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Налаштування «Social Links» у меню налаштуваннях «Menus» в
«Header» (рис. 3.18).
Рисунок 3.18 – Social Links
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Рисунок 3.19 – готове налаштування Social Links (Instagram)
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Головним «пунктом» управління вашого сайту є головне меню CMS
WordPress (рис. 3.20).
Рисунок 3.20 – головне меню CMS WordPress
Огляд головного меню WordPress
У попередній статті ми з вами розглянули можливості Консолі
WordPress. Пройшлися по основних елементів, але не торкнулися
найважливіший розділ - головне меню WordPress. Давайте розберемо його
детальніше в цьому матеріалі.
Всі основні завдання та функціональні можливості WordPress
згруповані за типами і винесені в бічне меню. Левова частка всієї навігації
по адмінці WordPress здійснюється саме через меню, тому відразу звикайте
до нього і запам'ятовуйте, що де знаходиться.
На знімку екрана нижче представлено основне меню WordPress з
доступними діями і розгорнутим підміню розділу «Зовнішній вигляд»:
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Рисунок 3.21 - приклад розкритого меню з підміню WordPress
Після установки WordPress кількість пунктів меню буде приблизно
однаковим для всіх. Додаючи або видаляючи плагіни (додаткові програми
для WordPress) ви можете впливати на кількість відображуваних пунктів
меню, додавати нові або приховувати непотрібні.
В цілому ж, всі версії WordPress виглядають однаково і, освоївшись
один раз, ви без праці розберетеся з будь-якою іншою версією.
Використання меню
Для того щоб виконати ту чи іншу дію, наприклад, додати новий запис,
необхідно вибрати потрібний розділ меню, а в ньому необхідний пункт
підміню.
Давайте виберемо пункт «Записи» - «Додати нову»:
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Рисунок 3.22 – вибір потрібного пункту в меню
Після цього відкриється потрібний інтерфейс для створення запису, всі
пункти підміню автоматично розгорнуться, а обраний пункт меню візуально
буде підсвічено:
Рисунок 3.23 – приклад використання меню
На цьому етапі більше подробиць не буде потрібно, все дуже доступно
і на вашій рідній мові. Самостійно поклацавши по різних пунктах меню і
підміню, ви швидко переконаєтеся, наскільки зручно їм користуватися.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Основні розділи меню WordPress
Після установки адмінка WordPress має 10 згруповані розділів меню,
кожен з яких відкриває доступ до адміністративних завдань. Нижче буде
розглянуто всі існуючі розділи і усе, що входить до їх можливостей.
Розділ «Записи»
Записи в WordPress служать для виведення матеріалів в хронологічній
послідовності - в самому верху йдуть найновіші матеріали, нижче всі інші з
можливістю посторінкового розбивки. В цілому, це основний тип контенту,
який буде використовуватися майже у всіх блогах. Іноді записи називають
«постами», майте на увазі.
«Усі записи»
Відображення всіх існуючих на сайті записів у вигляді табличного
представлення. Записи можна видаляти і редагувати і проводити будь-які
інші маніпуляції.
«Додати нову»
Додавання нового запису. Сама часто використовувана функція в
блогах. Саме тут виробляється наповнення контентом вашого сайту або
блогу, свята святих.
«Рубрики»
Рубрики необхідні для створення зручної структури і навігації по
сайту. Рубрики можна видаляти, редагувати, створювати, перейменовувати.
«Мітки»
Відображення існуючих міток. Мітки необхідні для угруповання
постів з різних категорій по загальному критерію. Уявіть, що у вас є рубрики
з країнами, наприклад, «Росія», «Хорватія», «Болгарія». У кожній рубриці є
матеріали про міста, готелі, ресторани. В цьому випадку рубрики - це самі
країни, а ось ключові слова «готелі», «ресторани» можна використовувати як
мітки. При клікі відвідувачем сайту на слово «готелі» або «ресторани» він
побачить всі матеріали з усього вашого сайту, пов'язаного з цією міткою.
Тобто, всі готелі Росії, Хорватії, Болгарії та інших країн, матеріали яких ви
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
відзначили міткою «готелі». Дуже зручно!
Розділ «Медіафайли»
Медіафайли - це будь-які графічні або текстові матеріали, які ви
завантажуєте на сторінки вашого сайту. Простіше кажучи: це зображення,
документи Word, Excel і інші типи, відео та аудіозаписи. У WordPress
реалізована відмінна можливість для публікації зображень, відео та аудіо на
сторінках вашого блогу.
«Бібліотека»
В даному розділі відображається список всіх завантажених
медіафайлів на сайт (зображення, відео та аудіофайли). Ці файли можна
змінювати і видаляти, все робиться через Бібліотеку.
«Додати новий»
Додавання нових медіафайлів, які можна буде надалі використовувати
в записах і на сторінках сайту. Взагалі, бажано краще не користуватися цією
кнопкою і завантажувати зображення в конкретні сторінки, тоді ви точно
зрозумієте, коли і до чого було завантажено те чи інше зображення.
Розділ «Сторінки»
Сторінки це аналоги записів (постів), але відрізняються тим, що
містять більше статичну інформацію, яка не прив'язана до дати. Типові
приклади сторінок на сайті: Про автора, Зворотній зв'язок, Задати питання,
Послуги. Загалом, все те, що може бути один раз написано і завжди повинно
бути на виду користувачів. Дуже часто в меню розміщуються посилання
саме на основні сторінки, а записи використовуються для виведення новин.
«Усі сторінки»
В даному розділі виводиться табличне представлення всіх наявних на
сайті сторінок з можливістю їх редагування і видалення. Інтерфейс
ідентичний тому, що використовується в записах.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
«Додати нову»
Інтерфейс для додавання нових сторінок на сайт. Дуже схожий з
інтерфейсом створення записів, практично ідентичні. Різниця тільки в тому,
що сторінки не можна прив'язати до рубрик та призначити їм мітки.
Розділ «Коментарі»
В даному розділі розміщені всі залишені на сайті коментарі. Їх можна
відредагувати, видалити, позначити як спам або навпаки - витягнути з папки
небажаних коментарів і опублікувати на сайті. Як тільки у вашого сайту
сформується постійна аудиторія, ви будете регулярно відвідувати цей розділ
адмінки WordPress для спілкування з аудиторією. Хоча, це можна зробити і
зі сторінок сайту, як вам буде зручніше.
Розділ «Зовнішній вигляд»
В даному великому розділі знаходиться все, що стосується
зовнішнього вигляду вашого сайту. Це вибір варіанту оформлення,
налаштування меню, вивід віджетів і все в такому дусі. Давайте розберемо
кожен пункт окремо.
«Теми»
Тема - те, що відповідає за візуальну складову вашого сайту: колір
тексту і посилань, використовувані шрифти, відступи тексту і зображень, ті
чи інші функціональні елементи. Ще тему часто називають «шаблоном».
Для WordPress існують десятки тисяч готових варіантів оформлень,
вам треба буде пройти довгий і складний шлях по вибору підходящого вам
варіанту, повірте, це на перший погляд здається дуже захоплюючим
заняттям, але якщо ви не знаєте, як повинен виглядати ваш сайт, то
виникнуть тимчасові труднощі і ви можете тут застрягти.
«Налаштування»
Цей пункт не завжди доступний і залежить від вибору тієї чи іншої
теми, але все одно його краще включити, тому що в стандартній темі Twenty
Fifteen відразу після установки WordPress цей варіант доступний.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Даний пункт меню дозволяє вам переміститися одразу на сторінки
вашого сайту і в візуальному режимі налаштувати оформлення: вибрати
колір фону або його зображення, підключити інформаційні блоки.
Можливості налаштування безпосередньо залежать від використовуваної
теми. Десь їх більше, десь взагалі може не бути. Вдаватися в подробиці
конкретних реалізацій не будемо.
«Віджети»
Віджети - інформаційні блоки на сайті, які найчастіше виводяться в
боковій колонці і служать для відображення різної інформації. Це може бути
додаткова навігація, вивід останніх коментарів або записів на сайті,
відображення посилань на ваші профілі в соціальних мережах або ж віджети
груп соціальних мереж. З ними вам ще належить зіткнутися при більш
детальному налаштуванні зовнішнього вигляду.
«Меню»
Меню - основний елемент навігації на сайті. Найчастіше
використовується два варіанти меню - горизонтальне в «шапці» сайту
(нагорі), яке містить посилання на основні сторінки сайту; і вертикальне
меню, воно більше використовується як додаткове для створення навігації на
розділи або рубрики матеріалів. Так само меню можна виводити в віджети.
"Заголовок"
Як і розділ «Налаштування» цей пункт підміню не завжди буде вам
доступний, але в стандартному постачанні WordPress він є, тому трохи
опишемо й його. В даному розділі можна вибрати зображення для «шапки»
вашого сайту. Якщо ви раптом ще не зрозуміли що таке «шапка», пояснення
- це та область на сайті, яка виводиться до головного меню, найчастіше там
назва сайту, слоган або якесь зображення. Ось саме це зображення в «шапці»
виводиться через розділ «Тема». Або ж тут будуть інші якісь налаштування,
в залежності від використовуваної вами теми на сайті.
«Редактор»
Браузерні редактор коду, який дозволяє прямо з адмінки вашого сайту
внести коригування в код вашої теми.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Настійно не рекомендується користуватися цією можливістю і відразу
її відключати. Майте на увазі, що якщо ви будете роздавати направо і наліво
доступ до адмінки вашого сайту фрілансерам або іншим фахівцям, то при
включеному редакторі вони можуть розмістити шкідливий код в тему і ви
про це навіть не дізнаєтеся. Просто запам'ятайте, що включений Редактор
коду в адмінці - це небезпечно.
Розділ «Модулі»
Найцікавіший розділ. Модулі - це прошивки, які встановлюються на
ваш сайт і доповнюють його новою функціональністю. Як ви могли вже
помітити, WordPress це якийсь конструктор, з якого можна зліпити або
цукерку, або ж зробити такий «вінегрет», що користуватися ним буде
неможливо. Якщо вам треба поставити систему антиспаму - треба знайти
плагін. Якщо вам треба зробити автоматичну публікацію матеріалів в
соціальні мережі - вам треба знайти плагін. Якщо хочете антивірус і захист
сайту - вам теж треба знайти плагін. Загалом, ви вже зрозуміли, що плагіни -
ваші друзі. Вміле і грамотне управління плагінами заощадить вам купу
нервів і часу. Пам'ятайте і про те, що чим більше плагінів підключено до
сайту, тим довше він буде завантажуватися. Тут важливо знайти баланс!
«Встановлені»
Управління встановленими на сайт плагінами (активація, деактивація,
налаштування, оновлення). Саме тут відбувається обслуговування всіх
плагінів. Оновлювати їх доведеться регулярно, при кожному виході нової
версії.
«Додати новий»
У цьому інтерфейсі є можливість знайти потрібний вам плагін або
завантажити його з вашого комп'ютера (попередньо скачавши його з сайту
WordPress або з сайту, розроблений третьою). Настійно не рекомендується
завантажувати плагіни від сторонніх сайтів. Майже все, що вам знадобиться,
є на сайті WordPress і додаткове скачування його на ваш комп'ютер
абсолютно непотрібна дія.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
«Редактор»
Як вже пояснено вище, Редактором краще не користуватися. За
аналогією з темою, існує і редактор для плагінів, через який ви можете
змінювати код будь-якого плагіна, встановленого в ваш WordPress. Будь-яка
помилка, не там поставлена «крапка з комою» або будь-який інший символ,
можуть повністю зламати ваш сайт і відвідувачі будуть бачити тільки білий
екран. Загалом, не заходьте сюди, будь ласка, без потреби.
Розділ «Користувачі»
Як ви, напевно, могли вже здогадатися, сайти бувають
однокористувацькі і розрахованими на багато користувачів. Різниця в тому,
що одногокористувацький сайт - це коли тільки ви маєте доступ до адмінки,
а на багато користувачів - це або відкрита реєстрація, або закрита реєстрація,
але ви самостійно додаєте потрібних вам користувачів. Якщо вам
знадобиться додати редактора на сайт, то не здумайте передавати йому
доступ до вашої адміністративної облікового запису. Найкраще створити
окремого користувача і управляти доступом через цей самий розділ. Саме
через неправильне управління користувачами найчастіше трапляються
проблеми на сайті. Будь-який новий адміністратор це потенційна проблема.
Думайте, кого створюєте на сайті і для чого.
"Усі користувачі"
В даному розділі відображаються всі користувачі, зареєстровані на
сайті, а також інформація, яку вони вказали при реєстрації. Користувачів
можна видаляти, розподіляти їм ролі (підписник, автор і т.д.) і редагувати
надані ними дані. Загалом, повний контроль над обліковими записами.
«Додати нового»
Як можна переконатися з назви - тут проводиться додавання нового
користувача. Вводиться його ПІБ (не обов'язково), логін, електронна пошта,
пароль і доступ, з яким він буде входити на ваш сайт.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
"Ваш профіль"
У розділі Ваш профіль ви можете відредагувати свої особисті дані:
змінити пароль, ім'я, вказати ПІБ, посилання на соціальні мережі або якусь
додаткову інформацію. Багато тем дозволяють в кінці постів виводити
інформацію про автора, який його написав. Якщо у вас сайт розрахований на
багато користувачів або ж для вас пишуть автори, то рекомендується
кожному з них заповнити цей розділ. Дуже зручно бачити зведену
інформацію про людину, яка займає ту чи іншу посаду на вашому сайті.
Розділ «Інструменти»
Великий технічний розділ, яким ви практично не будете
користуватися. Тут є можливості по імпорту даних з різних блогових
майданчиків на WordPress. Так само в Інструментах можна експортувати
матеріали вашого сайту в файл і потім імпортувати на іншому сайті.
«Всі інструменти»
Власне, тут знаходиться доступ до сервісних плагінів, які дозволяють
імпортувати налаштування або дані з інших сайтів. Наприклад, ви раніше
довгий час вели блог на платформі LiveJournal і вирішили переїхати на
WordPress. Встановлюєте відповідний плагін і прямуєте рекомендаціями на
екрані, все - ваш блог тепер на WordPress!
«Імпорт»
Імпорт контенту з інших сайтів. Дозволяє перенести записи, коментарі
та інші настройки. Розробники не часто користуюся цим розділом.
«Експорт»
Якщо ви раптом вирішили зберегти всі записи вашого сайту в файл -
це можна зробити в даному розділі. На виході ви отримаєте конфігураційний
текстовий файл, який можна завантажити в будь-який інший сайт на
WordPress через розділ Імпорту і, тим самим, перенести матеріали.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Розділ «Параметри»
Цей розділ самий часто змінюваний, тому що кожне встановлення
плагіна додає сюди новий пункт меню, який зв'язується з самим плагіном і
дозволяє налаштувати його. Крім цього, в даному розділі можлива зміна
основних параметрів WordPress, таких як:
- кількість записів, що виводяться на головній сторінці;
- назва та опис сайту;
- формат постійних посилань;
- рівень приватності;
- налаштування коментування та завантаження медіа файлів;
- і так далі.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
3.2 Адміністрування Web-орієнтованої інформаційної системи та її
інтерфейс
Рисунок 3.24 – сторінки готового сайту
Рисунок 3.25 – головна сторінка сайту (Muffin Builder)
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Рисунок 3.26 – сторінка «About us» (Muffing builder)
Рисунок 3.27 – сторінка «Our services» (Muffin builder)
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Рисунок 3.28 – сторінка «Contact» (Muffin builder)
Рисунок 3.29 – сторінка сайту «Portfolio» (WPBakery Page Builder)
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Рисунок 3.30 – головна Рисунок 3.31 - сторінка Рисунок 3.32 –
сторінка сайту «About us» сторінка «Our services»
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Рисунок 3.33 – сторінка «Portfolio»
Рисунок 3.34 – сторінка «Contact»
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
На рисунках 3.25 – 3.28 показані налаштування сторінок у Muffin
Browser. Тільки сторінка «Portfolio» (рис. 3.29) показана через WPBakery
Page Builder, тому що портфоліо реалізоване через пости.
На рисунках 3.30 – 3.34 показано готовий результат виконаного
проекту.
Рисунок 3.35- сторінки з мобільного телефону
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Завдяки CMS WordPress та його можливостям, створений сайт
адаптований під усі можливі пристрої. На рисунку 3.35 показано, як
відображаються сторінки сайту на мобільних пристроях, та наскільки вони
адаптовані.
3.3 Висновки до розділу 3
У третьому розділі обґрунтовано вибір програмного засобу для
розробки системи компанії, відображено процес адміністрування систем у
CMS WordPress та показано готовий результат Web-орієнтованої
інформаційної системи для фотографа.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
ВИСНОВКИ
Розробка Web-орієнтованої інформаційної системи для компанії
фотографа сприятиме кількості зацікавлених клієнтів за рахунок
відображення послуг, які представляє компанія, та завдяки демонстрації її
портфоліо.
У результаті дослідження предметної області, серед різних CMS було
обрано WordPress, що дозволило створити зручний користувацький
інтерфейс та привабливий дизайн Web-орієнтованої інформаційної системи.
Дана система відмінно справилася з поставленими завданнями.
Також, було описано сферу застосування та головні функції системи,
зв’язок із зовнішнім середовищем, вимоги до апаратного та програмного
забезпечення, що допомогло розробити сайт відповідно до основних вимог.
Реалізація Web-орієнтованої інформаційної системи виконана за
допомогою платформи керування контентом CMS WordPress, застосунків
BeTheme та MuffinBuilder. Під час розробки системи компанії встановлено
та налаштовано спеціальні модулі та плагіни, що призначені для полегшення
роботи з контентом.
Реалізовані можливості, що дозволяють користувачам системи
компанії переглядати потрібну їм інформацію, надати свої дані для
подальшого спілкування з менеджерами, поширювати інформацію.
Адміністратор, що не має знань азів програмування має можливість
оновлювати інформацію на сайті завдяки простоті CMS WordPress та Muffin
Builder. Також у спеціальній вкладці у меню WordPress можна переглядати
коментарі та відповідати на них.
Мета кваліфікаційної роботи досягнута. Вимоги виконані відповідно
до поставленого на початку роботи технічного завдання.
Арк.
ЧДТУ 2021
Змн. Арк. № докум. Підпис Дата
Розробка інформаційної системи для компанії фотографа
482 ЧДТУ 20847 – 01 12 01
Текст програми
Листів
Розробник ________________ Вихристенко В.С.
Черкаси, 2021
Код сторінки «Home»:
<!DOCTYPE html>
<html lang="ru-RU" class="no-js" itemscope itemtype="https://schema.org/WebPage">
<head>
<meta charset="UTF-8" />
<link rel="alternate" hreflang="ru-RU" href="https://mazastore.com.ua/ph/"/>
<title>Proffessional aerial shooting – Аэросьемка по всей миру</title>
<meta name='robots' content='max-image-preview:large' />
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<link rel='dns-prefetch' href='//fonts.googleapis.com' />
<link rel='dns-prefetch' href='//s.w.org' />
<link rel="alternate" type="application/rss+xml" title="Proffessional aerial shooting » Лента" href="https://mazastore.com.ua/ph/feed/" />
<link rel="alternate" type="application/rss+xml" title="Proffessional aerial shooting » Лента комментариев"
href="https://mazastore.com.ua/ph/comments/feed/" />
<link rel="alternate" type="application/rss+xml" title="Proffessional aerial shooting » Лента комментариев к «Home»"
href="https://mazastore.com.ua/ph/home/feed/" />
<script type="text/javascript">
window._wpemojiSettings =
{"baseUrl":"https:\/\/s.w.org\/images\/core\/emoji\/13.0.1\/72x72\/","ext":".png","svgUrl":"https:\/\/s.w.org\/images\/core\/emoji\/13.0.1\/svg\/","svgE
xt":".svg","source":{"concatemoji":"https:\/\/mazastore.com.ua\/ph\/wp-includes\/js\/wp-emoji-release.min.js?ver=5.7.1"}};
!function(e,a,t){var n,r,o,i=a.createElement("canvas"),p=i.getContext&&i.getContext("2d");function s(e,t){var
a=String.fromCharCode;p.clearRect(0,0,i.width,i.height),p.fillText(a.apply(this,e),0,0);e=i.toDataURL();return
p.clearRect(0,0,i.width,i.height),p.fillText(a.apply(this,t),0,0),e===i.toDataURL()}function c(e){var
t=a.createElement("script");t.src=e,t.defer=t.type="text/javascript",a.getElementsByTagName("head")[0].appendChild(t)}for(o=Array("flag","emoji")
,t.supports={everything:!0,everythingExceptFlag:!0},r=0;r<o.length;r++)t.supports[o[r]]=function(e){if(!p||!p.fillText)return!1;switch(p.textBaseline
="top",p.font="600 32px Arial",e){case"flag":return
s([127987,65039,8205,9895,65039],[127987,65039,8203,9895,65039])?!1:!s([55356,56826,55356,56819],[55356,56826,8203,55356,56819])&&!s([
55356,57332,56128,56423,56128,56418,56128,56421,56128,56430,56128,56423,56128,56447],[55356,57332,8203,56128,56423,8203,56128,56418,
8203,56128,56421,8203,56128,56430,8203,56128,56423,8203,56128,56447]);case"emoji":return!s([55357,56424,8205,55356,57212],[55357,56424,
8203,55356,57212])}return!1}(o[r]),t.supports.everything=t.supports.everything&&t.supports[o[r]],"flag"!==o[r]&&(t.supports.everythingExceptFla
g=t.supports.everythingExceptFlag&&t.supports[o[r]]);t.supports.everythingExceptFlag=t.supports.everythingExceptFlag&&!t.supports.flag,t.DOM
Ready=!1,t.readyCallback=function(){t.DOMReady=!0},t.supports.everything||(n=function(){t.readyCallback()},a.addEventListener?(a.addEventList
ener("DOMContentLoaded",n,!1),e.addEventListener("load",n,!1)):(e.attachEvent("onload",n),a.attachEvent("onreadystatechange",function(){"compl
ete"===a.readyState&&t.readyCallback()})),(n=t.source||{}).concatemoji?c(n.concatemoji):n.wpemoji&&n.twemoji&&(c(n.twemoji),c(n.wpemoji)))
}(window,document,window._wpemojiSettings);
</script>
<style type="text/css">
img.wp-smiley,
img.emoji {
display: inline !important;
border: none !important;
box-shadow: none !important;
height: 1em !important;
width: 1em !important;
margin: 0 .07em !important;
vertical-align: -0.1em !important;
background: none !important;
padding: 0 !important;
}
</style>
<link rel='stylesheet' id='revslider-material-icons-css' href='https://mazastore.com.ua/ph/wp-
content/plugins/revslider/public/assets/fonts/material/material-icons.css?ver=6.4.3' type='text/css' media='all' />
<link rel='stylesheet' id='revslider-basics-css-css' href='https://mazastore.com.ua/ph/wp-
content/plugins/revslider/admin/assets/css/basics.css?ver=6.4.3' type='text/css' media='all' />
<link rel='stylesheet' id='rs-color-picker-css-css' href='https://mazastore.com.ua/ph/wp-content/plugins/revslider/admin/assets/css/tp-color-
picker.css?ver=6.4.3' type='text/css' media='all' />
<link rel='stylesheet' id='revbuilder-select2RS-css' href='https://mazastore.com.ua/ph/wp-
content/plugins/revslider/admin/assets/css/select2RS.css?ver=6.4.3' type='text/css' media='all' />
<link rel='stylesheet' id='rs-roboto-css' href='//fonts.googleapis.com/css?family=Roboto&ver=5.7.1' type='text/css' media='all' />
<link rel='stylesheet' id='tp-material-icons-css' href='//fonts.googleapis.com/icon?family=Material+Icons&ver=5.7.1' type='text/css' media='all'
/>
<link rel='stylesheet' id='dashicons-css' href='https://mazastore.com.ua/ph/wp-includes/css/dashicons.min.css?ver=5.7.1' type='text/css' media='all' />
<link rel='stylesheet' id='admin-bar-css' href='https://mazastore.com.ua/ph/wp-includes/css/admin-bar.min.css?ver=5.7.1' type='text/css' media='all'
/>
<link rel='stylesheet' id='wp-block-library-css' href='https://mazastore.com.ua/ph/wp-includes/css/dist/block-library/style.min.css?ver=5.7.1'
type='text/css' media='all' />
<link rel='stylesheet' id='contact-form-7-css' href='https://mazastore.com.ua/ph/wp-content/plugins/contact-form-7/includes/css/styles.css?ver=5.4.1'
type='text/css' media='all' />
<link rel='stylesheet' id='rs-plugin-settings-css' href='https://mazastore.com.ua/ph/wp-content/plugins/revslider/public/assets/css/rs6.css?ver=6.4.3'
type='text/css' media='all' />
<style id='rs-plugin-settings-inline-css' type='text/css'>
#rs-demo-id {}
</style>
<link rel='stylesheet' id='duplicate-post-css' href='https://mazastore.com.ua/ph/wp-content/plugins/duplicate-post/css/duplicate-post.css?ver=4.1.1'
type='text/css' media='all' />
<link rel='stylesheet' id='style-css' href='https://mazastore.com.ua/ph/wp-content/themes/betheme/style.css?ver=22.0.1' type='text/css' media='all' />
<link rel='stylesheet' id='mfn-base-css' href='https://mazastore.com.ua/ph/wp-content/themes/betheme/css/base.css?ver=22.0.1' type='text/css'
media='all' />
<link rel='stylesheet' id='mfn-layout-css' href='https://mazastore.com.ua/ph/wp-content/themes/betheme/css/layout.css?ver=22.0.1' type='text/css'
media='all' />
<link rel='stylesheet' id='mfn-shortcodes-css' href='https://mazastore.com.ua/ph/wp-content/themes/betheme/css/shortcodes.css?ver=22.0.1'
type='text/css' media='all' />
<link rel='stylesheet' id='mfn-animations-css' href='https://mazastore.com.ua/ph/wp-
content/themes/betheme/assets/animations/animations.min.css?ver=22.0.1' type='text/css' media='all' />
<link rel='stylesheet' id='mfn-jquery-ui-css' href='https://mazastore.com.ua/ph/wp-content/themes/betheme/assets/ui/jquery.ui.all.css?ver=22.0.1'
type='text/css' media='all' />
<link rel='stylesheet' id='mfn-jplayer-css' href='https://mazastore.com.ua/ph/wp-
content/themes/betheme/assets/jplayer/css/jplayer.blue.monday.css?ver=22.0.1' type='text/css' media='all' />
<link rel='stylesheet' id='mfn-responsive-css' href='https://mazastore.com.ua/ph/wp-content/themes/betheme/css/responsive.css?ver=22.0.1'
type='text/css' media='all' />
<link rel='stylesheet' id='mfn-fonts-css'
href='https://fonts.googleapis.com/css?family=Montserrat%3A1%2C300%2C400%2C400italic%2C500%2C700%2C700italic&display=swap&
#038;ver=5.7.1' type='text/css' media='all' />
<style id='mfn-dynamic-inline-css' type='text/css'>
html{background-color: #313134;}#Wrapper,#Content{background-color: #313134;}body:not(.template-slider) #Header{min-height:
0px;}body.header-below:not(.template-slider) #Header{padding-top: 0px;}#Footer .widgets_wrapper {padding: 70px 0;}body, button,
span.date_label, .timeline_items li h3 span, input[type="submit"], input[type="reset"], input[type="button"],input[type="text"],
input[type="password"], input[type="tel"], input[type="email"], textarea, select, .offer_li .title h3 {font-family: "Montserrat", Helvetica, Arial, sans-
serif;}#menu > ul > li > a, a.action_button, #overlay-menu ul li a {font-family: "Montserrat", Helvetica, Arial, sans-serif;}#Subheader .title {font-
family: "Montserrat", Helvetica, Arial, sans-serif;}h1, h2, h3, h4, .text-logo #logo {font-family: "Montserrat", Helvetica, Arial, sans-serif;}h5, h6
{font-family: "Montserrat", Helvetica, Arial, sans-serif;}blockquote {font-family: "Montserrat", Helvetica, Arial, sans-serif;}.chart_box .chart .num,
.counter .desc_wrapper .number-wrapper, .how_it_works .image .number,.pricing-box .plan-header .price, .quick_fact .number-wrapper,
.woocommerce .product div.entry-summary .price {font-family: "Montserrat", Helvetica, Arial, sans-serif;}body {font-size: 14px;line-height:
26px;font-weight: 300;letter-spacing: 0px;}.big {font-size: 16px;line-height: 28px;font-weight: 300;letter-spacing: 0px;}#menu > ul > li > a,
a.action_button, #overlay-menu ul li a{font-size: 14px;font-weight: 400;letter-spacing: 0px;}#overlay-menu ul li a{line-height: 21px;}#Subheader
.title {font-size: 30px;line-height: 35px;font-weight: 400;letter-spacing: 1px;font-style: italic;}h1, .text-logo #logo {font-size: 60px;line-height:
70px;font-weight: 400;letter-spacing: 0px;}h2 {font-size: 55px;line-height: 65px;font-weight: 400;letter-spacing: 0px;}h3 {font-size: 35px;line-
height: 45px;font-weight: 400;letter-spacing: 0px;}h4 {font-size: 25px;line-height: 35px;font-weight: 300;letter-spacing: 0px;}h5 {font-size:
18px;line-height: 28px;font-weight: 400;letter-spacing: 0px;}h6 {font-size: 12px;line-height: 25px;font-weight: 400;letter-spacing: 4px;}#Intro .intro-
title {font-size: 70px;line-height: 70px;font-weight: 400;letter-spacing: 0px;}@media only screen and (min-width: 768px) and (max-width:
959px){body {font-size: 13px;line-height: 22px;letter-spacing: 0px;}.big {font-size: 14px;line-height: 24px;letter-spacing: 0px;}#menu > ul > li > a,
a.action_button, #overlay-menu ul li a {font-size: 13px;letter-spacing: 0px;}#overlay-menu ul li a{line-height: 19.5px;letter-spacing:
0px;}#Subheader .title {font-size: 26px;line-height: 30px;letter-spacing: 1px;}h1, .text-logo #logo {font-size: 51px;line-height: 60px;letter-spacing:
0px;}h2 {font-size: 47px;line-height: 55px;letter-spacing: 0px;}h3 {font-size: 30px;line-height: 38px;letter-spacing: 0px;}h4 {font-size: 21px;line-
height: 30px;letter-spacing: 0px;}h5 {font-size: 15px;line-height: 24px;letter-spacing: 0px;}h6 {font-size: 13px;line-height: 21px;letter-spacing:
3px;}#Intro .intro-title {font-size: 60px;line-height: 60px;letter-spacing: 0px;}blockquote { font-size: 15px;}.chart_box .chart .num { font-size: 45px;
line-height: 45px; }.counter .desc_wrapper .number-wrapper { font-size: 45px; line-height: 45px;}.counter .desc_wrapper .title { font-size: 14px; line-
height: 18px;}.faq .question .title { font-size: 14px; }.fancy_heading .title { font-size: 38px; line-height: 38px; }.offer .offer_li .desc_wrapper .title h3
{ font-size: 32px; line-height: 32px; }.offer_thumb_ul li.offer_thumb_li .desc_wrapper .title h3 {font-size: 32px; line-height: 32px; }.pricing-box
.plan-header h2 { font-size: 27px; line-height: 27px; }.pricing-box .plan-header .price > span { font-size: 40px; line-height: 40px; }.pricing-box .plan-
header .price sup.currency { font-size: 18px; line-height: 18px; }.pricing-box .plan-header .price sup.period { font-size: 14px; line-height:
14px;}.quick_fact .number { font-size: 80px; line-height: 80px;}.trailer_box .desc h2 { font-size: 27px; line-height: 27px; }.widget > h3 { font-size:
17px; line-height: 20px; }}@media only screen and (min-width: 480px) and (max-width: 767px){body {font-size: 13px;line-height: 20px;letter-
spacing: 0px;}.big {font-size: 13px;line-height: 21px;letter-spacing: 0px;}#menu > ul > li > a, a.action_button, #overlay-menu ul li a {font-size:
13px;letter-spacing: 0px;}#overlay-menu ul li a{line-height: 19.5px;letter-spacing: 0px;}#Subheader .title {font-size: 23px;line-height: 26px;letter-
spacing: 1px;}h1, .text-logo #logo {font-size: 45px;line-height: 53px;letter-spacing: 0px;}h2 {font-size: 41px;line-height: 49px;letter-spacing:
0px;}h3 {font-size: 26px;line-height: 34px;letter-spacing: 0px;}h4 {font-size: 19px;line-height: 26px;letter-spacing: 0px;}h5 {font-size: 14px;line-
height: 21px;letter-spacing: 0px;}h6 {font-size: 13px;line-height: 19px;letter-spacing: 3px;}#Intro .intro-title {font-size: 53px;line-height: 53px;letter-
spacing: 0px;}blockquote { font-size: 14px;}.chart_box .chart .num { font-size: 40px; line-height: 40px; }.counter .desc_wrapper .number-wrapper {
font-size: 40px; line-height: 40px;}.counter .desc_wrapper .title { font-size: 13px; line-height: 16px;}.faq .question .title { font-size: 13px;
}.fancy_heading .title { font-size: 34px; line-height: 34px; }.offer .offer_li .desc_wrapper .title h3 { font-size: 28px; line-height: 28px;
}.offer_thumb_ul li.offer_thumb_li .desc_wrapper .title h3 {font-size: 28px; line-height: 28px; }.pricing-box .plan-header h2 { font-size: 24px; line-
height: 24px; }.pricing-box .plan-header .price > span { font-size: 34px; line-height: 34px; }.pricing-box .plan-header .price sup.currency { font-size:
16px; line-height: 16px; }.pricing-box .plan-header .price sup.period { font-size: 13px; line-height: 13px;}.quick_fact .number { font-size: 70px; line-
height: 70px;}.trailer_box .desc h2 { font-size: 24px; line-height: 24px; }.widget > h3 { font-size: 16px; line-height: 19px; }}@media only screen and
(max-width: 479px){body {font-size: 13px;line-height: 19px;letter-spacing: 0px;}.big {font-size: 13px;line-height: 19px;letter-spacing: 0px;}#menu
> ul > li > a, a.action_button, #overlay-menu ul li a {font-size: 13px;letter-spacing: 0px;}#overlay-menu ul li a{line-height: 19.5px;letter-spacing:
0px;}#Subheader .title {font-size: 18px;line-height: 21px;letter-spacing: 1px;}h1, .text-logo #logo {font-size: 36px;line-height: 42px;letter-spacing:
0px;}h2 {font-size: 33px;line-height: 39px;letter-spacing: 0px;}h3 {font-size: 21px;line-height: 27px;letter-spacing: 0px;}h4 {font-size: 15px;line-
height: 21px;letter-spacing: 0px;}h5 {font-size: 13px;line-height: 19px;letter-spacing: 0px;}h6 {font-size: 13px;line-height: 19px;letter-spacing:
2px;}#Intro .intro-title {font-size: 42px;line-height: 42px;letter-spacing: 0px;}blockquote { font-size: 13px;}.chart_box .chart .num { font-size: 35px;
line-height: 35px; }.counter .desc_wrapper .number-wrapper { font-size: 35px; line-height: 35px;}.counter .desc_wrapper .title { font-size: 13px; line-
height: 26px;}.faq .question .title { font-size: 13px; }.fancy_heading .title { font-size: 30px; line-height: 30px; }.offer .offer_li .desc_wrapper .title h3
{ font-size: 26px; line-height: 26px; }.offer_thumb_ul li.offer_thumb_li .desc_wrapper .title h3 {font-size: 26px; line-height: 26px; }.pricing-box
.plan-header h2 { font-size: 21px; line-height: 21px; }.pricing-box .plan-header .price > span { font-size: 32px; line-height: 32px; }.pricing-box .plan-
header .price sup.currency { font-size: 14px; line-height: 14px; }.pricing-box .plan-header .price sup.period { font-size: 13px; line-height:
13px;}.quick_fact .number { font-size: 60px; line-height: 60px;}.trailer_box .desc h2 { font-size: 21px; line-height: 21px; }.widget > h3 { font-size:
15px; line-height: 18px; }}.with_aside .sidebar.columns {width: 23%;}.with_aside .sections_group {width: 77%;}.aside_both .sidebar.columns
{width: 18%;}.aside_both .sidebar.sidebar-1{margin-left: -82%;}.aside_both .sections_group {width: 64%;margin-left: 18%;}@media only screen
and (min-width:1240px){#Wrapper, .with_aside .content_wrapper {max-width: 1122px;}.section_wrapper, .container {max-width: 1102px;}.layout-
boxed.header-boxed #Top_bar.is-sticky{max-width: 1122px;}}@media only screen and (max-width:
767px){.section_wrapper,.container,.four.columns .widget-area { max-width: 480px !important; }}.button-default .button, .button-flat .button,
.button-round .button {background-color: #8c8c8c;color: #ffffff;}.button-stroke .button {border-color: #8c8c8c;color: #ffffff;}.button-stroke
.button:hover{background-color: #8c8c8c;color: #fff;}.button-default .button_theme, .button-default button,.button-default input[type="button"],
.button-default input[type="reset"], .button-default input[type="submit"],.button-flat .button_theme, .button-flat button,.button-flat
input[type="button"], .button-flat input[type="reset"], .button-flat input[type="submit"],.button-round .button_theme, .button-round button,.button-
round input[type="button"], .button-round input[type="reset"], .button-round input[type="submit"],.woocommerce #respond
input#submit,.woocommerce a.button:not(.default),.woocommerce button.button,.woocommerce input.button,.woocommerce #respond
input#submit:hover, .woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover{color: #ffffff;}.button-
stroke .button_theme:hover,.button-stroke button:hover, .button-stroke input[type="submit"]:hover, .button-stroke input[type="reset"]:hover, .button-
stroke input[type="button"]:hover,.button-stroke .woocommerce #respond input#submit:hover,.button-stroke .woocommerce
a.button:not(.default):hover,.button-stroke .woocommerce button.button:hover,.button-stroke.woocommerce input.button:hover {color: #ffffff
!important;}.button-stroke .button_theme:hover .button_icon i{color: #ffffff !important;}.button-default .single_add_to_cart_button, .button-flat
.single_add_to_cart_button, .button-round .single_add_to_cart_button,.button-default .woocommerce .button:disabled, .button-flat .woocommerce
.button:disabled, .button-round .woocommerce .button:disabled,.button-default .woocommerce .button.alt .button-flat .woocommerce .button.alt,
.button-round .woocommerce .button.alt,.button-default a.remove, .button-flat a.remove, .button-round a.remove{color:
#ffffff!important;}.action_button, .action_button:hover{background-color: #48484d;color: #ffffff;}.button-stroke a.action_button{border-color:
#48484d;}.button-stroke a.action_button:hover{background-color: #48484d!important;}.footer_button{color: #65666C!important;background-
color:transparent;box-shadow:none!important;}.footer_button:after{display:none!important;}.button-custom .button,.button-custom
.action_button,.button-custom .footer_button,.button-custom button,.button-custom input[type="button"],.button-custom input[type="reset"],.button-
custom input[type="submit"],.button-custom .woocommerce #respond input#submit,.button-custom .woocommerce a.button,.button-custom
.woocommerce button.button,.button-custom .woocommerce input.button{font-family: Arial;font-size: 14px;line-height: 14px;font-weight: 400;letter-
spacing: 0px;padding: 12px 20px 12px 20px;border-width: 0px;border-radius: 0px;}.button-custom .button{color: #626262;background-color:
#dbdddf;border-color: transparent;}.button-custom .button:hover{color: #626262;background-color: #d3d3d3;border-color: transparent;}.button-
custom .button_theme,.button-custom button,.button-custom input[type="button"],.button-custom input[type="reset"],.button-custom
input[type="submit"],.button-custom .woocommerce #respond input#submit,.button-custom .woocommerce a.button:not(.default),.button-custom
.woocommerce button.button,.button-custom .woocommerce input.button{color: #ffffff;background-color: #0095eb;border-color:
transparent;}.button-custom .button_theme:hover,.button-custom button:hover,.button-custom input[type="button"]:hover,.button-custom
input[type="reset"]:hover,.button-custom input[type="submit"]:hover,.button-custom .woocommerce #respond input#submit:hover,.button-custom
.woocommerce a.button:not(.default):hover,.button-custom .woocommerce button.button:hover,.button-custom .woocommerce
input.button:hover{color: #ffffff;background-color: #007cc3;border-color: transparent;}.button-custom .action_button{color: #626262;background-
color: #dbdddf;border-color: transparent;}.button-custom .action_button:hover{color: #626262;background-color: #d3d3d3;border-color:
transparent;}.button-custom .single_add_to_cart_button,.button-custom .woocommerce .button:disabled,.button-custom .woocommerce
.button.alt,.button-custom a.remove{line-height: 14px!important;padding: 12px 20px 12px 20px!important;color: #ffffff!important;background-color:
#0095eb!important;}.button-custom .single_add_to_cart_button:hover,.button-custom .woocommerce .button:disabled:hover,.button-custom
.woocommerce .button.alt:hover,.button-custom a.remove:hover{color: #ffffff!important;background-color: #007cc3!important;}#Top_bar
#logo,.header-fixed #Top_bar #logo,.header-plain #Top_bar #logo,.header-transparent #Top_bar #logo {height: 60px;line-height: 60px;padding: 25px
0;}.logo-overflow #Top_bar:not(.is-sticky) .logo {height: 110px;}#Top_bar .menu > li > a {padding: 25px 0;}.menu-highlight:not(.header-creative)
#Top_bar .menu > li > a {margin: 30px 0;}.header-plain:not(.menu-highlight) #Top_bar .menu > li > a span:not(.description) {line-height:
110px;}.header-fixed #Top_bar .menu > li > a {padding: 40px 0;}#Top_bar .top_bar_right,.header-plain #Top_bar .top_bar_right {height:
110px;}#Top_bar .top_bar_right_wrapper {top: 35px;}.header-plain #Top_bar a#header_cart,.header-plain #Top_bar a#search_button,.header-plain
#Top_bar .wpml-languages {line-height: 110px;}.header-plain #Top_bar a.action_button {line-height: 110px!important;}@media only screen and
(max-width: 767px){#Top_bar a.responsive-menu-toggle {top: 40px;}.mobile-header-mini #Top_bar #logo{height:50px!important;line-
height:50px!important;margin:5px 0;}}.twentytwenty-before-label::before{content:"Before"}.twentytwenty-after-
label::before{content:"After"}input[type="date"],input[type="email"],input[type="number"],input[type="password"],input[type="search"],input[type
="tel"],input[type="text"],input[type="url"],select,textarea,.woocommerce .quantity input.qty{border-width: 0 0 2px 0;box-
shadow:unset;resize:none;}#Side_slide{right:-250px;width:250px;}#Side_slide.left{left:-250px;}.blog-teaser li .desc-wrapper .desc{background-
position-y:-1px;}@media only screen and ( max-width: 767px ){body:not(.template-slider) #Header{min-height: ;}#Subheader{padding: 80px
0;}}@media only screen and (min-width: 1240px){body:not(.header-simple) #Top_bar #menu{display:block!important}.tr-menu #Top_bar
#menu{background:none!important}#Top_bar .menu > li > ul.mfn-megamenu{width:984px}#Top_bar .menu > li > ul.mfn-megamenu >
li{float:left}#Top_bar .menu > li > ul.mfn-megamenu > li.mfn-megamenu-cols-1{width:100%}#Top_bar .menu > li > ul.mfn-megamenu > li.mfn-
megamenu-cols-2{width:50%}#Top_bar .menu > li > ul.mfn-megamenu > li.mfn-megamenu-cols-3{width:33.33%}#Top_bar .menu > li > ul.mfn-
megamenu > li.mfn-megamenu-cols-4{width:25%}#Top_bar .menu > li > ul.mfn-megamenu > li.mfn-megamenu-cols-5{width:20%}#Top_bar
.menu > li > ul.mfn-megamenu > li.mfn-megamenu-cols-6{width:16.66%}#Top_bar .menu > li > ul.mfn-megamenu > li >
ul{display:block!important;position:inherit;left:auto;top:auto;border-width:0 1px 0 0}#Top_bar .menu > li > ul.mfn-megamenu > li:last-child >
ul{border:0}#Top_bar .menu > li > ul.mfn-megamenu > li > ul li{width:auto}#Top_bar .menu > li > ul.mfn-megamenu a.mfn-megamenu-title{text-
transform:uppercase;font-weight:400;background:none}#Top_bar .menu > li > ul.mfn-megamenu a .menu-arrow{display:none}.menuo-right
#Top_bar .menu > li > ul.mfn-megamenu{left:auto;right:0}.menuo-right #Top_bar .menu > li > ul.mfn-megamenu-bg{box-sizing:border-
box}#Top_bar .menu > li > ul.mfn-megamenu-bg{padding:20px 166px 20px 20px;background-repeat:no-repeat;background-position:right
bottom}.rtl #Top_bar .menu > li > ul.mfn-megamenu-bg{padding-left:166px;padding-right:20px;background-position:left bottom}#Top_bar .menu >
li > ul.mfn-megamenu-bg > li{background:none}#Top_bar .menu > li > ul.mfn-megamenu-bg > li a{border:none}#Top_bar .menu > li > ul.mfn-
megamenu-bg > li > ul{background:none!important;-webkit-box-shadow:0 0 0 0;-moz-box-shadow:0 0 0 0;box-shadow:0 0 0 0}.mm-vertical
#Top_bar .container{position:relative;}.mm-vertical #Top_bar .top_bar_left{position:static;}.mm-vertical #Top_bar .menu > li ul{box-shadow:0 0 0
0 transparent!important;background-image:none;}.mm-vertical #Top_bar .menu > li > ul.mfn-megamenu{width:98%!important;margin:0
1%;padding:20px 0;}.mm-vertical.header-plain #Top_bar .menu > li > ul.mfn-megamenu{width:100%!important;margin:0;}.mm-vertical #Top_bar
.menu > li > ul.mfn-megamenu > li{display:table-cell;float:none!important;width:10%;padding:0 15px;border-right:1px solid rgba(0, 0, 0,
0.05);}.mm-vertical #Top_bar .menu > li > ul.mfn-megamenu > li:last-child{border-right-width:0}.mm-vertical #Top_bar .menu > li > ul.mfn-
megamenu > li.hide-border{border-right-width:0}.mm-vertical #Top_bar .menu > li > ul.mfn-megamenu > li a{border-bottom-width:0;padding:9px
15px;line-height:120%;}.mm-vertical #Top_bar .menu > li > ul.mfn-megamenu a.mfn-megamenu-title{font-weight:700;}.rtl .mm-vertical #Top_bar
.menu > li > ul.mfn-megamenu > li:first-child{border-right-width:0}.rtl .mm-vertical #Top_bar .menu > li > ul.mfn-megamenu > li:last-child{border-
right-width:1px}.header-plain:not(.menuo-right) #Header .top_bar_left{width:auto!important}.header-stack.header-center #Top_bar
#menu{display:inline-block!important}.header-simple #Top_bar
#menu{display:none;height:auto;width:300px;bottom:auto;top:100%;right:1px;position:absolute;margin:0}.header-simple #Header a.responsive-
menu-toggle{display:block;right:10px}.header-simple #Top_bar #menu > ul{width:100%;float:left}.header-simple #Top_bar #menu ul
li{width:100%;padding-bottom:0;border-right:0;position:relative}.header-simple #Top_bar #menu ul li a{padding:0
20px;margin:0;display:block;height:auto;line-height:normal;border:none}.header-simple #Top_bar #menu ul li a:after{display:none}.header-simple
#Top_bar #menu ul li a span{border:none;line-height:44px;display:inline;padding:0}.header-simple #Top_bar #menu ul li.submenu .menu-
toggle{display:block;position:absolute;right:0;top:0;width:44px;height:44px;line-height:44px;font-size:30px;font-weight:300;text-
align:center;cursor:pointer;color:#444;opacity:0.33;}.header-simple #Top_bar #menu ul li.submenu .menu-toggle:after{content:"+"}.header-simple
#Top_bar #menu ul li.hover > .menu-toggle:after{content:"-"}.header-simple #Top_bar #menu ul li.hover a{border-bottom:0}.header-simple
#Top_bar #menu ul.mfn-megamenu li .menu-toggle{display:none}.header-simple #Top_bar #menu ul li
ul{position:relative!important;left:0!important;top:0;padding:0;margin:0!important;width:auto!important;background-image:none}.header-simple
#Top_bar #menu ul li ul li{width:100%!important;display:block;padding:0;}.header-simple #Top_bar #menu ul li ul li a{padding:0 20px 0
30px}.header-simple #Top_bar #menu ul li ul li a .menu-arrow{display:none}.header-simple #Top_bar #menu ul li ul li a span{padding:0}.header-
simple #Top_bar #menu ul li ul li a span:after{display:none!important}.header-simple #Top_bar .menu > li > ul.mfn-megamenu a.mfn-megamenu-
title{text-transform:uppercase;font-weight:400}.header-simple #Top_bar .menu > li > ul.mfn-megamenu > li >
ul{display:block!important;position:inherit;left:auto;top:auto}.header-simple #Top_bar #menu ul li ul li ul{border-
left:0!important;padding:0;top:0}.header-simple #Top_bar #menu ul li ul li ul li a{padding:0 20px 0 40px}.rtl.header-simple #Top_bar
#menu{left:1px;right:auto}.rtl.header-simple #Top_bar a.responsive-menu-toggle{left:10px;right:auto}.rtl.header-simple #Top_bar #menu ul
li.submenu .menu-toggle{left:0;right:auto}.rtl.header-simple #Top_bar #menu ul li ul{left:auto!important;right:0!important}.rtl.header-simple
#Top_bar #menu ul li ul li a{padding:0 30px 0 20px}.rtl.header-simple #Top_bar #menu ul li ul li ul li a{padding:0 40px 0 20px}.menu-highlight
#Top_bar .menu > li{margin:0 2px}.menu-highlight:not(.header-creative) #Top_bar .menu > li > a{margin:20px 0;padding:0;-webkit-border-
radius:5px;border-radius:5px}.menu-highlight #Top_bar .menu > li > a:after{display:none}.menu-highlight #Top_bar .menu > li > a
span:not(.description){line-height:50px}.menu-highlight #Top_bar .menu > li > a span.description{display:none}.menu-highlight.header-stack
#Top_bar .menu > li > a{margin:10px 0!important}.menu-highlight.header-stack #Top_bar .menu > li > a span:not(.description){line-
height:40px}.menu-highlight.header-transparent #Top_bar .menu > li > a{margin:5px 0}.menu-highlight.header-simple #Top_bar #menu ul li,.menu-
highlight.header-creative #Top_bar #menu ul li{margin:0}.menu-highlight.header-simple #Top_bar #menu ul li > a,.menu-highlight.header-creative
#Top_bar #menu ul li > a{-webkit-border-radius:0;border-radius:0}.menu-highlight:not(.header-fixed):not(.header-simple) #Top_bar.is-sticky .menu
> li > a{margin:10px 0!important;padding:5px 0!important}.menu-highlight:not(.header-fixed):not(.header-simple) #Top_bar.is-sticky .menu > li > a
span{line-height:30px!important}.header-modern.menu-highlight.menuo-right .menu_wrapper{margin-right:20px}.menu-line-below #Top_bar
.menu > li > a:after{top:auto;bottom:-4px}.menu-line-below #Top_bar.is-sticky .menu > li > a:after{top:auto;bottom:-4px}.menu-line-below-80
#Top_bar:not(.is-sticky) .menu > li > a:after{height:4px;left:10%;top:50%;margin-top:20px;width:80%}.menu-line-below-80-1 #Top_bar:not(.is-
sticky) .menu > li > a:after{height:1px;left:10%;top:50%;margin-top:20px;width:80%}.menu-link-color #Top_bar .menu > li >
a:after{display:none!important}.menu-arrow-top #Top_bar .menu > li > a:after{background:none repeat scroll 0 0 rgba(0,0,0,0)!important;border-
color:#ccc transparent transparent;border-style:solid;border-width:7px 7px 0;display:block;height:0;left:50%;margin-left:-
7px;top:0!important;width:0}.menu-arrow-top #Top_bar.is-sticky .menu > li > a:after{top:0!important}.menu-arrow-bottom #Top_bar .menu > li >
a:after{background:none!important;border-color:transparent transparent #ccc;border-style:solid;border-width:0 7px
7px;display:block;height:0;left:50%;margin-left:-7px;top:auto;bottom:0;width:0}.menu-arrow-bottom #Top_bar.is-sticky .menu > li >
a:after{top:auto;bottom:0}.menuo-no-borders #Top_bar .menu > li > a span{border-width:0!important}.menuo-no-borders #Header_creative
#Top_bar .menu > li > a span{border-bottom-width:0}.menuo-no-borders.header-plain #Top_bar a#header_cart,.menuo-no-borders.header-plain
#Top_bar a#search_button,.menuo-no-borders.header-plain #Top_bar .wpml-languages,.menuo-no-borders.header-plain #Top_bar
a.action_button{border-width:0}.menuo-right #Top_bar .menu_wrapper{float:right}.menuo-right.header-stack:not(.header-center) #Top_bar
.menu_wrapper{margin-right:150px}body.header-creative{padding-left:50px}body.header-creative.header-open{padding-
left:250px}body.error404,body.under-construction,body.template-blank{padding-left:0!important}.header-creative.footer-fixed #Footer,.header-
creative.footer-sliding #Footer,.header-creative.footer-stick #Footer.is-sticky{box-sizing:border-box;padding-left:50px;}.header-open.footer-fixed
#Footer,.header-open.footer-sliding #Footer,.header-creative.footer-stick #Footer.is-sticky{padding-left:250px;}.header-rtl.header-creative.footer-
fixed #Footer,.header-rtl.header-creative.footer-sliding #Footer,.header-rtl.header-creative.footer-stick #Footer.is-sticky{padding-left:0;padding-
right:50px;}.header-rtl.header-open.footer-fixed #Footer,.header-rtl.header-open.footer-sliding #Footer,.header-rtl.header-creative.footer-stick
#Footer.is-sticky{padding-right:250px;}#Header_creative{background-color:#fff;position:fixed;width:250px;height:100%;left:-200px;top:0;z-
index:9002;-webkit-box-shadow:2px 0 4px 2px rgba(0,0,0,.15);box-shadow:2px 0 4px 2px rgba(0,0,0,.15)}#Header_creative
.container{width:100%}#Header_creative .creative-wrapper{opacity:0;margin-right:50px}#Header_creative a.creative-menu-
toggle{display:block;width:34px;height:34px;line-height:34px;font-size:22px;text-align:center;position:absolute;top:10px;right:8px;border-
radius:3px}.admin-bar #Header_creative a.creative-menu-toggle{top:42px}#Header_creative
#Top_bar{position:static;width:100%}#Header_creative #Top_bar .top_bar_left{width:100%!important;float:none}#Header_creative #Top_bar
.top_bar_right{width:100%!important;float:none;height:auto;margin-bottom:35px;text-align:center;padding:0 20px;top:0;-webkit-box-sizing:border-
box;-moz-box-sizing:border-box;box-sizing:border-box}#Header_creative #Top_bar .top_bar_right:before{display:none}#Header_creative #Top_bar
.top_bar_right_wrapper{top:0}#Header_creative #Top_bar .logo{float:none;text-align:center;margin:15px 0}#Header_creative #Top_bar
#menu{background-color:transparent}#Header_creative #Top_bar .menu_wrapper{float:none;margin:0 0 30px}#Header_creative #Top_bar .menu >
li{width:100%;float:none;position:relative}#Header_creative #Top_bar .menu > li > a{padding:0;text-align:center}#Header_creative #Top_bar
.menu > li > a:after{display:none}#Header_creative #Top_bar .menu > li > a span{border-right:0;border-bottom-width:1px;line-
height:38px}#Header_creative #Top_bar .menu li ul{left:100%;right:auto;top:0;box-shadow:2px 2px 2px 0 rgba(0,0,0,0.03);-webkit-box-shadow:2px
2px 2px 0 rgba(0,0,0,0.03)}#Header_creative #Top_bar .menu > li > ul.mfn-megamenu{margin:0;width:700px!important;}#Header_creative
#Top_bar .menu > li > ul.mfn-megamenu > li > ul{left:0}#Header_creative #Top_bar .menu li ul li a{padding-top:9px;padding-
bottom:8px}#Header_creative #Top_bar .menu li ul li ul{top:0}#Header_creative #Top_bar .menu > li > a span.description{display:block;font-
size:13px;line-height:28px!important;clear:both}#Header_creative #Top_bar .search_wrapper{left:100%;top:auto;bottom:0}#Header_creative
#Top_bar a#header_cart{display:inline-block;float:none;top:3px}#Header_creative #Top_bar a#search_button{display:inline-
block;float:none;top:3px}#Header_creative #Top_bar .wpml-languages{display:inline-block;float:none;top:0}#Header_creative #Top_bar .wpml-
languages.enabled:hover a.active{padding-bottom:11px}#Header_creative #Top_bar .action_button{display:inline-
block;float:none;top:16px;margin:0}#Header_creative #Top_bar .banner_wrapper{display:block;text-align:center}#Header_creative #Top_bar
.banner_wrapper img{max-width:100%;height:auto;display:inline-block}#Header_creative
#Action_bar{display:none;position:absolute;bottom:0;top:auto;clear:both;padding:0 20px;box-sizing:border-box}#Header_creative #Action_bar
.contact_details{text-align:center;margin-bottom:20px}#Header_creative #Action_bar .contact_details li{padding:0}#Header_creative #Action_bar
.social{float:none;text-align:center;padding:5px 0 15px}#Header_creative #Action_bar .social li{margin-bottom:2px}#Header_creative #Action_bar
.social-menu{float:none;text-align:center}#Header_creative #Action_bar .social-menu li{border-color:rgba(0,0,0,.1)}#Header_creative .social li
a{color:rgba(0,0,0,.5)}#Header_creative .social li a:hover{color:#000}#Header_creative .creative-
social{position:absolute;bottom:10px;right:0;width:50px}#Header_creative .creative-social li{display:block;float:none;width:100%;text-
align:center;margin-bottom:5px}.header-creative .fixed-nav.fixed-nav-prev{margin-left:50px}.header-creative.header-open .fixed-nav.fixed-nav-
prev{margin-left:250px}.menuo-last #Header_creative #Top_bar .menu li.last ul{top:auto;bottom:0}.header-open #Header_creative{left:0}.header-
open #Header_creative .creative-wrapper{opacity:1;margin:0!important;}.header-open #Header_creative .creative-menu-toggle,.header-open
#Header_creative .creative-social{display:none}.header-open #Header_creative #Action_bar{display:block}body.header-rtl.header-creative{padding-
left:0;padding-right:50px}.header-rtl #Header_creative{left:auto;right:-200px}.header-rtl #Header_creative .creative-wrapper{margin-
left:50px;margin-right:0}.header-rtl #Header_creative a.creative-menu-toggle{left:8px;right:auto}.header-rtl #Header_creative .creative-
social{left:0;right:auto}.header-rtl #Footer #back_to_top.sticky{right:125px}.header-rtl #popup_contact{right:70px}.header-rtl #Header_creative
#Top_bar .menu li ul{left:auto;right:100%}.header-rtl #Header_creative #Top_bar .search_wrapper{left:auto;right:100%;}.header-rtl .fixed-
nav.fixed-nav-prev{margin-left:0!important}.header-rtl .fixed-nav.fixed-nav-next{margin-right:50px}body.header-rtl.header-creative.header-
open{padding-left:0;padding-right:250px!important}.header-rtl.header-open #Header_creative{left:auto;right:0}.header-rtl.header-open #Footer
#back_to_top.sticky{right:325px}.header-rtl.header-open #popup_contact{right:270px}.header-rtl.header-open .fixed-nav.fixed-nav-next{margin-
right:250px}#Header_creative.active{left:-1px;}.header-rtl #Header_creative.active{left:auto;right:-1px;}#Header_creative.active .creative-
wrapper{opacity:1;margin:0}.header-creative .vc_row[data-vc-full-width]{padding-left:50px}.header-creative.header-open .vc_row[data-vc-full-
width]{padding-left:250px}.header-open .vc_parallax .vc_parallax-inner { left:auto; width: calc(100% - 250px); }.header-open.header-rtl .vc_parallax
.vc_parallax-inner { left:0; right:auto; }#Header_creative.scroll{height:100%;overflow-y:auto}#Header_creative.scroll:not(.dropdown) .menu li
ul{display:none!important}#Header_creative.scroll
#Action_bar{position:static}#Header_creative.dropdown{outline:none}#Header_creative.dropdown #Top_bar
.menu_wrapper{float:left}#Header_creative.dropdown #Top_bar #menu ul li{position:relative;float:left}#Header_creative.dropdown #Top_bar
#menu ul li a:after{display:none}#Header_creative.dropdown #Top_bar #menu ul li a span{line-height:38px;padding:0}#Header_creative.dropdown
#Top_bar #menu ul li.submenu .menu-toggle{display:block;position:absolute;right:0;top:0;width:38px;height:38px;line-height:38px;font-
size:26px;font-weight:300;text-align:center;cursor:pointer;color:#444;opacity:0.33;}#Header_creative.dropdown #Top_bar #menu ul li.submenu
.menu-toggle:after{content:"+"}#Header_creative.dropdown #Top_bar #menu ul li.hover > .menu-toggle:after{content:"-
"}#Header_creative.dropdown #Top_bar #menu ul li.hover a{border-bottom:0}#Header_creative.dropdown #Top_bar #menu ul.mfn-megamenu li
.menu-toggle{display:none}#Header_creative.dropdown #Top_bar #menu ul li
ul{position:relative!important;left:0!important;top:0;padding:0;margin-left:0!important;width:auto!important;background-
image:none}#Header_creative.dropdown #Top_bar #menu ul li ul li{width:100%!important}#Header_creative.dropdown #Top_bar #menu ul li ul li
a{padding:0 10px;text-align:center}#Header_creative.dropdown #Top_bar #menu ul li ul li a .menu-arrow{display:none}#Header_creative.dropdown
#Top_bar #menu ul li ul li a span{padding:0}#Header_creative.dropdown #Top_bar #menu ul li ul li a
span:after{display:none!important}#Header_creative.dropdown #Top_bar .menu > li > ul.mfn-megamenu a.mfn-megamenu-title{text-
transform:uppercase;font-weight:400}#Header_creative.dropdown #Top_bar .menu > li > ul.mfn-megamenu > li >
ul{display:block!important;position:inherit;left:auto;top:auto}#Header_creative.dropdown #Top_bar #menu ul li ul li ul{border-
left:0!important;padding:0;top:0}#Header_creative{transition: left .5s ease-in-out, right .5s ease-in-out;}#Header_creative .creative-
wrapper{transition: opacity .5s ease-in-out, margin 0s ease-in-out .5s;}#Header_creative.active .creative-wrapper{transition: opacity .5s ease-in-out,
margin 0s ease-in-out;}}@media only screen and (min-width: 768px){#Top_bar.is-sticky{position:fixed!important;width:100%;left:0;top:-
60px;height:60px;z-index:701;background:#fff;opacity:.97;-webkit-box-shadow:0 2px 5px 0 rgba(0,0,0,0.1);-moz-box-shadow:0 2px 5px 0
rgba(0,0,0,0.1);box-shadow:0 2px 5px 0 rgba(0,0,0,0.1)}.layout-boxed.header-boxed #Top_bar.is-sticky{max-width:1240px;left:50%;-webkit-
transform:translateX(-50%);transform:translateX(-50%)}#Top_bar.is-sticky .top_bar_left,#Top_bar.is-sticky .top_bar_right,#Top_bar.is-sticky
.top_bar_right:before{background:none;box-shadow:unset}#Top_bar.is-sticky .top_bar_right{top:-4px;height:auto;}#Top_bar.is-sticky
.top_bar_right_wrapper{top:15px}.header-plain #Top_bar.is-sticky .top_bar_right_wrapper{top:0}#Top_bar.is-sticky .logo{width:auto;margin:0
30px 0 20px;padding:0}#Top_bar.is-sticky #logo,#Top_bar.is-sticky .custom-logo-link{padding:5px 0!important;height:50px!important;line-
height:50px!important}.logo-no-sticky-padding #Top_bar.is-sticky #logo{height:60px!important;line-height:60px!important}#Top_bar.is-sticky
#logo img.logo-main{display:none}#Top_bar.is-sticky #logo img.logo-sticky{display:inline;max-height:35px;width:auto}#Top_bar.is-sticky
.menu_wrapper{clear:none}#Top_bar.is-sticky .menu_wrapper .menu > li > a{padding:15px 0}#Top_bar.is-sticky .menu > li > a,#Top_bar.is-sticky
.menu > li > a span{line-height:30px}#Top_bar.is-sticky .menu > li > a:after{top:auto;bottom:-4px}#Top_bar.is-sticky .menu > li > a
span.description{display:none}#Top_bar.is-sticky .secondary_menu_wrapper,#Top_bar.is-sticky .banner_wrapper{display:none}.header-overlay
#Top_bar.is-sticky{display:none}.sticky-dark #Top_bar.is-sticky,.sticky-dark #Top_bar.is-sticky #menu{background:rgba(0,0,0,.8)}.sticky-dark
#Top_bar.is-sticky .menu > li:not(.current-menu-item) > a{color:#fff}.sticky-dark #Top_bar.is-sticky .top_bar_right
a:not(.action_button){color:rgba(255,255,255,.8)}.sticky-dark #Top_bar.is-sticky .wpml-languages a.active,.sticky-dark #Top_bar.is-sticky .wpml-
languages ul.wpml-lang-dropdown{background:rgba(0,0,0,0.1);border-color:rgba(0,0,0,0.1)}.sticky-white #Top_bar.is-sticky,.sticky-white
#Top_bar.is-sticky #menu{background:rgba(255,255,255,.8)}.sticky-white #Top_bar.is-sticky .menu > li:not(.current-menu-item) >
a{color:#222}.sticky-white #Top_bar.is-sticky .top_bar_right a:not(.action_button){color:rgba(0,0,0,.8)}.sticky-white #Top_bar.is-sticky .wpml-
languages a.active,.sticky-white #Top_bar.is-sticky .wpml-languages ul.wpml-lang-dropdown{background:rgba(255,255,255,0.1);border-
color:rgba(0,0,0,0.1)}}@media only screen and (max-width: 1239px){#Top_bar
#menu{display:none;height:auto;width:300px;bottom:auto;top:100%;right:1px;position:absolute;margin:0}#Top_bar a.responsive-menu-
toggle{display:block}#Top_bar #menu > ul{width:100%;float:left}#Top_bar #menu ul li{width:100%;padding-bottom:0;border-
right:0;position:relative}#Top_bar #menu ul li a{padding:0 25px;margin:0;display:block;height:auto;line-height:normal;border:none}#Top_bar
#menu ul li a:after{display:none}#Top_bar #menu ul li a span{border:none;line-height:44px;display:inline;padding:0}#Top_bar #menu ul li a
span.description{margin:0 0 0 5px}#Top_bar #menu ul li.submenu .menu-
toggle{display:block;position:absolute;right:15px;top:0;width:44px;height:44px;line-height:44px;font-size:30px;font-weight:300;text-
align:center;cursor:pointer;color:#444;opacity:0.33;}#Top_bar #menu ul li.submenu .menu-toggle:after{content:"+"}#Top_bar #menu ul li.hover >
.menu-toggle:after{content:"-"}#Top_bar #menu ul li.hover a{border-bottom:0}#Top_bar #menu ul li a span:after{display:none!important}#Top_bar
#menu ul.mfn-megamenu li .menu-toggle{display:none}#Top_bar #menu ul li
ul{position:relative!important;left:0!important;top:0;padding:0;margin-left:0!important;width:auto!important;background-image:none!important;box-
shadow:0 0 0 0 transparent!important;-webkit-box-shadow:0 0 0 0 transparent!important}#Top_bar #menu ul li ul
li{width:100%!important}#Top_bar #menu ul li ul li a{padding:0 20px 0 35px}#Top_bar #menu ul li ul li a .menu-arrow{display:none}#Top_bar
#menu ul li ul li a span{padding:0}#Top_bar #menu ul li ul li a span:after{display:none!important}#Top_bar .menu > li > ul.mfn-megamenu a.mfn-
megamenu-title{text-transform:uppercase;font-weight:400}#Top_bar .menu > li > ul.mfn-megamenu > li >
ul{display:block!important;position:inherit;left:auto;top:auto}#Top_bar #menu ul li ul li ul{border-left:0!important;padding:0;top:0}#Top_bar #menu
ul li ul li ul li a{padding:0 20px 0 45px}.rtl #Top_bar #menu{left:1px;right:auto}.rtl #Top_bar a.responsive-menu-toggle{left:20px;right:auto}.rtl
#Top_bar #menu ul li.submenu .menu-toggle{left:15px;right:auto;border-left:none;border-right:1px solid #eee}.rtl #Top_bar #menu ul li
ul{left:auto!important;right:0!important}.rtl #Top_bar #menu ul li ul li a{padding:0 30px 0 20px}.rtl #Top_bar #menu ul li ul li ul li a{padding:0
40px 0 20px}.header-stack .menu_wrapper a.responsive-menu-toggle{position:static!important;margin:11px 0!important}.header-stack
.menu_wrapper #menu{left:0;right:auto}.rtl.header-stack #Top_bar #menu{left:auto;right:0}.admin-bar #Header_creative{top:32px}.header-
creative.layout-boxed{padding-top:85px}.header-creative.layout-full-width #Wrapper{padding-
top:60px}#Header_creative{position:fixed;width:100%;left:0!important;top:0;z-index:1001}#Header_creative .creative-
wrapper{display:block!important;opacity:1!important}#Header_creative .creative-menu-toggle,#Header_creative .creative-
social{display:none!important;opacity:1!important}#Header_creative #Top_bar{position:static;width:100%}#Header_creative #Top_bar
#logo,#Header_creative #Top_bar .custom-logo-link{height:50px;line-height:50px;padding:5px 0}#Header_creative #Top_bar #logo img.logo-
sticky{max-height:40px!important}#Header_creative #logo img.logo-main{display:none}#Header_creative #logo img.logo-sticky{display:inline-
block}.logo-no-sticky-padding #Header_creative #Top_bar #logo{height:60px;line-height:60px;padding:0}.logo-no-sticky-padding #Header_creative
#Top_bar #logo img.logo-sticky{max-height:60px!important}#Header_creative #Action_bar{display:none}#Header_creative #Top_bar
.top_bar_right{height:60px;top:0}#Header_creative #Top_bar .top_bar_right:before{display:none}#Header_creative #Top_bar
.top_bar_right_wrapper{top:0;padding-top:9px}#Header_creative.scroll{overflow:visible!important}}#Header_wrapper, #Intro {background-color:
#313134;}#Subheader {background-color: rgba(247,247,247,1);}.header-classic #Action_bar, .header-fixed #Action_bar, .header-plain #Action_bar,
.header-split #Action_bar, .header-stack #Action_bar {background-color: #292b33;}#Sliding-top {background-color: #545454;}#Sliding-top
a.sliding-top-control {border-right-color: #545454;}#Sliding-top.st-center a.sliding-top-control,#Sliding-top.st-left a.sliding-top-control {border-top-
color: #545454;}#Footer {background-color: #313134;}body, ul.timeline_items, .icon_box a .desc, .icon_box a:hover .desc, .feature_list ul li a,
.list_item a, .list_item a:hover,.widget_recent_entries ul li a, .flat_box a, .flat_box a:hover, .story_box .desc, .content_slider.carouselul li a
.title,.content_slider.flat.description ul li .desc, .content_slider.flat.description ul li a .desc, .post-nav.minimal a i {color: #969699;}.post-nav.minimal
a svg {fill: #969699;}.themecolor, .opening_hours .opening_hours_wrapper li span, .fancy_heading_icon .icon_top,.fancy_heading_arrows .icon-
right-dir, .fancy_heading_arrows .icon-left-dir, .fancy_heading_line .title,.button-love a.mfn-love, .format-link .post-title .icon-link, .pager-single >
span, .pager-single a:hover,.widget_meta ul, .widget_pages ul, .widget_rss ul, .widget_mfn_recent_comments ul li:after, .widget_archive
ul,.widget_recent_comments ul li:after, .widget_nav_menu ul, .woocommerce ul.products li.product .price, .shop_slider .shop_slider_ul li
.item_wrapper .price,.woocommerce-page ul.products li.product .price, .widget_price_filter .price_label .from, .widget_price_filter .price_label
.to,.woocommerce ul.product_list_widget li .quantity .amount, .woocommerce .product div.entry-summary .price, .woocommerce .star-rating
span,#Error_404 .error_pic i, .style-simple #Filters .filters_wrapper ul li a:hover, .style-simple #Filters .filters_wrapper ul li.current-cat a,.style-simple
.quick_fact .title {color: #b89d85;}.themebg,#comments .commentlist > li .reply a.comment-reply-link,#Filters .filters_wrapper ul li a:hover,#Filters
.filters_wrapper ul li.current-cat a,.fixed-nav .arrow,.offer_thumb .slider_pagination a:before,.offer_thumb .slider_pagination a.selected:after,.pager
.pages a:hover,.pager .pages a.active,.pager .pages span.page-numbers.current,.pager-single span:after,.portfolio_group.exposure .portfolio-item .desc-
inner .line,.Recent_posts ul li .desc:after,.Recent_posts ul li .photo .c,.slider_pagination a.selected,.slider_pagination .slick-active a,.slider_pagination
a.selected:after,.slider_pagination .slick-active a:after,.testimonials_slider .slider_images,.testimonials_slider .slider_images
a:after,.testimonials_slider .slider_images:before,#Top_bar a#header_cart span,.widget_categories ul,.widget_mfn_menu ul li
a:hover,.widget_mfn_menu ul li.current-menu-item:not(.current-menu-ancestor) > a,.widget_mfn_menu ul
li.current_page_item:not(.current_page_ancestor) > a,.widget_product_categories ul,.widget_recent_entries ul li:after,.woocommerce-account
table.my_account_orders .order-number a,.woocommerce-MyAccount-navigation ul li.is-active a,.style-simple .accordion .question:after,.style-simple
.faq .question:after,.style-simple .icon_box .desc_wrapper .title:before,.style-simple #Filters .filters_wrapper ul li a:after,.style-simple .article_box
.desc_wrapper p:after,.style-simple .sliding_box .desc_wrapper:after,.style-simple .trailer_box:hover .desc,.tp-bullets.simplebullets.round
.bullet.selected,.tp-bullets.simplebullets.round .bullet.selected:after,.tparrows.default,.tp-bullets.tp-thumbs .bullet.selected:after{background-color:
#b89d85;}.Latest_news ul li .photo, .Recent_posts.blog_news ul li .photo, .style-simple .opening_hours .opening_hours_wrapper li label,.style-simple
.timeline_items li:hover h3, .style-simple .timeline_items li:nth-child(even):hover h3,.style-simple .timeline_items li:hover .desc, .style-simple
.timeline_items li:nth-child(even):hover,.style-simple .offer_thumb .slider_pagination a.selected {border-color: #b89d85;}a {color: #b89d85;}a:hover
{color: #927459;}*::-moz-selection {background-color: #b89d85;color: white;}*::selection {background-color: #b89d85;color: white;}.blockquote
p.author span, .counter .desc_wrapper .title, .article_box .desc_wrapper p, .team .desc_wrapper p.subtitle,.pricing-box .plan-header p.subtitle, .pricing-
box .plan-header .price sup.period, .chart_box p, .fancy_heading .inside,.fancy_heading_line .slogan, .post-meta, .post-meta a, .post-footer, .post-
footer a span.label, .pager .pages a, .button-love a .label,.pager-single a, #comments .commentlist > li .comment-author .says, .fixed-nav .desc .date,
.filters_buttons li.label, .Recent_posts ul li a .desc .date,.widget_recent_entries ul li .post-date, .tp_recent_tweets .twitter_time, .widget_price_filter
.price_label, .shop-filters .woocommerce-result-count,.woocommerce ul.product_list_widget li .quantity, .widget_shopping_cart
ul.product_list_widget li dl, .product_meta .posted_in,.woocommerce .shop_table .product-name .variation > dd, .shipping-calculator-
button:after,.shop_slider .shop_slider_ul li .item_wrapper .price del,.testimonials_slider .testimonials_slider_ul li .author span, .testimonials_slider
.testimonials_slider_ul li .author span a, .Latest_news ul li .desc_footer,.share-simple-wrapper .icons a {color: #a8a8a8;}h1, h1 a, h1 a:hover, .text-
logo #logo { color: #ffffff; }h2, h2 a, h2 a:hover { color: #ffffff; }h3, h3 a, h3 a:hover { color: #ffffff; }h4, h4 a, h4 a:hover, .style-simple .sliding_box
.desc_wrapper h4 { color: #ffffff; }h5, h5 a, h5 a:hover { color: #ffffff; }h6, h6 a, h6 a:hover,a.content_link .title { color: #969699; }.dropcap,
.highlight:not(.highlight_image) {background-color: #b89d85;}.button-default .button_theme, .button-default button,.button-default
input[type="button"], .button-default input[type="reset"], .button-default input[type="submit"],.button-flat .button_theme, .button-flat button,.button-
flat input[type="button"], .button-flat input[type="reset"], .button-flat input[type="submit"],.button-round .button_theme, .button-round
button,.button-round input[type="button"], .button-round input[type="reset"], .button-round input[type="submit"],.woocommerce #respond
input#submit,.woocommerce a.button:not(.default),.woocommerce button.button,.woocommerce input.button,.woocommerce #respond
input#submit:hover, .woocommerce a.button:not(.default):hover, .woocommerce button.button:hover, .woocommerce
input.button:hover{background-color: #b89d85;}.button-stroke .button_theme,.button-stroke .button_theme .button_icon i,.button-stroke button,
.button-stroke input[type="submit"], .button-stroke input[type="reset"], .button-stroke input[type="button"],.button-stroke .woocommerce #respond
input#submit,.button-stroke .woocommerce a.button:not(.default),.button-stroke .woocommerce button.button,.button-stroke.woocommerce
input.button {border-color: #b89d85;color: #b89d85 !important;}.button-stroke .button_theme:hover,.button-stroke button:hover, .button-stroke
input[type="submit"]:hover, .button-stroke input[type="reset"]:hover, .button-stroke input[type="button"]:hover {background-color:
#b89d85;}.button-default .single_add_to_cart_button, .button-flat .single_add_to_cart_button, .button-round .single_add_to_cart_button,.button-
default .woocommerce .button:disabled, .button-flat .woocommerce .button:disabled, .button-round .woocommerce .button:disabled,.button-default
.woocommerce .button.alt, .button-flat .woocommerce .button.alt, .button-round .woocommerce .button.alt{background-color:
#b89d85!important;}.button-stroke .single_add_to_cart_button:hover,.button-stroke #place_order:hover {background-color:
#b89d85!important;}a.mfn-link {color: #656B6F;}a.mfn-link-2 span, a:hover.mfn-link-2 span:before, a.hover.mfn-link-2 span:before, a.mfn-link-5
span, a.mfn-link-8:after, a.mfn-link-8:before {background: #b89d85;}a:hover.mfn-link {color: #b89d85;}a.mfn-link-2 span:before, a:hover.mfn-link-
4:before, a:hover.mfn-link-4:after, a.hover.mfn-link-4:before, a.hover.mfn-link-4:after, a.mfn-link-5:before, a.mfn-link-7:after, a.mfn-link-7:before
{background: #927459;}a.mfn-link-6:before {border-bottom-color: #927459;}.column_column ul, .column_column ol, .the_content_wrapper:not(.is-
elementor) ul, .the_content_wrapper:not(.is-elementor) ol {color: #ffffff;}hr.hr_color, .hr_color hr, .hr_dots span {color: #b89d85;background:
#b89d85;}.hr_zigzag i {color: #b89d85;}.highlight-left:after,.highlight-right:after {background: #b89d85;}@media only screen and (max-width:
767px) {.highlight-left .wrap:first-child,.highlight-right .wrap:last-child {background: #b89d85;}}#Header .top_bar_left, .header-classic #Top_bar,
.header-plain #Top_bar, .header-stack #Top_bar, .header-split #Top_bar,.header-fixed #Top_bar, .header-below #Top_bar, #Header_creative,
#Top_bar #menu, .sticky-tb-color #Top_bar.is-sticky {background-color: #313134;}#Top_bar .wpml-languages a.active, #Top_bar .wpml-languages
ul.wpml-lang-dropdown {background-color: #313134;}#Top_bar .top_bar_right:before {background-color: #e3e3e3;}#Header .top_bar_right
{background-color: #f5f5f5;}#Top_bar .top_bar_right a:not(.action_button) {color: #333333;}#Top_bar .menu > li > a,#Top_bar #menu ul
li.submenu .menu-toggle {color: #ffffff;}#Top_bar .menu > li.current-menu-item > a,#Top_bar .menu > li.current_page_item > a,#Top_bar .menu >
li.current-menu-parent > a,#Top_bar .menu > li.current-page-parent > a,#Top_bar .menu > li.current-menu-ancestor > a,#Top_bar .menu > li.current-
page-ancestor > a,#Top_bar .menu > li.current_page_ancestor > a,#Top_bar .menu > li.hover > a {color: #ffffff;}#Top_bar .menu > li a:after
{background: #ffffff;}.menuo-arrows #Top_bar .menu > li.submenu > a > span:not(.description)::after {border-top-color: #ffffff;}#Top_bar .menu >
li.current-menu-item.submenu > a > span:not(.description)::after,#Top_bar .menu > li.current_page_item.submenu > a >
span:not(.description)::after,#Top_bar .menu > li.current-menu-parent.submenu > a > span:not(.description)::after,#Top_bar .menu > li.current-page-
parent.submenu > a > span:not(.description)::after,#Top_bar .menu > li.current-menu-ancestor.submenu > a > span:not(.description)::after,#Top_bar
.menu > li.current-page-ancestor.submenu > a > span:not(.description)::after,#Top_bar .menu > li.current_page_ancestor.submenu > a >
span:not(.description)::after,#Top_bar .menu > li.hover.submenu > a > span:not(.description)::after {border-top-color: #ffffff;}.menu-highlight
#Top_bar #menu > ul > li.current-menu-item > a,.menu-highlight #Top_bar #menu > ul > li.current_page_item > a,.menu-highlight #Top_bar #menu
> ul > li.current-menu-parent > a,.menu-highlight #Top_bar #menu > ul > li.current-page-parent > a,.menu-highlight #Top_bar #menu > ul >
li.current-menu-ancestor > a,.menu-highlight #Top_bar #menu > ul > li.current-page-ancestor > a,.menu-highlight #Top_bar #menu > ul >
li.current_page_ancestor > a,.menu-highlight #Top_bar #menu > ul > li.hover > a {background: #F2F2F2;}.menu-arrow-bottom #Top_bar .menu > li
> a:after { border-bottom-color: #ffffff;}.menu-arrow-top #Top_bar .menu > li > a:after {border-top-color: #ffffff;}.header-plain #Top_bar .menu >
li.current-menu-item > a,.header-plain #Top_bar .menu > li.current_page_item > a,.header-plain #Top_bar .menu > li.current-menu-parent >
a,.header-plain #Top_bar .menu > li.current-page-parent > a,.header-plain #Top_bar .menu > li.current-menu-ancestor > a,.header-plain #Top_bar
.menu > li.current-page-ancestor > a,.header-plain #Top_bar .menu > li.current_page_ancestor > a,.header-plain #Top_bar .menu > li.hover >
a,.header-plain #Top_bar a:hover#header_cart,.header-plain #Top_bar a:hover#search_button,.header-plain #Top_bar .wpml-
languages:hover,.header-plain #Top_bar .wpml-languages ul.wpml-lang-dropdown {background: #F2F2F2;color: #ffffff;}.header-plain
#Top_bar,.header-plain #Top_bar .menu > li > a span:not(.description),.header-plain #Top_bar a#header_cart,.header-plain #Top_bar
a#search_button,.header-plain #Top_bar .wpml-languages,.header-plain #Top_bar .action_button {border-color: #F2F2F2;}#Top_bar .menu > li ul
{background-color: #F2F2F2;}#Top_bar .menu > li ul li a {color: #5f5f5f;}#Top_bar .menu > li ul li a:hover,#Top_bar .menu > li ul li.hover > a
{color: #2e2e2e;}#Top_bar .search_wrapper {background: #b89d85;}.overlay-menu-toggle {color: #b89d85 !important;background:
transparent;}#Overlay {background: rgba(184,157,133,0.95);}#overlay-menu ul li a, .header-overlay .overlay-menu-toggle.focus {color:
#efeeea;}#overlay-menu ul li.current-menu-item > a,#overlay-menu ul li.current_page_item > a,#overlay-menu ul li.current-menu-parent >
a,#overlay-menu ul li.current-page-parent > a,#overlay-menu ul li.current-menu-ancestor > a,#overlay-menu ul li.current-page-ancestor > a,#overlay-
menu ul li.current_page_ancestor > a {color: #ffffff;}#Top_bar .responsive-menu-toggle,#Header_creative .creative-menu-toggle,#Header_creative
.responsive-menu-toggle {color: #b89d85;background: transparent;}#Side_slide{background-color: #191919;border-color:
#191919;}#Side_slide,#Side_slide .search-wrapper input.field,#Side_slide a:not(.action_button),#Side_slide #menu ul li.submenu .menu-
toggle{color: #A6A6A6;}#Side_slide a:not(.action_button):hover,#Side_slide a.active,#Side_slide #menu ul li.hover > .menu-toggle{color:
#FFFFFF;}#Side_slide #menu ul li.current-menu-item > a,#Side_slide #menu ul li.current_page_item > a,#Side_slide #menu ul li.current-menu-
parent > a,#Side_slide #menu ul li.current-page-parent > a,#Side_slide #menu ul li.current-menu-ancestor > a,#Side_slide #menu ul li.current-page-
ancestor > a,#Side_slide #menu ul li.current_page_ancestor > a,#Side_slide #menu ul li.hover > a,#Side_slide #menu ul li:hover > a{color:
#FFFFFF;}#Action_bar .contact_details{color: #bbbbbb}#Action_bar .contact_details a{color: #b89d85}#Action_bar .contact_details a:hover{color:
#927459}#Action_bar .social li a,#Header_creative .social li a,#Action_bar:not(.creative) .social-menu a{color: #bbbbbb}#Action_bar .social li
a:hover,#Header_creative .social li a:hover,#Action_bar:not(.creative) .social-menu a:hover{color: #FFFFFF}#Subheader .title{color:
#444444;}#Subheader ul.breadcrumbs li, #Subheader ul.breadcrumbs li a{color: rgba(68,68,68,0.6);}#Footer, #Footer .widget_recent_entries ul li a
{color: #969699;}#Footer a {color: #b89d85;}#Footer a:hover {color: #907054;}#Footer h1, #Footer h1 a, #Footer h1 a:hover,#Footer h2, #Footer h2
a, #Footer h2 a:hover,#Footer h3, #Footer h3 a, #Footer h3 a:hover,#Footer h4, #Footer h4 a, #Footer h4 a:hover,#Footer h5, #Footer h5 a, #Footer h5
a:hover,#Footer h6, #Footer h6 a, #Footer h6 a:hover {color: #ffffff;}#Footer .themecolor, #Footer .widget_meta ul, #Footer .widget_pages ul,
#Footer .widget_rss ul, #Footer .widget_mfn_recent_comments ul li:after, #Footer .widget_archive ul,#Footer .widget_recent_comments ul li:after,
#Footer .widget_nav_menu ul, #Footer .widget_price_filter .price_label .from, #Footer .widget_price_filter .price_label .to,#Footer .star-rating span
{color: #b89d85;}#Footer .themebg, #Footer .widget_categories ul, #Footer .Recent_posts ul li .desc:after, #Footer .Recent_posts ul li .photo
.c,#Footer .widget_recent_entries ul li:after, #Footer .widget_mfn_menu ul li a:hover, #Footer .widget_product_categories ul {background-color:
#b89d85;}#Footer .Recent_posts ul li a .desc .date, #Footer .widget_recent_entries ul li .post-date, #Footer .tp_recent_tweets .twitter_time,#Footer
.widget_price_filter .price_label, #Footer .shop-filters .woocommerce-result-count, #Footer ul.product_list_widget li .quantity,#Footer
.widget_shopping_cart ul.product_list_widget li dl {color: #a8a8a8;}#Footer .footer_copy .social li a,#Footer .footer_copy .social-menu a{color:
#65666C;}#Footer .footer_copy .social li a:hover,#Footer .footer_copy .social-menu a:hover{color: #FFFFFF;}#Footer .footer_copy{border-top-
color: rgba(255,255,255,0.1);}#Sliding-top, #Sliding-top .widget_recent_entries ul li a {color: #cccccc;}#Sliding-top a {color: #b89d85;}#Sliding-top
a:hover {color: #927459;}#Sliding-top h1, #Sliding-top h1 a, #Sliding-top h1 a:hover,#Sliding-top h2, #Sliding-top h2 a, #Sliding-top h2
a:hover,#Sliding-top h3, #Sliding-top h3 a, #Sliding-top h3 a:hover,#Sliding-top h4, #Sliding-top h4 a, #Sliding-top h4 a:hover,#Sliding-top h5,
#Sliding-top h5 a, #Sliding-top h5 a:hover,#Sliding-top h6, #Sliding-top h6 a, #Sliding-top h6 a:hover {color: #ffffff;}#Sliding-top .themecolor,
#Sliding-top .widget_meta ul, #Sliding-top .widget_pages ul, #Sliding-top .widget_rss ul, #Sliding-top .widget_mfn_recent_comments ul li:after,
#Sliding-top .widget_archive ul,#Sliding-top .widget_recent_comments ul li:after, #Sliding-top .widget_nav_menu ul, #Sliding-top
.widget_price_filter .price_label .from, #Sliding-top .widget_price_filter .price_label .to,#Sliding-top .star-rating span {color: #b89d85;}#Sliding-top
.themebg, #Sliding-top .widget_categories ul, #Sliding-top .Recent_posts ul li .desc:after, #Sliding-top .Recent_posts ul li .photo .c,#Sliding-top
.widget_recent_entries ul li:after, #Sliding-top .widget_mfn_menu ul li a:hover, #Sliding-top .widget_product_categories ul {background-color:
#b89d85;}#Sliding-top .Recent_posts ul li a .desc .date, #Sliding-top .widget_recent_entries ul li .post-date, #Sliding-top .tp_recent_tweets
.twitter_time,#Sliding-top .widget_price_filter .price_label, #Sliding-top .shop-filters .woocommerce-result-count, #Sliding-top
ul.product_list_widget li .quantity,#Sliding-top .widget_shopping_cart ul.product_list_widget li dl {color: #a8a8a8;}blockquote, blockquote a,
blockquote a:hover {color: #444444;}.image_frame .image_wrapper .image_links,.portfolio_group.masonry-hover .portfolio-item .masonry-hover-
wrapper .hover-desc {background: rgba(184,157,133,0.8);}.masonry.tiles .post-item .post-desc-wrapper .post-desc .post-title:after,.masonry.tiles
.post-item.no-img,.masonry.tiles .post-item.format-quote,.blog-teaser li .desc-wrapper .desc .post-title:after,.blog-teaser li.no-img,.blog-teaser
li.format-quote {background: #b89d85;}.image_frame .image_wrapper .image_links a {color: #ffffff;}.image_frame .image_wrapper .image_links
a:hover {background: #ffffff;color: #b89d85;}.image_frame {border-color: #f8f8f8;}.image_frame .image_wrapper .mask::after {background:
rgba(0,0,0,0.4);}.sliding_box .desc_wrapper {background: #b89d85;}.sliding_box .desc_wrapper:after {border-bottom-color: #b89d85;}.counter
.icon_wrapper i {color: #b89d85;}.quick_fact .number-wrapper {color: #b89d85;}.progress_bars .bars_list li .bar .progress {background-color:
#b89d85;}a:hover.icon_bar {color: #b89d85 !important;}a.content_link, a:hover.content_link {color: #b89d85;}a.content_link:before {border-
bottom-color: #b89d85;}a.content_link:after {border-color: #b89d85;}.get_in_touch, .infobox {background-color: #b89d85;}.google-map-contact-
wrapper .get_in_touch:after {border-top-color: #b89d85;}.timeline_items li h3:before,.timeline_items:after,.timeline .post-item:before {border-color:
#b89d85;}.how_it_works .image .number {background: #b89d85;}.trailer_box .desc .subtitle,.trailer_box.plain .desc .line {background-color:
#b89d85;}.trailer_box.plain .desc .subtitle {color: #b89d85;}.icon_box .icon_wrapper, .icon_box a .icon_wrapper,.style-simple .icon_box:hover
.icon_wrapper {color: #b89d85;}.icon_box:hover .icon_wrapper:before,.icon_box a:hover .icon_wrapper:before {background-color:
#b89d85;}ul.clients.clients_tiles li .client_wrapper:hover:before {background: #b89d85;}ul.clients.clients_tiles li .client_wrapper:after {border-
bottom-color: #b89d85;}.list_item.lists_1 .list_left {background-color: #b89d85;}.list_item .list_left {color: #b89d85;}.feature_list ul li .icon i {color:
#b89d85;}.feature_list ul li:hover,.feature_list ul li:hover a {background: #b89d85;}.ui-tabs .ui-tabs-nav li.ui-state-active a,.accordion .question.active
.title > .acc-icon-plus,.accordion .question.active .title > .acc-icon-minus,.faq .question.active .title > .acc-icon-plus,.faq .question.active
.title,.accordion .question.active .title {color: #b89d85;}.ui-tabs .ui-tabs-nav li.ui-state-active a:after {background: #b89d85;}body.table-
hover:not(.woocommerce-page) table tr:hover td {background: #b89d85;}.pricing-box .plan-header .price sup.currency,.pricing-box .plan-header
.price > span {color: #b89d85;}.pricing-box .plan-inside ul li .yes {background: #b89d85;}.pricing-box-box.pricing-box-featured {background:
#b89d85;}input[type="date"], input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"],
input[type="text"], input[type="url"],select, textarea, .woocommerce .quantity input.qty,.dark input[type="email"],.dark input[type="password"],.dark
input[type="tel"],.dark input[type="text"],.dark select,.dark textarea{color: #626262;background-color: rgba(255,255,255,0);border-color:
#2f2f33;}::-webkit-input-placeholder {color: #929292;}::-moz-placeholder {color: #929292;}:-ms-input-placeholder {color:
#929292;}input[type="date"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="password"]:focus,
input[type="search"]:focus, input[type="tel"]:focus, input[type="text"]:focus, input[type="url"]:focus, select:focus, textarea:focus {color:
#b89d85;background-color: rgba(233,245,252,0) !important;border-color: #5a5a63;}:focus::-webkit-input-placeholder {color: #929292;}:focus::-
moz-placeholder {color: #929292;}.woocommerce span.onsale, .shop_slider .shop_slider_ul li .item_wrapper span.onsale {border-top-color: #b89d85
!important;}.woocommerce span.onsale i, .shop_slider .shop_slider_ul li .item_wrapper span.onsale i {color: white;}.woocommerce
.widget_price_filter .ui-slider .ui-slider-handle {border-color: #b89d85 !important;}@media only screen and ( min-width: 768px ){.header-semi
#Top_bar:not(.is-sticky) {background-color: rgba(49,49,52,0.8);}}@media only screen and ( max-width: 767px ){#Top_bar{background-color:
#313134 !important;}#Action_bar{background-color: #FFFFFF !important;}#Action_bar .contact_details{color: #222222}#Action_bar
.contact_details a{color: #b89d85}#Action_bar .contact_details a:hover{color: #927459}#Action_bar .social li a,#Action_bar .social-menu a{color:
#bbbbbb!important}#Action_bar .social li a:hover,#Action_bar .social-menu a:hover{color: #777777!important}}
form input.display-none{display:none!important}
</style>
<script type='text/javascript' src='https://mazastore.com.ua/ph/wp-includes/js/jquery/jquery.min.js?ver=3.5.1' id='jquery-core-js'></script>
<script type='text/javascript' src='https://mazastore.com.ua/ph/wp-includes/js/jquery/jquery-migrate.min.js?ver=3.3.2' id='jquery-migrate-js'></script>
<script type='text/javascript' src='https://mazastore.com.ua/ph/wp-content/plugins/revslider/public/assets/js/rbtools.min.js?ver=6.4.3' id='tp-tools-
js'></script>
<script type='text/javascript' src='https://mazastore.com.ua/ph/wp-content/plugins/revslider/public/assets/js/rs6.min.js?ver=6.4.3' id='revmin-
js'></script>
<link rel="https://api.w.org/" href="https://mazastore.com.ua/ph/wp-json/" /><link rel="alternate" type="application/json"
href="https://mazastore.com.ua/ph/wp-json/wp/v2/pages/2" /><link rel="EditURI" type="application/rsd+xml" title="RSD"
href="https://mazastore.com.ua/ph/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="https://mazastore.com.ua/ph/wp-includes/wlwmanifest.xml" />
<meta name="generator" content="WordPress 5.7.1" />
<link rel="canonical" href="https://mazastore.com.ua/ph/" />
<link rel='shortlink' href='https://mazastore.com.ua/ph/' />
<link rel="alternate" type="application/json+oembed" href="https://mazastore.com.ua/ph/wp-
json/oembed/1.0/embed?url=https%3A%2F%2Fmazastore.com.ua%2Fph%2F" />
<link rel="alternate" type="text/xml+oembed" href="https://mazastore.com.ua/ph/wp-
json/oembed/1.0/embed?url=https%3A%2F%2Fmazastore.com.ua%2Fph%2F&format=xml" />
<meta name="generator" content="Powered by WPBakery Page Builder - drag and drop page builder for WordPress."/>
<style type="text/css" media="print">#wpadminbar { display:none; }</style>
<style type="text/css" media="screen">
html { margin-top: 32px !important; }
* html body { margin-top: 32px !important; }
@media screen and ( max-width: 782px ) {
html { margin-top: 46px !important; }
* html body { margin-top: 46px !important; }
}
</style>
<meta name="generator" content="Powered by Slider Revolution 6.4.3 - responsive, Mobile-Friendly Slider Plugin for WordPress with
comfortable drag and drop interface." />
<link rel="icon" href="https://mazastore.com.ua/ph/wp-content/uploads/2021/05/cropped-cropped-site-logo-32x32.png" sizes="32x32" />
<link rel="icon" href="https://mazastore.com.ua/ph/wp-content/uploads/2021/05/cropped-cropped-site-logo-192x192.png" sizes="192x192" />
<link rel="apple-touch-icon" href="https://mazastore.com.ua/ph/wp-content/uploads/2021/05/cropped-cropped-site-logo-180x180.png" />
<meta name="msapplication-TileImage" content="https://mazastore.com.ua/ph/wp-content/uploads/2021/05/cropped-cropped-site-logo-
270x270.png" />
<script type="text/javascript">function setREVStartSize(e){
//window.requestAnimationFrame(function() {
window.RSIW = window.RSIW===undefined ? window.innerWidth : window.RSIW;
window.RSIH = window.RSIH===undefined ? window.innerHeight : window.RSIH;
try {
var pw = document.getElementById(e.c).parentNode.offsetWidth,
newh;
pw = pw===0 || isNaN(pw) ? window.RSIW : pw;
e.tabw = e.tabw===undefined ? 0 : parseInt(e.tabw);
e.thumbw = e.thumbw===undefined ? 0 : parseInt(e.thumbw);
e.tabh = e.tabh===undefined ? 0 : parseInt(e.tabh);
e.thumbh = e.thumbh===undefined ? 0 : parseInt(e.thumbh);
e.tabhide = e.tabhide===undefined ? 0 : parseInt(e.tabhide);
e.thumbhide = e.thumbhide===undefined ? 0 : parseInt(e.thumbhide);
e.mh = e.mh===undefined || e.mh=="" || e.mh==="auto" ? 0 : parseInt(e.mh,0);
if(e.layout==="fullscreen" || e.l==="fullscreen")
newh = Math.max(e.mh,window.RSIH);
else{
e.gw = Array.isArray(e.gw) ? e.gw : [e.gw];
for (var i in e.rl) if (e.gw[i]===undefined || e.gw[i]===0) e.gw[i] = e.gw[i-1];
e.gh = e.el===undefined || e.el==="" || (Array.isArray(e.el) && e.el.length==0)?
e.gh : e.el;
e.gh = Array.isArray(e.gh) ? e.gh : [e.gh];
for (var i in e.rl) if (e.gh[i]===undefined || e.gh[i]===0) e.gh[i] = e.gh[i-1];
var nl = new Array(e.rl.length),
ix = 0,
sl;
e.tabw = e.tabhide>=pw ? 0 : e.tabw;
e.thumbw = e.thumbhide>=pw ? 0 : e.thumbw;
e.tabh = e.tabhide>=pw ? 0 : e.tabh;
e.thumbh = e.thumbhide>=pw ? 0 : e.thumbh;
for (var i in e.rl) nl[i] = e.rl[i]<window.RSIW ? 0 : e.rl[i];
sl = nl[0];
for (var i in nl) if (sl>nl[i] && nl[i]>0) { sl = nl[i]; ix=i;}
var m = pw>(e.gw[ix]+e.tabw+e.thumbw) ? 1 : (pw-(e.tabw+e.thumbw)) /
(e.gw[ix]);
newh = (e.gh[ix] * m) + (e.tabh + e.thumbh);
}
if(window.rs_init_css===undefined) window.rs_init_css =
document.head.appendChild(document.createElement("style"));
document.getElementById(e.c).height = newh+"px";
window.rs_init_css.innerHTML += "#"+e.c+"_wrapper { height: "+newh+"px }";
} catch(e){
console.log("Failure at Presize of Slider:" + e)
}
//});
};</script>
<noscript><style> .wpb_animate_when_almost_visible { opacity: 1; }</style></noscript>
</head>
<body data-rsssl=1 class="home page-template-default page page-id-2 logged-in admin-bar no-customize-support wp-custom-logo template-slider
color-custom style-default button-flat layout-full-width if-zoom no-content-padding header-classic sticky-header sticky-tb-color ab-hide subheader-
both-center menu-line-below-80-1 menuo-right menuo-no-borders mobile-tb-center mobile-side-slide mobile-mini-mr-ll tablet-sticky mobile-header-
mini mobile-sticky be-reg-2201 wpb-js-composer js-comp-ver-6.6.0 vc_responsive">
<!-- mfn_hook_top --><!-- mfn_hook_top -->
<div id="Wrapper">
<div id="Header_wrapper" class="" >
<header id="Header">
<div class="header_placeholder"></div>
<div id="Top_bar" class="loading">
<div class="container">
<div class="column one">
<div class="top_bar_left clearfix">
<div class="logo"><a id="logo" href="https://mazastore.com.ua/ph" title="Proffessional aerial shooting"
data-height="60" data-padding="25"><img class="logo-main scale-with-grid" src="https://mazastore.com.ua/ph/wp-
content/uploads/2018/10/video2.png" data-retina="https://mazastore.com.ua/ph/wp-content/uploads/2018/10/retina-video2.png" data-height="60"
alt="video2" data-no-retina /><img class="logo-sticky scale-with-grid" src="https://mazastore.com.ua/ph/wp-content/uploads/2018/10/video2.png"
data-retina="https://mazastore.com.ua/ph/wp-content/uploads/2018/10/retina-video2.png" data-height="60" alt="video2" data-no-retina /><img
class="logo-mobile scale-with-grid" src="https://mazastore.com.ua/ph/wp-content/uploads/2018/10/video2.png" data-
retina="https://mazastore.com.ua/ph/wp-content/uploads/2018/10/retina-video2.png" data-height="60" alt="video2" data-no-retina /><img
class="logo-mobile-sticky scale-with-grid" src="https://mazastore.com.ua/ph/wp-content/uploads/2018/10/video2.png" data-
retina="https://mazastore.com.ua/ph/wp-content/uploads/2018/10/retina-video2.png" data-height="60" alt="video2" data-no-retina /></a></div>
<div class="menu_wrapper">
<nav id="menu"><ul id="menu-main-menu" class="menu menu-main"><li id="menu-item-
45" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-home current-menu-item page_item page-item-2
current_page_item"><a href="https://mazastore.com.ua/ph/"><span>Home</span></a></li>
<li id="menu-item-49" class="menu-item menu-item-type-post_type menu-item-object-page"><a href="https://mazastore.com.ua/ph/about-
us/"><span>About us</span></a></li>
<li id="menu-item-48" class="menu-item menu-item-type-post_type menu-item-object-page"><a href="https://mazastore.com.ua/ph/our-
services/"><span>Our services</span></a></li>
<li id="menu-item-47" class="menu-item menu-item-type-post_type menu-item-object-page"><a
href="https://mazastore.com.ua/ph/portfolio/"><span>Portfolio</span></a></li>
<li id="menu-item-46" class="menu-item menu-item-type-post_type menu-item-object-page"><a
href="https://mazastore.com.ua/ph/contact/"><span>Contact</span></a></li>
</ul></nav><a class="responsive-menu-toggle " href="#"><i class="icon-menu-fine"></i></a> </div>
<div class="secondary_menu_wrapper">
</div>
<div class="banner_wrapper">
</div>
<div class="search_wrapper">
<form method="get" id="searchform" action="https://mazastore.com.ua/ph/">
<i class="icon_search icon-search-fine"></i>
<a href="#" class="icon_close"><i class="icon-cancel-fine"></i></a>
<input type="text" class="field" name="s" placeholder="Enter your search" />
<input type="submit" class="display-none" value="" />
</form>
</div>
</div>
</div>
</div>
</div>
<div class="mfn-main-slider mfn-rev-slider">
<!-- START Home Video2 REVOLUTION SLIDER 6.4.3 --><p class="rs-p-wp-fix"></p>
<rs-module-wrap id="rev_slider_1_1_wrapper" data-alias="video2" data-source="gallery"
style="background:transparent;padding:0;margin:0px auto;margin-top:0;margin-bottom:0;max-width:;">
<rs-module id="rev_slider_1_1" style="" data-version="6.4.3">
<rs-slides>
<rs-slide data-key="rs-1" data-title="Slide" data-anim="ms:600;" data-in="o:0;"
data-out="a:false;">
<img src="//mazastore.com.ua/ph/wp-
content/uploads/2018/10/home_video2_pic1.jpg" title="Home" class="rev-slidebg" data-no-retina>
<!--
--><rs-layer
id="slider-1-slide-1-layer-2"
data-type="text"
data-color="#b89d85"
data-rsp_ch="on"
data-xy="x:40px;y:63px;"
data-text="s:12;l:22;ls:4px;fw:500;a:inherit;"
data-frame_0="tp:600;"
data-frame_1="tp:600;sR:10;"
data-frame_999="o:0;tp:600;st:w;sR:8690;"
style="z-index:5;font-family:Montserrat;"
>SINCE 1998
</rs-layer><!--
--><rs-layer
id="slider-1-slide-1-layer-1"
data-type="text"
data-color="#ffffff"
data-rsp_ch="on"
data-xy="x:39px;y:104px;"
data-text="s:60;l:70;a:inherit;"
data-frame_0="tp:600;"
data-frame_1="tp:600;sR:10;"
data-frame_999="o:0;tp:600;st:w;sR:8690;"
style="z-index:6;font-family:Montserrat;"
>We make<br />
memorable videos
</rs-layer><!--
--><rs-layer
id="slider-1-slide-1-layer-4"
class="rev-btn"
data-type="button"
data-color="rgba(255,255,255,1)"
data-rsp_ch="on"
data-xy="x:40px;y:283px;"
data-text="s:14;l:14;a:inherit;"
data-padding="t:15;r:40;b:15;l:40;"
data-frame_0="tp:600;"
data-frame_1="tp:600;sR:10;"
data-frame_999="o:0;tp:600;st:w;sR:8690;"
data-
frame_hover="bgc:#977c63;boc:#000;bor:0px,0px,0px,0px;bos:solid;oX:50;oY:50;e:none;"
style="z-index:8;background-color:#b89d85;font-
family:Montserrat;cursor:pointer;outline:none;box-shadow:none;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;"
>See more about us
</rs-layer><!--
--><rs-layer
id="slider-1-slide-1-layer-5"
data-type="text"
data-color="#b89d85"
data-rsp_ch="on"
data-xy="x:-13px;y:490px;"
data-text="s:12;l:22;ls:4px;fw:500;a:inherit;"
data-frame_0="rZ:270;tp:600;"
data-frame_1="rZ:270;tp:600;sR:10;"
data-frame_999="o:0;tp:600;st:w;sR:8690;"
style="z-index:9;font-family:Montserrat;"
>SCROLL DOWN
</rs-layer><!--
--><rs-layer
id="slider-1-slide-1-layer-6"
data-type="image"
data-rsp_ch="on"
data-xy="x:49px;y:584px;"
data-text="l:22;a:inherit;"
data-dim="w:10;h:17;"
data-frame_0="tp:600;"
data-frame_1="tp:600;st:0;"
data-frame_999="o:0;tp:600;st:w;sR:8700;"
style="z-index:10;"
><img src="//mazastore.com.ua/ph/wp-
content/uploads/2018/10/home_video2_pic2.png" width="10" height="17" data-no-retina>
</rs-layer><!--
--> </rs-slide>
</rs-slides>
</rs-module>
<script type="text/javascript">
setREVStartSize({c:
'rev_slider_1_1',rl:[1240,1024,778,480],el:[],gw:[1080],gh:[860],type:'hero',justify:'',layout:'fullwidth',mh:"0"});
var revapi1,
tpj;
function revinit_revslider11() {
jQuery(function() {
tpj = jQuery;
revapi1 = tpj("#rev_slider_1_1");
if(revapi1==undefined || revapi1.revolution == undefined){
revslider_showDoubleJqueryError("rev_slider_1_1");
}else{
revapi1.revolution({
sliderType:"hero",
visibilityLevels:"1240,1024,778,480",
gridwidth:1080,
gridheight:860,
spinner:"spinner2",
perspectiveType:"local",
responsiveLevels:"1240,1024,778,480",
progressBar:{disableProgressBar:true},
navigation: {
onHoverStop:false
},
fallbacks: {
allowHTML5AutoPlayOnAndroid:true
},
});
}
});
} // End of RevInitScript
var once_revslider11 = false;
if (document.readyState === "loading") {document.addEventListener('readystatechange',function() {
if((document.readyState === "interactive" || document.readyState === "complete") && !once_revslider11 ) { once_revslider11 = true;
revinit_revslider11();}});} else {once_revslider11 = true; revinit_revslider11();}
</script>
<script>
var htmlDivCss = ' #rev_slider_1_1_wrapper rs-loader.spinner2{ background-color: #FFFFFF
!important; } ';
var htmlDiv = document.getElementById('rs-plugin-settings-inline-css');
if(htmlDiv) {
htmlDiv.innerHTML = htmlDiv.innerHTML + htmlDivCss;
}else{
var htmlDiv = document.createElement('div');
htmlDiv.innerHTML = '<style>' + htmlDivCss + '</style>';
document.getElementsByTagName('head')[0].appendChild(htmlDiv.childNodes[0]);
}
</script>
</rs-module-wrap>
<!-- END REVOLUTION SLIDER -->
</div></header>
</div>
<!-- mfn_hook_content_before --><!-- mfn_hook_content_before -->
<div id="Content">
<div class="content_wrapper clearfix">
<div class="sections_group">
<div class="entry-content" itemprop="mainContentOfPage">
<div class="section mcb-section mcb-section-868b07f55 no-margin-h no-margin-v" style="" ><div
class="section_wrapper mcb-section-inner"><div class="wrap mcb-wrap mcb-wrap-d860e21b6 one-second valign-top clearfix" style="" ><div
class="mcb-wrap-inner"><div class="column mcb-column mcb-item-3ff6bcfd3 one column_placeholder"><div
class="placeholder"> </div></div></div></div><div class="wrap mcb-wrap mcb-wrap-ac5da43af one-second valign-top move-up clearfix"
style="margin-top:-400px" data-mobile="no-up"><div class="mcb-wrap-inner"><div class="column mcb-column mcb-item-fbcc4ee47 one
column_column"><div class="column_attr clearfix" style="background-image:url('https://mazastore.com.ua/ph/wp-
content/uploads/2018/10/home_video2_pic8.png');background-repeat:no-repeat;background-position:center top;padding:110px 0 0 35%;"><div
style="padding: 60px 13% 45px; background: #18181a;">
<h6 class="themecolor">Last work</h6>
<h4><a href="#">Wild Iceland in the winter in 10 days</a></h4>
<p> We had a great time shooting those awesome views. </p>
</div></div></div></div></div></div></div><div class="section mcb-section mcb-section-575e3ec94" style="padding-top:80px" ><div
class="section_wrapper mcb-section-inner"><div class="wrap mcb-wrap mcb-wrap-9f677b853 one-second valign-top clearfix" style="" ><div
class="mcb-wrap-inner"><div class="column mcb-column mcb-item-d10080e55 one column_column"><div class="column_attr clearfix"
style="padding:0 10% 0 0;"><h6 class="themecolor">OUR SERVICES</h6>
<h2>What we can do for you?</h2>
<hr class="no_line" style="margin:0 auto 30px"/>
<a class="button button_size_2 button_theme" href="https://mazastore.com.ua/ph/our-services/" target="_blank" ><span class="button_label">our
all services</span></a>
</div></div></div></div></div></div><div class="section mcb-section mcb-section-0ab05209a no-margin-h no-margin-v" style="padding-
bottom:140px" ><div class="section_wrapper mcb-section-inner"><div class="wrap mcb-wrap mcb-wrap-3c2a9f374 one-second valign-top
clearfix" style="" ><div class="mcb-wrap-inner"><div class="column mcb-column mcb-item-1ebfb3dca one column_column"><div
class="column_attr clearfix" style="background-image:url('https://mazastore.com.ua/ph/wp-
content/uploads/2018/10/home_video2_pic5.jpg');background-repeat:no-repeat;background-position:center bottom;padding:220px 0 0 35%;"><div
style="padding: 60px 13% 45px; background: #18181a;">
<h6 class="themecolor">02</h6>
<h4><a href="#">Clips & music<br /> videos</a></h4>
<p>Our sound director will tune your clip like its a movie. </p>
</div></div></div><div class="column mcb-column mcb-item-143cf942d one column_column"><div class="column_attr clearfix"
style="padding:60px 8% 45px;"><p> <span style="color: #fff;"></p></div></div></div></div><div class="wrap mcb-wrap mcb-wrap-5eccfd334
one-second valign-top move-up clearfix" style="margin-top:-220px" data-mobile="no-up"><div class="mcb-wrap-inner"><div class="column mcb-
column mcb-item-8d1a8e0f6 one column_column"><div class="column_attr clearfix" style="background-image:url('https://mazastore.com.ua/ph/wp-
content/uploads/2018/10/home_video2_pic6.jpg');background-repeat:no-repeat;background-position:center top;padding:0 35% 220px 0;"><div
style="padding: 60px 13% 45px; background: #18181a;">
<h6 class="themecolor">01</h6>
<h4><a href="#">Movies & advertising videos</a></h4>
<p>We make all kinds of video shooting, even drone.</p>
</div></div></div><div class="column mcb-column mcb-item-67bbd0a04 one column_column"><div class="column_attr clearfix"
style="background-image:url('https://mazastore.com.ua/ph/wp-content/uploads/2018/10/home_video2_pic7.jpg');background-repeat:no-
repeat;background-position:center top;padding:0 0 120px 35%;"><div style="padding: 60px 13% 45px; background: #18181a;">
<h6 class="themecolor">03</h6>
<h4><a href="#">Short film productions</a></h4>
<p>The great choice for advertisment.</p>
</div></div></div></div></div></div></div><div class="section mcb-section mcb-section-60e2144aa" style="padding-top:100px;padding-
bottom:50px;background-color:#18181a" ><div class="section_wrapper mcb-section-inner"><div class="wrap mcb-wrap mcb-wrap-c061f0d5c one
valign-top move-up clearfix" style="margin-top:-178px" data-mobile="no-up"><div class="mcb-wrap-inner"><div class="column mcb-column
mcb-item-228672053 one column_column"><div class="column_attr clearfix" style=""><h6 class="themecolor">WHAT’S NEW?</h6>
<h2>About us</h2></div></div><div class="column mcb-column mcb-item-679a18d58 one column_divider"><hr class="no_line" style="margin:0
auto 20px"/>
</div><div class="column mcb-column mcb-item-e1697718f one-third column_column"><div class="column_attr clearfix" style="padding:0 7% 0
0;"><h6>Trip to Iceland</h6>
<h4>A 10 day trip to Iceland for shooting </h4>
<p>We had a great time shooting those awesome views around Iceland</p></div></div><div class="column mcb-column mcb-item-d65115e12 one-
third column_column"><div class="column_attr clearfix" style="padding:0 7% 0 0;"><h6>New drone</h6>
<h4>We bought a brand new DJI FPV Combo</h4>
<p>We hope this "monster" will make your footage look awesome. </p></div></div><div class="column mcb-column mcb-item-f2924128f one-
third column_column"><div class="column_attr clearfix" style="padding:0 7% 0 0;"><h6>A new sound director</h6>
<h4>We hired the most demanded man in Kiev - Vasiliy Bondarchuk</h4>
<p>Singer Vasily Bondarchuk. FOH sound engineer, PR / SMM director </p></div></div><div class="column mcb-column mcb-item-c3710042c
one column_divider"><hr class="no_line" style="margin:0 auto 20px"/>
</div><div class="column mcb-column mcb-item-b10800185 one column_button"><div class="button_align align_center"><a class="button
button_size_2 button_theme" href="https://mazastore.com.ua/ph/about-us/" ><span class="button_label">read more about us</span></a></div>
</div></div></div></div></div><div class="section mcb-section mcb-section-dd0334d61" style="padding-bottom:50px;background-
color:#18181a" ><div class="section_wrapper mcb-section-inner"><div class="wrap mcb-wrap mcb-wrap-8b3f8383c one valign-top clearfix"
style="" ><div class="mcb-wrap-inner"><div class="column mcb-column mcb-item-be4afa450 one column_image"><div class="image_frame
image_item no_link scale-with-grid aligncenter no_border" ><div class="image_wrapper"><img class="scale-with-grid"
src="https://mazastore.com.ua/ph/wp-content/uploads/2018/10/home_video2_pic3.png" alt="home_video2_pic3" title="" width="1080"
height="30"/></div></div>
</div><div class="column mcb-column mcb-item-46636e84b one column_divider"><hr class="no_line" style="margin:0 auto 40px"/>
</div><div class="column mcb-column mcb-item-30a55e1f8 one column_column"><div class="column_attr clearfix align_center" style=""><h6
class="themecolor">NEWSLETTER</h6>
<h4>Stay up to date with our productions!</h4></div></div><div class="column mcb-column mcb-item-2ec2990f9 one-fourth
column_placeholder"><div class="placeholder"> </div></div><div class="column mcb-column mcb-item-2f4349f5d one-second
column_column"><div class="column_attr clearfix align_center" style=""><div role="form" class="wpcf7" id="wpcf7-f26-p2-o1" lang="en-US"
dir="ltr">
<div class="screen-reader-response"><p role="status" aria-live="polite" aria-atomic="true"></p> <ul></ul></div>
<form action="/ph/#wpcf7-f26-p2-o1" method="post" class="wpcf7-form init" novalidate="novalidate" data-status="init">
<div style="display: none;">
<input type="hidden" name="_wpcf7" value="26" />
<input type="hidden" name="_wpcf7_version" value="5.4.1" />
<input type="hidden" name="_wpcf7_locale" value="en_US" />
<input type="hidden" name="_wpcf7_unit_tag" value="wpcf7-f26-p2-o1" />
<input type="hidden" name="_wpcf7_container_post" value="2" />
<input type="hidden" name="_wpcf7_posted_data_hash" value="" />
</div>
<div class="video2-newsletter">
<p><span class="wpcf7-form-control-wrap your-email"><input type="email" name="your-email" value="" size="40" class="wpcf7-form-control
wpcf7-text wpcf7-email wpcf7-validates-as-required wpcf7-validates-as-email" aria-required="true" aria-invalid="false" placeholder="Your e-mail"
/></span></p>
<p><input type="submit" value="sign in" class="wpcf7-form-control wpcf7-submit" />
</p></div>
<div class="wpcf7-response-output" aria-hidden="true"></div></form></div></div></div></div></div></div></div><div class="section
the_content no_content"><div class="section_wrapper"><div class="the_content_wrapper "></div></div></div>
<div class="section section-page-footer">
<div class="section_wrapper clearfix">
<div class="column one page-pager">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- mfn_hook_content_after --><!-- mfn_hook_content_after -->
<footer id="Footer" class="clearfix ">
<div class="footer_copy">
<div class="container">
<div class="column one">
<a id="back_to_top" class="footer_button" href=""><i class="icon-up-open-
big"></i></a>
<div class="copyright">
© 2021 Proffessional aerial shooting. All Rights Reserved. <a
target="_blank" rel="nofollow" href="https://muffingroup.com">Muffin group</a> </div>
<ul class="social"><li class="facebook"><a href="#" title="Facebook"><i
class="icon-facebook"></i></a></li><li class="vimeo"><a href="#" title="Vimeo"><i class="icon-vimeo"></i></a></li><li class="youtube"><a
href="#" title="YouTube"><i class="icon-play"></i></a></li><li class="instagram"><a href="#" title="Instagram"><i class="icon-
instagram"></i></a></li></ul>
</div>
</div>
</div>
</footer>
</div>
<div id="Side_slide" class="right dark" data-width="250"><div class="close-wrapper"><a href="#" class="close"><i class="icon-cancel-
fine"></i></a></div><div class="extras"><div class="extras-wrapper"></div></div><div class="lang-wrapper"></div><div
class="menu_wrapper"></div><ul class="social"><li class="facebook"><a href="#" title="Facebook"><i class="icon-facebook"></i></a></li><li
class="vimeo"><a href="#" title="Vimeo"><i class="icon-vimeo"></i></a></li><li class="youtube"><a href="#" title="YouTube"><i class="icon-
play"></i></a></li><li class="instagram"><a href="#" title="Instagram"><i class="icon-instagram"></i></a></li></ul></div><div
id="body_overlay"></div>
<!-- mfn_hook_bottom --><!-- mfn_hook_bottom -->
<link href="https://fonts.googleapis.com/css?family=Montserrat:500%2C400%7CRoboto:400" rel="stylesheet" property="stylesheet" media="all"
type="text/css" >
<script type="text/javascript">
if(typeof revslider_showDoubleJqueryError === "undefined") {
function revslider_showDoubleJqueryError(sliderID) {
var err = "<div class='rs_error_message_box'>";
err += "<div class='rs_error_message_oops'>Oops...</div>";
err += "<div class='rs_error_message_content'>";
err += "You have some jquery.js library include that comes after the Slider Revolution files js
inclusion.<br>";
err += "To fix this, you can:<br> 1. Set 'Module General Options' -> 'Advanced' ->
'jQuery & OutPut Filters' -> 'Put JS to Body' to on";
err += "<br> 2. Find the double jQuery.js inclusion and remove it";
err += "</div>";
err += "</div>";
var slider = document.getElementById(sliderID); slider.innerHTML = err; slider.style.display = "block";
}
}
</script>
<script type='text/javascript' src='https://mazastore.com.ua/ph/wp-includes/js/hoverintent-js.min.js?ver=2.2.1' id='hoverintent-js-js'></script>
<script type='text/javascript' src='https://mazastore.com.ua/ph/wp-includes/js/admin-bar.min.js?ver=5.7.1' id='admin-bar-js'></script>
<script type='text/javascript' src='https://mazastore.com.ua/ph/wp-includes/js/dist/vendor/wp-polyfill.min.js?ver=7.4.4' id='wp-polyfill-js'></script>
<script type='text/javascript' id='wp-polyfill-js-after'>
( 'fetch' in window ) || document.write( '<script src="https://mazastore.com.ua/ph/wp-includes/js/dist/vendor/wp-polyfill-
fetch.min.js?ver=3.0.0"></scr' + 'ipt>' );( document.contains ) || document.write( '<script src="https://mazastore.com.ua/ph/wp-
includes/js/dist/vendor/wp-polyfill-node-contains.min.js?ver=3.42.0"></scr' + 'ipt>' );( window.DOMRect ) || document.write( '<script
src="https://mazastore.com.ua/ph/wp-includes/js/dist/vendor/wp-polyfill-dom-rect.min.js?ver=3.42.0"></scr' + 'ipt>' );( window.URL &&
window.URL.prototype && window.URLSearchParams ) || document.write( '<script src="https://mazastore.com.ua/ph/wp-
includes/js/dist/vendor/wp-polyfill-url.min.js?ver=3.6.4"></scr' + 'ipt>' );( window.FormData && window.FormData.prototype.keys ) ||
document.write( '<script src="https://mazastore.com.ua/ph/wp-includes/js/dist/vendor/wp-polyfill-formdata.min.js?ver=3.0.12"></scr' + 'ipt>' );(
Element.prototype.matches && Element.prototype.closest ) || document.write( '<script src="https://mazastore.com.ua/ph/wp-
includes/js/dist/vendor/wp-polyfill-element-closest.min.js?ver=2.0.2"></scr' + 'ipt>' );( 'objectFit' in document.documentElement.style ) ||
document.write( '<script src="https://mazastore.com.ua/ph/wp-includes/js/dist/vendor/wp-polyfill-object-fit.min.js?ver=2.3.4"></scr' + 'ipt>' );
</script>
<script type='text/javascript' id='contact-form-7-js-extra'>
/* <![CDATA[ */
var wpcf7 = {"api":{"root":"https:\/\/mazastore.com.ua\/ph\/wp-json\/","namespace":"contact-form-7\/v1"}};
/* ]]> */
</script>
<script type='text/javascript' src='https://mazastore.com.ua/ph/wp-content/plugins/contact-form-7/includes/js/index.js?ver=5.4.1' id='contact-form-7-
js'></script>
<script type='text/javascript' src='https://mazastore.com.ua/ph/wp-includes/js/jquery/ui/core.min.js?ver=1.12.1' id='jquery-ui-core-js'></script>
<script type='text/javascript' src='https://mazastore.com.ua/ph/wp-includes/js/jquery/ui/mouse.min.js?ver=1.12.1' id='jquery-ui-mouse-js'></script>
<script type='text/javascript' src='https://mazastore.com.ua/ph/wp-includes/js/jquery/ui/sortable.min.js?ver=1.12.1' id='jquery-ui-sortable-js'></script>
<script type='text/javascript' src='https://mazastore.com.ua/ph/wp-includes/js/jquery/ui/tabs.min.js?ver=1.12.1' id='jquery-ui-tabs-js'></script>
<script type='text/javascript' src='https://mazastore.com.ua/ph/wp-includes/js/jquery/ui/accordion.min.js?ver=1.12.1' id='jquery-ui-accordion-
js'></script>
<script type='text/javascript' id='mfn-plugins-js-extra'>
/* <![CDATA[ */
var mfn =
{"mobileInit":"1240","parallax":"translate3d","responsive":"1","sidebarSticky":"","lightbox":{"disable":false,"disableMobile":false,"title":false},"slid
er":{"blog":0,"clients":0,"offer":0,"portfolio":0,"shop":0,"slider":0,"testimonials":0},"ajax":"https:\/\/mazastore.com.ua\/ph\/wp-admin\/admin-
ajax.php"};
/* ]]> */
</script>
<script type='text/javascript' src='https://mazastore.com.ua/ph/wp-content/themes/betheme/js/plugins.js?ver=22.0.1' id='mfn-plugins-js'></script>
<script type='text/javascript' src='https://mazastore.com.ua/ph/wp-content/themes/betheme/js/menu.js?ver=22.0.1' id='mfn-menu-js'></script>
<script type='text/javascript' src='https://mazastore.com.ua/ph/wp-content/themes/betheme/assets/animations/animations.min.js?ver=22.0.1' id='mfn-
animations-js'></script>
<script type='text/javascript' src='https://mazastore.com.ua/ph/wp-content/themes/betheme/assets/jplayer/jplayer.min.js?ver=22.0.1' id='mfn-jplayer-
js'></script>
<script type='text/javascript' src='https://mazastore.com.ua/ph/wp-content/themes/betheme/js/parallax/translate3d.js?ver=22.0.1' id='mfn-parallax-
js'></script>
<script type='text/javascript' src='https://mazastore.com.ua/ph/wp-content/themes/betheme/js/scripts.js?ver=22.0.1' id='mfn-scripts-js'></script>
<script type='text/javascript' src='https://mazastore.com.ua/ph/wp-includes/js/wp-embed.min.js?ver=5.7.1' id='wp-embed-js'></script>
<script type="text/javascript">
function rs_adminBarToolBarTopFunction() {
if(jQuery('#wp-admin-bar-revslider-default').length > 0 && jQuery('rs-module-wrap').length > 0){
var aliases = new Array();
jQuery('rs-module-wrap').each(function(){
aliases.push(jQuery(this).data('alias'));
});
if(aliases.length > 0){
jQuery('#wp-admin-bar-revslider-default li').each(function(){
var li = jQuery(this),
t = li.find('.ab-item .rs-label').data('alias'); //text()
t = t!==undefined && t!==null ? t.trim() : t;
if(jQuery.inArray(t,aliases)!=-1){
}else{
li.remove();
}
});
}
}else{
jQuery('#wp-admin-bar-revslider').remove();
}
}
var adminBarLoaded_once = false
if (document.readyState === "loading")
document.addEventListener('readystatechange',function(){
if ((document.readyState === "interactive" || document.readyState === "complete") &&
!adminBarLoaded_once) {
adminBarLoaded_once = true;
rs_adminBarToolBarTopFunction()
}
});
else {
adminBarLoaded_once = true;
rs_adminBarToolBarTopFunction();
}
</script>
<script type="text/javascript">
(function() {
var request, b = document.body, c = 'className', cs = 'customize-support', rcs = new RegExp('(^|\\s+)(no-
)?'+cs+'(\\s+|$)');
request = true;
b[c] = b[c].replace( rcs, ' ' );
// The customizer requires postMessage and CORS (if the site is cross domain).
b[c] += ( window.postMessage && request ? ' ' : ' no-' ) + cs;
}());
</script>
<div id="wpadminbar" class="nojq nojs">
<a class="screen-reader-shortcut" href="#wp-toolbar"
tabindex="1">Перейти к верхней панели</a>
<div class="quicklinks" id="wp-toolbar" role="navigation" aria-label="Верхняя
панель">
<ul id='wp-admin-bar-root-default' class="ab-top-menu"><li id='wp-admin-bar-wp-logo'
class="menupop"><a class='ab-item' aria-haspopup="true" href='https://mazastore.com.ua/ph/wp-admin/about.php'><span class="ab-
icon"></span><span class="screen-reader-text">О WordPress</span></a><div class="ab-sub-wrapper"><ul id='wp-admin-bar-wp-logo-default'
class="ab-submenu"><li id='wp-admin-bar-about'><a class='ab-item' href='https://mazastore.com.ua/ph/wp-admin/about.php'>О
WordPress</a></li></ul><ul id='wp-admin-bar-wp-logo-external' class="ab-sub-secondary ab-submenu"><li id='wp-admin-bar-wporg'><a
class='ab-item' href='https://ru.wordpress.org/'>WordPress.org</a></li><li id='wp-admin-bar-documentation'><a class='ab-item'
href='https://ru.wordpress.org/support/'>Документация</a></li><li id='wp-admin-bar-support-forums'><a class='ab-item'
href='https://ru.wordpress.org/support/forums/'>Поддержка</a></li><li id='wp-admin-bar-feedback'><a class='ab-item'
href='https://ru.wordpress.org/support/forum/requests-and-feedback/'>Обратная связь</a></li></ul></div></li><li id='wp-admin-bar-site-name'
class="menupop"><a class='ab-item' aria-haspopup="true" href='https://mazastore.com.ua/ph/wp-admin/'>Proffessional aerial shooting</a><div
class="ab-sub-wrapper"><ul id='wp-admin-bar-site-name-default' class="ab-submenu"><li id='wp-admin-bar-dashboard'><a class='ab-item'
href='https://mazastore.com.ua/ph/wp-admin/'>Консоль</a></li></ul><ul id='wp-admin-bar-appearance' class="ab-submenu"><li id='wp-admin-
bar-themes'><a class='ab-item' href='https://mazastore.com.ua/ph/wp-admin/themes.php'>Темы</a></li><li id='wp-admin-bar-widgets'><a
class='ab-item' href='https://mazastore.com.ua/ph/wp-admin/widgets.php'>Виджеты</a></li><li id='wp-admin-bar-menus'><a class='ab-item'
href='https://mazastore.com.ua/ph/wp-admin/nav-menus.php'>Меню</a></li></ul></div></li><li id='wp-admin-bar-customize' class="hide-if-no-
customize"><a class='ab-item' href='https://mazastore.com.ua/ph/wp-
admin/customize.php?url=https%3A%2F%2Fmazastore.com.ua%2Fph%2F'>Настроить</a></li><li id='wp-admin-bar-updates'><a class='ab-item'
href='https://mazastore.com.ua/ph/wp-admin/update-core.php' title='2 обновления плагинов'><span class="ab-icon"></span><span class="ab-
label">2</span><span class="screen-reader-text">2 обновления плагинов</span></a></li><li id='wp-admin-bar-comments'><a class='ab-item'
href='https://mazastore.com.ua/ph/wp-admin/edit-comments.php'><span class="ab-icon"></span><span class="ab-label awaiting-mod pending-count
count-0" aria-hidden="true">0</span><span class="screen-reader-text comments-in-moderation-text">0 комментариев ждут
одобрения</span></a></li><li id='wp-admin-bar-new-content' class="menupop"><a class='ab-item' aria-haspopup="true"
href='https://mazastore.com.ua/ph/wp-admin/post-new.php'><span class="ab-icon"></span><span class="ab-label">Добавить</span></a><div
class="ab-sub-wrapper"><ul id='wp-admin-bar-new-content-default' class="ab-submenu"><li id='wp-admin-bar-new-post'><a class='ab-item'
href='https://mazastore.com.ua/ph/wp-admin/post-new.php'>Запись</a></li><li id='wp-admin-bar-new-media'><a class='ab-item'
href='https://mazastore.com.ua/ph/wp-admin/media-new.php'>Медиафайл</a></li><li id='wp-admin-bar-new-page'><a class='ab-item'
href='https://mazastore.com.ua/ph/wp-admin/post-new.php?post_type=page'>Страницу</a></li><li id='wp-admin-bar-new-client'><a class='ab-item'
href='https://mazastore.com.ua/ph/wp-admin/post-new.php?post_type=client'>Клиент</a></li><li id='wp-admin-bar-new-offer'><a class='ab-item'
href='https://mazastore.com.ua/ph/wp-admin/post-new.php?post_type=offer'>Элемент предложения</a></li><li id='wp-admin-bar-new-
portfolio'><a class='ab-item' href='https://mazastore.com.ua/ph/wp-admin/post-new.php?post_type=portfolio'>Элемент портфолио</a></li><li
id='wp-admin-bar-new-slide'><a class='ab-item' href='https://mazastore.com.ua/ph/wp-admin/post-new.php?post_type=slide'>Слайд</a></li><li
id='wp-admin-bar-new-testimonial'><a class='ab-item' href='https://mazastore.com.ua/ph/wp-admin/post-
new.php?post_type=testimonial'>Отзыв</a></li><li id='wp-admin-bar-new-layout'><a class='ab-item' href='https://mazastore.com.ua/ph/wp-
admin/post-new.php?post_type=layout'>Макет</a></li><li id='wp-admin-bar-new-template'><a class='ab-item'
href='https://mazastore.com.ua/ph/wp-admin/post-new.php?post_type=template'>Шаблон</a></li><li id='wp-admin-bar-new-user'><a class='ab-
item' href='https://mazastore.com.ua/ph/wp-admin/user-new.php'>Пользователя</a></li></ul></div></li><li id='wp-admin-bar-edit'><a class='ab-
item' href='https://mazastore.com.ua/ph/wp-admin/post.php?post=2&action=edit'>Редактировать страницу</a></li><li id='wp-admin-bar-
vc_inline-admin-bar-link' class="vc_inline-link"><a class='ab-item' href='https://mazastore.com.ua/ph/wp-
admin/post.php?vc_action=vc_inline&post_id=2&post_type=page'>Edit with WPBakery Page Builder</a></li><li id='wp-admin-bar-
duplicate-post' class="menupop"><a class='ab-item' aria-haspopup="true" href='https://mazastore.com.ua/ph/wp-
admin/admin.php?action=duplicate_post_new_draft&post=2&_wpnonce=e45b72f466'><span class="ab-icon"></span><span class="ab-
label">Duplicate Post</span></a><div class="ab-sub-wrapper"><ul id='wp-admin-bar-duplicate-post-default' class="ab-submenu"><li id='wp-
admin-bar-new-draft'><a class='ab-item' href='https://mazastore.com.ua/ph/wp-
admin/admin.php?action=duplicate_post_new_draft&post=2&_wpnonce=e45b72f466'>Копировать в новый черновик</a></li><li
id='wp-admin-bar-rewrite-republish'><a class='ab-item' href='https://mazastore.com.ua/ph/wp-
admin/admin.php?action=duplicate_post_rewrite&post=2&_wpnonce=074c897dd5'>Rewrite & Republish</a></li></ul></div></li><li
id='wp-admin-bar-revslider' class="menupop revslider-menu"><a class='ab-item' aria-haspopup="true" href='https://mazastore.com.ua/ph/wp-
admin/admin.php?page=revslider'><span class="rs-label">Slider Revolution</span></a><div class="ab-sub-wrapper"><ul id='wp-admin-bar-
revslider-default' class="ab-submenu"><li id='wp-admin-bar-video2' class="revslider-sub-menu"><a class='ab-item'
href='https://mazastore.com.ua/ph/wp-admin/admin.php?page=revslider&view=slide&id=slider-1'><span class="rs-label" data-
alias="video2">Home Video2</span></a></li></ul></div></li></ul><ul id='wp-admin-bar-top-secondary' class="ab-top-secondary ab-top-
menu"><li id='wp-admin-bar-search' class="admin-bar-search"><div class="ab-item ab-empty-item" tabindex="-1"><form
action="https://mazastore.com.ua/ph/" method="get" id="adminbarsearch"><input class="adminbar-input" name="s" id="adminbar-search"
type="text" value="" maxlength="150" /><label for="adminbar-search" class="screen-reader-text">Поиск</label><input type="submit"
class="adminbar-button" value="Поиск"/></form></div></li><li id='wp-admin-bar-my-account' class="menupop with-avatar"><a class='ab-item'
aria-haspopup="true" href='https://mazastore.com.ua/ph/wp-admin/profile.php'>Привет, <span class="display-
name">[email protected]</span><img alt=''
src='https://secure.gravatar.com/avatar/c8ccb80e3f5d3afd42806b1d341a28d2?s=26&d=mm&r=g'
srcset='https://secure.gravatar.com/avatar/c8ccb80e3f5d3afd42806b1d341a28d2?s=52&d=mm&r=g 2x' class='avatar avatar-26 photo'
height='26' width='26' loading='lazy'/></a><div class="ab-sub-wrapper"><ul id='wp-admin-bar-user-actions' class="ab-submenu"><li id='wp-admin-
bar-user-info'><a class='ab-item' tabindex="-1" href='https://mazastore.com.ua/ph/wp-admin/profile.php'><img alt=''
src='https://secure.gravatar.com/avatar/c8ccb80e3f5d3afd42806b1d341a28d2?s=64&d=mm&r=g'
srcset='https://secure.gravatar.com/avatar/c8ccb80e3f5d3afd42806b1d341a28d2?s=128&d=mm&r=g 2x' class='avatar avatar-64 photo'
height='64' width='64' loading='lazy'/><span class='display-name'>[email protected]</span></a></li><li id='wp-admin-bar-edit-
profile'><a class='ab-item' href='https://mazastore.com.ua/ph/wp-admin/profile.php'>Изменить профиль</a></li><li id='wp-admin-bar-logout'><a
class='ab-item' href='https://mazastore.com.ua/ph/wp-
login.php?action=logout&_wpnonce=dae97d6ece'>Выйти</a></li></ul></div></li></ul> </div>
<a class="screen-reader-shortcut" href="https://mazastore.com.ua/ph/wp-
login.php?action=logout&_wpnonce=dae97d6ece">Выйти</a>
</div>
</body>
</html>