ব্লগ পোস্টে কোড বক্স এড করুন খুব সহজেই ।

প্রথম পদ্ধতিঃ

একদম সহজ

here's the simple method, just paste this code on your post editor in Edit HTML tab.

<textarea name="textarea" cols="40" rows="4" wrap="VIRTUAL">
YOUR CODE 
</textarea>

Here's an image on where to post the code:

And here is the result:

YOUR CODE


It's just the simple version, but if you want it Professional Code Box look, follow this second method.


দ্বিতীয় পদ্ধতিঃ

1. Follow this guide on How To Edit Your Blog Template

2. Find(CTRL+F) ]]></b:skin>

3. Add this code ABOVE ]]></b:skin>

.code {
  background:#f5f8fa;
  background-image:url(http://s568.photobucket.com/user/Akil_Ashraful/media/-2084931012_zps8mntixy0.jpg);
  background-repeat:no-repeat;
  border: solid #5C7B90;
  border-width: 1px 1px 1px 20px;
  color: #000000;
  font: 13px 'Courier New', Courier, monospace;
  line-height: 16px;
  margin: 10px 0 10px 10px;
  max-height: 200px;
  min-height: 16px;
  overflow: auto;
  padding: 28px 10px 10px; width: 90%;
}

.code:hover {
  background: #FAFAFA; background-image:url(http://s568.photobucket.com/user/Akil_Ashraful/media/-2084931012_zps8mntixy0.jpg);
  background-repeat:no-repeat;
}

4. Click Save Template

5. Now go to your Dashboard and make a new post on the blog where you added the Professional Code Box.

On HTML tab, just paste this code:

<div class="code">
 YOUR CODE
</div>

(refer to the image above for reference)

Here is the result:

THIS IS THE
RESULT
CALLED
PROFESSIONAL CODE BOX

Note: You cannot see the Professional Code Box on your post editor, so you'll have to save it and view the post from your blog.

আরো পোস্ট দেখুন

Tweet

Written by Akil Ashraful

I am Akil Ashraful. Born in Palash, Narsingdi. I am a blogger, Web designer and also a logo designer.