Monday, May 11, 2015

How to enable meta description for blog and posts

Meta description for both blog and post for Blogger is disabled by default. It is good for SEO as well as increasing the chance that people searching for something related to your blog or posts will click on the search results to get to your blog and posts.

With this default set, when you compose a post, you will not see an option to enter search description for a post and typically this screenshot would show the missing field for search description in the right sidebar of the post editor:

Blogger Search Description for post not enabled

You will see a change when you enable meta description for your blog as shown below.

When you sign into www.blogger.com
Dashboard > Settings > Search preferences
you will see that meta tag for description for the blog is disabled:

Blogger enable meta search description for blog

Click EDIT, the tick ENABLE SEARCH DESCRIPTIONS? (.) Yes, then enter a suitable search decription for the blog then click SAVE

Now when you open the post editor to compose a post, you will notice a difference in the right sidebar. A new section for SEARCH DESCRIPTION will be added for you to enter a suitable search description for the post (see screenshot below):

Blogger Search Description for post enabled

Wednesday, April 01, 2015

How: embed calculator into blog post or sidebar

It is easy to embed a working calculator into a blog post or the sidebar. Just copy the calculator gadget/widget code below into the post editor in the HTML mode or log into www.blogger.com
Dashboard > Layout > Add a gadget > HTML/Javascript gadget
and paste the following code into the HTML/Javascript gadget field making sure to change the width and height values (highlighted in red) to values suitable for your blog main column width or the sidebar width, publish or save and it is done:

<iframe width="590" height="390" src="http://web2.0calc.com/widgets/horizontal/" scrolling="no" style="border: 1px solid #silver; ">
</iframe>
<br />
<a href="http://web2.0calc.com/">Web 2.0 scientific calculator</a>

Sample:




Web 2.0 scientific calculator

Wednesday, March 25, 2015

How to put AdSense ads in Blogger blog

Once you have an approved AdSense account, there are 2 ways to add AdSense ads in your blog

Method 1: Direct via Blogger Adsense gadget

Sign into www.blogger.com
Dashboard > Layout > Add a gadget > Add an AdSense gadget

Blogger Adsense gadget

Then in Layout, drag the newly added AdSense gadget to wherever you want and SAVE.

Method 2: Indirect via AdSense codes

Sign into google.com/adsense and click MY ADS at the top left, then +New ad unit, then select the ad unit you want.
After selecting the ad unit, at the bottom, click SAVE AND GET CODE

Now go to www.blogger.com
Dashboard > Layout > Add a gadget > HTML/Javascript gadget
Paste the AdSense code into the gadget
Drag the gadget to where you want and save.


Tuesday, March 24, 2015

How to change email address for Blogger login (New GUI)

Let's say, you want to change the email address for a blog from email A to email B. For this task, it is best to use 2 different browsers
Browser A for email A
Browser B for email B

First, in browser A sign into www.blogger.com using email A to get to the Dashboard of the blog
Dashboard > Settings > Basic
Scroll to the bottom to the PERMISSIONS section, type in email B then click INVITE AUTHORS

Blogger permissions section to add blog author

Second, in browser B, sign into email B and look for the invitation email, click on the link to accept invitation, then in BLOGGER, accept invitation.

Third, go back to browser A, to www.blogger.com
Dashboard > Settings > Basic
then in the PERMISSIONS section, you will see email B added as Author.
Click the down arrow and make email B as ADMIN

Now if you wish, you can go back to browser B
Dashboard > Settings > Basic
and in the PERMISSION section, make sure you have email B as admin, then if you wish, you can remove email A

Monday, March 16, 2015

Embed Youtube video direct via Share to Blogger tab



Test embedding direct from Youtube via Share > Blogger rather than copy-pasting into the post editor in the HTML mode This video was originally intended for a post in the Robotics for Children blog titled Command motor turn in 41 languages.

However, I noticed that the width of the Youtube video was automatically changed such that it slightly overlap to the right sidebar.

Sunday, March 15, 2015

How to embed Youtube video to Blogger

In the COMPOSE mode of Blogger post editor there is a video upload icon video upload icon which you can click to upload video. However, we have found that to be messy and if you want videos in your blog, it is far better to upload them to Youtube then embed into your blog.

