Howdy!

You are a shining owner of a regular license based on Butazzo Pizza Theme

First of all, Thank you so much for purchasing this template and for being my loyal customer. You are entitled to get free updates to this product + exceptional support (as per market policy) from the author directly.

This documentation is to help you understand the template's structure. Please go through the documentation carefully to understand how this template is made and how to edit this properly. Basic HTML and CSS knowledge is required to customize this template.

1. Getting Started


When you are ready to use this template, you must first upload the template files to a local or remote server. In this regard, unzip the template package you have downloaded from themeforest. In extracted folder you can see following folders:

Package contents:

  • template — Contains all the original template files comprises of HTML, CSS, JS etc. This is the folder which you'll upload on your server after necessary modifications.
  • documentation — Inside this folder, you will find the same documentation updated with the latest changes.

Details regarding contents and structure of template folder is given below.

2. HTML Structure


This theme is a responsive landing page which built with Bootstrap fraemwork and you can customize it very easily. All of the information within the main content area is nested within a div with an class of "sections". The general template structure is the same throughout the template. Here is the general structure. Note that for brevity, I am not including content that isn’t relevant to the technique.

2.1. Skeleton Details


From the above skeleton it can be seen that there are 7 major logical code blocks in page. Most of the contents displayed on the screen goes in one of this block.

div class="loading-overlay" shows a loading overlay on the whole page or over single DOM elements

header id="header" section contains the code for carousel, contact details, logo and primary navigation at top.

div id="about_us" div id="menu" div id="reservation" div id="gallery" section contains the page specific content as well as their details.

site-footer section typically remains the same. It consist of short about info, working days list, contact details, social icons and copyright text note also.

Further, skeleton shows two additional markup tags.div id="cd-nav" contains the menu for the mobile version. div class="cd-overlay" when mobile menu showed this layer visibled under mobile menu above content too.

3. Stylesheet Files


All styling related files of this template can be found in this folder path template/src/assets/css

  
    css/
    |
    |-- bootstrap.min.css
    |-- bootstrap-datepicker.css
    |-- bootstrap-datetimepicker.css
    |-- bootstrap-theme.min.css
    |-- fonts.css
    |-- font-awesome.min.css
    |-- main.css
    |-- responsive.css
    |-- aos.css
    |-- slick.css
    |-- slick-theme.css
    |-- scrolling-nav.css
    |-- jquery.fancybox.css
    |-- touch-sideswipe.css

As it can be seen, the folder contains 14 css files.
bootstrap.min.css is an open source toolkit for developing with HTML, CSS, and JS. Quickly prototype your ideas or build your entire app with responsive grid system.
bootstrap-datepicker.css provides a flexible datepicker widget in the Bootstrap style.
bootstrap-datetimepicker.css widget based on twitter bootstrap.
fonts.css import fonts to stylesheet.
font-awesome.min.css is iconic font and CSS toolkit.
main.css custom style file.
responsive.css for responsive design.
aos.css animate On scroll library.
slick.css is a responsive carousel jQuery plugin that supports multiple breakpoints, CSS3 transitions, touch events/swiping & much more.
scrolling-nav.css is a basic Bootstrap framework for creating smooth scrolling, one page websites
jquery.fancybox.css is a tool for displaying images, html content and multi-media in a Mac-style "lightbox" that floats overtop of web page
touch-sideswipe.css widget-library for mobile navbar (vanilla js and little bit pure css)

4. Javascript Files


All client-side related javascript files can be found in this folder path template/src/assets/js

  
    js/
    |    
    |-- jquery-2.1.1.min.js  
    |-- bootstrap.min.js 
    |-- jquery.easing.min.js      
    |-- bootstrap-datepicker.js
    |-- bootstrap-datetimepicker.js
    |-- moment.js
    |-- main.js
    |-- aos.js
    |-- jquery.fancybox.js
    |-- jquery.mousewheel.min.js
    |-- jquery.touchSwipe.min.js
    |-- slick.min.js
    |-- scrolling-nav.js
    |-- loadMoreResults.js

