HTML Templates Documentation
Структура шаблона
Данный раздел содержит информацию о структуре шаблона и его отдельных файлов.
Структура архива
После распаковки архива шаблона, вы увидите следующую структуру файлов:
-
- documentation
- содержит файлы документации по редактированию и установке шаблона.
-
- documentation.html
- основной файл документации. Содержит ссылку на онлайн документацию, которую вы сейчас читаете.
-
- screenshots
- содержит скриншоты шаблона. Не для рабочего сайта.
-
- site
- содержит .html файлы страниц шаблона.
-
- bat
- содержит все .php скрипты, используемые в шаблоне.
-
- audio
- содержит все аудио файлы, используемые в шаблоне.
-
- css
- содержит все файлы .css, используемые в шаблоне.
-
- fonts
- содержит все нестандартные типографические и иконочные шрифты, используемые в шаблоне.
-
- images
- содержит все изображения, используемые в файлах .html.
-
- js
- содержит библиотеки JavaScript и плагины jQuery.
-
- video
- содержит все видео файлы, используемые в шаблоне.
-
- sources
- содержит исходные файлы шаблона.
-
- psd
- содержит .psd-файлы Adobe Photoshop (доступность исходных файлов PSD зависит от шаблона).
-
- sass
- содержит файлы .scss SASS, используемые в шаблоне.
-
- jade
- содержит файлы .jade Jade, используемые в шаблоне.
-
- info.txt
- содержит информацию о защищенной паролем папке "sources".
Структура HTML
Структура .html страниц в шаблонах строится по следующему принципу:
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Your Stylesheets, Core Scripts (jQuery etc) & Title -->
...
</head>
<body>
<div class="page">
<!-- Page Head -->
<header class="page-head">
...
</header>
<!-- Page Content-->
<main class="page-content">
...
</main>
<!-- Page Footer-->
<footer class="page-footer">
...
</footer>
</div>
<!-- Additional Functionality Scripts -->
<script src="js/script.js"></script>
</body>
</html>
Структура CSS
В шаблоне все стили шаблона расположены в файле style.css.
Структура файла style.css строится по следующему принципу:
/**
* Template Style
*
* [Table of contents]
* 1 Bootstrap Framework
* 1.1 Normalize
* 1.2 Scaffolding
* 1.3 Type
* 1.4 Code
* 1.5 Tables
* 1.6 Forms
* 1.7 Buttons
* 1.8 Grids
* 1.9 Component animations
* 1.10 Dropdowns
* 1.11 Button Groups
* 1.12 Input Groups
* 1.13 Navs
* 1.14 Navbar
* 1.15 Breadcrumbs
* 1.16 Pagination
* 1.17 Pager
* 1.18 Labels
* 1.19 Badges
* 1.20 Jumbotron
* 1.21 Thumbnails
* 1.22 Alerts
* 1.23 Progress bars
* 1.24 Media
* 1.25 List Group
* 1.26 Panels
* 1.27 Responsive Embed
* 1.28 Wells
* 1.29 Close
* 1.30 Glyphicons
* 1.31 Modals
* 1.32 Tooltip
* 1.33 Popovers
* 1.34 Carousel
* 1.35 Utilities
* 1.36 Responsive Utilities
*
* 2 Bootstrap Toolkit Styles
* 2.1 Reset
* 2.2 Flex Grid System
* 2.3 Responsive Text System
* 2.4 Responsive Pulls System
* 2.5 Responsive Visibility System
* 2.6 Type Addons
* 2.7 Alerts Addons
* 2.8 Text Styling
* 2.9 Icons
* 2.10 Font Awesome
* 2.11 Material Design Icons
* 2.12 Thumbnail Addons
* 2.13 Form Addons
* 2.14 Responsive Units
* 2.15 Stacktables
* 2.16 Sections
* 2.17 Scaffolding Addons
* 2.18 Offsets
*
* 3 Plugins
* 3.1 Animate
* 3.2 Counter
* 3.3 Isotope
* 3.4 Owl Carousel
* 3.5 RD Video
* 3.6 RD Navbar
* 3.7 RD Parallax
* 3.8 RD Material Tabs
* 3.9 RD Video
* 3.10 RD Event Calendar
* 3.11 RD Google Maps
* 3.12 RD Audio Player
* 3.13 RD Video Player
* 3.14 RD Search
* 3.14 RD Range
* 3.16 RD Filepicker
* 3.17 Swiper Slider
* 3.18 ToTop Button
* 3.19 Responsive Tabs
* 3.20 Progress Bars
* 3.21 Timecircles
* 3.22 Scrollspy
* 3.23 Slick carousel
* 3.24 Scrollbar
* 3.25 FS Stepper
* 3.26 Bootstrap-material-datetimepicker
* 3.27 Photoswipe
* 3.28 Circle progress bars
* 3.29 Select 2
*/