New Blogger Tips

Showing posts with label YY - needs Sept11 review. Show all posts

Blocking specific AdSense advertisers from your site

by Unknown / Saturday, March 26, 2011 / Posted in Adsense, Advertising, AdWords, Article, YY - needs Sept11 review, zzz - check update for new AdSense interface

Prev / Next

You can stop ads from specific AdSense advertisers from appearing on your blog - provided you know the URL that those advertisers are using.

Why block individual advertisers

Previously, I've described how to set up AdSense on your blog, and how to to block certain categories of AdSense ads from your blog.

But there may be times when you need more control than this, for example if your blog (or other website) has:

Poor contextual advertising fit:
AdSense is a "contextual" advertising programme: it decides what ads to show to a person on a web-page based on the content of the page and the characteristics of the person viewing it.

But the contents in some blogs attract advertisers with directly opposite points of view.   For example, an anti-hunt blog will have posts about the things that hunters do to animals and why these are bad - but the contextual-advertising approach will probably attract ads from people promoting hunting or selling hunting equipment.

And other blogs just attract straight-out completitors: I've advised one person in the blogger help-forum who was running a blog about a particular educational scholarship and was very unhappy that their blog was showing ads for other scholarships.

Restrictions imposed by other advertisers:
One of my blogs has affiliate ads from a particular budget-accommodation travel site. One of their terms and conditions is that I don't display ads for a list of other websites that they provided.

Advertisers not categorised correctly:
Even if you've applied category-filtering to your blog, there may be some advertisers that sneak into the wrong category - for example, an advertisement for diet products that uses pictures that are only slightly suggestive may be listed in the "Weight loss" category, but not the "References to Sex & Sexuality" category.

If you advertise your blog through AdWords:
Sometimes, AdWords can be an effective tool for advertising your own blog.   But in terms of keywords, your blog is likely to be a very good fix.   So there's a high chance that your ads will be shown on your blog, unless you tell AdSense not to.

How to block specific companies:

In any of these cases - and others - you may want to tell AdSense not to show ads from certain advertisers on your blog.   Unfortunately, you cannot quite do this - AdSense doesn't let you identify individual advertisers.   But you can block ads that point to specific websites:

Follow these steps:

1 Log in to AdSense,

In the "old" AdSense interface (the main one as at March 2011):

2 Choose the AdSense Setup tab

3 Choose the Competitive ad filter sub-tab

4 Choose the AdSense for Content sub-sub-tab (the tab-row is half way down the page, underneath the examples)

5 Add the web-sites whose ads you want to block to the list:

In most cases, enter the website name with out the "www". Eg enter rustling.org, not www.rusting.org, to block ALL adds from the site.
If you need finer control than this (eg blocking ads for a forum at a site, but not the site itself) study the examples shown on the page to understand what to enter.

In the new AdSense interface (still in beta testing at March 2011):

2 Choose the Allow & block ads tab (from the top row)

3 Under Blocking Options (left hand menu), choose Advertiser URLs

4 Click the Block new URLs button. This opens a window

5 From the Products drop-down, choose one or more products and press Apply (currently at the bottom right corner of the drop-down window).

f you just want to keep the ads off your blog, choose the "Content" product. Or to be certain, choose all of them.

6 Enter the names (URLs) of the sites you want to block

Click Learn how to format your URLs for blocking fordetails about how to enter URLs so that you block sites at the correct level. But in most cases, you just enter the top-level name, eg enter "blogger.com" to stop all ads pointing to anywhere under www.blogger.com

7 Choose one of the reasons.

8 Press Block Sites.

The newly-blocked site will appear in your list of blocked URLs - which is in alphabetical order.

You can un-block it at any time by going to the same screen, finding it in the list, and clicking the Unblock link at the right hand side of the name/product.

What your visitors will see:

Within a short time (maybe even in about 10 minutes), advertisements that point to the URL(s) you entered will not be displayed on your site: instead, visitors who see AdSense adverts will see other (non-blocked) ads, or Google (public service) ads if no payng ads are available.

Notice the risk for you:- if you block too many potential advertisers, your site may only show public-service or Google ads that don't earn you revenue.

Final thoughts:

Ads which you block because they feel "spammy" can easilyre-appear from other not-yet-blocked sites: folks who make money off them move servers etc regularly. if you are determined to keep certain ads off your site, you may need to keep figuring out where the ads are coming from and adding new sites to your blocked-list all the time.

Finding out what sites to block can be challenging, as not every advertiser puts their URL into their graphical ads. Some ways of doing this include:

Looking very hard at the advertisement:
Sometimes the company URL is in small text at the bottom
Searching for a key phrase from the ad
Eg when I wrote this articl,e Blogger-HAT's home page was showing an ad for "Smallest hidden DV in the world" - I suspect I could identify them with Google fairly quickly).
Click the ad yourself: Remember that this is against AdSense's terms and conditions, and that you won't get any revenue for it. I'm not suggesting that it's good to do this - AdSense know that it occasionally happens by accident, so they are unlikely to penalise you for doing, so long as you don't do it often.
Click the same ad on someone else's site:
This is allowed under AdSense's rules. But it's not recommended, because the advertiser won't get any benefit from the click, so doing this will tend to put the price they are willing to pay for each down in the longer-term.

