If you are writing technical blogs, sometimes you have to give some sample programs. Few ways are there to beautify your code snippet one is attaching Gist code into your blogger(How to include your gist code snippet into your blogger). Other turn around is, i am going to explain in this blog post.
I am working on Ruby on Rails, so most of my tech articles based on either Ruby or Rails side only. So if the users are coming to my site, if they are looking any code snippets if language based and highlighted means, its very easy to understand. So that purpose we have make beautify our code snippets. Here is very less steps to follow to make your code as beautify with language specific.
1) Goto Hillite.me website.
2) In "source code" text box, just enter your code which you want to display in your posts.
3) Select "Language" dropdown, which language is for your code snippet.
4) Select "Style" dropdown, which style you want. There is plenty of style options are there. I personally prefer "monokai".
5) Select "Line Numbers" check box if your code snippet with line numbers (Optional only). Otherwise dont select.
6) In CSS text box, just enter the color of border and spacing stuff( Probably you no need to modify anything, default style itself is fine).
7) Yes you are almost done. Just you need to click the button called "Highlight!".
8) You can see Preview immediately. If any further changes you need just modify and click "Highlight!" button again.
9) Copy auto generated code from "HTML" text box. Below is the snapshot i have attached from the website of "Hillite.me" for your reference.
Here is the complete output after you complete above steps.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 | class PostsController < ApplicationController before_action :set_post, only: [:show, :edit, :update, :destroy] def index @posts = Post.all.to_a end def show end def new @post = Post.new end def edit end def create @post = Post.new(post_params) respond_to do |format| if @post.save format.html { redirect_to @post, notice: 'Post was successfully created.' } format.json { render action: 'show', status: :created, location: @post } else format.html { render action: 'new' } format.json { render json: @post.errors, status: :unprocessable_entity } end end end def update respond_to do |format| if @post.update(post_params) format.html { redirect_to @post, notice: 'Post was successfully updated.' } format.json { head :no_content } else format.html { render action: 'edit' } format.json { render json: @post.errors, status: :unprocessable_entity } end end end def destroy @post.destroy respond_to do |format| format.html { redirect_to posts_url } format.json { head :no_content } end end private def set_post @post = Post.find(params[:id]) end def post_params params.require(:post).permit(:title, :description) end end |
