Shao-s-Kitchen

• Shao's Kitchen is an exusitive food company based in Nairobi

Live

• https://shaos-kitchen.netlify.app/

What I learnt📐

• Bootstrap Grid System
• Owl Carousel- jQuery plugin that lets you create a beautiful responsive carousel slider.
• Netlify Forms & PHP Mail sender
• Web crawlers & Site map
• Advanced SEO
• Site Indexing
• Web-testing
• SSL certificates
• Website-optimization
• Google Webmaster

Project Structure🚀

The structure of the website

CSS File

• The CSS file is divided in sections:
• General and Typography
• Preloader
• Navigation
• Slider
• Structure
• Section - About us
• Section - Menu
• Section - Gallery
• Section - Contact
• Section - Blog Pages
• Miscellaneous
• Media Queries

Contact Form

-The Contact form will use php to send emails. Open the file sendmail.php located inside the php folder and change the example email found in the line 4 and your form is ready to use.

= "youremail@email.com"; //Recipient email, Replace with own email here

Layerslider

• This template uses Layerslider in the header of the index page, to read the documentation and learn how to insert slides, layers and effects - https://layerslider.kreaturamedia.com/

Icons

• This website uses icons from FontAwesome 5 , and Flat Icons you can click in each link to find the icon map, to change the icons just replace with the icon name you want.

Images

• The images used in the preview are from Freepik, you can find a collection with the images used here.For better performance is recommended to use a image optimizer like TinyJPG to make your site load faster.

Web Test

References

• https://tinyjpg.com/
• https://gtmetrix.com/
• https://layerslider.kreaturamedia.com/
• https://owlcarousel2.github.io/OwlCarousel2/
• https://web.dev/vitals/
• https://developers.facebook.com/docs/graph-api/

Inspiration ❤

• https://www.awwwards.com/websites/food-drink/