Building Image-only ads from Amazon

by Unknown / Thursday, November 4, 2010 / Posted in Amazon Associates, Article, Picasa, YY - needs Sept11 review

Prev / Next

When Blogger users put an image-only link from Amazon into their blog, there is often a problem with the image not being found. It applies to code generated at Amazon, not to ads that are made using the Amazon widgets in Blogger.

Overview:

Previously, I explained how to build customised Amazon product links for use in Blogger. You may need to do this if your readers are mainly not from the USA, or if you need to change the size of the advertisements.

One of the options for links is Image-only: the link shows a picture of the item, which your readers can click. When they click on the picture, they are taken to Amazon to buy the product.

This article explains how to fix the problem of the image not actually showing up on the published blog page, even though no error is reported and Amazon's reports say that the ad displayed.

What is causing the picture to not display?

The procedure for building an image-only link has a step:

"Save this image to your server, then cut and paste the HTML code in the lower left textbox into your web page."

Unfortunately, the HTML that Amazon generates assumes that you will save the image onto the same directory in the server that the web-page is stored on. This is fine for many web-site builders, but doesn't work for Blogger users who store their pictures in Picasa by default, or on other image-hosting services.

How to fix it:

Description:
You can fix the problem by uploading the image file to Picasa, or any other file host service, and altering the HTML to use this uploaded file.

Follow these steps:

