GithubHelp home page GithubHelp logo

juanmanubens / trophy-jekyll Goto Github PK

View Code? Open in Web Editor NEW

This project forked from thomasvaeth/trophy-jekyll

0.0 1.0 0.0 2.05 MB

๐Ÿ† โ€“ A blog theme for Jekyll.

Home Page: http://thomasvaeth.com/trophy/

License: MIT License

Ruby 6.18% HTML 40.41% CSS 45.37% JavaScript 8.04%

trophy-jekyll's Introduction

๐Ÿ† โ€“ A Blog Theme for Jekyll

Trophy is a blog theme for Jekyll built using HTML, Sass, and JavaScript (no jQuery). External stylesheets and libraries included are Google Fonts, Font Awesome, Normalize.CSS, Rellax, and WOW.js. Trophy is also available in Ghost.

Screenshots

Blog Page (Posts) Blog Page

Blog Page (Categories) Blog Page

Post Page (Mast) Post Page

Post Page (Profile & Footer) Post Page

Archive Page Archive Page

Installation

All dependencies are saved in the Gemfile. Run bundle install (Install Bundler if it is not already) after cloning the repo.

Edit Theme

I made everything as easy as possible to edit. Most things can be found in the _config.yml, but if more editing is required digging through the code will be required. The head.html file is in the _includes folder and the Sass variables are found in the _base.scss file in the _sass folder.

_config.yml

Site Settings

email: 
baseurl: ""
paginate: 5
paginate_path: "/blog/page-:num"
google_analytics: UAโ€”XXXXXXXX-X
  • email - Your email for the contact card and the footer
  • baseurl - Path of blog if adding this on to another website
  • paginate - Number of blog posts per page
  • paginate_path - URL structure of paginated pages
  • google_analytics - Option field to replace with correct Google Analytics code

SEO Settings

title: 
description: 
url: ""
twitter_username: 
default_img: 
  • title - Title of blog
  • description - Description of blog (recommended to not go over 160 characters)
  • url - URL of main website
  • twitter_username - Twitter username
  • default_img - Image that will appear when posting links on social networks

Profile Settings

name: 
profile_img: 
profile: 
social:
  github: 
  • name - Full name for SEO purposes
  • profile_img - Image for the profile card (size to 2000x1200px)
  • profile - Short description that will be in the profile card
  • social - List of social networks for icons in the contact card and the footer (Font Awesome is used, so only match the name of the icon, but do not include fa-)

Build Settings

exclude: ["_screenshots", "Gemfile", "Gemfile.lock", "LICENSE.txt", "README.md"]
permalink: /:year/:month/:day/:title/
  • exclude - Folders that are excluded from _site_
  • permalink - URL structure of blog posts

_posts

---
layout: post
title: ""
date: 
categories:
description: 
image: 
image-sm:
---

This is the YAML front matter block for blog posts.

  • layout - This field will always be post
  • title - The title of the blog post
  • date - The date that will appear on the blog post
  • categories - Optional field that can be entered as an array or a list
  • description - Optional field for SEO (recommended to not go over 160 characters)
  • image - The blog theme was designed for 2000x1200px images (optimize your images because this is a picture heavy theme)
  • image-sm - Optional field for card layouts for image optimization and page speed (designed for 500x300px images)

Upcoming Additions

  • Page transitions
  • More styled elements for blog posts

Issues

Please submit any issues here.

License

Trophy is licensed under the MIT License.

trophy-jekyll's People

Contributors

thomasvaeth avatar adarn avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.