Tweak My Blogger

WELCOME To Tweak My Blogger!!!

2013-05-25T12:35:00.000-07:00

This site contains some helpful tricks and tips I picked up on how to use Blogger.

I am a self taught programmer with knowledge in HTML, and CSS. I am still learning a few other coding languages and would like to be able to get more tweaks up on them as well. Hopefully you will be able to find what your looking for in this blog. I will always be more then happy to answer any questions or concerns with my site or Blogger to the best of my knowledge.

This site was originally created for my personal use so I could refer back to when needed. But with all the ideas I had I ended up opening this site to the public. I try to explain things in simple and understandable terms so everyone can understand them.

I hope the articles on this site will be as helpful to you as they are for me. I try to update and post new articles everyday. Join me with the followers gadget in the sidebar and get instant updates and tweaks as I create them.

If you know anything that we don't already have up that might be useful.
Please don't hesitate to Contact Us

You can also find additional help at the Blogger Help Forums

Opening External Links In New Window

2011-09-17T13:26:00.000-07:00

Their are a few codes out their that will open links in a new window but for most people they just want external links to be the target. With this script below you can open external links in a new window without implanting multiple codes in every link. This will only work if the viewer has JavaScript enabled!

Place this code just under the <head> tag in your template.

`<script type='text/javascript'> //<![CDATA[ function externalLinks() { if (!document.getElementsByTagName) return; var anchors = document.getElementsByTagName("a"); for (var i=anchors.length-1; i>=0; i--) { var anchor = anchors[i]; if (anchor.href && anchor.href.substr(0,Number) != "Homepage URL") anchor.target = "_blank"; } } window.onload = externalLinks; //]]> </script>`

The red text needs to be the link to your homepage (exactly).

