Skip to main content

How to integrate code snippets on BlogSpot posts?


Introduction:

Creating code snippets using HTML and CSS is very easy, but for hosted blogs such as Blogger, it is quite difficult to edit the source code of the pages. You can create some custom CSS code to the source code of the page, but today we are going to show the easy process, i.e. using popular source code hosting website 'GIT HUB'.

For example:

Steps:

  1. We will be using GIST of GitHub to make code snippets.
  2. Open up the https://gist.github.com.
  3. You may have to Sign In or Sign Up for a GitHub account.
  4. After sign in to your account, create a new gist by selecting the top right button on the web page.
  5. Type a name for your file and type or paste the source code in the second text area.
  6. That's it, now, create a secret gist or a public gist.
  7. Secret gist means it is not visible to users, but if you give them the link it will be visible.
  8. Copy the embed code.

  9. Paste in the post editor of your blogspot post while in the HTML view.
  10. It will be visible to you when you view you blog, not on the editor.

Conclusion:

Hope you got an idea how to do so! It is quite easy and fun, you don't have to edit the CSS content of your page as well it also shows syntax highlighting.

Comments

Popular posts from this blog

Creating a Web Browser With Integrated Chromium using C#

Final Output Introduction: In this post, we shall start a project to build a C# application integrated with Chromium in Visual Studio. I shall be using Visual Studio Express For Windows Desktop 2013. But the minimum requirements are mentioned below. We shall create a Windows Forms C# project from scratch and integrate Chromium Embedded Framework (CEF) in our application, basic navigation options and much more. Minimum Requirements and Prerequisites: Visual Studio 2012 or Higher that supports NuGet Package Manager. A decent internet connection. Basic Knowledge of C#. Knowlege in using Windows efficiently. Creating A Visual Studio Project: First, create a Visual Studio C# Project through File > New Project > Installed > Visual C# > Windows > Windows Forms . Name the file whatever you want, for example ' Web Browser '. New Project Customising the Form: Now customize the main form by changing its  Properties  like Text to 'Web...

How to start programming with JavaScript? Get Started with JavaScript!

Introduction: JavaScript is of-course a programming language. It can be called the 'programming language of the web' as it is one of the core three technologies for Web Development (other than HTML and CSS ). Before you start programming with JavaScript, you have to know what JavaScript is. See also: Basics of Programming Languages and Introduction to Front End Development . Requirements for this blog post: Minimum knowledge of programming terms: Intermediate . Minimum knowledge of JavaScript: None/Beginner . Some JavaScript Characteristics: JavaScript is a high-level , interpreted , dynamic and weakly-typed programming language. It is an object-oriented language like many high-level programming languages. It is a functional language , here function is considered to be an object. The term Vanilla JavaScipt is often used to refer JavaScript with any external frameworks or libraries. Best Free Resources to get started with JavaScript: After searchi...

Complete Guide to install Firebase CLI (Command Line Interface)

Source: firebase.google.com Introduction: Firebase is a mobile and web application development platform developed by Firebase, Inc. in 2011, then acquired by Google in 2014. It is one of the most popular platforms nowadays for developing Android applications. It is quite easy to, use with documentation for reference included on its website along with examples.  Firebase requires a browser to interact with. But, for advanced application development, it has a Command Line Interface (CLI) called Firebase CLI. It can be installed on your system, and then have to be used with your system's command line tool, such as Command Prompt in Windows, and Terminal in Linux and Mac. Installing in Windows: To install Firebase CLI, just follow the steps below: You must have installed Node.js and npm on your Windows system. To install refer the video below: Then type the following in your Command Prompt to install Firebase CLI: npm install -g firebase-tools That is it. You a...