Get started
Item name: Gute - Minimalist Blog HMTL Template
Creator: Khanh Vu
Owned by: Avitex Studio
Created at: 30/05/2020
Lastest update: 30/05/2020
Thank you for your purchasing this template. If you have any questions that are beyond the scope of this help file, please feel free to email us via hello@avitex.vn
Template Installation
FTP Upload
- Open up your FTP manager and connect to your hosting
- Browse to required directory (Normally public_html)
- Upload the files inside Gute/app folder.
Avaiable pages
Hompages
- HOMEPAGE 01: homepage1.html
- HOMEPAGE 02: homepage2.html
- HOMEPAGE 03: homepage3.html
- HOMEPAGE 04: homepage4.html
- HOMEPAGE 05: homepage5.html
- HOMEPAGE 06: homepage6.html
- HOMEPAGE 07: homepage7.html
- HOMEPAGE 08: homepage8.html
- HOMEPAGE 09: homepage9.html
Blog
- BLOG_CATEGORY_GRID: blog_category_grid.html
- BLOG_CATEGORY_LIST: blog_category_list.html
- POST_STANDARD: post_standard.html
- POST_STANDARD_IMAGE_FULLWIDTH: post_standard_image_full.html
- POST_STANDARD_SIDEBAR: post_standard_sidebar.html
- POST_GALLERY: post_gallery.html
- POST_VIDEO: post_video.html
- POST_AUDIO: post_audio.html
- POST_QUOTE: post_quote.html
Pages
- AUTHOR: author.html
- ABOUT: about.html
- CONTACT: contact.html
- SHOP: shop.html
- PRODUCT_DETAIL: product_detail.html
- CART: cart.html
- CHECKOUT: checkout.html
- ERROR: error_404.html
Fonts
If you want to use orther font family you may want to find one on Google Fonts
To choose & change your favourite font family from google font you can follow this instruction
Soruce files
CSS files:
//Main font family <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=DM+Sans:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap"/> //Fontawesome icon font <link rel="stylesheet" href="https://kit-pro.fontawesome.com/releases/v5.13.0/css/pro.min.css"/> //Fav icon <link rel="shortcut icon" type="image/png" href="./assets/images/fav.png"/> //Elegant icon font <link rel="stylesheet" href="assets/css/elegant.css"/> //Customed boostrap <link rel="stylesheet" href="assets/css/custom_bootstrap.css"/> //Slick slider <link rel="stylesheet" href="assets/css/slick.css"/> //Plyr.js for player <link rel="stylesheet" href="assets/css/plyr.min.css"/> //Main style file <link rel="stylesheet" href="assets/css/style.css"/>
Javascript files:
//Jquery <script rel="script/javascript" src="assets/js/jquery.min.js"></script> //Slick slider <script rel="script/javascript" src="assets/js/slick.min.js"></script> //Plyr.js <script rel="script/javascript" src="assets/js/plyr.min.js"></script> //Mansonry <script rel="script/javascript" src="assets/js/masonry.pkgd.min.js"></script> //Image loaded <script rel="script/javascript" src="assets/js/imagesloaded.pkgd.min.js"></script> //Vimeo API <script rel="script/javascript" src="assets/js/vimeo.player.min.js"></script> //Main javascript file <script rel="script/javascript" src="assets/js/main.js"></script>
Color
How to change main color
- Go to path app/assets/sass/abstracts
- Open varible.scss file
-
Find variable $colors and edit key yellow in it to color you want
- Finally, go to root folder, open terminal & run gulp build
Customization
How to change logo image source ?
You can change logo source by replace src srouce
How to change copyright ?
You can change logo source by replace src srouce
Using Templae Engine & Css Preprocessors
If you have knowledge of template engine and css preprocessors, you can edit the source code file in pug, sass folder to have a theme with a higher degree of customization than editing HTML / CSS files. We use PugJs as template engine, and SCSS as css Preprocessors. You can learn more about them here
Thanks
Thank you for purchasing our Template
Deer creative