Check out the Featured Blog Feeds.

Check out the Submission Guidelines.

Showing posts with label *tutorials. Show all posts
Showing posts with label *tutorials. Show all posts

Monday, June 25, 2007

Create A "Link To Me" Form

One way to link to blogs is by using buttons. They can be a nice alternative to text links - especially if the blog name is long.



Some of your readers may not know how to create the image links. You can write a short tutorial like I did but you may find that the html code gets messed up when you post. That's usually due to the long image file names.

You can fix this problem by using a simple html form:



When you right-click in the box and "select all" you can easily copy all of the text.

To create the form I used the following format:

<textarea rows="3" cols="40"><a href="BLOG URL"><img src="IMAGE URL"></a></textarea>

Change the capitalized letters to the appropriate code.

Adjust the rows and columns to fit your post or sidebar. A column width of 20 works for most sidebars in Blogger blogs.

Add the code to an html/javascript widget (in Blogger) titled "Link To Me!" or something similar.



Check out: Buttons, Bows and Badges for Your Blog.

Saturday, March 03, 2007

How To Create A Guestbook In Blogger

Some bloggers may want to turn off comments but still interact with readers. Some bloggers get frustrated with off-topic comments. These bloggers could use third party guestbooks or tagboards but that isn't necessary.

The easiest way to control comments is to create a 'Genaral Comments' or 'Guestbook' post.

  1. Create a post called 'Guestbook'.
  2. Make sure comments are allowed and set the way you want.
  3. Explain what your comments policy is. (It can be as simple as: "Keep comments on-topic or post them in my 'Guestbook'.)
  4. Publish the post.
  5. Add a link to the post to the sidebar.


Note: This won't work if your blog comments are restricted to team members. In that case create a blog specifically for comments and link back to the team blog.

Tuesday, February 27, 2007

Adding A Copyright Notice To Your Site Feed

I added this copyright information to my site feed:

Big Blog Directory is licensed with a Creative Commons Attribution-NonCommercial-NoDerivs license.


To add a footer you have to go Settings > Site Feed and set "Allow Blog Feed" to "Full".

Here is a screenshot:



Update: this is what the feed looks like in Google Reader.

Sunday, February 25, 2007

How To Link To Big Blog Directory

Text Links

Blogger and most other programs can automatically make text links. Previously we had to write out code like this:

<a href="http://bigblogdir.blogspot.com/">Big Blog Directory</a>

...to produce a text link like this:

Big Blog Directory

Text links to BBD are fine. Please remember to use the full name.

Image Links

Using images to link to BBD is easy once you get the hang of it.

An image link usually consists of a button with a symbol and/or some text. The image is uploaded to Blogger or another server just like any other image or photograph.



http://photos1.blogger.com/
blogger2/1176/373809733834064/320/button1..png

The code above is the URL (or address) of the image. I called this one "button1." Blogger added a lot of information which I removed. The URL is all I needed.

To make the button a click-able link you need to set it up like this:

<a href="http://bigblogdir.blogspot.com"><img src="http://photos1.blogger.com/
blogger2/1176/373809733834064/320/button1..png"/></a>

The code above produces an image link to Big Blog Directory:



Here is a different style of button you may use:



http://1.bp.blogspot.com/_jA33IGKDuBw/Rd1-4LBNONI/AAAAAAAAALg/
V0Fw_4Mau8U/s320/BBDbannersmall.jpg

These are my 'standard' buttons. You can also use the ones on my BBD Buttons page.

In most cases it is best to copy the image to your computer then upload it to your blog. If you are really stuck use the image URL I supply.



Because of the length of the image URLs in the above examples I have had to break them up between lines. Copy the code below and insert the image URL.

<a href="http://bigblogdir.blogspot.com"><img src="IMAGE URL"/></a>



Note: The blue button was made with Banner Maker.

Friday, February 02, 2007

Widget Permalink Hack

After I changed the style of my Labels Widget I didn't want people to look all over the blog trying to find it. I thought permalinks might be a solution but didn't know what to look for. I looked at some blogs using the idea and saw the solution.

Each widget has a unique name and is written as "widget id= [widget name]". Here is the Labels Widget:



The name of the widget in the screenshot is Label1. To link to the widget you need to set up the link like this:

<a href="#[widget name]"></a>

Replace [widget name] with the name of the widget you wish to link to. Use an html/javascript widget to place the link in the sidebar.



You can use this hack for any widget. Check out this blog for more ideas.

Thursday, February 01, 2007

"Paragraph Style" Labels Hack

BBD uses a lot of labels. Each blog submitted uses labels supplied by the blogger and I add some administrative ones. I also label the posts I write. The number of labels is growing exponentially.

The Labels Widget in the sidebar was becoming too long. Blogger uses unordered lists (<ul> <li></li> </ul>) to manage labels so the easiest solution was to find the template section I needed and remove the <li> and </li> markers. Doing so changed the list into a paragraph.

The labels paragraph changes to fit the location the widget is placed in. It is wider if placed in the footer and narrower in the sidebar. Now my labels are more manageable.

The image below shows the section of the template that has to be changed. Always backup your template before making changes.



Thanks to Belle for the idea.

Wednesday, January 24, 2007

Tutorial: Creating A Blog With A Booklike Format

People have asked me how to make a blog look and act like a book. Basically they want to create webpages without the usual blog features. Quite often they are fair bloggers but aren't used to modifying templates or working with html.

I decided to create a blog and transform it into one large tutorial. The result is "Blog In Book Format". The "book" works fine but the tutorial needs to be edited again. Have a look and let me know what you think.

Saturday, January 20, 2007

Html Links Within Posts And In Blogrolls

When people asked me for the URL of my blog they sometimes asked how to create the link. I created a links page and wrote:

To link to my journal:

(a href = "http://firemind2.blogspot.com")Firemind(/a) - replace the () with <>.


I then went on to explain how to link to individual posts.

I did it this way because it worked and I didn't know how to display html code in a post.

I have come across several posts showing how to display code in a post. The latest being 'Displaying code inside a post' at Beautiful Beta. A reader (Shelly) left a comment there that led me to Quick Escape - a tool which turns the html into postable characters.

Now I can show examples like this:

<a href="http://bigblogdir.blogspot.com">Big Blog Directory</a>

Blogger makes it very easy to create sidebar links now. We don't have to paste the code into the templates but just add the URL to a link list widget.



If you would like to add a graphic link, such as a button, to your sidebar you need to use a HTML/JavaScript widget and add code like this:

<a href="http://bigblogdir.blogspot.com/"><img src="http://photos1.blogger.com/blogger2/1176/373809733834064/320/button1..png"></a>

The code will create a clickable button like this:

Wednesday, January 03, 2007

Blogger: Using A Widget To Create A Clickable Header

I like using graphic headers in some of my blogs. When I upgraded to the new Blogger I found it difficult to reinstall the headers I had used before.

I have been reading various blogs and experimenting in my test blogs. I finally figured out how to change the template code so that I could use a graphic as a clickable header.



I tried it out at my test blog using a header from 2 Lazy 2 Blog.



I liked the hack and was going to use it at '2 Lazy' until I saw this post at Blog U. The idea was a lot simpler than mine and had the potential to be very flexible. The only problem was that the graphic wasn't clickable since it used the 'Picture' widget . I took my html code and put it in a 'HTML/Javascript' widget instead and it worked. Check it out here.



This is a great way to add clickable graphic headers to your blog.

Wednesday, December 13, 2006

Search Google Using Blogger Labels

I like finding interesting blogs to read and I frequently visit Blog Search or Google Blog Search. These sites are great when keywords are used but they don't support searching by Blogger labels yet. I have found a way to search the Internet using Blogger labels.

Searching with labels in a (beta) Blogger blog takes one to a page called "Showing posts with label blogging." (for example).



Since this is a web page it is searchable in any search engine. You need to use "advanced search" and search for the exact phrase.



Here is an example from Google using "posts with label blogging".

This method doesn't work with every label. The following labels confuse search engines: my starred bbd blog labels (*search for example), #, and 0-9. Since these are only used in BBD that isn't a problem.