The blue text should be the number of the characters (including http:// and .com) that you just placed in for the red text.

Forgot Login Info to Access Blog

2011-06-25T16:00:00.000-07:00

In many cases people may forget their login info to access their blogs. The problem is their log in info for their blog is also the login info for the email account use to make the blog. This makes recovering the password to their email pointless if they can not access their email. Their is a solution to this!

If you post your issue in Blogger Help Forums: Login Issues stating you do not remember the email used to create your blog. You may run across a Top Contributor who is willing to escalate your issue to a Google employee. Sometimes a Google employee is willing to give you a hint to the email used. They can not provide the actual email address its self because they are bound by law to protect Blogger users privacy and security.

Here is a example of a hint you might get from a Google employee.

mike*****@gmail.com

They will block (*stars*)out some letters for the email in which you will have to figure out.

If you are able to remember the email address used from the hint you can then go to the sign in for the email. You still can not access the email because you do not have the password however, emails tend to have security questions and or secondary emails set up when creating a email address. This gives you a backdoor into your forgotten email.

If you are able to gain access into the forgotten email you can then reset the password from Blogger sign in to that email. This will allow you access into your blog.

Password Lock For Certain Post

2011-06-13T03:55:00.000-07:00

With this little script you can lock post of your choosing so only people who know the password can view them. Keep in mind this will not stop anyone who is good with computers. So don't go saving your bank ATM pin on a post and expect this to protect it.

Just paste this script in a post in Edit HTML mode.

`<script type="text/javascript"> var password; var pass1 = "PASSWORD"; password=prompt("Please enter your password to veiw this page!:",""); if (password==pass1) { window.location= "LINK TO BE OPEN IF PASSWORD IS CORRECT"; } else { window.location= "LINK TO BE OPEN IF PASSWORD IS NOT CORRECT"; } </script>`

Red is the password needed to be typed to access the page.
Green is the link of the post you are using this password script on.
Orange is the page to be taken to if the password entry is incorrect. This can be your homepage or a page of your choosing.

You can Encrypt the code for extra security.

Note: You will need to change the post date of the post you place this code in or it will end up on your homepage and the password lock will bleed through. The idea is to make this the oldest post in your blog so no one will find it. If your blog only has a few post and they are all displaying on the homepage then you can not use this tweak because it will lock all your post. This is more for those pre-established blogs who want to hide a post in the background.

Referral Link Spamming & Scamming

2011-06-13T02:32:00.000-07:00

With the release of Blogger Stats, spammers now have yet another way to spam and advertise their site. This tactic has been around for sometime but now that Blogger has stats built in it has become more proficient.

"Why do I have porn sites linking to my site?"

These words echo the forums as users can't figure out why their Christian blog is being linked to by a such a site. In reality their blog link is not on the porn site at all. The owner of the porn site is spamming you through referral linking.

"Why, what do they gain by doing this you may ask."

As you look though your stats and see this unknown site referring to your site you want to click to see what this site is and if your link is really on it. Now you just gave this unknown site a page view and the spammer wins with free advertisement.

In some cases these spammers may even lead you to a site which can be harmful to your browser or computers. Most anti-virus now days will show a "ok" or "warning" symbol next to sites within Google search before you click on them. This allows us to stay away from sites that maybe harmful to our computers. But with referral linking we can be tricked into visiting these sites unknowingly.

Be careful of the referral link spammers when viewing your stats! You cant stop them from doing this but you can be prepared.

We been seeing some users asking for a IP blocker to blacklist the spammers but I must say this will do no good. Spammers use proxy sites a lot of the time which will get around IP blockers. Also satellite internet IP address changes all the time. The end result in adding a IP blocker tool to Blogger stats would be inaccurate stats and you may end up blocking people who you do not wish to.

What Type Of Blog Should I Make?

2011-06-12T06:34:00.000-07:00

The first thing you need to do when creating a blog is to know what you want to write about. This maybe the most important decision of all because your blog title and theme is based on your blog genre.

Ask yourself "What is the purpose of my blog?". Their are 3 main types of blogs which are random, merchant and category.

A random blog might be a blog about ones life or daily experience. These blogs will draw in friends and random interest viewers. I have found these blogs to generate less traffic then other types of blogs. Just as the articles found in these blog would be random the blog name and theme would be as well. These blogs generally have no aim or goals which makes them a good starter blog. These blogs don't really need a custom domain.

Merchant blogs are blogs that try to sale products or services to its viewers. In someways these are also a category blog because they are generally aimed at a certain category of products. Randomly putting items for sale on your merchant blog may not be the best idea because you will be unable to target a single type of traffic. This will result in a conflict of interest when trying to design your blog. Your likely not going to create the next Amazon on Blogger so I suggest sticking to a single category and target your viewers with your theme.

Category blogs are aimed at a single subject such as this one. This blog is aimed at Blogger help and will only appeal to people who use Blogger. Although this blog contains multiple category's, all the category's are related to Blogger. Rather your blog is about Blogger, football, music, or UFO's its still a category blog. The title and theme of the blog should be aimed at drawing in traffic that will be enticed by that category. Some category's maybe more likely to draw in a different race or sex then others. A blog about football is more likely to draw in male viewers so its probably not a good idea for the theme to be pink and purple.

No matter what type of blog you decide on make you will need to have quality content to draw in the crowds. Their is no such thing as getting rich fast so don't fall for the idea that you will retire on a blogs income.

Make Youtube Videos Autoplay

2011-05-29T05:30:00.000-07:00

Youtube videos used to have a option to set autoplay on them but was removed not long after the Rick Roll videos started going around. Rather that was the reason or not I do not know but their is a way to make the video autoplay on your own.

Here is a example of what a youtube embedded video might look like.

`<iframe width="560" height="349" src="VIDEO SOURCE URL" frameborder="0" allowfullscreen></iframe>`

To make the video autoplay you just need to add ?autoplay=1 after the VIDEO SOURCE URL.

Example:

`<iframe width="560" height="349" src="http://www.youtube.com/embed/4P0Rbe1ASuQ?autoplay=1" frameborder="0" allowfullscreen></iframe>`

Redirect Script

2011-04-24T11:49:00.000-07:00

With this script you can redirect visitors to a different location. You need to be careful how you use this script because it can cause your blog to be locked by the spam detection bot.

I do not recommend redirecting people to a different blog or domain other then the one you are using the script on. It is not allowed to redirect people to a different domain without their consent. Do not put this script on your homepage either. The spam detection bot works in strange ways and if this script is on your homepage it may view it as a spam blog. The reason is many spam sites use tactics similar to that to get more traffic. As a example someone could make 10 blogs and add this script to them redirecting them to one blog which redirect them to another and creates a big loop. This would allow them to get multiple impressions on their ads. Well at least until Google figures it out then their ad account will be deleted and blogs locked for spam.

Really this script should only be used with a action such as after someone sends you a email or something through a contact option which will redirect them to a thank you screen or back to the homepage. Another use for this is for site maintenance so you can temporarily direct users to a post that says we are under maintenance or something to that effect.

However you choose to use it is up to you but I am not responsible for any problems it may cause.

Their are 2 different scripts you can use. The first one is a little safer since it does not cause a loop issue when you hit the back button.

`<script type="text/JavaScript"> location.replace('http://www.example.com/'); </script>`

This next one has a time delay on it which will redirect in a set amount of time. This however can cause problems if you have ads because if a users is to hit the back button it would keep redirecting them which goes against most ad policy's. But since you are using it with a set amount of time it will not be so much of a loop and give the user time to navigate without being redirected instantly.

`<script type="text/JavaScript"> setTimeout("location.href = 'http://www.example.com/';",5*1000); </script>`

The red number is the number of seconds till the script is activated. Its a little bit of math involved because the 1000 is milliseconds and their are 1000 milliseconds in a single second. All I am doing is 5x1000 which equals 5000 milliseconds or 5 seconds.

Make sure to replace the URL (blue) with one of your own for both of these codes.

Marquee Scrolling Gadgets

2011-04-24T08:12:00.000-07:00

Lets spice up your blog with scrolling gadgets. This is a really nice trick that is pretty simple to do.

1. First you need to locate the widget/gadget ID of the gadget you want to make scroll.

2. Go to your Edit HTML page of your template and Expand Template Widgets.

3. Click Ctrl+F to activate the browser find bar and input your Widget/Gadget ID you just found in step 1.

(This will locate the code in your Edit HTML page.)

You should see something similar to what I have below with the blue highlighted.

`<b:widget id='Widget/GadgetID' locked='false' title='TITLE' type='LinkList'> <b:includable id='main'> <b:if cond='data:title'><h2><data:title/></h2></b:if> <marquee direction='down'><div class='widget-content'> <ul> <b:loop values='data:links' var='link'> <li><a expr:href='data:link.target'><data:link.name/></a></li> </b:loop> </ul> <b:include name='quickedit'/> </div></marquee> </b:includable> </b:widget>`

4.The red is the marquee tag I am adding to make it scroll. Refer to HTML marquee tags for help on what marquee tag you should use.

The rule is to add a marquee tag before the widget content div and after the closing widget content div as I have done above.

HTML Marquee Tag

2011-04-24T07:52:00.000-07:00

Marquee tag is used to make objects scroll across the page. In these examples below I will use various ways to use these tags.

This text scrolls right...

As You can see the text above scrolls right. The code below is what I used to implement this behavior.

`<marquee direction="right">This text scrolls right...</marquee>`

All you need to do is change the text in blue to the direction you want the text to scroll. (up, down, right, left)

This text moves fast

We can adjust the speed of the text by using a code like this below.

`<marquee scrollamount="30">This text moves fast</marquee>`

Change the number in red to adjust the speed of the text.

This text moves slow

`<marquee scrolldelay="300">This text moves slow</marquee>`

Change the number in red to adjust the speed.

This text bounces

To make the text bounce use a code like this below.

`<marquee behavior="alternate">This text bounces</marquee>`

On this next one I will set the allowed space of the marquee

This text is set to 200 width

`<marquee width="200">This text is set to 200 width</marquee>`

Adjust the width to your liking.

In this next on I am going to combined a few of these together.

cool text

Here is the code I am using for the above text

`<marquee behavior="alternate" width="300" scrollamount="30">cool text</marquee>`

You can find more on Marquee tags at HTML marquee

Browser Conditions For Internet Explorer

2011-02-18T11:53:00.000-08:00

Some have probably noticed Internet Explorer tends to be in a category of its own when it comes to design. Coding sometimes does not get rendered properly as it would in other browsers such as Firefox or Chrome, thus causing a different look or design. With this tweak you can set coding to only be used by Internet Explorer on Windows computers.

Unfortunately this is not one of those copy and paste techniques to fix everything. You will need to have a great deal of understanding in CSS coding to correct the mistakes IE renders. I can not go over every possible fix nor do I know every possible fix.

To use this tweak you need to go to your Edit HTML page.

Click Ctrl +F for the browser find/search bar to pop up.

Input </head> in the find/search bar.

Directly above the </head> tag place this code below.

` </style> <![endif]-->`

Replace the orange line with your CSS coding to be rendered only in Internet Explorer.

You can also be more specific as in what version of IE (IE5.5, IE6, IE7, eg) to use as shown below.

` </style> <![endif]-->`

Duplicate Blog Post or Headers

2011-02-14T11:07:00.000-08:00

We been seeing quite a few cases where users report having double blog post or headers elements on their blog. If you are seeing this problem then you probably found out its not so easy to remove the duplicate. I believe this is causes by a unknown error which is normally found when changing template or using 3rd party templates.

To remove the issue you need to go to Design--> Edit HTML.

Once on the Edit HTML page click Ctrl +F.

In the browser find/search bar that pops up input one of these below.

For Duplicate Blog Post.

`Blog2`

For Duplicate Headers.

`Header2`

You should see something like this below depending on what you search for.

`<b:widget id='Blog2' locked='true' title='Blog Posts' type='Blog'/>`

`<b:widget id='Header2' locked='true' title='YOUR TITLE (Header)' type='Header'/>`

Remove the full line as show above and save. Once saved you will be prompted "Your template does not contain the widget". Just click the delete option and your done.

Post Title Before Blog Title

2011-02-10T08:40:00.000-08:00

This tweak has been around for years and is said to help your blog in search engines. I believe this is a debatable subject of opinion in which I choose to keep my blog title first. But I believe this all has to do with the titles of your blog and post to decide which is better for you.

For an example my blog is titled "Tweak My Blogger" which is a catchy name that uses 3 words and would commonly be used in Google when looking for Blogger help. So in cases like this it might be better to leave my blog title first. But if you have a blog title like "Jane Science" and your blog is about earth space science, then it might be better to place the post title first. Jane's blog post might be titled something like "Saturn's Rings" or "Jupiter's Red Spot". People will commonly input these in Google search over "Jane Science".

Google will only display a maximum of 70 characters for the titles in the search results. So if you have a long post title or blog title then having your post title displaying first might be better. So I will show you some examples of how this would work below.

Lets say I have my post titled as...

Hundred Ways to Tweak Your Blog For Search Engine Optimization

This is 63 characters and when the blog title is added it will be 80 characters. So Google will not display this full title correctly but instead display as...

Tweak My Blogger: Hundred Ways to Tweak Your Blog For Search Engine ...

But if we were to add the tweak mention later, this post would display as...

Hundred Ways to Tweak Your Blog For Search Engine Optimization | Tweak ...

As you can see the blog title is now cut off which is not a good thing.

Now that you understand the purpose of this tweak I will explain how to do this tweak.

First you need to go to Design--> Edit HTML

At the top of your template you should see a code similar to this below.

<head>
<b:include data='blog' name='all-head-content'/>
<title><data:blog.pageTitle/></title>

Replace the red line with this code below.

<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.pageTitle/></title>
<b:else/>
<title><data:blog.pageName/> | <data:blog.title/></title>
</b:if>

You can change that blue line to any thing you want. Some people prefer the (~) symbol over the simple line (|)

After that your done and all you have to do is wait on the search engine to pick it up which can take a week or so.

Dynamic Gadget Content

2011-02-05T17:24:00.000-08:00

In this tweak I will teach you how to dictate the content within a gadget depending on the page you are viewing the gadget on. This method will only work with HTML/JavaScript and Text Gadgets. This can get a little confusion depending on how many variables of content you want to use.

I understand this is a complicated tweak so feel free to leave questions at the bottom.

To start off you first need to add your gadget and content. If you are using a Text Gadget make sure your in Edit HTML mode within the gadget. In order to make this work we need to add the content into div element.

I am going to start with two variables so it will be easier to understand.

Example:

`<div class="hide1"> <--content to display--> </div> <div class="hide2"> <--content to display--> </div>`

The blue text is your class ID which will change between each variable of content you are using.
The red text is the content its self which can range from simple text to images or flash content. Pretty much anything you can think of can go here.

Make note of each class ID because you will need to call for it later.

Save your gadget and go to the Edit HTML page where you can find your template coding.

I recommend doing this next step in a notepad for editing purposes.

We need to build our conditional tag coding to dictate the content to display and on what pages to display on. You will need to read up on conditional tags in order to do this.

Now lets say I want the content in the class ID "hide1" to display on the homepage only.

`<b:if cond='data:blog.url != "HomePage URL"'> <style> .hide1 { display: none; } </style> </b:if>`

The orange text would be my homepage URL in which you will need to replace with yours.
The blue text is where I called on the hide1 element.
The green text is me telling the content in hide1 to hide or not to display.

This conditional code above is telling the hide1 content not to display if the page is not the homepage URL.

Now we need to dictate the content in div class hide2. Lets say I want this content to display only on the post pages.

`<b:if cond='data:blog.pageType != "item"'> <style> .hide2 { display: none; } </style> </b:if>`

In this case the orange text does not change because item is calls on all post pages.
Notice I am now calling on the hide2 element with the blue text.

The conditional code above is telling the hide2 to hide if the page is not a post page. This means the content will be hidden on Static pages and the Homepage.

So when we put these two codes together it will look like this

`<b:if cond='data:blog.url != "www.tweakmyblogger.com"'> <style> .hide1 { display: none; } </style> </b:if> <b:if cond='data:blog.pageType != "item"'> <style> .hide2 { display: none; } </style> </b:if>`

Now all we need to do is place this code in the right section of your template. To do this you should be on the Edit HTML page with your template coding and then click Ctrl+F which will open the browser find/search bar.

In the find/search bar input </head>

This will locate the </head> tag within you template coding.
Directly above the </head> tag place the conditional code you just made and save.

Provided you did everything correctly your gadget content will now be dynamic to the page in which you view it on.

Multi Colored Links When Hovering

2011-02-02T20:18:00.000-08:00

With this tweak you can create multi colored links when hovering over the hyperlinked text.

Design--> Edit HTML--> Click Ctrl+F

A find/search bar will pop up and in the box you will input </head>

This will locate the </head> tag in your template. Just above the </head> tag place this code below.

<script type='text/javascript'> //<![CDATA[ var rate = 20; if (document.getElementById) window.onerror=new Function("return true") var objActive; // The object which event occured in var act = 0; // Flag during the action var elmH = 0; // Hue var elmS = 128; // Saturation var elmV = 255; // Value var clrOrg; // A color before the change var TimerID; // Timer ID if (document.all) { document.onmouseover = doRainbowAnchor; document.onmouseout = stopRainbowAnchor; } else if (document.getElementById) { document.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT); document.onmouseover = Mozilla_doRainbowAnchor; document.onmouseout = Mozilla_stopRainbowAnchor; } function doRainbow(obj) { if (act == 0) { act = 1; if (obj) objActive = obj; else objActive = event.srcElement; clrOrg = objActive.style.color; TimerID = setInterval("ChangeColor()",100); } } function stopRainbow() { if (act) { objActive.style.color = clrOrg; clearInterval(TimerID); act = 0; } } function doRainbowAnchor() { if (act == 0) { var obj = event.srcElement; while (obj.tagName != 'A' && obj.tagName != 'BODY') { obj = obj.parentElement; if (obj.tagName == 'A' || obj.tagName == 'BODY') break; } if (obj.tagName == 'A' && obj.href != '') { objActive = obj; act = 1; clrOrg = objActive.style.color; TimerID = setInterval("ChangeColor()",100); } } } function stopRainbowAnchor() { if (act) { if (objActive.tagName == 'A') { objActive.style.color = clrOrg; clearInterval(TimerID); act = 0; } } } function Mozilla_doRainbowAnchor(e) { if (act == 0) { obj = e.target; while (obj.nodeName != 'A' && obj.nodeName != 'BODY') { obj = obj.parentNode; if (obj.nodeName == 'A' || obj.nodeName == 'BODY') break; } if (obj.nodeName == 'A' && obj.href != '') { objActive = obj; act = 1; clrOrg = obj.style.color; TimerID = setInterval("ChangeColor()",100); } } } function Mozilla_stopRainbowAnchor(e) { if (act) { if (objActive.nodeName == 'A') { objActive.style.color = clrOrg; clearInterval(TimerID); act = 0; } } } function ChangeColor() { objActive.style.color = makeColor(); } function makeColor() { // Don't you think Color Gamut to look like Rainbow? // HSVtoRGB if (elmS == 0) { elmR = elmV; elmG = elmV; elmB = elmV; } else { t1 = elmV; t2 = (255 - elmS) * elmV / 255; t3 = elmH % 60; t3 = (t1 - t2) * t3 / 60; if (elmH < 60) { elmR = t1; elmB = t2; elmG = t2 + t3; } else if (elmH < 120) { elmG = t1; elmB = t2; elmR = t1 - t3; } else if (elmH < 180) { elmG = t1; elmR = t2; elmB = t2 + t3; } else if (elmH < 240) { elmB = t1; elmR = t2; elmG = t1 - t3; } else if (elmH < 300) { elmB = t1; elmG = t2; elmR = t2 + t3; } else if (elmH < 360) { elmR = t1; elmG = t2; elmB = t1 - t3; } else { elmR = 0; elmG = 0; elmB = 0; } } elmR = Math.floor(elmR).toString(16); elmG = Math.floor(elmG).toString(16); elmB = Math.floor(elmB).toString(16); if (elmR.length == 1) elmR = "0" + elmR; if (elmG.length == 1) elmG = "0" + elmG; if (elmB.length == 1) elmB = "0" + elmB; elmH = elmH + rate; if (elmH >= 360) elmH = 0; return '#' + elmR + elmG + elmB; } //]]> </script>

Add Content Warning to Single Post.

2011-02-02T16:40:00.000-08:00

Before using this script please read everything below.

Blogger has a default content warning that will make visitors confirm before entering your blog. If this setting is applied it will be set to every post in your blog. Sometimes you may only have a single post with adult content which seems pointless to add the content warning to every page making you lose traffic because of it. Well with this script below you can avoid that problem.

This does not negate the rules of Blogger to enforce the content warning. In other words even if you add this script to your post it does not mean Blogger wont enforce a content warning on your blog anyways. This is not a replacement for the Blogger content warning and if you use this script you do so at your own risk. If Blogger does enforce the content warning on your blog then you will not be able to remove it on your own. To remove it you will have to go through the Blogger Help Forums after you have removed the post containing the mature content.

Their are a few ways you can do this but none of them are full proof. For an example this will not work for users who have JavaScript disabled. Also in order for this script to work the page must be loaded so they will still have a gleams of the adult content before the script it activated.

To use this script its best that you do not put this post on your homepage. You should change the post dates so this post will not display on your homepage. Otherwise this script will display when your homepage is loaded which is bad because it will be a endless loop because the script will activate again when the homepage is loaded.

To add this script to your blog just paste this script into your post in Edit HTML mode.

`<script type="text/javascript"> { var r=confirm("The page you are about to view may contain content only suitable for adults. Press Ok to continue or Cancel to be redirected to the homepage."); if (r==false) { document.location.href="PAGE TO BE REDIRECTED TO"; } } </script>`

You can edit the red text so the message displayed is different if need be.
The orange text is the link or page your visitors will be directed to if they select cancel. You can even make a custom page for them to be directed to if need be.

Different Design on Different Browsers

2011-02-01T08:57:00.000-08:00

If you have every looked at your blog in different browsers then you would notice your design, font and, colors may look different between browsers. This is a problem with no escape which makes web designing a lot more difficult.

Everyday engineers from World Wide Web Consortium (W3C) are creating and implementing new coding for the web. When new coding is created it maybe marked as draft (testing) for months and even years before its made standard in all browsers. When W3 marks coding as standard it will then be enforced that all browsers support the coding. If browsers do not support the coding it will render as default by browsers.

Something many people are not aware of is coding has different types of languages. Many of you maybe familiar or at least heard of HTML. But what you may not know is HTML has many types among its self. HTML has been around since the late 80's and was just called HTML at that time. Later on the idea of HTML was added onto and in November 24, 1995 HTML 2.0 was released. Currently we are on HTML 4.01 with HTML 5 in draft. HTML 5 should be made standard in the following months of 2011. This is all just a brief history on HTML and as I said their are many other types of coding languages such as CSS, JavaScript, Java, PHP, XML, eg. Each of these have their own standards and draft (levels) coding as well.

Why does this cause compatibility issues?

Some browsers such as Firefox and Chrome will implement draft coding even know its not made standard yet. Then browsers such as Internet Explorer stick to only using standard coding. So for an example if you were to use coding to make the corners round or to display shadowing in your template which is CSS 3 and HTML 5. You would run into browser compatibility issues when using Internet Explorer 8 (or earlier) because those types of coding are still in draft. You can use Internet Explorer Conditions as a cure for many alignment issues.

Even when using coding that is standard does not mean it will look the same between browsers. This is another issues that you may see on your blog. each browser is designed by different engineers which use different methods for the browser to interpret and render the coding. So even know the language of coding is supported in your browser it does not mean it will look the same in a different browser. With this problem you may see a color display darker or lighter between browsers or some font may look different although its the same font.

The font brings me to another issues which follows the rules of coding in draft. Some font may work fine on Firefox while Internet Explorer renders as New Times Roman (default browser font). This is because the font is still in draft which means Internet Explorer does not know how to render the font. So when something can not be rendered it will use the browser default instead.

We see another problem with font which is font packages on your computer.Windows 7 will have the most current font packages which Windows XP may not have installed on it. This all depends on the updated you have received on your computer. You can always go onto the Microsoft or Apple site and find font packages for your computer.

Pop Up Alert Box

2011-01-30T06:55:00.000-08:00

To make a pop up alert box within your blog post just add this code below in Edit HTML mode within the Blogger Post Editor.

`<script type="text/javascript"> alert("YOUR TEXT"); </script>`

Change the red text to your liking.

You can even display additional boxes once the first box is closed.

Example:

`<script type="text/javascript"> alert("YOUR TEXT FOR BOX 1"); alert("YOUR TEXT FOR BOX 2"); </script>`

Add as many as you see fit but keep in mind alert boxes can annoy your visitors.

Hyperlink Blog Title

2011-01-27T17:56:00.000-08:00

When you upload a header image to your blog it will automatically hyperlink the image to your homepage. But if you are not using a image then your title will just remain as text. This tweak below will show you how to get around this problem.

1. Go to Design--> Edit HTML.
2. Click Ctrl+F for the browser Find/Search bar to pop up.
3. Input one of these codes below.

Newer Templates:

`<div class='header-outer'>`

Older Templates:

`<div id='header-wrapper'>`

`<div id='header'>`

4. Change the code as I have below.

Newer Templates:

`<div class='header-outer' onclick='location.href = "YOUR LINK URL"'>`

Older Templates:

`<div id='header-wrapper' onclick='location.href = "YOUR LINK URL"'>`

`<div id='header' onclick='location.href = "YOUR LINK URL"'>`

5. Replace the red text with the link you want to be directed to.

Make note of the ID or Class that you just changed.

6. Scroll up until you see this code below.

`]]></b:skin>`

7. Just above this code, place one of these codes below. Depending on the code your found in section 3 will determine what code you will use below.

Newer Templates:

`.header-outer { cursor: pointer;}`

Older Templates:

`#header-wrapper { cursor: pointer;}`

`#header { cursor: pointer;}`

You can choose from different cursors, just replace the blue print with the cursor value from the link in this sentence.

8. Save and you done.

Duplicate Blog Post Element

2011-01-08T14:57:00.000-08:00

A number of Blogger users have reported have duplicate or multiple blog post elements within their template. I have yet to fully understand why this occurrence has happen with some users.

In most cases you can remove the second blog post element by going to...

Design--> Edit HTML--> Ctrl+F

In the Find/Text bar that pops up input Blog2

You should see something like this below with the Blog2 highlighted.

`<b:widget id='Blog2' locked='true' title='Blog Posts' type='Blog'/>`

Remove the full line above and save your template.

Classification of "Spam" Blogs

2010-12-21T10:11:00.000-08:00

Even if this post does not seem to relate to you I recommend reading it anyways before you end up being one of those who it does relate to.

Some maybe reading this article to keep their blogs from being marked as spam, and others maybe reading this because their blog was already marked as spam. But for everyone of you who has a legitimate reason to be reading this article, their is someone else reading this article with intentions only to use this info to manipulate Google's Anti-spam system. Those type of people are hurting everyone and don't care the least bit. So for everyone who has had their blogs falsely marked as spam you can stop blaming Blogger and start blame the people who are trying to manipulate Google. The more they manipulate, the more blogs we will see falsely marked as spam.

History of Spam

We see quite a few Blogger users everyday who's blogs are being classified as spam. Many of these users do not get their blog back even after they appeal to Blogger (If your blog is truly spam). In many cases the users do not understand why their blog has been marked as spam. By our terms the word the word "Spam" is commonly referred to as duplicating something many times. But in Blogger's terms it could mean a whole lot more.

The most common types of blogs that are classified as spam are blogs titled "Get Money Fast" or "Earn Money Now". But in fact it has nothing to do with the title of the blog but the common methods used by these types of blogs. Most sites that contain articles about how to get rich fast are scams which are only getting their money from the traffic entering the blog. Their is no such thing as getting rich fast in the real world and if you think their is your more then welcome to browser through the endless list of scams online. But beware and don't forget that company's are supposed to pay you to work not the other way around. Don't give money to these sites that claim to send you a package on how to make money fast.

Google's Anti-spam detection system will target these type of sites. While simple having your blog titled by a similar name is not enough to get your blog removed, it is enough to be put in the cross-hairs.

Why does Google target these sites?

As I said these sites are scams and we could do without them, but the content on these sites are often illegal. Teaching people to manipulate their ad payouts and Google search is not allowed. Any site caught doing so will be removed. The more people that try to manipulate ad payout, the more it hurts us all. Advertisers pay with hopes that their ads will bring in traffic and they will sell more merchandise. If people are manipulating this, it cost the advertisers more money in which they are not getting any return. This results in advertisers not wanting to pay as much on adverting, which hurts the economy and everyone who uses ads on their site. If advertisers don't make money then we wont either.

Another problem found on "Get Rich Quick" sites is link affiliation networks. We see this quite often and it is simple another method to manipulate the ad payout. Sites that link from one site to another for no apparent reasons other then profit gain. The visitor is reading a article only to be linked to another site with a similar article which then links to another site with the same. Each of these sites containing ads which gives (I say "gives and not "earn" for a reason) each owner a profit every time someone enters. Their is no real point in this other then to gain profit. So when Google finds this it will travel right up the same path the visitors are traveling and remove each site.

We can usually tell when this is the reason because the user reporting their blog being marked as spam has multiple blogs marked as spam as well. Meaning they made a link affiliation network with their own blogs. Visitors enter on Blog1 only to be sent to Blog2 which will send them to another blog doing the same thing. Linking to or being link to a blog that is using this method could result in your blog being marked as spam as well.

Another type of link affiliation is link farms, these type of sites do not contain any real content of their own. These sites have post that are full of post that contain links to other sites. This is not allowed because it manipulate backlinks and search results. No one wants to come to a site with no content only to be sent to other sites. Some visitors may find these sites useful because it helps them find sites they are looking for. But the fact they cant find find what they are looking for can is sometimes caused because of the link farm site. They clog up Google search making it harder for everyone to find what they want. These blogs are also a problem because the ads hosted on these sites are only getting viewed for a brief moment before the user is sent to another site. The bounce rate of these sites are extremely high and sends up a red flag to Google that something is wrong.

Last but not least we come to the reason blogs are marked as spam that you maybe aware of. Blogs that copy or duplicate content to multiple post or other blogs. These blogs may or may not be owned by the same person but its all the same. Your duplicating content which clogs up the search engines making it harder for people to find what they are looking for. If I create 10 blogs with the same articles then I just put a monopoly on that article. Now when someone searches for something about that topic they will not pull up results of different articles but a list of the same article. The smart web surfer will always read more then one article about a subject to verify that the article is true. (Getting a second opinion) Well if content is duplicated then you might as well say "So much for the second opinion!".

There are other reasons your blog could be marked as spam that many not be as easily noticeable. The fact is Google is always adding more reasons because people keep finding more ways to cheat. Google does not have any official article written on what is and what is not spam for that simple reason. If they tell us what is, then spammers will just find loop holes to get around it. As the internet becomes more advanced, so will the spammers tactics.

PayPal On Blogger

2010-12-18T14:49:00.000-08:00

Paypal offers many types of services allowing users to to turn their sites into a store if needed. In this post I will go over how to use a bunch of their options with Blogger. I will not be going over any of their advanced options for Paypal members only.

Scroll down for the Buy Now button.

Donate Button:

With this option you can add a donate button to your site allowing visitors who appreciate you blog to donate money to you.

1.) Sign into your Paypal account

2.) Go to Merchant Services

