• Stars
    star
    313
  • Rank 133,714 (Top 3 %)
  • Language
    CSS
  • License
    MIT License
  • Created almost 9 years ago
  • Updated over 1 year ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

A minimalist, responsive portfolio theme for Jekyll with Bootstrap

Phantom for Jekyll

A minimalist, responsive portfolio theme for Jekyll with Bootstrap.

preview

See it in action.

Fancy using it for your own site?

Here are some steps to get you started:

  1. Clone this repo and cd into the directory:
git clone https://github.com/jamigibbs/phantom.git your-dir-name && cd your-dir-name
  1. Run:
gem install bundler
bundle install
bundle exec jekyll serve

You may need to append your commands with sudo if you're getting a permissions error.

Don't have Jekyll yet? Get `er installed then!

  1. Visit in your browser at:

http://127.0.0.1:4000

Launching with Github Pages 🚀

Jekyll + Github pages is a marriage made in heaven. You can use your own custom domain name or use the default Github url (ie. http://username.github.io/repository) and not bother messing around with DNS settings.

Theme Features

Navigation

Navigation can be customized in _config.yml under the nav_item key. Default settings:

nav_item:
    - { url: '/', text: 'Home' }
    - { url: '/about', text: 'About' }

Set the nav_enable variable to false in _config.yml to disable navigation.

Contact Form

You can display a contact form within the modal window template. This template is already setup to use the Formspree email system. You'll just want to add your email address to the form in /_includes/contact-modal.html.

Place the modal window template in any place you'd like the user to click for the contact form. The template will display a link to click for the contact form modal window:

{% include contact.html %}
{% include contact-modal.html %}

Animation Effects

Animations with CSS classes are baked into the theme. To animate a section or element, simply add the animation classes:

<div id="about-me" class="wow fadeIn">
  I'm the coolest!
</div>

For a complete list of animations, see the animation list.

Pagination

By default, pagination on the home page will activate after 10 posts. You can change this within _config.yml. You can add the pagination to other layouts with:

  {% for post in paginator.posts %}
    {% include post-content.html %}
  {% endfor %}

  {% include pagination.html %}

Read more about the pagination plugin.

Credit

More Repositories

1

portfolio

My personal portfolio site using Jekyll and Github Pages
SCSS
53
star
2

lwc-websocket-chat

JavaScript
9
star
3

get-me-there-better

A React Native app that provides multiple options getting from your current location to a given destination. It indicates an optimal route based on cost or time preference via and offers route details for each: CTA transit, Divvy bike, walking, or Lyfy rideshare
JavaScript
8
star
4

text-revealer-chrome-extension

A Chrome Extension that helps reveal deeper information about text you highlight on a web page.
JavaScript
5
star
5

fair-split-calculator

A simple ReactJS calculator that takes two earnings and determines the amount each should pay towards an inputed set of household bills. Based on the thought that two different incomes should not be paying the same amount.
JavaScript
5
star
6

text-revealer-js

Reveal deeper information about text you highlight on a web page.
JavaScript
4
star
7

mobile-app-landing-page

CSS
3
star
8

blog-site

My personal blogging site
JavaScript
3
star
9

envato-extras

This WordPress plugin enables an Envato Extras custom post type and shortcode for displaying projects created using the Envato API.
PHP
2
star
10

scribe

A WordPress theme that excels as a writing presentation tool.
PHP
2
star
11

twitter-remove-non-mutuals

Remove Twitter followers that are not mutuals.
JavaScript
2
star
12

lazy-load-demos

JavaScript
2
star
13

quote-generator

CSS
2
star
14

sf-chat-websocket-server

JavaScript
2
star
15

guessing-game

JavaScript
1
star
16

jamigibbs

1
star
17

pomodoro-clock

CSS
1
star
18

chicago-train-tracker

JavaScript
1
star
19

sf-lwc-docs-diff

HTML
1
star
20

todo-list-with-localstorage

A simple todo list example using localStorage.
JavaScript
1
star
21

espn-fantasy-chrome-extension

JavaScript
1
star
22

local-weather

CSS
1
star
23

fieldbook-dispatches

Unique observations and illustrations by Margaret Armstrong from her Fieldbook of Western Wild Flowers
JavaScript
1
star
24

and-the-winner-is

Compares Github development activity for the popular frontend frameworks React, Angular, Ember and Vue with user voting and demographic tracking using React, Redux, Express, and Neo4j graph database
JavaScript
1
star