Posts

Showing posts with the label blogspot hack

How to Create Hyperlink on Blogger Header

Image
Today, I got this question in comment of my previous tutorial on How to Create Hyperlink on Blogger Post . Barbara Fowlds L.Ac. : "Can I put a hyperlink in my header of my blogspot blog and if so how?" My answer is Yes you can. And here's how to do it in the simplest newbie way. Before that, I assume you may wanted to add this hyperlink on your Blogger Header Description because maybe you want to invite your visitor to your business website or any other sites you have. For example, I may like to invite my blog reader to read my art blog at http://artofapogee.blogspot.com and my blog description says something like this: Feel free to visit Art Of ApOgEE Blog to see my arts and order some graphic design books And now we wanna link that blue "Art Of ApOgEE Blog" to http://artofapogee.blogspot.com This is the simplest way. You just have to copy paste and no coding . Here's the step: Open up New Post on you blogger, select Edit Html and type the words there: Se...

Fixing Read More link appear on Blogger Fullpost

Image
Thanks to Paul Escolar who really use my code on 'How to create expandable post summaries in Blogger' and spot a bug on that tutorial. Hence my code for this blog is already changed for other additional stuff. Sorry for that silly mistakes . As I went to debug my tutorial, I found that whoever follow that tutorial properly will get the same result as Paul's blog. So, here is the explanation and how to fix it. Please check at the last chunk of code on 'Step #1 - Edit your template code' . The old code should look like this: <b:if cond='data:post.labels'> <b:loop values='data:post.labels' var='label'> <b:if cond='data:label.name == &quot;more&quot;'> <a expr:href='data:post.url'>...<b>Read more</b></a> </b:if> </b:loop> </b:if> where the previous screenshot is this: What this code do is checking the 'more' label and put that ...

How to create expandable post summaries in Blogger

Image
I've been tweaking my blog template because I've already bored with my old default template that I use previously. While working on this template, I'm thinking that it may be cool to have my long post to be truncated and have the "read more" link . I found the code from Blogger Help to do this. However, there is one issue with their code where the "read more" link will appear regardless of whether a post has been truncated or not. You can check it out at help.blogger.com on How can I create expandable post summaries? . If you have already read them, you should notice the disadvantages under the Note list which says: Disadvantages: Requires changes to the posts themselves, rather than to the template only. However, the "read more" link is in the template, so it will appear regardless of whether a post has been truncated or not. (Modifying this feature is left as an exercise for the reader.) Do you think it is a good exercise? So, how many of...

How to Create Hyperlink on Blogger Post

Image
Well, this time I make a basic simple tutorial. For all advanced geek who read this blog, please ignore this post... I just wanna help myself not to teach the same basic thing on every newbies friends that really need help. OK guys, back to the howto... There are two ways to create a hyperlink on your blog post. One is the simple GUI way and the other is coders way. I prefer the coder way as I can have more control on it. I like to teach by example. So, let say you wanna create a hyperlink on this line of words... You can go here to see my art blog where you wanna link the word "here" to the other page on your blog or on the internet. In this example, I wanna link it to my Art Of Apogee Blog post with the address: http://artofapogee.blogspot.com/2008/03/gimp-best-free-photoshop.html And here is how to do it using both ways... The simple GUI way If you rollover every button on your Compose toolbar, you can see one button called "Link" where the word Link will pop u...

How to Show and Hide Text in Blog Post with teaser

Image
As my reply to Andrea's question in the comment section of my previous post on How to Show and Hide Text in Blog Post , Here is how to show and hide text in blog post with something like 300 words teaser before the link to read the rest of the story... Click here to read more... This post is already the example to show that it is possible to use the same technique in my previous show/hide blog post article to have a teaser before the link to show the rest of the story. What I've done here is just placing the "span" tags at the right position where i wanted it to be. To make it short and clear, here is the sample template to this kind of blog post... --- Place your 300 words teaser here --- <span class="postshown" id="your-topic-link-id-0001"> <a href="javascript:expandcollapse('your-topic-link-id-0001'); expandcollapse('your-topic-id-0001');"> Click here for more...</a></span> <span class="...

How to Show and Hide Text in Blog Post

Image
I would like to share on how to make a Show/Hide text in your blog post. I'm sorry if I didn't explain detail enough because I want to keep my post short as I'm in a hurry. However, you can read the detail explanation on Blogger Help . In this example, I assume you have sub topics that you want to make it hidden until reader clicks on the headline. Without the show/hide trick, it would look like this... Title One This is the example text for title one. Title Two This is the example text for title two. Title Three This is the example text for title three. Here's my step to do this... Firstly, edit your template and add the following code in the CSS area. .posthidden {display:none} .postshown {display:inline} Then add the following javascript code on your blog template between the <head></head> tag. <script type="text/Javascript"> function expandcollapse (postid) { whichpost = document.getElementById(postid); if (w...