3.) Select the Donate button from the Create Buttons list.

4.) Set up the specs for your button.

Their are many options you can use to set up your button and most of these are self explanatory. For most these options you have no need for because its just a simple donate button.

5.) Click the Save option at the bottom when your done and it should take you to a output code for your button.

6.) Sign into Blogger

The best place for a donate button would be in a gadgets rather then in a post. The more people who see the button the better chance you have to get a donation. So hiding it in a post or page will not do any good.

7.) Go to Design--> Page Elements--> Click Add Gadget--> Add a HTML/Javascript gadget

8.) Paste the Paypal code into the gadget and save it.

Buy Now Button:

The Buy Now button has many uses and options to choose from. The options you choose for this button all depends on your blog and items your selling.

1.) Sign into your Paypal account

2.) Go to Merchant Services

3.) Select the Buy Now button from the Create Buttons list.

4.) Set up the specs for the Buy Now Button.

I will try to go over the specs in this section and when to use them as best I can below.

Item name:
This is very important so you can identify what item the user bought. Without this field you may find your button completely useless.

Item ID:
This is a addition to the Item name option and will help you track and bill items easily. Starting off you may not find much need for this but once you start selling items everyday you will be glad you added this option.

Price:
This is the base price of the item without shipping or tax included. You will not need to add the price in this field if you are using a drop down list.

