Firstly, a huge thanks for purchasing this theme, your support is truly appreciated!
This document covers the installation and use of this theme and often reveals answers to common problems and issues - read this document thoroughly if you are experiencing any difficulties. If you have any questions that are beyond the scope of this document, feel free to email at [email protected] Thank you so much!
- Bootstrap 5
- Pixel Perfect Design
- Contact Form
- Personal Portfolio
- Cross-Browser Compatibility
- Sidebar Menu
- Typing Text
- Top bar Menu
- Image Moving Animation
- Well organized, commented & clean code
- Free Lifetime Updates
- Fully Responsive
- W3C Validated Code
- Cross Browser Optimization
- Unique Design
- SEO Friendly Code
- Smooth Scroll
- Sticky Menu
- Google Fonts Support
- Built With HTML5 and CSS3
- Free Font Icons
- Easy Setup
- All files are well commented
- Cross Browser Compatible with IE11+, Firefox, Safari, Opera, Chrome
- Github Access
- Extensive Documentation
- After unzip the download pack, you'll found a Template Folder with all the files.
- You can view this Template in any browser, you can display or edit the Template without an internet connection.(May not wotrk fonts and google map).
- This section that will not work is the Contact Section which contains getform.io form service for send messages.
- Now go to your github account and create repository (name like
yourname.github.io
). Push the content of the Template on your github repo. - Once the files are done uploading go to
yourname.github.io
- Enjoy
All information within the main content area is nested within a body tag. The general template structure is pretty the same throughout the template. Here is the general structure of main page (index.html).
roots [20 directories]
.
├── 404.html # 404 error file
├── assets # all assets of this theme
│ ├── css
│ ├── fonts
│ ├── js
│ └── webfonts # font awesome font
│
├── blog
│ └── index.html # blog page
├── _config.yml # config files
├── Gemfile
├── img # all of images
├── _includes
│ ├── disqus_comments.html # blog post comments
│ ├── footer.html
│ ├── google_analytics.html # google analytics
│ ├── header.html
│ ├── head.html
│ ├── hero # hero sections
│ │ ├── basic.html
│ │ ├── jarallax.html
│ │ └── particles.html
│ ├── hero.html # hanbdle hero sections
│ ├── preloader.html
│ ├── scripts.html
│ ├── sections # all of sections
│ │ ├── about.html
│ │ ├── blog.html
│ │ ├── contact.html
│ │ ├── exp-area.html
│ │ ├── faq.html
│ │ ├── feedback.html
│ │ ├── hireme.html
│ │ ├── price-area.html
│ │ ├── service.html
│ │ └── work.html
│ └── seo.html # handle static site seo
├── index-2.html
├── index-3.html
├── index.html # index file
├── _layouts #layouts
│ ├── blog.html
│ ├── compress.html
│ ├── default.html
│ ├── page.html
│ └── post.html
├── _pages # custom pages
├── _posts # blog post
├── README.md # main stylesheet
└── style.css # main stylesheet
These are the css files that are loaded into templates in Head Section.
<!-- ========== Start Stylesheet ========== -->
<link href="{{ 'assets/css/bootstrap.min.css' | relative_url }}" rel="stylesheet" />
<link href="{{ 'assets/css/fontawesome.min.css' | relative_url }}" rel="stylesheet" />
<link href="{{ 'assets/css/bsnav.min.css' | relative_url }}" rel="stylesheet" />
<link href="{{ 'assets/css/magnific-popup.css' | relative_url }}" rel="stylesheet" />
<link href="{{ 'assets/css/slick.css' | relative_url }}" rel="stylesheet" />
<link href="{{ 'assets/css/all.min.css' | relative_url }}" rel="stylesheet" />
<link href="{{ 'assets/css/animate.css' | relative_url }}" rel="stylesheet" />
<link href="{{ 'assets/css/icofont.min.css' | relative_url }}" rel="stylesheet" />
<link href="{{ 'assets/css/splitting.css' | relative_url }}" rel="stylesheet" />
<link href="{{ 'assets/css/splitting-cells.css' | relative_url }}" rel="stylesheet" />
<link href="{{ 'style.css' | relative_url }}" rel="stylesheet">
<link href="{{ 'assets/css/responsive.css' | relative_url }}" rel="stylesheet" />
<!-- ========== End Stylesheet ========== -->
By default, the template loads this font from Google Web Font Services, you can change the font with the one that suits you best. go to style.css and you can update google font
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap");
Remember to change the font into main.css
These are the list of Javascript files that are loaded into templates in end of the Body Section.
<!-- jQuery Frameworks
============================================= -->
<script src="{{ 'assets/js/jquery-3.6.0.min.js' | relative_url }}"></script>
<script src="{{ 'assets/js/bootstrap.bundle.min.js' | relative_url }}"></script>
<script src="{{ 'assets/js/jquery.appear.min.js' | relative_url }}"></script>
<script src="{{ 'assets/js/jquery.easing.min.js' | relative_url }}"></script>
<script src="{{ 'assets/js/waypoints.min.js' | relative_url }}"></script>
<script src="{{ 'assets/js/jquery.magnific-popup.min.js' | relative_url }}"></script>
<script src="{{ 'assets/js/progress-bar.min.js' | relative_url }}"></script>
<script src="{{ 'assets/js/slick.min.js' | relative_url }}"></script>
<script src="{{ 'assets/js/isotope.pkgd.min.js' | relative_url }}"></script>
<script src="{{ 'assets/js/count-to.js' | relative_url }}"></script>
<script src="{{ 'assets/js/typed.min.js' | relative_url }}"></script>
<script src="{{ 'assets/js/parallax.js' | relative_url }}"></script>
<script src="{{ 'assets/js/wow.js' | relative_url }}"></script>
<script src="{{ 'assets/js/bsnav.min.js' | relative_url }}"></script>
<script src="{{ 'assets/js/splitting-animation.js' | relative_url }}"></script>
<script src="{{ 'assets/js/splitting.min.js' | relative_url }}"></script>
{%- if page.hero == 'particles' -%}
<script src=" assets/js/jquery.particles.min.js"></script>
{%- endif -%}
<script src="{{ 'assets/js/YTPlayer.min.js' | relative_url }}"></script>
<script src="{{ 'assets/js/main.js' | relative_url }}"></script>
This is a getform.io for sending messages to your email, to start receiving messages.
- Create new form endpoint on Getform
- Form endpoint, Place this URL in the action attribute of your form. Also, make sure to add method="POST".
<form accept-charset="UTF-8" action="https://getform.io/f/{site.getform_id}" method="POST">
<input type="email" name="email" placeholder="Your Email">
<input type="text" name="name" placeholder="Your Name">
<input type="text" name="message" placeholder="Your Message">
<button type="submit">Send</button>
</form>
We make the Jekyll template using a high-quality full template. We have more than 5+ years of experience to develop the Jekyll theme. more than 1k users use our Jekyll themes. It is a basic Jekyll theme or template so you can easily change the _config.yaml
file.
How to change site url? Go to _config.yaml
file update url
value
url: ''
url is very import of jekyll theme. You most be change url value form config.yaml
How to change logo? Go to _config.yaml
file update logo
value
logo: 'img/logo.png'
How to change favion? Go to _config.yaml
file update favion
value
favion: 'img/favicon.png'
***hire us *** If you are unable to customize this theme, you can hire us. our qualified developer make it perfect for you as your requirements.
- To use this project, you'll need the following things installed on your machine.
- Most be installed ruby 2.4 - 2.7 on you sytem. more details visite jekyllrb installation
- [Jekyll] (http://jekyllrb.com/) -
$ gem install jekyll bundler
- run
$ bundle exec jekyll server
and browse http://127.0.0.1:8000
- Fonts used in this item are loaded from Google. If you don't have an internet connection then item fonts can be different (don't worry about it because this is not an issue)
- if you think documentation is not enough to customize this item then email to [email protected]
- Before asking for any help you need to make sure that you are the actual buyer for this item. you have two ways to Wokoya that
1. collect a support ticket and send with your mail
2. Send a screenshot after login to you account So that we can understand you have access to download this item from themeforest
We would really love to take this opportunity to appreciate guys whose items were helpful to us to make Vifolio a really beautiful theme for our awesome users:
- jQuery
- HTML5 Shiv
- Modernizr
- jQuery Easing
- Smooth Scroll
- jQuery Appear
- Bootsnav
- WOW
- jQuery countTo Plugin
- Magnific Popup
- Equalizing
- Slick Carousel
- Do you need customization in a reasonable price. You can Hire Us