Embed GitHub Repository Files into Your Blog or Website Using Gist-it

on

 

Embed GitHub Repository Files into Your Blog or Website Using Gist-it


Video Documentation :-

See Demo :- 



2. Embed Code :- 


<script src="http://gist-it.appspot.com/https://github.com/CXDI/ChatsDuringVideoMaking/blob/main/2021/02/how-to-remove-youtube-information-from.html"></script>


Preview :-




I am sure that you here because, you have a situation that you need to embed a file from a github repository to your webpage/blog. right?

I was in the same situation once, so I googled and got a perfect solution for my need and now for yours.

Gist-it

Gist-it is your solution for it. A man named "Robert Krimen" is kind enough to create a application so that we can embed any file from github repository to our webpage/blog. You can do it as simple as in three steps, just like you embed a gist, hoping you are familiar with embedding gist. 
  1. Copy github url of the file you like to embed.
  2. Submit it to Gist-it and copy the script tag generated.
  3. Use the script tag copied in you blog, same as you use gist.




gist-it.appspot.com  –  Embed files from a github repository like a gist

Description

gist-it.appspot.com lets you take a file from your GitHub repository and embed it into any webpage, just like a gist

Syntax highlighting by google-code-prettify

Usage

Take a github file url and prefix it with http://gist-it.appspot.com and embed the result within a <script> tag:

<script src="http://gist-it.appspot.com/http://github.com/$file"></script>
  1. $file should follow the github repository pattern of $user/$repository/raw/master/$path
  2. github/$file is a shorthand for http://github.com/$file and works in the same way

Additional customization is possible by including one or more of the following in the query string:

slice (optional)

Supply a slice parameter to show only a particular portion of the file:

slice=0:-2Show the first line up to and including the second to last line
slice=24:100Show lines 24 through 100
slice=0Show only the first line of the file
footer (optional)

Use the footer parameter to control the appearance of the footer:

footer=no
footer=0		Hide the footer
footer=minimalShow the footer without "This Gist brought to you by gist-it."

Example

function Xyzzy() {
    return "Nothing happens";
}
This Gist by gist-itview rawexample.js

Example Source

<script src="http://gist-it.appspot.com/github/robertkrimen/gist-it-example/blob/master/example.js"></script>

Source

http://github.com/robertkrimen/gist-it

Author

Robert Krimen <robertkrimen@gmail.com>

Chats During Video Making ...
00


Comments

Post a Comment