I am going to skip over the next section for later and more on to the sections below them.

Shipping:
This is how much is going to be added on to the item for your cost to ship the item to the buyer. Sometimes you may just want to leave this blank and include the cost in the Price field.

Example:
Price is $10.00 USD
Shipping is $2.00 USD
Total Cost is $12.00 USD

Tax:
I would recommend not using this option and just leaving it blank. It will be easier on you and the buyer for you just to round up the price to a even number instead of trying to add a tax percent into the item. If you do decide to use this option make sure to look up what the exact tax rate for your area.

The next options are for customize buttons. You will use these depending on the item your selling.

Add drop-down menu with price/option:
This is good for when you have items of the same type and need to use different prices for them. A good example would be if you were selling jewelry and have them in gold and silver.

Example:
(Please don't buy this item, its just a example and I do not have theis item or are the for sell on this site)

Add drop-down menu:
This is good for items such as clothing when you need to buyer to pick a size or color but the price for different sizes or colors are the same.

Example:
(Please don't buy this item, its just a example and I do not have this item or are the for sell on this site)

Add Text Field:
This is used when the buyer may need to add in custom details to the item they are buying. This is used mostly with engraved items and such.

Example:
(Please don't buy this item, its just a example and I do not have this item or are the for sell on this site)

5.) After you have set up the button to the correct specs you will need to save it and it will generate a code to use.

6.) On Blogger in the post where you have the details for this item you just set up, you will need to place the button code. Make sure you are in Edit HTML mode in the post editor and not Compose when pasting the code in. Also make sure to paste the code in the correct place on your post. You don't want to confuse your buyers with having the wrong button under the wrong item.

Remember the Buy Now button is not a one time thing and you must make this button for each item you are selling. If you are selling something like post cards or images and the price for all of them are the same you maybe able to make just one button and use the Add drop-down menu: button in place of multiple buttons

Add Your Site To Search Engines

2010-12-13T07:16:00.000-08:00

Many sites out there claim they will summit your site to 40 search engines and in return you must place their banner on your site. I tried this once and waited a month and my site had still not been submitted. So I recommend doing it yourself which does not take very much time.

Just focus on the bigger search engines because many smaller search engines will use the same search quarry as the bigger ones. So when you summit your site to these three below your really doing it for a whole lot more.

If you plan on buying a custom domain do so before you summit your site to search engines.

For any others you may wish to summit to, you can just Google as "Summit site to 'Name of Search Engine'.

Sometimes the search engines may change the link to their summit forum. If one of these links is not working for you please let me know so I can fix it.

Keep in mind even after you summit your site to the search engines it will not appear immediately. This can take a week or so before the search engines index your site.

You can check what post have been indexed by if you in put this line below into Google search bar.

site://Your homepage URL

Example:

site://http://www.tweakmyblogger.com

Basic Template Structure (Blogger)

2010-12-12T13:41:00.000-08:00

In this post I will show you the basic layout structure of a template. The elements in this diagram below do not necessarily refer to the actual names of the elements in your blog. This is just a basic structure of the layouts to show how one element holds another. A real template will actually contain much more elements then this diagram shows. This also does not reflect on the actual size of the elements in compare to others.

If we look at these as a bunch of boxes or containers we can see how each element is inside of another (Other then the body). This is to show how each element has a parent element or container holding it.

As a example to express how CSS coding would effect a element within another element I will show you a basic CSS code. This is of course if the elements in my template have these same names.

`#content-wrapper { background-color: orange; color: blue; } #sidebar { background-color: green; }`

If the code above was in my template then the results would be as followed.

These areas will all have a background color of orange.

content-wrapper, main, post-area, post-feeds, comments, and footer.

Since the content-wrapper holds all these other elements in it, these elements will have the same styles as the content-wrapper.

Even know the sidebar and gadgets are inside the content-wrapper, they have their own style which is green and was declared in the sidebar. The gadgets will follow the styles of the sidebar since it is the closest relative with a background style.

The sidebar and gadgets element will still have a font color of blue because they don't have any styles of font.

Its also important to remember size is a factor. If the width of containers are wider then the container holding them, then they will not fit. In other words you cant put two 10in square boxes into a 15in square box. So this will not work on your template either. If the width of the containers exceed the container they are in, then the results will either push one of the elements below the other, or will display one of the elements being as cut off.

Download File Button

2010-12-11T13:31:00.000-08:00

With this tweak I will show you how to make a simple button that will allow your visitors to download files with the use of HTML <form> and <button> tags.

Their are other methods to make this button as well but I am doing it this way as a demonstration in using these HTML tags. Also some other methods require JavaScript which I am trying to avoid since some users disable JavaScript on their browser.

The syntax for creating a download file button is as followed.

`<form action="Direct Link To File" method="get"> <button>Download Now</button> </form>`

Red text is the direct link to the file you wish for your users to download.
Orange text is the title to display on the button.

The code above will render the following.

Tweak My Blogger

WELCOME To Tweak My Blogger!!!

Opening External Links In New Window

Forgot Login Info to Access Blog

Password Lock For Certain Post

<script type="text/javascript">var password;var pass1 = "PASSWORD";password=prompt("Please enter your password to veiw this page!:","");if (password==pass1) { window.location= "LINK TO BE OPEN IF PASSWORD IS CORRECT";} else { window.location= "LINK TO BE OPEN IF PASSWORD IS NOT CORRECT"; }</script>

Referral Link Spamming & Scamming

What Type Of Blog Should I Make?

Make Youtube Videos Autoplay

<iframe width="560" height="349" src="VIDEO SOURCE URL" frameborder="0" allowfullscreen></iframe>

<iframe width="560" height="349" src="http://www.youtube.com/embed/4P0Rbe1ASuQ?autoplay=1" frameborder="0" allowfullscreen></iframe>

Redirect Script

<script type="text/JavaScript">location.replace('http://www.example.com/');</script>

<script type="text/JavaScript">setTimeout("location.href = 'http://www.example.com/';",5*1000);</script>

Marquee Scrolling Gadgets

HTML Marquee Tag

<marquee direction="right">This text scrolls right...</marquee>

<marquee scrollamount="30">This text moves fast</marquee>

<marquee scrolldelay="300">This text moves slow</marquee>

<marquee behavior="alternate">This text bounces</marquee>

<marquee width="200">This text is set to 200 width</marquee>

<marquee behavior="alternate" width="300" scrollamount="30">cool text</marquee>

Browser Conditions For Internet Explorer

</style><![endif]-->

</style><![endif]-->

Duplicate Blog Post or Headers

Blog2

Header2

<b:widget id='Blog2' locked='true' title='Blog Posts' type='Blog'/>

<b:widget id='Header2' locked='true' title='YOUR TITLE (Header)' type='Header'/>

Post Title Before Blog Title

<head><b:include data='blog' name='all-head-content'/><title><data:blog.pageTitle/></title>

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

Dynamic Gadget Content

<div class="hide1"><--content to display--> </div><div class="hide2"><--content to display--></div>

<b:if cond='data:blog.url != "HomePage URL"'><style>.hide1 {display: none;}</style></b:if>

<b:if cond='data:blog.pageType != "item"'><style>.hide2 {display: none;}</style></b:if>

<b:if cond='data:blog.url != "www.tweakmyblogger.com"'><style>.hide1 {display: none;}</style></b:if><b:if cond='data:blog.pageType != "item"'><style>.hide2 {display: none;}</style></b:if>

Multi Colored Links When Hovering

Add Content Warning to Single Post.

<script type="text/javascript">{var r=confirm("The page you are about to view may contain content only suitable for adults. Press Ok to continue or Cancel to be redirected to the homepage.");if (r==false) { document.location.href="PAGE TO BE REDIRECTED TO"; }}</script>

Different Design on Different Browsers

Pop Up Alert Box

<script type="text/javascript">alert("YOUR TEXT");</script>

<script type="text/javascript">alert("YOUR TEXT FOR BOX 1");alert("YOUR TEXT FOR BOX 2");</script>

Hyperlink Blog Title

<div class='header-outer'>

<div id='header-wrapper'>

<div id='header'>

<div class='header-outer' onclick='location.href = "YOUR LINK URL"'>

<div id='header-wrapper' onclick='location.href = "YOUR LINK URL"'>

<div id='header' onclick='location.href = "YOUR LINK URL"'>

]]></b:skin>

