.feed-links {That did it! Who knows why. Certainly I don't...I'm just happy it worked and thought I'd share.
display:none;
}
Sunday, 14 September 2008
Another way to remove "Subscribe to: Posts (Atom)"
While working on a template, I was trying to remove the Subscribe to: from the bottom of the page. For some reason, previous methods that have worked for me in the past, didn't work on this template. I ended up adding this bit of code to the CSS style sheet:
Saturday, 13 September 2008
Related Posts
Have you ever wanted a feature under your post that shows related posts from your blog? I found this way to do it from JackBook.com. It was originally designed by Hoctro with modifications by JackBook. This uses labels/categories that you already have in place to show Related Posts by Category.
There are two steps to this hack. But before you begin, be sure to save your template!
Step 1: Go to your Dashboard | Layout | Edit HTML | check Expand Widget Templates and locate this code:
There are two steps to this hack. But before you begin, be sure to save your template!
Step 1: Go to your Dashboard | Layout | Edit HTML | check Expand Widget Templates and locate this code:
<data:post.body/>Step 2: Place this code after the code you just located:
<b:if cond='data:blog.pageType == "item"'>Save your work and all is done.
<div class='similiar'>
<!-- ***http://hoctro.blogspot.com***Jan,2007**** -->
<!-- ***Related Articles by Labels - Take Two*** -->
<!--
Modified by JackBook.Com to make it easier to use.
1. Now, users don't need to change anything to use this widget. just copy and paste, and done!
2. The current article will also be listed, now it's no more.
-->
<div class='widget-content'>
<h3>Related Posts by Categories</h3>
<div id='data2007'/><br/><br/>
<div id='hoctro'>
Widget by <u><a href='http://hoctro.blogspot.com'>Hoctro</a></u> | <u><a href='http://www.jackbook.com/' title='Related Posts on Blogger Modified by JackBook.Com. Read More?'>Jack Book</a></u>
</div>
<script type='text/javascript'>
var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 100;
maxNumberOfLabels = 3;
function listEntries10(json) {
var ul = document.createElement('ul');
var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i < maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement('li');
var a = document.createElement('a');
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l < json.feed.link.length; l++) {
if (json.feed.link[l].rel == 'alternate') {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k<20; k++) label = label.replace("%20", " ");
var txt = document.createTextNode(label);
var h = document.createElement('b');
h.appendChild(txt);
var div1 = document.createElement('div');
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById('data2007').appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement('script');
script.setAttribute('src', query + 'feeds/posts/default/-/'
+ label +
'?alt=json-in-script&callback=listEntries10');
script.setAttribute('type', 'text/javascript');
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = "<data:label.name/>";
var test = 0;
for (var i = 0; i < labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length <= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel < maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
</div>
</b:if>
Thursday, 28 August 2008
A Round-Up of Free Blogging Icons!
These are some icons I found and thought I'd share. What a fun way to pull together your blog!! And best of all...they are all FREE!! You can download each set from the link under the image.

A set of sweet Irish Icons

Several wild RSS feed icon sets

From DefiantArt

Free Vector Icon PSD Set

Simplistica (has a nice calendar icon!)

Stickers Icons

Sketchy Paper Icons (I LOVE this set)

Valentine Love

Glossy Blogging Icons

Function Icon Set

Bottle Icon Set (cute, cute, cute!)

Coquette Icon Set

Vector Icon Set








Saturday, 23 August 2008
Post Larger Images with Blogger
Have you ever wished that you could post larger images via the Blogger: Upload Images window? I found a neat trick from a reader, Miranda.
This requires a blogger template with extra width in the posting section so it will display the larger images.
Upload your image in the post window, Dashboard | Posting | Create | Add Image icon. After doing that, click on the Edit HTML tab and you will see this image code:
I'm not sure how legal this is. All I know is that it works.
EDIT: Question was brought up about draft users. I didn't realize the image code was different, but it is. So, if you use Blogger in Draft, here is your instructions. Follow the directions above. You will see this image code:
EDIT 09/08/08: Thanks to The A of DNA for: If you don't want it as large as s800 replace it with s576!
This requires a blogger template with extra width in the posting section so it will display the larger images.
Upload your image in the post window, Dashboard | Posting | Create | Add Image icon. After doing that, click on the Edit HTML tab and you will see this image code:
<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfD95WXFoBJGXok5hUIQcZdFNzS208heTaWHIIk3WYuNPb5KC33ktW-v9WIbZsu_mNn06GyrMouRrp45I6yL-KVCTaDbSTkEUWGnu2gbjubwDocmeFyC3t58a9zq_hkpsPkjZa12z1pfv4/s1600-h/DSC_2693.JPG"><img style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfD95WXFoBJGXok5hUIQcZdFNzS208heTaWHIIk3WYuNPb5KC33ktW-v9WIbZsu_mNn06GyrMouRrp45I6yL-KVCTaDbSTkEUWGnu2gbjubwDocmeFyC3t58a9zq_hkpsPkjZa12z1pfv4/s400/DSC_2693.JPG" alt="" id="BLOGGER_PHOTO_ID_5237868380194789154" border="0" /></a>All you change is the s400 to s800! Then you have a nice large image on your blog.
I'm not sure how legal this is. All I know is that it works.
EDIT: Question was brought up about draft users. I didn't realize the image code was different, but it is. So, if you use Blogger in Draft, here is your instructions. Follow the directions above. You will see this image code:
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhA0xM0T2ufp5aJb1Qds4Awt07xPmbWWNY_2glvdgwg6BVaw5Opm7BZaGuSd-VRW3kK5oQ9Fhv720kgSl82lV9Xx7FZa0gfuDITsQ3F1kpqv7wDBq7iOT3JwNtEdSt075iLEpCOT9qfS06v/s1600-h/DSC_2689.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://2.bp.blogspot.com/_OFh1WWXWCHM/SLDBAvBlhrI/AAAAAAAAB7g/kTUthEX2IYc/s320-R/DSC_2689.JPG" /></a></div>Change this s320-R to this s800-R. Where there's a will, there's a way!
EDIT 09/08/08: Thanks to The A of DNA for: If you don't want it as large as s800 replace it with s576!
Friday, 22 August 2008
Blogger Error Messages
Oh. You know them. You've seen them. The nasty red font above your template edit window after you attempt to save your template or even preview your work. Jeering at you with:
Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly. XML error message: Element type "href" must be followed by either attribute specifications, ">" or "/>"
or
More than one widget was found with id: HTML3. Widget IDs should be unique.
Makes my skin crawl. But, you can battle the error message...and be victorious!!
I think the two examples above are probably the most commonly seen messages. At least for me they are. The first example can have a variety of elements in the "href" spot. Sometimes it is like fill in the blank. But, the thing to focus on is the ">" or "/>". I noticed, while working on a template yesterday for Pauls Health Blog, that I kept getting this error...with "div" as the element. It said that a "div" element wasn't closed properly. I checked and checked. Nothing looked out of place. But, the code I put in had "/>" at the end of it. And where I put the code, it already had the closing tag a bit further down. Finally I spied that little "/". That was the culprit. I removed the "/" and was finally able to save the template.
Lesson here is if you get this message, look carefully at the exact code you just put in. Does it have the "/" at the end with the ">"? If so, remove it. Or, controversially, if you get the error and it doesn't have the "/" at the end, slip it in!
The second error message comes up when adding code to your template that has already named the widget. It is easy to fix. Find the culprit in question and renumber it. It doesn't make any difference what number, just as long as it doesn't occur anywhere else in your template. It wants to be unique.
Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly. XML error message: Element type "href" must be followed by either attribute specifications, ">" or "/>"
or
More than one widget was found with id: HTML3. Widget IDs should be unique.
Makes my skin crawl. But, you can battle the error message...and be victorious!!
I think the two examples above are probably the most commonly seen messages. At least for me they are. The first example can have a variety of elements in the "href" spot. Sometimes it is like fill in the blank. But, the thing to focus on is the ">" or "/>". I noticed, while working on a template yesterday for Pauls Health Blog, that I kept getting this error...with "div" as the element. It said that a "div" element wasn't closed properly. I checked and checked. Nothing looked out of place. But, the code I put in had "/>" at the end of it. And where I put the code, it already had the closing tag a bit further down. Finally I spied that little "/". That was the culprit. I removed the "/" and was finally able to save the template.
Lesson here is if you get this message, look carefully at the exact code you just put in. Does it have the "/" at the end with the ">"? If so, remove it. Or, controversially, if you get the error and it doesn't have the "/" at the end, slip it in!
The second error message comes up when adding code to your template that has already named the widget. It is easy to fix. Find the culprit in question and renumber it. It doesn't make any difference what number, just as long as it doesn't occur anywhere else in your template. It wants to be unique.
Wednesday, 13 August 2008
+/- (hide/show, expand/collapse) Labels
I'm on a label enhancement mission. Maybe my drop down menu label method didn't do it for you. Good news! Here is another option for you label makers using the infamous +/- method. This is simple, simple, simple.
Step 1 - Without expanding your widgets, find this code in your template:
EDIT: 08/16/08 - In order for this to work, you have to have a label widget in place. And you have to have posts labeled. So, go to your dashboard | layout | page elements | add a gadget | Labels before trying this code.
Step 1 - Without expanding your widgets, find this code in your template:
<b:widget id='Label1' locked='false' title='Labels' type='Label'>Step 2 - Replace that line with this code:
<b:widget id='Label2' locked='false' title='Labels and Feeds' type='Label'>TaDa! Label those posts!
<b:includable id='main'>
<script type='text/javascript'>
//<![CDATA[
if(typeof(rnd) == 'undefined') var rnd = '';
rnd = Math.floor(Math.random()*1000);
rnd = 'id-' + rnd;
document.write('<a href="#" onclick="tmp = document.getElementById("' + rnd + '"); tmp.style.display = (tmp.style.display == "none") ? "block" : "none"; return false;" style="float:left;margin-right:5px;">');
//]]>
</script>[+/-]
<script type='text/javascript'>
//<![CDATA[
document.write('<\/a>');
//]]>
</script>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<script type='text/javascript'>
//<![CDATA[
document.write('<div id="' + rnd + '" style="display:none;">');
//]]>
</script>
<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<data:label.name/>
<b:else/>
<a expr:href='data:label.url'><data:label.name/></a>
</b:if>
</li>
</b:loop>
</ul>
<script type='text/javascript'>
//<![CDATA[
document.write('<\/div>');
//]]>
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
EDIT: 08/16/08 - In order for this to work, you have to have a label widget in place. And you have to have posts labeled. So, go to your dashboard | layout | page elements | add a gadget | Labels before trying this code.
Tuesday, 12 August 2008
Drop Down Menu for Labels
Hi Annie
I've just successfully used your instructions on adding tabs to my blog and have seriously cleaned up my sidebar, for which I sincerely thank you but, I would like to go a bit further. My Label list is pretty long and I would like to have a scroll bar or drop down menu for it. Trouble is, I can't see how I can get the scroll bar instructions on BlogU to work with the Label page element 'cos there's nowhere to enter the code given and I can't find anything about a drop-down (unless I've passed over it) on your blog.
Just thought it was worth an email to ask advice and to say thank you for the info I've already used successfully. I've recommended your site to a friend and put a link on my blog list ....
My readers are keeping me on my toes! Here is another request...this time for a drop down menu for labels. Here are the steps to accomplish this.
Step 1 - find this code in your template:
<b:widget id='Label1' locked='false' title='Labels' type='Label'>Step 2 - replace that line with this:
<b:widget id='Label1' locked='false' title='Labels' type='Label'>There are a few places in this code to customize it. Change this number to change the width of the box to fit in your sidebar. Change the wording that shows in the first line of your drop down box...to whatever you like.
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<br/>
<select onchange='location=this.options[this.selectedIndex].value;' style='width:200px'>
<option>Labels</option>
<b:loop values='data:labels' var='label'>
<option expr:value='data:label.url'><data:label.name/>
</option>
</b:loop>
</select>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
Now you have a sweet little drop down menu to corral those labels that are getting out of hand. Go now and label with reckless abandon!!!
EDIT: 08/16/08 - In order for this to work, you have to have a label widget in place. And you have to have posts labeled. So, go to your dashboard | layout | page elements | add a gadget | Labels before trying this code.
EDIT: 08/21/08 - If you want to display the label count {trees (5) birds (9) flowers (3)} after each label use this code in Step 2:
<b:widget id='Label1' locked='false' title='Labels' type='Label'>EDIT 09/07/08: Here is an example of the drop down box before expanded and after:
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<br/>
<select onchange='location=this.options[this.selectedIndex].value;' style='width:200px'>
<option>Labels</option>
<b:loop values='data:labels' var='label'>
<option expr:value='data:label.url'><data:label.name/>
(<data:label.count/>)
</option>
</b:loop>
</select>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>


Subscribe to:
Posts (Atom)