Skip to main content

How to add Coding box in your blog

In this article, I will tell you about how to add coding box in your blog post. Many of the bloggers write articles on coding like they give coding for a program, giving codes to hack some programs, and writing a technical post but you can't just write coding in your post, you have to write some codes in HTML section and ask the blogger to read them as written text, not in the form of codes.

So, let's learn ho to add coding snippets in your blog post. To do this you have to follow the steps which are mentioned below.

Step 1:- First of all you have to copy the code which is given below in the box. Select the code from the box below and press Ctrl+C to copy it.

<pre style="background: #ffffff; border-width: 0.1em 0.1em 0.1em 0.8em; border: solid gray; line-height: 125%; margin: 0; overflow: auto; width: auto;">
past or enter your code or script here
</pre>

Step 2:- Then go to the HTML section of your post as shown in the picture below.

 How to add Code Snippet in blog


Step 3:- Then paste this code at that place where you want to show your code in your post like I wanted to show my code box above the line digital charcha. So, I will paste the code above the line digital charcha.

How to add Code Snippet in your blog

Step 4:- After pasting the code it will look like this and then you have to remove those letters and paste your code inside your box instead of them.

How to add Code Snippet in your blog

Step 5:- You have to place everywhere in the HTML section of your post where you want to show your code. For example, if you want to show code box at three places then you have to paste the code at all the three places.

Step 6:- Save and Publish your article.

Step 7:-  After publishing your code box will look like this in your post.

How to add Code Snippet in your blog


NOTE:- you can change the background color of the box so that the code will be clearly visible to the viewers by replacing #FFFFFF by #2e4052 in the code, which is shown in Step 1 as shown in the picture. You can replace the white color with any by knowing the color code of that color.

How to add Code Snippet in your blog

Features of this Code Box

  • This code supports scrolling that is there may be a code with a long line, so you can scroll the cost by the bar without cutting the code.
  • Users can easily copy the code present in the code box.
  • this is very customizable you can change the background color, Border color as you like.
I hope you liked our article on how to add coding box in your blog then please share this with your friends on social media platforms like Whatsapp, Instagram, and Facebook.



Comments

Popular posts from this blog

How to add table of content in Blog post

How to add table of content in Blog Post- If you want to categorize your content and put it in a systematic way in your blog post, then you should go for the table of content. Your user can access any particular element of your blog immediately according to his interest.

Let me show you how good Table of Content looks and gives your blog an attractive look.


So let's dive in and learn How to add table of content in Blogger?

Benefits of Table of Content The table of content help you in a lot of ways, it has a lot of benefits as well as it helps you enhance your SEO.  It arranges your data systematically.It enhances your readability.It has a good impact on your user.Gives a free-hand to the user to access your blog easily.It enhances your SEOIt makes the blog content look attractive.
SEO Benefits of Table of Content As we all know that Google always prefers well structured and organized data, then if your blog post contains a table of content and you make your data organized in it, it…

Lockdown 4.0 - Everything you should know

As we all know that for the last 48 days we have been inside our homes because of the lockdown, and everyone is thinking that when all this will end and when we will be able to start our former life back. How many such questions come to our mind in the day, but we also have to admit that after Lockdown 3.0, now we have all stood on the verge of Lockdown 4.0.
We have many questions and thoughts and thoughts in our mind regarding our life, daily routine, and obviously our job like:-

Will Lockdown 4.0 take place or not?If applied, how long can it take?Which people will get relief in this?Which services will remain operational?
Why is Lockdown 4.0 important?
See, it is clear that the lockdown is in the interest of the country if the proper steps are not taken by our government at the right time, then the problem in our country could have increased further, but to a large extent, the situation in our country is under control and in comparison with other countries we are in a much better pos…

Biography of PrithviRaj Chauhan

Prithviraja III, popularly known as Rai Pithora or Prithviraj Chauhan was a king from Chahamana (Chauhan) dynasty. He was one of the greatest Rajput rulers, who controlled many parts of Rajasthan, Delhi, Haryana, Madhya Pradesh, and Uttar Pradesh. His capital was located at Ajayameru, popularly knows as Ajmer. He was one of the great rulers who stood up bravely against the invasion of the Muslim Rulers.

Early in his career, Prithviraj achieved military success against several Hindu kingdoms, most of the famous is the victory against Paramadi king of Chandela. After that, he fought with the Muslim Ruler Muhammad of Ghor from the Ghurid dynasty. His Defeat at Tarain is seen as the main event in the Conquest of India by Islam.

Early Life Rai Pithora was born to King Someshvara and his Queen Karpura Devi in Chahamana. Both he and his brother Hariraja was born in Gujrat. According to an inscription Prithviraja Vijaya, Prithviraj was born on the 12th day of the Jyestha month, which is the se…