{"id":15516006,"url":"https://github.com/tedivm/jekyll-theme-portfolio","last_synced_at":"2025-04-23T03:27:15.770Z","repository":{"id":56878947,"uuid":"187440515","full_name":"tedivm/jekyll-theme-portfolio","owner":"tedivm","description":"A Portfolio Theme for Jekyll","archived":false,"fork":false,"pushed_at":"2021-11-12T01:41:25.000Z","size":1843,"stargazers_count":11,"open_issues_count":0,"forks_count":4,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-04-19T21:10:33.379Z","etag":null,"topics":["bootstrap","jekyll-theme","portfolio","portfolio-site"],"latest_commit_sha":null,"homepage":"https://rubygems.org/gems/jekyll-theme-portfolio","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/tedivm.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2019-05-19T06:09:15.000Z","updated_at":"2025-03-23T04:46:36.000Z","dependencies_parsed_at":"2022-08-20T11:40:44.856Z","dependency_job_id":null,"html_url":"https://github.com/tedivm/jekyll-theme-portfolio","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tedivm%2Fjekyll-theme-portfolio","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tedivm%2Fjekyll-theme-portfolio/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tedivm%2Fjekyll-theme-portfolio/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tedivm%2Fjekyll-theme-portfolio/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/tedivm","download_url":"https://codeload.github.com/tedivm/jekyll-theme-portfolio/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250363051,"owners_count":21418189,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["bootstrap","jekyll-theme","portfolio","portfolio-site"],"created_at":"2024-10-02T10:05:20.116Z","updated_at":"2025-04-23T03:27:15.753Z","avatar_url":"https://github.com/tedivm.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Portfolio Page for Github Pages\n\nThe goal of this project is to make it easy for people who want to host their portfolio to actually do so without having to jump through a ton of hoops or pay any money. I originally made this for [my own portfolio](https://projects.tedivm.com/) after realizing that all the existing portfolio themes were expensive or required extensive customization.\n\nThis project is a [Jekyll](https://jekyllrb.com/) theme, which means that it can be used to set up a free website on [Github Pages](https://pages.github.com/).\n\nIt is possible to use this theme without understanding anything about building websites. It works by using a configuration file to store all of your projects, which it then displays (including logos, descriptions, and a variety of links). This way when you want to add a new project all you have to do is add a few lines to a configuration and it will appear.\n\nIt is also possible to go beyond that and customize the project right down to the CSS. This theme is made with [Bootstrap 4](https://getbootstrap.com/) and [SCSS](https://sass-lang.com/documentation/syntax).\n\n\n![alt text](https://raw.githubusercontent.com/tedivm/jekyll-theme-portfolio/master/screenshot.png)\n\n\n## Getting Started\n\n### Setup a Github Pages Site\n\nGithub has a great [Getting Started with Github Pages](https://fontawesome.com/icons/chess-pawn?style=solid) tutorial.\n\n\n### Configure your Site\n\nAt this point you should have a `_config.yml` file. You can just replace it with the one below, filled out with your details.\n\n```yaml\n\n# This is how Jekyll knows to use this theme.\nremote_theme: tedivm/jekyll-theme-portfolio\n\n\ntitle: Your awesome title\nauthor: Your Name\nemail: your-email@domain.com\ndescription: \u003e\n  Write an awesome description for your new site here. You can edit this\n  line in _config.yml. It will appear in your document head meta (for\n  Google search results) and in your feed.xml site description.\n\n\n# Header Links - all optional. If set these create header links.\nhomepage: https://your.homepage.com\ntwitter_username: example\ngithub_username: example\nlinkedin_username: example\n\n\nplugins:\n - jekyll-feed\n - jekyll-seo-tag\n - jekyll-remote-theme # Lets us test remote themes locally.\n\n```\n\n\n### Create your Portfolio Page\n\nIf you have a one page site then you should create your portfolio page at `index.html` or `index.md`, but for multipage sites you can create it anywhere you want. Either way the file only contain the following to start (if there's anything after the last three dashes remove it for now)-\n\n```\n---\nlayout: portfolio\n---\n```\n\nThis tells Jekyll to use the `portfolio` layout for the page, which lets the theme take care of the rest.\n\nIf you prefer two columns instead of three you can use the two column layout instead-\n\n```\n---\nlayout: portfolio_2column\n---\n```\n\nIf you leave any content in the file it will show up above the portfolio listings.\n\n```\n---\nlayout: portfolio\n---\n\u003ch2\u003e Welcome!\u003c/h2\u003e\n```\n\n\n### Add your Projects\n\nProject details are stored in `_data/projects.yaml`.\n\n\n## Defining Projects\n\nProjects are defined using the `yaml`, which is like `json` but friendly for humans to edit.\n\nBefore diving into all of the options, lets look at an example projects file. This file has a single category, named `Libraries`, with four projects underneath it. Each of those projects has a variety of configuration values (most of which are optional) that tell the theme what to display.\n\n```yaml\n\n- name: Libraries\n  projects:\n    - name: Stash\n      description: This caching library supports multiple backends with a consistent frontend. It supports hierarchical keys, stampede and dogpile protection, automatic miss distribution, and more.\n      github: tedious/Stash\n      documentation: https://www.stashphp.com/\n      packagist: tedivm/stash\n      icon: fab fa-php\n\n    - name: JShrink\n      description: This library minifies javascript using 100% pure PHP, allowing it to be integrated into applications with minimal work and maximum compatibility.\n      github: tedious/JShrink\n      packagist: tedivm/jshrink\n      icon: fab fa-php\n\n    - name: github3apps.py\n      description: This library is a wrapper around the \u003ca href=\"https://github.com/sigmavirus24/github3.py\"\u003egithub3.py\u003c/a\u003e library, giving it the ability to build GitHub Applications.\n      github: tedivm/github3apps.py\n      pypi: github3apps.py\n      icon: fab fa-github\n\n    - name: Fetch\n      description: This library wraps the native PHP IMAP libraries around a modern object orientated interface.\n      github: tedious/Fetch\n      packagist: tedivm/fetch\n      icon: fab fa-php\n\n    - name: psad\n      description: This Puppet module controls the Port Scan Active Defense program, providing active response to block port scans.\n      puppet_forge: tedivm/psad\n      github: tedivm/puppet-psad\n      image: puppet.png\n\n```\n\nFor a larger example you can view [tedivm's portfolio data](https://github.com/tedivm/portfolio/blob/master/_data/projects.yaml).\n\n### Project Fields\n\nThere is only one required configuration values for each project, the `name`. If you put this and nothing else the project will get displayed using the default project icon and no description or links.\n\nThe `description` field is where you actually describe the project. You can put `html` in here if you want, which can be useful for linking to related projects.\n\nThen there are a variety of repository options that can be used. Each of these will add an icon below the project description linking to that project in that particular repository or site-\n\n* `homepage`\n* `documentation`\n* `github` - this will also add the `stars` link to the project.\n* `dockerhub`\n* `puppet_forge`\n* `npm`\n* `pypi`\n* `packagist`\n* `rubygems`\n* `wordpress`\n\nIf there's a repository or site that isn't supported [open a ticket](https://github.com/tedivm/jekyll-theme-portfolio/issues/new?title=Please+add+project+link+support+for+X\u0026body=Here%27s+an+example+link%3A+) and it should be simple to get it added.\n\n\n### Images and Icons\n\nEach project has a picture above it. The picture comes from either the `icon` or the `image` option of the project.\n\nIcons come from [FontAwesome](https://fontawesome.com/icons?d=gallery\u0026m=free). To use them you have to use the full class name, such as `fab fa-github` for [Github](https://fontawesome.com/icons/github?style=brands) or `fas fa-chess-pawn` for [the Pawn](https://fontawesome.com/icons/chess-pawn?style=solid).\n\nImages should be supplied by you. Any images should be added to `assets/images/projects`, afterwhich they can be used in any `image` by using the filename (such as `image: puppet.png`).\n\nYou can also use `icon` and `image` at the category level. This will set the default for that category.\n\n### Github Stars\n\nThe Github Star badges are using the [GithubStars API](https://blog.tedivm.com/open-source/2019/05/gitstars-a-github-api-for-front-end-development/). This bypasses various Github API ratelimiting issues that plague many Github Badge projects.\n\n\n## Customizing\n\n### Changing Colors\n\nTo override the existing colorscheme of the portfolio you're going to need to copy the variables file from [this theme's github page](https://raw.githubusercontent.com/tedivm/jekyll-theme-portfolio/master/_sass/_variables.scss) into `_sass/_variables.scss`. This will tell Jekyll to stop using the theme file and instead use yours.\n\nOnce there the first thing you'll likely want to change is the `$primary` color, which you should be able to fine on line 40. This variable is used for the header and the various project icons. You can set it to any of the colors defined above it (`$blue`, `$indigo`, `$pink`, etc) or to any hex code you'd like.\n\n\n### Adding a FavIcon\n\nThere are all sorts of websites and tools which will help you make your favicon file. Once you have you just need to dump it into the repository as `favicon.ico` and it will start showing up.\n\n\n### Using a Custom Domain\n\nGithub supports [custom domains](https://help.github.com/en/articles/using-a-custom-domain-with-github-pages), as you can see from their extensive documention.\n\nLong story short, point the DNS for your domain to `username.github.io` as a CNAME record and then add a file named `CNAME` with that domain as the file contents.\n\n\n### Adding Analytics\n\nThis theme supports two website analytics options- [Fathom](https://usefathom.com/), which is an [open source](https://github.com/usefathom/fathom) and privacy focused analytics package, or theres [Google Analytics](https://google.com/analytics). Both require a simple addition to your configuration file to use.\n\nFathom takes a Site ID and optionally a URL (if you're hosting it yourself instead of using their service).\n\n```\nfathom_key: DXQMN\nfathom_domain: fathom.example.net\n```\n\nFor Google Analytics you only need the one option.\n\n```\ngoogle_analytics: UA-XXXXX-Y\n```\n\n\n## Awknowledgements\n\nThis project was forked off of the excellent [Boostrap 4 Github Pages project](https://github.com/nicolas-van/bootstrap-4-github-pages).\n\n* A full Bootstrap 4 theme usable both on Github Pages and with a standalone Jekyll.\n* Recompiles Bootstrap from SCSS files, which allows to customize Bootstrap's variables and use Bootstrap themes.\n* Full support of Bootstrap's JavaScript plugins.\n* Supports all features of Github Pages and Jekyll.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftedivm%2Fjekyll-theme-portfolio","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftedivm%2Fjekyll-theme-portfolio","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftedivm%2Fjekyll-theme-portfolio/lists"}