.header-outer { cursor: pointer;}

#header-wrapper { cursor: pointer;}

#header { cursor: pointer;}

Duplicate Blog Post Element

<b:widget id='Blog2' locked='true' title='Blog Posts' type='Blog'/>

Classification of "Spam" Blogs

PayPal On Blogger

Add Your Site To Search Engines

Basic Template Structure (Blogger)

#content-wrapper {background-color: orange;color: blue;}#sidebar { background-color: green;}

Download File Button

<form action="Direct Link To File" method="get"> <button>Download Now</button></form>

`<iframe width="560" height="349" src="VIDEO SOURCE URL" frameborder="0" allowfullscreen></iframe>`

`<iframe width="560" height="349" src="http://www.youtube.com/embed/4P0Rbe1ASuQ?autoplay=1" frameborder="0" allowfullscreen></iframe>`

`<script type="text/JavaScript"> location.replace('http://www.example.com/'); </script>`

`<script type="text/JavaScript"> setTimeout("location.href = 'http://www.example.com/';",5*1000); </script>`

`<marquee direction="right">This text scrolls right...</marquee>`

`<marquee scrollamount="30">This text moves fast</marquee>`

`<marquee scrolldelay="300">This text moves slow</marquee>`

`<marquee behavior="alternate">This text bounces</marquee>`

