Basilico - Restaurant HTML Template
- Version: 1.0.0
- Last Updated: July 16 25
- Author: themesflat
Template features:
- Restaurant HTML Template
- HTML5 & CSS3
- Responsive Template
- Animate everything you want
- Free icons used
- Pixel Perfect
- Clean & Unique Design
- Easy to customize
- Retina Ready
- Unlimited Colors
- Home Page
- Services Page
- Service Detail
- Price List
- Parallax Effect
- & much more...
HTML Structure
Basilico - Restaurant HTML Template
Below is Basilico basic structure:
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title> Basilico - Restaurant HTML Template </title>
<!-- Mobile Specific Metas -->
<!-- Bootstrap -->
<!-- Theme Style -->
<!-- Responsive -->
<!-- colors -->
<!-- Animation Style -->
<!-- Favicon and touch icons -->
</head>
<body>
<!-- Header -->
<!-- Slider -->
<!-- Section -->
<section class="flat-row"> </section>
<!-- Footer -->
<footer class="footer"> </footer>
<!-- Bottom -->
<div class="bottom"> </bottom>
<!-- Go Top -->
<a class="go-top">
<i class="fa fa-angle-up"></a>
</a>
<!-- Javascript -->
<script type="text/javascript" src="assets/js/jquery.min.js"></script>
<script type="text/javascript" src="assets/js/bootstrap.min.js"></script>
<script type="text/javascript" src="assets/js/jquery.easing.js"></script>
<script type="text/javascript" src="assets/js/jquery-waypoints.js"></script>
<script type="text/javascript" src="assets/js/owl.carousel.js"></script>
<script type="text/javascript" src="assets/js/parallax.js"></script>
<script type="text/javascript" src="assets/js/jquery.cookie.js"></script>
<script type="text/javascript" src="assets/js/switcher.js"></script>
<script type="text/javascript" src="assets/js/main.js"></script>
</body>
</html>
CSS System
The Basilico CSS System contains 3 parts:
- Template style
- Shortcodes style
- Responsive style
- Javascript - Fonts - Animation - Bootstrap style
Your_template/asset/scss/style.scss ( Template style )
/**
* Reset Browsers
* General
* Elements
* Forms
* Typography
* Extra classes
* link style
* banner
* main-content
* preload
* go top
* cusor
*/
Your_template/asset/scss/Shortcodes.scss ( Shortcodes - Elements style )
You can easily use the shortcodes to create your own page.
/**
* button
* slidermain
* slideranimation
* slider navigation
* custom button carousel
* features custom carousel
* ripple effect
* request form wcu
* progress bar
* preload
* map
* side menu toggle
*/
Javascript - Fonts - Animation - Bootstrap style
/**
* animate.css
* bootstrap.css
* jquery.fancybox.css
* owl.carousel.css
* wow.css
* swiper-bundle.min.css
*/
How to add light box in your template
Javascript Custom
Here you can modify any settings for ( Retina Logos, Animations, Testimonials, Sliders, & Progress bar and more..)
Main.js ( js/main.js )
/**
* gotop
* cursor
* preloader
*/
Shortcodes System
You can easily use the shortcodes to create your own page.
/**
* Nav
* Banner
* Page AboutUS
* Our-Team
* Group-2
* Info
* List-Check
* List Check style
* FAQ
* Price
* Blog
* Comment
* MAP
* Contact
* Footer
* Padding
* Contact Form 7
* Color
* Background-color
* Font-Size
* Form-Search
* Button
* Title Heading
* Box-Shadow
* Image box
* Icon box
* Responsive
*/
Credits
-
Photos
- All images are just used for preview purpose only and NOT included in the final purchase files.
- Fonts & Icons
-
Javascript
- jQuery (http://jquery.com/)
- Bootstrap (http://getbootstrap.com)
- Easing (http://gsgd.co.uk/sandbox/jquery/easing/)
- owl.carousel (http://owlgraphic.com/owlcarousel/)
- WayPoints (http://imakewebthings.com/jquery-waypoints/)
- Parallax (http://www.ianlunn.co.uk/plugins/jquery-parallax/)
- Cookie (https://github.com/carhartl/jquery-cookie)