A simple personal site with your Twitter and Instagram, from a spreadsheets using IFTTT.
This is a Fork-n-Go project, so fork to get started making your own.
See the demo at jlord.github.io/person-page.
Create your own
|GitHub account||Basic HTML|
First, fork this repository.
Click the fork button in the upper right. Now you have a copy of this repository on your GitHub account!
Rename your fork
Once you've forked it, click on Settings and rename your fork, because probably
person-page is not what you want in your URL. Name your new repository:
username.github.io (but make
username your username, for instance, I'd use
jlord.github.io). GitHub will host all website files on the
master branch of a repo with that account name convention. Woo! More info on that at pages.github.com.
You can also give it any 'ol name and GitHub will host it using this patter:
Set up Twitter and Instagram with IFTTT
- Go to ifttt.com and create an account, use these recipes for creating a row on a spreadsheet every time you Instagram or Tweet.
- Instagram or Tweet so that a spreadsheet is created. It may take 10-15 mins for it to appear.
- Go to those spreadsheets and add a header row.
- For the Twitter one: date, twitter, tweet, tweetURL
- For the Instagram one: instadate, instacaption, instaurl, instasource
- Make each spreadsheet's data accessible:
- File -> Publish to the Web -> Start Publishing
- Share -> Anyone with link can view
- Get each spreadsheet's URL, it's at the top of your browser!
index.hmtlreplace the URL's (
URL2) with the appropriate spreadsheet URL (or spreadsheet key, but make sure you get the entire key, including hyphens and underscores if you're using just the key.) You can edit
index.htmlGitHub.com and the Edit button when you click on the filename from your fork's page, or in your favorite text editor.
- Go through
index.htmland change links and names to your links and names!
- Commit those changes and push them to GitHub (button at the bottom of the GitHub.com page your editing on, or through terminal or GitHub Desktop if you're using one of those).
- BOOM! Go checkout your site at
There are basic styles included in
style.css but go wild and make it your own, try other things!
There is another style, on the
lines branch. To access this style however you'll need to use your Terminal or GitHub desktop app to delete
gh-pages and then rename