Author: ThemeForest Profile | Demo | Website | Contact with me
1. First, unzip main file, copy all files from /theme/ folder to your work dir.
2. To run the theme locally, navigate to the theme directory and install all the dependencies with Bundler:
bundle install
3. Then run the following command to start the Jekyll server
bundle exec jekyll serve
4. Browse to http://localhost:4000
You can find more on Deployment Methods page on Jekyll Website.
Basic site options you can edit in _config.yml file:
# basic settings
title: "Ober - Resume / CV Jekyll Theme"
email: "your-email@example.com"
description: "Jekyll Resume / CV / vCard / Portfolio template"
author: "Admin"
baseurl: "" # the subpath of your site, e.g. /blog
url: "" # the base hostname & protocol for your site, e.g. http://example.com
date_format: "%d %B %Y"
# paginations & permalinks
paginate: 9
paginate_path: "/blog/page:num/"
permalink: pretty
To configure header go to _data/settings.yml file:
### Header
header:
logo:
image: "assets/img/ober_logo.png"
alt: "Joé Wilson"
To configure footer go to _data/settings.yml file:
### Social
social:
- name: "Dribbble"
icon: "fab fa-dribbble"
url: "http://dribbble.com"
- name: "Twitter"
icon: "fab fa-twitter"
url: "http://twitter.com"
- name: "Behance"
icon: "fab fa-behance"
url: "http://behance.com"
### Footer
footer:
developer: "Developed by bslthemes"
copyright: "Ober. All Rights Reserved"
To configure site navigation left panel go to _data/navigation.yml file:
...
main:
# About
- title: "About"
url: "#about-section"
parent: 0
# Resume
- title: "Resume"
url: "#resume-section"
parent: 0
# Works
- title: "Works"
url: "#works-section"
parent: 0
# Pricing
- title: "Pricing"
url: "#pricing-section"
parent: 0
...
Each menu item are linked with header menu. To add new menu item use this code:
- title: "Resume"
url: "#section-resume"
parent: 0
All content of all pre-built sections on home page you can edit in _data/content.yml file.
All pre-built sections name:
- hero-image
- about
- resume
- portfolio
- pricing
- testimonials
- clients
- blog
- contacts
To edit a home page structure go to file /index.html
For example standart page file structure:
---
layout: builder
sections: hero-image,about,resume,portfolio,pricing,testimonials,blog,clients,contacts
---
To create a new post, you can create a new markdown file inside the /_posts/ directory by following the recommended file naming format:
YEAR-MONTH-DAY-title.MARKUP
Where YEAR is a four-digit number, MONTH and DAY are both two-digit numbers, and MARKUP is the file extension representing the format used in the file. For example, the following are examples of valid post filenames:
2011-12-31-new-years-eve-is-awesome.md
2012-09-12-how-to-write-a-blog.md
All blog post files must begin with front matter which is typically used to set a layout or other meta data betwenn "---" and "---"". After will be rendered with Markdown and show up as “Content”.
For example standart post file structure:
---
layout: post
title: "By spite about what to do"
date: 2020-06-15
category: Design
image: assets/img/blog/blog1.jpg
author: Ryan Adlard
tags: jekyll
---
So striking at of to welcomed resolved. Northward by described up household therefore attention. Excellence decisively nay man yet impression for contrasted remarkably.
To create a draft post, create the post file under the /_drafts/ directory, and you can find more information at Working with Drafts.
To create a new pages, you need create a new markdown file inside the your work directory.
All pages files must begin with front matter which is typically used to set a layout or other meta data betwenn "---" and "---"". Text after will be rendered with Markdown and show up as “Content”.
For example standart page file structure:
---
layout: page
title: About
---
So striking at of to welcomed resolved. Northward by described up household therefore attention. Excellence decisively nay man yet impression for contrasted remarkably.
To create a new project, you need create a new markdown file inside the /_works/.
All projects files must begin with front matter which is typically used to set a layout or other meta data betwenn "---" and "---"". Text after will be rendered with Markdown and show up as “Content”.
For example standart project file structure:
---
# preview details
layout: works-single
title: Mozar
category: Photography
category_slug: photography
image: assets/img/works/work1.jpg
# full details
full_image: assets/img/works/single1.jpg
info:
- label: Year
value: 2022
- label: Technology
value: Photoshop, XD
description1:
show: yes
title: Project Goal
text: "Aliquam a sapien diam. Phasellus pulvinar tellus aliquam eleifend consectetur. Sed bibendum leo quis rutrum aliquetmorbi.
Donec imperdiet risus at tortor consequat maximus et eget magna. Cras ornare sagittis augue, id sollicitudin justo tristique ut. Nullam ex enim, euismod vel bibendum ultrices, fringilla vel eros. Donec euismod leo lectus, et euismod metus euismod sed. Quisque quis suscipit ipsum, at pellentesque velit. Duis a congue sem.
"
gallery:
- assets/img/blog/blog3.jpg
- assets/img/works/work4.jpg
- assets/img/blog/blog4.jpg
description2:
title: Project Result
text: "Aliquam a sapien diam. Phasellus pulvinar tellus aliquam eleifend consectetur. Sed bibendum leo quis rutrum aliquetmorbi.
Donec imperdiet risus at tortor consequat maximus et eget magna. Cras ornare sagittis augue, id sollicitudin justo tristique ut. Nullam ex enim, euismod vel bibendum ultrices, fringilla vel eros. Donec euismod leo lectus, et euismod metus euismod sed. Quisque quis suscipit ipsum, at pellentesque velit. Duis a congue sem.
"
video:
poster: assets/img/blog/blog9.jpg
id: Gu6z6kIukgg
---
Preview/General Details
Single Page Details
Select initial skin ( "light" or "dark" ) for settings -> skin option in the /_data/settings.yml file:
### Main Settings
settings:
skin: "light" # select initial sking option: "light" or "dark"
To configure form submission you need confirm you email ( where you want get submissions ) on site formsubmit.io. After, change option formsubmit_email in /_config.yml file:
# formsubmit.io
formsubmit_email: "beshleyweb@gmail.com" # sign up on https://formsubmit.io/ and confirm your email
You can configure Disqus Comments options in /_config.yml file:
# disqus comments
disqus_comments: "yes" # yes - show disqus comments, no - hide disqus comments
disqus_shortname: "glitche-jekyll-theme" # read more here https://help.disqus.com/customer/portal/articles/466208-what-s-a-shortname-
You can find out more about Disqus’ shortnames here.
To change styles default variables go to /_sass/ober/settings.scss:
/* SETTINGS VARIABLES FOR DARK UI
- Background Colors
- Colors
*/
/* Background Colors */
$default_bg: #222a36;
$second_bg: #181e27;
/* Colors */
$default_color: #fff;
$white_color: #FFF;
$dark_color: #000;
$active_color: #ff8059;
$error_color: red;
/* SETTINGS VARIABLES FOR LIGHT UI
- Background Colors
- Colors
*/
/* Background Colors */
$light_default_bg: #f7f5f2;
$light_second_bg: #ebe7e0;
/* Colors */
$light_default_color: #1c2528;
$light_white_color: #FFF;
$light_dark_color: #000;
$light_active_color: #68e0cf;
$light_error_color: red;
/* SETTINGS VARIABLES FOR TYPOGRAPHY
- Fonts
- Fonts Size
- Icons Size
- Line Height
- Mixins
*/
/* Fonts */
$default_font: 'Rubik';
$extra_font: 'Sorts Mill Goudy';
/* Fonts Size */
$default_size: 20px;
$section_h1_size: 138px;
$section_h2_size: 100px;
$section_sub_size: 40px;
$section_name_size: 24px;
$btn_size: 18px;
$menu_size: 120px;
$menu_sub_size: 40px;
$title_h1_size: 49px;
$title_h3_size: 39px;
$title_h4_size: 29px;
$title_h5_size: 24px;
$title_h6_size: 20px;
/* Fonts Weight */
$font_weight: 300;
/* Line Height */
$line_height: 1.5;
To translate all default strings go to /_data/ui-text.yml file
ui_text:
home: "Home"
blog: "Blog"
blog_subtitle: "All the most current news and events of my life"
archive: "Archive"
blog_post: "Blog Post"
by: "by"
share: "Share"
share_on: "Share on"
tags: "Tags"
prev: "Prev"
next: "Next"
comments: "Comments"
full_name: "Full Name"
your_full_name: "ej.: Genoveva Lian Hullt"
email_address: "Email Address"
your_email_address: "example@domain.com"
message: "Message"
your_message: "To Write"
send_message: "Send Message"
view_project: "View Project"
new: "new"
search: "Search ..."
recent_posts: "Recent Posts"
latest_posts: "Latest Posts"
categories: "Categories"
follow_me: "Follow Me"
all: "All"
read_more: "Read More"
Use this Guide: A Step-by-Step Guide: Jekyll 3.0 on Netlify
In this template are defined some of classes for icons, your can see all icons here - Fontawesome.
Any Images or logos used in previews are not included in this item or final purchase.