`<marquee width="200">This text is set to 200 width</marquee>`

`<marquee behavior="alternate" width="300" scrollamount="30">cool text</marquee>`

` </style> <![endif]-->`

` </style> <![endif]-->`

`Blog2`

`Header2`

`<b:widget id='Blog2' locked='true' title='Blog Posts' type='Blog'/>`

`<b:widget id='Header2' locked='true' title='YOUR TITLE (Header)' type='Header'/>`

<head>
<b:include data='blog' name='all-head-content'/>
<title><data:blog.pageTitle/></title>

<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.pageTitle/></title>
<b:else/>
<title><data:blog.pageName/> | <data:blog.title/></title>
</b:if>

`<div class="hide1"> <--content to display--> </div> <div class="hide2"> <--content to display--> </div>`

`<b:if cond='data:blog.url != "HomePage URL"'> <style> .hide1 { display: none; } </style> </b:if>`

`<b:if cond='data:blog.pageType != "item"'> <style> .hide2 { display: none; } </style> </b:if>`

`<b:if cond='data:blog.url != "www.tweakmyblogger.com"'> <style> .hide1 { display: none; } </style> </b:if> <b:if cond='data:blog.pageType != "item"'> <style> .hide2 { display: none; } </style> </b:if>`

`<script type="text/javascript"> { var r=confirm("The page you are about to view may contain content only suitable for adults. Press Ok to continue or Cancel to be redirected to the homepage."); if (r==false) { document.location.href="PAGE TO BE REDIRECTED TO"; } } </script>`

`<script type="text/javascript"> alert("YOUR TEXT"); </script>`

`<script type="text/javascript"> alert("YOUR TEXT FOR BOX 1"); alert("YOUR TEXT FOR BOX 2"); </script>`

`<div class='header-outer'>`

`<div id='header-wrapper'>`

`<div id='header'>`

`<div class='header-outer' onclick='location.href = "YOUR LINK URL"'>`

`<div id='header-wrapper' onclick='location.href = "YOUR LINK URL"'>`

`<div id='header' onclick='location.href = "YOUR LINK URL"'>`

`]]></b:skin>`

`.header-outer { cursor: pointer;}`

`#header-wrapper { cursor: pointer;}`

`#header { cursor: pointer;}`

`<b:widget id='Blog2' locked='true' title='Blog Posts' type='Blog'/>`

`#content-wrapper { background-color: orange; color: blue; } #sidebar { background-color: green; }`

`<form action="Direct Link To File" method="get"> <button>Download Now</button> </form>`