After you have successfully uploaded a video to Youtube.com, then below the video click SHARE > EMBED to get the embed code. The code will look something like this (you don't need to understand the code in order to use it):

<iframe width="560" height="315" src="https://www.youtube.com/embed/HEVBWRzU5SA" frameborder="0" allowfullscreen></iframe>

Then if you want to embed the video into a blog post, then click the orange pencil icon to open the post editor. Note that you have to be in the HTML mode. Note also the width of the video above is 560px and this may be wider than your blog post column width. To change, click the SHOW MORE below, select CUSTOM SIZE

Youtube embed video custom size

Click in width field and type a number suitable for your blog post column width then click in the HEIGHT field. The height will automatically be added such that the aspect ration is maintain so video wouldn't be distorted.

If you want to embed the video in the sidebar, go to Dashboard > Layout > Add a gadget > Add a HTML/Javascript gadget, paste the code into the field and save. Note: if you don't know the sidebar width, go to
Dashboard > Layout > Template Designer > Adjust width
and you can see the sidebar width there (also total width - sidebar width = blog post column width)

Thursday, March 12, 2015

What is source code? What do they do?

Source codes are codes written to do something. There are many types of source code for various purposes. In the case of the Internet and if your are using a blogging platform like Blogger.com for your blog, the source codes are meant to be read and interpreted by browsers (Google Chrome, Firefox, Internet Explorer, etc.) and instruct them to display what the coder want the browser to display on your computer screen.

Below is an example of a small section of the source code used to display what you see now on your screen. Do you need to understand what all those "gibberish" means? Not exactly, it is meant for browsers and browsers are not human (coders/programmers are also "not human" but they need to understand how to write the source codes for the browsers)

Although you don't need to be an expert on source code, it will be good for you as a blogger to know a bit about HTML (which is one of the source codes for the Internet). For example, you want to put in your blog post a link for your visitors to click to take them to elsewhere such as to my Blogger for Dummies blog.

The source code for the above link is as follows;
<a href="http://bloggerfordummies.blogspot.com/">Blogger for Dummies</a>

And if I want the link to open in a new tab/window, all I need to do is to add an attribute target="_blank" or target="new" like this
<a href="http://bloggerfordummies.blogspot.com/ target="_blank">Blogger for Dummies</a> blog

Note that to do the above in your blog post, you will have to do it in the post editor in HTML mode.

And if you are interested in displaying advertisements like AdSense ads, what you have to is to sign into google.com/adsense, get the codes for the ads from their dashboard then go to
Dashboard > Layout > Add a gadget > Add a HTML/Javascript gadget
and paste their codes there.

Example of source code used to display this blog on your computer screen


<!DOCTYPE html>
<html class='v2' dir='ltr' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/>
<meta content='width=1100' name='viewport'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<script type="text/javascript">(function() { var b=window,f="chrome",g="tick",k="jstiming";(function(){function d(a){this.t={};this.tick=function(a,d,c){var e=void 0!=c?c:(new Date).getTime();this.t[a]=[e,d];if(void 0==c)try{b.console.timeStamp("CSI/"+a)}catch(h){}};this[g]("start",null,a)}var a;b.performance&&(a=b.performance.timing);var n=a?new d(a.responseStart):new d;b.jstiming={Timer:d,load:n};if(a){var c=a.navigationStart,h=a.responseStart;0<c&&h>=c&&(b[k].srt=h-c)}if(a){var e=b[k].load;0<c&&h>=c&&(e[g]("_wtsrt",void 0,c),e[g]("wtsrt_","_wtsrt",h),e[g]("tbsd_","wtsrt_"))}try{a=null,
b[f]&&b[f].csi&&(a=Math.floor(b[f].csi().pageT),e&&0<c&&(e[g]("_tbnd",void 0,b[f].csi().startE),e[g]("tbnd_","_tbnd",c))),null==a&&b.gtbExternal&&(a=b.gtbExternal.pageT()),null==a&&b.external&&(a=b.external.pageT,e&&0<c&&(e[g]("_tbnd",void 0,b.external.startE),e[g]("tbnd_","_tbnd",c))),a&&(b[k].pt=a)}catch(p){}})();b.tickAboveFold=function(d){var a=0;if(d.offsetParent){do a+=d.offsetTop;while(d=d.offsetParent)}d=a;750>=d&&b[k].load[g]("aft")};var l=!1;function m(){l||(l=!0,b[k].load[g]("firstScrollTime"))}b.addEventListener?b.addEventListener("scroll",m,!1):b.attachEvent("onscroll",m);
})();</script>

Find help, info, instructions, tips, tricks

Tip: Use search box below or this box, labels in the first right sidebar, archive, ctrl+F for this page or sitemap to find topics