How to display codes and scripts in your blogger posts

Jun 29, 2010

Want to show some piece of code in your post to your readers?
Normally when you insert some code with HTML tags in your blogger composer , it will be executed and the result will be shown instead of code.

Step 1
Login to your Blogger account and navigate to Layout section. Then go to Edit Html subtab.

Step 2
Find this code ]]></b:skin> in your template code, and above this line add CSS code below and Save your Template now

.codeview {
font-family: Arial, Helvetica, sans-serif;
color: #CC0000;
margin : 15px 35px 15px 15px;
padding : 10px;
clear : both;
list-style-type : none;
border-top : 2px solid #cccccc;
border-right : 2px solid #cccccc;
border-bottom : 2px solid #cccccc;
border-left : 2px solid #cccccc;
background-color: #FFFFFF;
}
.codeview li {
font-size : 13px;
line-height : 24px;
font-family : "Courier New", "MS Sans Serif", sans-serif, serif;
color : #333333;
font-weight : normal;
margin : 0;
padding : 0;
}

Step 3
Whenever you create new posts just include the speical Script ( CSS code , Scripts , etc ) within this div section .

<div class="codeview">
Insert the Special code here
</div>

That it. If you have any problem to implement it, feel free to post a comment, I will help you.

Stop visitors from stealing your blog content

Below is a little trick that will stop your visitors from copying and pasting your blog information. Anyone with experience may know a way around this trick. However it will make it hard enough to discourage them and get them moving on to easier targets.

What to do?
Log in blogger / Dashboard --> Layout --> Add Gadget - scroll down --> HTML/JavaScript --> copy the next code and past in in HTML/JavaScript text box area

<script language="JavaScript">
<!--  
//Disable right mouse click Script
//By Maximus (maximus@nsimail.com) w/ mods by DynamicDrive
//For full source code, visit http://www.dynamicdrive.com  
var message="Function Disabled!";  

///////////////////////////////////
function clickIE4(){
if (event.button==2){
alert(message);
return false;
}
}  
function clickNS4(e){
if (document.layers||document.getElementById&&!document.all){
if (e.which==2||e.which==3){ alert(message); return false;
}
}
}  
if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=clickNS4;
}
else if (document.all&&!document.getElementById){
document.onmousedown=clickIE4;
}  
document.oncontextmenu=new Function("alert(message);return false")  
// -->
</script>

When someone will try to do right click a message will appear “Function disabled” , you can change this message too if you wish.

Enjoy.

Contact Form for Blogge

Blogger does not include the default option to install a widget or a code to generate a contact form through which visitors to your blog to send requests, suggestions, comments or just congratulate you for your work.

However, it is always the option to use external tools.

All these free services can help you to create and install a contact form in Blogger

FormSpring - Works to be included in a post in the HTML editing mode

123 Contact Form - A link to located on 123Contact Form or you can copy and paste your post in order to integrate them directly.

Kontactr - A JavaScript its deal for pasting into your Blogger post.

My Contact Form - The 14 steps to complete, click on "Get HTML" to get code and paste blogger post in HTML mode.

Pow Page Contact Us -Form is not as embedded in the page, but it appears a text link to click on and go to form, best option to insert on the sidebar.

EmailMe Form - You'll find a code to add a link that points to the contact form generated, or click on "Get the HTML Code" and get the code to insert directly into your site.

Need help, just leave a comment.

Using Title Tags to Improve SEO

Until now, the Title Tags generated for each page of your Blogger blog would display the blog title first, then the name of your post. This wasn't so good for SEO (search engine optimization) as this made keywords from your post titles appear after your blog title.

So if you want to improve SEO that is important for your blog, follow step below.

1. Go to Layout > edit HTML in your Blogger dashboard.
2. Search for this tag:

<title><data:blog.pageTitle/></title>

3. Replace(means remove code above and place code below) this tag with the following:

<b:if cond='data:blog.pageType == &quot;index&quot;'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/></title>
</b:if>

4. Save your template.

This work only in XML blogger templates. Also is and a hack for classic bloggers, but as I know noone use classic blogger anymore.

Moving a blog to another email addres

Q1: Can I move my blog from one Gmail account to another?

Q2: I have two blogs that are on separate email addresses ID like to know how to move one to the other? I don't want the blogs combined but managed from the one email account.

Follow steps:

1. Login to Blogger Dashboard.

2. Click Settings on your dashboard --> than click Permissions tab.

3. Under Blog Authors click the ADD AUTHOR button. Copy and paste or type in the email address of the person you wish to invite or that of your second email account and click on Invite.

4. Open your Gmail for that account and check Blogger email [invitation]. Click link and activate it, you will log in blogger.

5. Now log again with your previous gmail account that you made invitation, go to permission and click give admin permission.

6. Now your blog can be managed by 2 email account, you can delete one [old] if you want.

That's it, need help, leave a comment.