In this folder there are 13 files.
jquery.min.js is a fast, small, and feature-rich JavaScript library
jquery.easing.min.js a jQuery plugin from GSGD to give advanced easing options
bootstrap.min.js is an open source toolkit for developing with HTML, CSS, and JS. Quickly prototype your ideas or build your entire app with responsive grid system
bootstrap-datetimepicker.js widget based on twitter bootstrap
bootstrap-datepicker.js provides a flexible datepicker widget in the Bootstrap style main.js contains all the custom programmed javascript coded specifically for this template
aos.js animate On scroll library
slick.min.js is a responsive carousel jQuery plugin that supports multiple breakpoints, CSS3 transitions, touch events/swiping & much more
scrolling-nav.js is a basic Bootstrap framework for creating smooth scrolling, one page websites
jquery.fancybox.js is a tool for displaying images, html content and multi-media in a Mac-style "lightbox" that floats overtop of web page
jquery.touchSwipe.min.js widget-library for mobile navbar (vanilla js and little bit pure css)
loadMoreResults.js is a small jQuery plugin for adding a 'Load More' pagination button to your long web content that allows you to dynamically load more items according to your needs.

5. Support Desk


Please be reminded that you have purchased a very affordable theme and you have not paid for a full-time web design agency. Occasionally, we will help with small tweaks, but these requests will be put on a lower priority due to their nature.

Support for my items includes:


  • Responding to questions or problems regarding the item and its features
  • Fixing bugs and reported issues
  • Providing updates to ensure compatibility with new software versions

Item support does not include:


  • Customization and installation services
  • Support for third party software and plug-ins

Before seeking support, please...


  • Make sure your question is a valid item issue and not a customization request.
  • Make sure you have read through the documentation and any related video guides before asking support on how to accomplish a task.
  • Make sure to double check the item FAQs.
  • If you have customized your item and now have an issue, back-track to make sure you didn't make a mistake. If you have made changes and can't find the issue, please provide us with your changelog.
  • Almost 80% of the time we find that the solution to people's issues can be solved with a simple "Google Search". You might want to try that before seeking support. You might be able to fix the issue yourself much quicker than we can respond to your request.
  • Make sure to state the name of the item you are having issues with when requesting support via ThemeForest.

6. Files & Resources


The template uses following resources by third parties.

7. PHP Code Explanation


index.php file for deploy and init on docker container or heroku

8. Yandex Map Api


I have used Yandex Map Api to generate Yandex Map. You are able to change map style or marker from guidelines Yandex Map

9. Regular Updates


We’re always improving our skills and knowledge so we’re making changes regularly. From bug fixes to new awesome features, updates generally come at least twice a month.

  
  V. 1.5.3 – 11.01.2024
  - Update: Preview link change.
  - Fix: Optimization images for SEO.
  - Tweak: Improved Documentation

  V. 1.5.2 – 13.04.2021
  - Update: Bootstrap Framework to 4.5.
  - Tested: Android (Samsung, Google, HTC) and iOS (iPhone 11, iPhone 6s, iPad (6th Generation), iPad Air 2) devices, Safari, Firefox, Chrome browsers.
  - Tweak: Improved Documentation
  
  V. 1.5.1 – 13.10.2020
  - Fix: "Our Menus" section tab on click problem on iPhone devices.
  - Tested: Android (Samsung, Google, HTC) and iOS (iPhone 11, iPhone 6s, iPad (6th Generation), iPad Air 2) devices, Safari, Firefox, Chrome browsers. 
  - Tweak: Improved Documentation
  
  V. 1.5.0 – 21.07.2020
  - New: Home version 2 added
  - Added: Yandex Map API
  - Tweak: Improved Documentation
  
  V. 1.4.0 – 10.07.2020
  - New Feature: Chef personal info can be added and shown on slider
  - Fix: Google Map API key source
  - Tweak: Improved Documentation

  V. 1.3.1 – 04.05.2020
  - Added: Menu and gallery big images for popup
  - Fix: Menu and gallery images changed
  - Tweak: Improved Documentation

  V. 1.3.0 – 03.05.2020
  - New: Animate gallery load icon added for more button
  - Fix: Go to top button work on footer
  - Fix: Search input clear empty value
  - Tweak: Improved Documentation
    
  V. 1.2.0 – 1.12.2019
  - New: Scroll up button functionality added
  - Fix: Header search clear button type
  - Fix: Inputs type text autocomplete 
  - Tweak: Improved Documentation

  V. 1.1.1 – 30.09.2018
  - Fix: Burger menu view on tablet devices
  - Fix: Navbar fixed view 
  - Tweak: Improved Documentation

  V. 1.1.0 – 08.07.2018
  - New: loadMoreResults plugin for gallery photos
  - Fix: Slider responsive view to medium devices
  - Added: Extra images for slider, menu and gallery sections
  - Fix: Content of menu section  
  - Tweak: Improved Documentation

  V. 1.0.1 – 7.07.2018
  - Tweak: Improved Fonts Loading Performance
  
  V. 1.0.0 – 2.06.2018
  - Initial release