Cover Card landing page theme
Quick set-up
- Use this template
- Edit the
_config.yml
with your online presence accounts and upload a background and an avatar image - Go to the
Settings
tab, then selectPages
from the sidebar, and find (gh-pages branch) your new home page link
Dependencies
This theme is based on jekyll and jekyll-remote-theme. These dependencies are natively supported by Github Pages, which should build and deploy your site as soon as you make any change to your files. The theme is also based on the icons from Font Awesome.
Motivation
Create a cover page for your social media profiles, host it for free on Github Pages, and maintain it in minutes, not hours.
I understand that a jekyll theme without a blog might sound like a self contradiction, but jekyll has also motivated something even more useful than itself: seamless hosting with Github Pages.
This theme takes advantage of both jekyll and Github Pages, in order to create something similar to linktree, about.me and carrd, but without the price tag.
In addition to the official demo link, here is one more demo from my home page.
This theme is ideal for people or organizations who are busy enjoying their life or business and who want a simple business card for their online presence.
Please keep this README file because it contains the credits at the end and it might become handy after you have completely forgoten the set-up instructions.
Design rationale
The design rationale of this theme is to do less than other themes: "Less is more"
The majority (99%) of the availabe jekyll themes offers a blog, but I have never been able to keep blog content (or its technology) updated over time.
Let's be honest with ourselves: How does an (abandoned) blog centered web site look to new visitors if we have not posted since two years ago?
Make it yours
Fork this repository and edit the files to your liking: As a first step, you may want to replace the images and edit the _config.yml
with your online profiles. You can test the result almost in real-time at the Github Pages
section in the Settings tab (gh-pages branch).
Avatar or Logo
The avatar image should be square and at least 200 pixels. Chances are that you have a selfie somewhere in your media storage. If you are making a page for a business or product, then use a logo.
Background image sets the mood
There is no aspect ratio requirement for the background image, but it should be big enough for contemporary (desktop, tablet, phone) computer displays and dark enough in order to work for the white foreground text and icons.
Social profiles
Edit the _config.yml
file with your social media profiles by adding the respective account name, according to the documentation and comments inside that file. You can delete or comment out the social media that you don't need. Since v04, you can also control the order of your social media accounts. Moreover, you can add new media accounts and choose the icon.
Domain name
Github Pages supports free custom domain names, so it is worth buying a domain name and fill it in Custom domain
field at the settings. If you want to use the theme with you user page (ie. username.github.io), then delete (or rename) your master branch
and rename your gh-branch
to master
#13
Working example
In addition to the configuration file in this repository, you can also inspect a modified example of the legacy configuration file, which is using the legacy version of the theme. Moreover, you can inspect a custom (icons, links) example of the current version.
Updates
Please note that the theme is currently in beta, so some updates at the master branch might break your site. Don't panic!
If you wish to keep your theme frozen and not receive updates, then you can revert your remote_theme to the last known good configuration:
You may also optionally specify a branch, tag, or commit to use by appending an @ and the Git ref (e.g., epidrome/cover-card@v0.3). If you don't specify a Git ref, the master branch will be used.
Please note that currently Github Pages seems to build your site only when you make a local change. This means that the theme might get updated but you will not receive the updated version unless you make a local change in your forked repository.
You can always visit releases for new features and check issues for major bugs.
Expert options
You can find and locally overide advanced options (e.g., font, image, and icon styles) for this theme in the documentation (readme) at the master branch.
Credits
This page is based on the cover-card jekyll remote theme.
Background photo by Anders Jildén and avatar photo by Ayo Ogunseinde, both on Unsplash