Skip to content

Simple bio page with twitter and instagram. Fork-n-go!

Notifications You must be signed in to change notification settings

keithtzeng/person-page

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

26 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Person Page

screenshot

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

You'll Need:
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: username.github.io/reponame.

Set up Twitter and Instagram with IFTTT

  1. Go to ifttt.com and create an account, use these recipes for creating a row on a spreadsheet every time you Instagram or Tweet.
  1. Instagram or Tweet so that a spreadsheet is created. It may take 10-15 mins for it to appear.
  2. 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
  1. Make each spreadsheet's data accessible:
  • File -> Publish to the Web -> Start Publishing
  • Share -> Anyone with link can view
  1. Get each spreadsheet's URL, it's at the top of your browser!
  2. In index.hmtl replace the URL's (URL and 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.html GitHub.com and the Edit button when you click on the filename from your fork's page, or in your favorite text editor.
  3. Go through index.html and change links and names to your links and names!
  4. 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).
  5. BOOM! Go checkout your site at username.github.io

Style

There are basic styles included in style.css but go wild and make it your own, try other things!

Bonus Style

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 lines to gh-pages.

About

Simple bio page with twitter and instagram. Fork-n-go!

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 99.5%
  • Other 0.5%