Copy the HTML provided by Amazon's link-builder, and paste it into wherever you want it in your blog.
Copy the location of the image that Amazon is telling you to put onto your server.
In another window, log on to Picasa Web Albums using the same Google account that owns your blog
Choose Upload
Choose an album to put the image into
(You may want to keep a separate folder for all Amazon Associates products, or you may want some other arrangement eg one folder per page).
Use the From an URL tab, and enter the location that Amazon told you for the source of the image (copied in step 2)
Press Upload, and wait while the picture is loaded.
When the picture has loaded, Picasa-web-album shows the album summary page. Click on the picture you just loaded.
Click Link to this Photo (on the right hand bar) to get the link value (ie the URL or hyperlink) for the photo, and copy it.
Go back to the place in Blogger where you put the HTLM provided by Amazon in Step 1 and edit it.
The HTML will have this structure:
(I've put in some link breaks and bolding to make it easier to read - you can do the same, provided the Post Options - Ignore new lines option is selected ):

<a
href="http://www.amazon.com/gp/product/0975841963?ie=UTF8&tag=bloggerhintsa-20&linkCode=as2&camp=1789&creative=9325&creativeASIN=0975841963">
<img border="0"
src="41FxC9u%2B%2BVL._SL160_.jpg">
</a>
<img
src="http://www.assoc-amazon.com/e/ir?t=YOUR-AMAZON-ID=as2&o=1&a=0975841963" width="1" height="1" border="0" alt="" style="border:none !important; margin:0px !important;" />
Find where it says SRC "blah-blah-blah.jpg" (ie the piece in bold)
Select everything inside the quote marks, and replace it with the link value for the picture that you loaded into Picasa, so it becomes something like:

<a
href="http://www.amazon.com/gp/product/0975841963?ie=UTF8&tag=bloggerhintsa-20&linkCode=as2&camp=1789&creative=9325&creativeASIN=0975841963">
<img border="0"
src="http://picasaweb.google.com/YOUR-GOOGLE-ACCOUNT/YOUR-ALBUM-NAME?authkey=Gv1sRgCOGyrv2X0-OvmAE#5430348305093079170">
</a>
<img src="http://www.assoc-amazon.com/e/ir?t=YOUR-AMAZON-ID=as2&o=1&a=0975841963" width="1" height="1" border="0" alt="" style="border:none !important; margin:0px !important;" />
Save the change (ie publish the post, or save the gadget etc).

Here are some examples of working image links:

Understanding Google Accounts

by Unknown / Friday, October 29, 2010 / Posted in Account management, Article, YY - needs Sept11 review

Prev / Next

This article is about Google accounts: what they are- and aren't, how to access them, and what the account-names look like. This supports another article about the relationship between Google accounts and Google-Apps accounts.

Blogger accounts vs Google accounts

Once upon a time (pre 2006), there was a tool on the internet called Blogger.   People created accounts on Blogger, and then used them to make a blog that was owned by their Blogger account.

Then Google (the company that made the search engine) purchased Blogger.   They wanted to integrate their products, so Blogger users had to change their original Blogger accounts to "Google accounts". (Google were pretty nice about this: they kept support old, unconverted Blogger accounts up til 2011, but have recently said that this will stop soon.)

At the time, very few people understood the difference between Google-the-company and Google-the-search-engine, so most didn't have any idea of the power and importance of these "Google accounts".   However as the other applications available through our Google accounts grew (Gmail, Picasa-web-albums, Google-custom-maps, AdSense, AdWords, etc), this has become clearer.

Getting a Google account

To make a new Google account, you just have to sign-up for any one of the products that Google offers (Gmail, Blogger, AdSense, etc).

The sign-up screen asks you to enter an email address, and says that it "(must already exist)". But it does not check that the email-account does actually exist.

If the product that you sign up with is Gmail (which is where Google accounts started, I think), then it makes sense that the account name is the email address.

However Google (or perhaps even Blogger: I don't remember) decided that people would use a text-string that looks like an email address as their Google-account name - even if the email address isn't a Gmail one, and even if there is no valid email account with that address

This means there are Google accounts called Joe.blogs@yahoo.com, and similar. There are even Google accounts with a name that is not, and never has been, a real email address. This has caused lots of confusion and problems:

If the email address isn't a gmail one, then changing the password of the email doesn't change the password of the Google account

Some people don't understand that their Google account name is just a set of letters: they don't realise that they can change the email address attached to their account without changing the underlying account (Dashboard > Edit Profile, identity tab).

Some people lost access to the email address (eg because they leave their job, or use a free service and didn't log on for 30 or 60 or however-many day).

Some people never had access to the email address, because they used a text-string that wasn't actually an address, and Google never checked if non-Gmail addresses actually worked.

In these cases, problems happened when that email address was the only tool that the person used to identify their Google accounts. If it's not real, or they can't access it any more, then Google can't help when they forget their passwords,etc. So there are some blogs that can never be accessed ever again, because Google has no way of being sure who owns the Google-account that made them.

Google Apps accounts

by Unknown / / Posted in Article, Google Apps, YY - needs Sept11 review

Prev / Next

This article was written in October 2010, to support information about resolving conflicting Google and Google Apps accounts.

It is replaced by Google Apps, Google Accounts and Blogger, which describes the situation now that the conflicting accounts have resolved and all Google Accounts have transitioned to Google's new infrastructure.

Centering the Post title (or Page title) in your Blog

by Unknown / Friday, September 17, 2010 / Posted in Article, Blog layout, CSS, Titles, YY - needs Sept11 review

Prev / Next

This article is about how to centre-align the title that is shown for all Posts and Pages in blogs made with Blogger.

Center/Centre alignment:

Blogger's template designer lets you choose the colour and font-size of the Post title. This is true even for most Layout templates (ref: What type of template does my blog have?) though some don't have an option to edit the post-header.

However it doesn't, yet, have an option to change the alignment, ie whether the title is flush with the left or right side, or in the centre.

But this is very easy to do, provided you're willing to accept the disadvantages of editing your blog's layout template.

Simply add this rule to the CSS section of your blog's layout template:

h3.post-title{
text-align: center;
}

See Adding a new formatting rule to your template if you need help with editing your template to add the rule.

Right alignment?

Making your header right aligned is just as easy: add this rule instead:

h3.post-title{
text-align: right;
}

Adding tooltips (hover text) to Blogger posts

by Unknown / Thursday, September 16, 2010 / Posted in Article, CSS, Hover text, Post Editor, YY - needs Sept11 review

Prev / Next

This article is about putting a "tooltip" (text that is shown when you hover over) into an URL in a Blogger post.

What are tooltips?

Tooltips are a feature found in many websites and GUI-based tools: when a viewer hovers their mouse over an item, a small piece of text is shown which explains the item.
You can see them in Blogger's Post Editor when you put your mouse over an item in the toolbar.

But tool-tips can be used on other things too, including pictures and text: put your mouse over This Text to see one.

They can be particularly useful if you want to provide a translation for a few words from another language, or a definition for technical terms, but don't have enough to make a glossary worthwhile.

How to add a tool-tip in Blogger

Open the Post (etc) that you are working on.
1 Create the item that you want the tool-tip to be on (it may be text or a picture).
2 Select the item, and use the Link button on the toolbar to set up a link for it. (Do this even if you don't want it to end up linked to anything - you can remove the link part alter on.)
3 Go into Edit HTML mode (top right side of the editor toolbar), and find the HTML for the item.

Hint: use the find feature in your brower - it may be helpful to temporarily put some marker text, eg XXX, just before and after the item.

The HTML for the item will have this sort of structure:

<a href="Your Link" > Your item text ... </a>

or it may be like this if your item is a picture:

<img border="0" src="URL FOR YOUR PICTURE" style="margin-left: auto; margin-right: auto;" />

or even like this if it's a picture that's linked:

<a href="Your Link" img border="0" src="URL FOR YOUR PICTURE" style="margin-left: auto; margin-right: auto;" </a>

4 Add title="YOUR HOVER TEXT" to the HTML, so it becomes something like:

<a href="Your Link" title="YOUR HOVER TEXT" > Your item text ... </a>

or, if the item is a picture:

<a href="Your Link" img border="0" src="URL FOR YOUR PICTURE" title="YOUR HOVER TEXT" style="margin-left: auto; margin-right: auto;" </a>

5 (optional) If you don't want the item to be linked, remove the href="Your Link"
statement, so the HTML becomes similar to:

<a title="YOUR HOVER TEXT" > Your item text ... </a>

or, if the item is a picture:

< img border="0" src="URL FOR YOUR PICTURE" title="YOUR HOVER TEXT" style="margin-left: auto; margin-right: auto;" />

6 Return to Compose mode (top right of the Post Editor window), so that you aren't faced with HTML the next time you edit a post.

Formatting unlinked text that has tooltips.

If you put hover-text on words that aren't linked to anything, it's good to give them a different format so that readers know to mouse-over them to see the hover-text. For example

When you visit Ireland, you will undoubtedly experience rain, ceol and great craic.

To do this:

1 Add this CSS rule to your blog's template (See Adding a new CSS rule to your template if you need help with this):

.toolTippedText {
border-bottom: 1px dotted red;
}

2 While editing your Post (etc) to add the hover-text, also add this class statement

class="toolTippedText"

to every URL which has title="YOUR HOVER TEXT" added to it. So the full statements become

<a href="Your Link" title="YOUR HOVER TEXT" class="toolTippedText"> Your item text ... </a>

or, if you don't want the text to actually be linked to anything:

<a title="YOUR HOVER TEXT" class="toolTippedText"> Your item text ... </a>

It probably doesn't make sense to add a font-decoration like this to tool-tipped images - though it can be done in exactly the same way.

If you don't like using red dots as the way to highlight text that has hover-text, there are other rules you can add to your template. For example to get a solid underline in the same colour as the text font, use:

.toolTippedText {
text-decoration:underline;
}

Related Articles:

Adding a new CSS rule to your template.

Blogger's "static" Pages are more trouble than they're worth

by Unknown / Monday, September 13, 2010 / Posted in Pages, YY - needs Sept11 review

Prev / Next

Blogger's "static" or stand-alone pages have some benefits - but also a number of disadvantages. Use them sparingly!

Overview:

Previously I've described the Pages feature that Blogger introduced in February 2010, and the differences between Pages and Posts.

There are times when stand-alone Pages are a handy feature.

But overall I've decided that the disadvantages are a lot greater than the advantages. From now on, any blogs that I work on will get horizontal menu bars made from Link-list gadget, or perhaps just menus made with HTML, and the vast majority of content will go into Posts not Pages.

Here's why.

The Page title is the Menu-bar value

When you create a page (Edit Pages > New Page), you can

Give it a title,
Write the content,
Allow viewer comments or not
Handle <br />'s (or not)
Say whether any HTML in the page is interpreted (ie used to control the display), or displayed (the code vales, not their effects, are always shown).

Blogger has standard rules for how the items that you enter are turned into HTML. In particular, the Page-title (and Post-title too) is given a H3 (header three) tag. And this particular tag is very important to the search-engines, so bloggers who care about whether the search-engines find their blog or not pay quite a bit of attention to the words in the title.

The problem is that the Page title is also the value that's put on the menu bar if you are giving access to your Pages with the Pages-gadget (and most people are):

That's ok, if you use only a short-ish titles.

The HTML behind the Pages gadget used an un-ordered list: this it what lets it display horizontally if it's in the header, and vertically if it's in the sidebar. But when it's horizontal, if the values are longer than one line then it simply spills onto the next line. This can happen if a viewer had a low screen resolution - or if you've used lots of search-engine friendly key-words in the Page-titles:

And there's the crux of the problem: since the Page-title is the H3 header, it needs to be long and descriptive to give the search engines a good chance of finding your page. But make it long, and the Pages gadget looks awful, and is confusing for viewers.

Of course I could use Pages, and build a menu-bar to access them using a linked-list gadget (or even just HTML for a table). But if I'm doing that, it's just as easy to make the menu-bar "items" out of Posts as it is from Pages - and using Posts avoids the disadvantages which Pages have (eg not included in the RSS feed, no Labels, etc).

Other problems:

There are some other problems with Pages, including:

An unclear name:
Blogger decided to call the feature that they introduced "Pages". Most help-article writers outside of Google used the phrase "static pages", to make a clear distinction between these new "pages" and the existing main page, layout-page, archive-page (not to mention the way that "page" refers to a screen in most websites). But there are still dozens, maybe hundreds, of official help articles from Google, and unofficial ones from the rest of us, that refer to "Pages" in the older screen-full-of-text sense.

User confusion:
New Blogger users see Pages, and assume that it's possible to put blog-posts onto the individual pages, just like you can put content into pages in other websites.   Some spend a lot of time looking for ways to do this - time which IMHO would be better spent just adapting to Blogger's way of working, or moving to another tool that has native support for classical web-pages if that's what they really need.

RSS Feed:
Pages aren't included in a blog's RSS feed - a new page is not notified to Followers or feed-subscribers.

Backups:
When the feature was first introduced, Pages weren't included in exported blog-content files. So the only way to back them up, or even transfer them to another blog, was to manually copy the contents.   (This feels like the sort of thing that Google might quietly fix - I haven't tested to see if they have or not.)

No label or date:
Static-pages don't have Labels or dates, so there's no way for them to be included in the display shown on Archive or Label pages. This also confuses some readers. It also means that a Page can never be used as the target page for any of the standard tricks that can be used to give your blog a "home page".

Conclusion:

None of the other problems were enough to make me stop using Pages.

But the combined effect of the SEO / header-display problem and all the other issues means that I now believe that

"Static-pages are trouble than they're worth."

I'll still use the page-gadget area in designer templates to make my own horizontal menu bar, because I rather like the way that linked lists are formatted in most of the templates. I might even make it look like I've put posts into pages using this menu. And I'll happily use Pages to display the results of Google Custom Searches (since there's no need for these to be fed, backed-up etc)

But I won't be pointing to any new stand-alone pages made with the Posting > Edit Pages menu.

Displaying a gadget only on static pages - or on everything except static pages

by Unknown / Friday, August 27, 2010 / Posted in Article, Gadgets, HTML, Pages, YY - needs Sept11 review

Prev / Next

This article is about how to set up a gadget / widget in Blogger so that it is only visible on the "static" pages in your blog.

Note: in Blogger, the words "gadget", "widget", and even "page-element" all mean the same thing - basically a bit of code that can be put into your blog without looking like code, and which does a specific thing.

I generally use "gadget", because the Page Elements tab currently says "Add a Gadget". But they're absolutely the same.

Making a gadget that only shows on static pages:

1 Make the gadget
Do this in the usual way, using Design > Page Elements > Add a gagdet.

2 Drag-and-drop the gadget to the place where you want it.
A popular place for a gadget that is going to look like a "home page" is in the Body section, just above the Blog Posts gadget, where "Test Gadget" is in this example:

3 Edit the Gadget again

Don't make any changes to it - just maximise the window, so you can see the WidgetID, which is at the very end of the address bar at the top.

Make a note of the value. (In this example, it's Text1).

4 Find the code for your gadget and edit the template:

Edit your template (Design > Edit HTML)

Download a copy of the template, and put it somewhere safe.

Use your browser's text search tool (Edit / Find in Firefox) to look for the widget name that you noted in step 3. Notice what comes after it. In this example, it's the line for Blog1:

<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Text1' locked='false' title='Test gadget' type='Text'/>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>

Click the Expand Widget Templates checkbox (so it's turned on)

After the expanded template has downloaded, find the widget name again. This time it will look a bit longer (the exact details depend on what type of widget/gadget it is.)

<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Text1' locked='false' title='Test gadget' type='Text'>
<b:includable id='main'>

<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>
</b:includable>
</b:widget>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'>

5 Add conditional formatting:
You need to put conditional formatting code around the code for the gadget - makings sure that it doesn't go around the code for anything else! (which is why you noted what comes afterwards in step 4)

The code to use is:

<b:if cond='data:blog.pageType == "static_page"'>

THE CODE FOR YOUR GADGET GOES IN HERE

</b:if>

The example above looks like this, when the code has been added:

<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Text1' locked='false' title='Test gadget' type='Text'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "static_page"'> 
<b:if cond='data:title != ""'>
    <h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
    <data:content/>
</div>

<b:include name='quickedit'/>
</b:if></b:includable>
</b:widget>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'>

ALTERNATIVE:
If you want the gadget to appear on every page except static pages, use is

<b:if cond='data:blog.pageType != "static_page"'>

THE CODE FOR YOUR GADGET GOES IN HERE

</b:if>

See the slight difference: != instead of ==

NOTE:
Copy and paste is the best way to transfer the code. If you must type it in yourself, be very careful about what's a single quote mark and what's a double quote mark.

6 Check that it's worked
Preview your blog before you save the changes: check that the the widget is visible.

Save the template changes, and look at your blog. Check that

The widget is, or is not, on static pages (depending on what option you chose)
The other elements of your blog (other widgets, blog post titles, dates and contents) are all as you expect them - on the first screen, and on other screens too.

If anything is wrong with how your blog is working, go back to the template editor (Design > Edit HTML), and upload from the copy of your template that you made at the beginning of step 1. This will let your blog work properly, while you figure out what went wrong.

Showing image-only AdSense ads in your blog

by Unknown / Saturday, July 31, 2010 / Posted in Adsense, Article, YY - needs Sept11 review, zzz - check update for new AdSense interface

Prev / Next

This article is about how to show image-only AdSense ads in your blog.

Blogger and AdSense

It's easy to Set up AdSense on your Blog: Just go to Monetize > AdSense - and then follow the prompts to apply for an account.

Once you've been approved, it's easy to put AdSense ads into your blog:

Design > Page Elements > Add a Gadget > Adsense - for ads in your sidebar, header, footer etc
Design > Page Elements > Blog Posts (edit) - for ads in between posts

But the advertisement format options that Blogger provides for are limited: you can only choose either text-only or image-and-text ads. There is (currently) no option for image-only ads.

To guarantee that your blog displays image ads only, you need to get the ad-code from AdSense, and put it into an HTML-Javascript gadget or inside a Post (or Page)

How to display image only ads:

1 Log into AdSense with the Google-account that you use to manage your ads. (There may be some cases where this is not the same Google account that you use to manage the blog where the ad is displayed)

2 Go into the AdSense Setup > Get Ads tab.

3 Choose AdSense for Content

4 Configure your ad:

Work through the items in the wizard to (I like to choose single-page, so everything is visible at once). If you've chosen the Ad Unit radio button, then beside it there is a drop-down that lets you choose:

Text-and-image,
Text-only,
Image-only.

5 At then end of the wizard, you are shown some HTML code. Copy and paste that code.

6 Go to Blogger (with the account you use for the blog).

7 Place the ad:

If it's going in a gadget, Choose Design > Page Layout > Add a Gadget > HTML-Javascript and paste the copied code into the Contents field. Save the new gadget, and drag-and-drop it to wherever you want

If it's going in a post, see putting AdSense ads inside Blogger posts

To request image-only for the ads that are shown at the bottom of individual posts (via Design > Page Layout > Blog Posts/edit), you would need to edit the design-template. Instructions for this will vary depending on what template you have, and are beyond the scope of this article. But you can put a gadget at the bottom of all the blog-posts that are shown on a screen - just make the gadget the usual way, and drag it to underneath the Blog Posts gadget

Changing the case of your Label values

by Unknown / Sunday, July 25, 2010 / Posted in Article, Blog structures, Labels, YY - needs Sept11 review

Prev / Next

This article is about how to change the case of the Labels in your blog. For example, from lower to initial case ("cats" to "Cats") or even all capital-letters ("CATS").

Why change case?

When some people start using Blogger, they apply labels to posts without much thought: they just type "cats" into the label field, and don't consider how it will look later on. Even worse, they type in "Dogs" for the next post and "FROGS" later on.

This gives an untidy, unprofessional-looking labels gadget.

And it's a bit hard to fix: you can change the labels on individual posts, but if even one other post has "cats" as a label, it doesn't matter how many times you add "Cats" to new posts the label will always be recorded as "cats".

The only approach I've found is to apply a unique temporary label to all posts with the value you want to change, then to delete the initial label and use the temporary label to select the posts to apply the correctly-formatted value to.

How to change the case of existing Labels

Log in to Blogger, and go to the Posting > Edit Posts tab.

Select all the posts with the label you want to change (eg "fred"), by clicking on this Label in the left-hand panel, and then clicking Select All.

Use the Label Action... drop-down menu (just above the list of posts) to:

Give them a new temporary label that's not already in use (eg "xxx-temp") - when you have done this, they will all have at least two labels.

Remove the label that you want to change

Select all the posts with the temporary label

Give them the label that you want to change to (eg "Fred")

Remove the temporary label that you added in the 2nd step.

Warning:

Blogger blogs have a maximum of 5000 labels. Some problems that have been raised in the Blogger-Help-Forum make me think that this is a life-time limit, and that a label is still included even if no current posts have it, though I haven't tested this personally. I suspect that applying the procedure above will use up to three labels: the original, the temporary one and the new one. You may not want to use it if you think that your blog might ever reach the limit.

Related Articles:

Using Labels to Categorise your Blogger Posts

Posts, Pages and Navigation.

Understanding the email address that is shown in your blog

by Unknown / Tuesday, July 20, 2010 / Posted in Article, Email, HTML, Post Editor, YY - needs Sept11 review

Prev / Next

This article is about when, and what, email addresses are displayed in your blog.

Overview:

Many people who are new to Blogger get upset because when they look at their blog, they see their email address near the top right hand corner. Reasonably enough, they assume that is they can see it, so can other people. And so they start looking for instructions about how to remove the email address from their blog. Or they notice that some other blogs don't have email addresses showing, and start looking for ways to make their blog the same, sometimes with far-reaching consequences.

However there's one important piece of information that they've missed:

The email address that may be shown near the top right hand corner of a blog belongs to the person who is reading the blog, not the person who wrote it.

This means that it's simple to remove the email address from the top of your blog: just click the Sign-out link.

Details:

Some blogs never show any email addresses, because they have hidden the navBar. This is either deliberate, or because the are using 3rd party templates that simply don't include it.

But when YOU are viewing a blog (yours or someone else's) that is showing a navbar, AND you are logged into a Google account, then YOUR email address is shown near the top right hand corner of the screen.

In this example, I'm viewing someone else's blog, and my email address is shown (even thought it's quite hard to see because the background picture is noisy and the navBar has been set to be transparent).

In the same way, if one of your readers is looking at your blog, and they are logged in to a Google account, then their own address shows near the top right hand side of the screen.

My email address?

There is one small point that I've glossed over here.

When an "email address" is shown in the navBar, it's actually the name of the Google account that is currently signed in. For many people, this is the same as their own email address, but some people have different email addresses. And some now sign-in to Google with old "addresses" that have long-since stopped working for email: this is fine provided they remember their password, and have updated the primary address that is updated with their account so that Google know where to find them.

Related Articles:

How to show an email address in your blog.

Understanding Google Accounts

Finding the address for any blog's RSS feed

by Unknown / Thursday, July 15, 2010 / Posted in Article, RSS, YY - needs Sept11 review

Prev / Next

This article is about how to find the subscription-address for any blog's RSS feed, whether or not the blogger has provided a subscribe button.

Blogger blogs and RSS feeds:

Every blog created in Blogger is originally set up to produce an RSS feed.

Some blogs don't actually produce a feed any longer:

Bloggers can choose to turn their feed off (Settings > Site Feeds > Allow Blog Feeds = None),
Blogs that are changed to not public have their feed automagically turned off, because it's not possible to apply Blogger's security rules to control access to a feed.

But provided the blog is still producing an RSS feed, it is still possible to find the feed address even if the blogger has not provided an icon for it on his/her site.

Finding the RSS-feed address for a Blog

Option 1: Use the Subscribe to Posts (atom) link

Every Blogger template produced by Google (or at least every one that I've seen) has a Subscribe to Posts (Atom) link at the bottom of the screen.

The easiest way to get the blog's (atom) RSS feed address is to right-click on this link and copy the link-location.

But some blog-authors have removed the Subscribe to Post link

accidentally, or
because they're in the process of replacing it with a "proper" chicklet
because they don't want people to read their feed - possibly because they've realised that for each Post, the feed contains the first version of it that they publish, not any updates that they've made since - and don't know about the proper option to disable it.

and in these cases you need to use another option.

Option 2: Use the RSS icon or feedcounter icon that the blogger has provided

If the blogger has added either an RSS icon, or Feedburner's feedcount gadget, then you can right-click on them and copy the link-location. Or just click on them, and most probably the feed will be opened in your favourite feed-reader software.

Option 3: Work it out from the blog's source-code

Even if the blog-owner hasn't given you any way to subscribe to their feed, you can still work out the feed-address by looking at the instructions that are used to show the blog in your web-browser:

1 View the blog in your browser.

2 Choose to view the page-source. The command to do this is different in each browser: in Firefox it's View > Page Source.

This opens a text-file which shows the code that was used to draw the web-page you were looking at.

3 Search for "RSS" in the text file.
Hint: use the browser's seach command (Edit > Find in Firefox).

4 Examine the code: If there is a feed coming form the blog, you will see the URL's of the feed in atom and RSS format, like this:

<link rel="alternate" type="application/atom+xml"
        title="Blogger-Hints-and-Tips - Atom" 
          href="http://blogger-hints-and-tips.blogspot.com/feeds/posts/default" />
<link rel="alternate" type="application/rss+xml" 
        title="Blogger-Hints-and-Tips - RSS" 
          href="http://blogger-hints-and-tips.blogspot.com/feeds/posts/default?alt=rss" />
<link rel="service.post" type="application/atom+xml" 
        title="Blogger-Hints-and-Tips - Atom" 
          href="http://www.blogger.com/feeds/5681944372768269659/posts/default" />

The URLs are the text inside the quote-marks after each of the "href=" statements - shown in the example as links.

Note: I've put in line-breaks so you can read this code, but in the source file there will only be three - long - lines used.

5 Choose which one you want to use. (Atom or RSS - I think RSS is more universally accepted, but Atom will be fine for any Google situations.)

You can copy-and-paste one of these, and use it to subscribe to the blog. Which one to use, and how/where to use it depends on where you want to put the subscription.

For example, I've just done this to subscribe to a blog in Google reader:

I chose the URL which is equivalent to the one that's highlighted in the example above
In Google-Reader, I choose Add a subscription, and pasted in the URL

Zemanta and your Blog: how to add and remove it

by Unknown / Thursday, July 8, 2010 / Posted in Article, Post Editor, YY - needs Sept11 review, Zemanta

Prev / Next

This article is about Zemanta and your blog: what it is, how to add it, and how to delete it.

Overview

In June 2009, Google announced Zemanta - a tool for "blogging smarter", which had to be downloaded and installed into your browser. More recently, they announced a closer integration between Google and Zemanata: there is now a Google-hosted page where you you can choose to install Zemanta with pretty much a single click.

Zemanata is basically an assistant that sits inside Blogger while you're writing, and makes suggestions about related things (pictures, articles etc) that you might like to link to. It's fine in theory (although I'd prefer to control my own research process, and take responsibility myself for meeting copyright conditions), however I found real performance issues when I tried to use it - which is why I went looking for the removal instructions! Some people at Blogger clearly like it though, so it must have some advantages.

It's possible that there will be some more Zemanta integration coming: eg options inside Blogger for enabling and disabling it and setting the user-options/preferences. But in the meantime the basic information about adding it to a blog, and removing it too, is presented here.

How to add Zemanta to your Blog

To turn Zemanta on for your blog:

Log into Blogger with a Google account that has admin-rights on the blog which you want to use Zemanta with
Click here to add the Zemanta gadget

In the window that opens, choose the Blog from the drop-down list

Click the orange "Add Zemanta" arrow.

Immediately after clicking the arrow, you are taken to the Post Editor with a new post for the blog that you selected. There is an extra gadget showing on the right hand side of the editing window. This gadget will be on the screen every time that you edit a post.

It's not currently available in the Page editor - but if you really want to use it while writing a Page, then just write the contents in a Post, save it as draft (ie don't publish), and use the HTML copy/paste approach described in Moving a Post from one Blog to Another.

How to remove Zemanta from your Blog

Log into Blogger with a Google account that has admin-rights on the blog which you want to remove Zemanta from
Open the Post Editor (eg by clicking New Post).

In the top row of the Zemanta gadget, at the right hand side, there's a small down arrow. Click the arrow and choose "Remove this gadget".

Click Ok.

Some people reported that removing it from Chrome was different: they said that there you would not see the small drop-down arrow, but instead need to look in the browser's address bar and use the Zemanta icon on the right hand side, which has an option to isable Zemanta for blogs. However this clearly isn't the case now, because I just removed it from Chrome to make the pictures above. It may be that these instructions apply if you have used some other method to install a toolbar: in this case, you may need to go into the Control Panel and use Add/Remove Programs to remove it.

Seven simple steps to a snazzy new-look blog: preparing to change template in Blogger

by Unknown / Wednesday, July 7, 2010 / Posted in Managing blogs, Template Designer, Templates, YY - needs Sept11 review

Prev / Next

This article is about making a plan to change your Blogger template if your existing blog-template has been customised: it covers how to make a list of the changes that have been made to your template, and using this as the basis of a list of changes to re-apply when you change templates.

Overview:

Changing your template in Blogger is easy: you just choose another template, press save or Apply to Blog (in the Template Designer), and the changes are applied.

But if you have ever customised your template using the Edit HTML feature, then ALL the customisations are lost when you change templates. This is fine for some changes (eg hiding things you didn't like in a particular template), but it means you lose changes that you may want to keep, eg a favicon, meta-tags, Google Analytics or Webmaster verification, Amazon Product Preview, etc - in short anything that you want to keep, no matter how your template looks.

If you're worried about the consequences of changing templates, you have a basic choice to make:

1 Remember what you did:
Try to remember what you've set up on your blog, and think about which of these things you want to apply in your blog-with-a-new-template.

2 Code comparison:
Compare the layout-template code for your blog with the same code from another blog that has the same template and widgets as your blog, but not the HTML customisations. From this comparison, make a list of what customisations you need to re-apply after you change templates.

The first option is quicker and a lot easier - but you might miss something important. Personally it's not an option I'd like to use for any blog that has "weight".

Unfortunately the second option doesn't give a 100% correct list of customisations, unless you kept a copy of your current template at it was at the time when you first applied it to your blog. This is because Google may have upgraded their copy of the standard version of your template, but not been able to upgrade your customised version. (See Advantages and Disadvantages of Editing Your Blogger Template for more about this). However the list that you can make may be close enough - and I used it myself to make sure I didn't miss any details in migrating the blog you are reading now.

This article is about the second option, and how to use the results of the comparison to make a detailed plan for moving your blog from one template to another.

Applying Option 2:

Follow these steps to compare the template from your blog with another un-customised version of the template:

1 Make a test-blog which is like your Real-blog, except it doesn't have the layout-template customisations. See Making a test-blog for more details about this: it's NOT as simple as just copying the template over.
IMPORTANT: If you do have a backup copy of your template from immediately after you last applied a new template to, then apply it to your test blog before giving it any widgets. (Doing this will give you the chance of making a 100% correct list.)

2 Line-by-line, compare the template code in your test and main blogs. For each difference, work out whether it's due to a customisation that you want to keep when you "migrate" your main blog to a new template, or something that you can leave behind.

To do the comparison:

Get the template code for your test-blog by choosing Design > Edit HTML for it, and clicking on Download Full Template. Save the downloaded file somewhere with a name like testBlog-Template.xml

Get the template code for your main blog the same way Save the downloaded file with a name like realBlog-Template.xml

Use a text-file comparison tool to find the differences between the two files.
Comparing two text files using Excel discusses this in more detail, and links to a tool that makes this process (a little) easier.

Note that there may be some differences which aren't explained by modifications that you made to the template: these will be due to improvements that Google have made to the template file. You need to decide how much time to spend investigating each difference, based on how likely it is that you made it.

3 From the list of differences, write a plan of the existing customisations you want to apply to your new template, and also of any new changes that you want to make at the same time. Put it in order of most-to-least important (eg I usually put "load Google Analytics code" just after "apply template, because the statistics are very important to me).

3.5 (optional) Decide which new template to use, and practise the upgrade:
Use the test-version of your existing blog (the one you made in step 1), and give it the new template. Apply the extra customisations from your list. Possibly even copy in some posts from your main blog into it. Test how well it works, and tweak your list of the changes that need to be made when you migrate your real blog.

4 Back up the current template of your blog.

5 Apply the new template you've selected to your blog.

5.5 (Optional) make another back-up of your template - before you re-apply any of the customisations. This will be the basic version that you compare against if you ever need to do this exercise again, so save it somewhere safe.

6 Make the other changes from your plan.

7 Test your blog to see that all is well.

That sounds easy enough. Seven simple steps to a snazzy new-look blog. Let me know how you get on.

Rss:

Top

Labels

Blog Archive