Tuesday, December 28, 2010

Blogger Trick: How to Create Blogroll / Links List

1 comments
Blogroll or Links List is a place to store the Link Address on your blog. The reason for you to put other people Link Address in your blog, usually to links exchange. Links Exchange is a mutual link put other people that have a link towards your blog. Links Exchange is very useful to improve the link popularity your blog. The more blogs that have a link to the blog you are, the higher the link popularity your blog, and will be the better your blog in the Search Engine. So, Blogroll or Links List is a very important part in your blog. This time I will tell you How to Create Blogroll / Links List with a few options. Keep Reading.




1. Li

Example:



Here's the code:

<div style="border: 1px solid #D8DFEA; margin: 10px 0pt 0pt; padding: 8px; overflow: auto; width: 250px; height: 100px;">

<li>1.<a href="http://blogwidgetbox.blogspot.com/">Blog Name 1</a></li>

<li>2.<a href="http://blogwidgetbox.blogspot.com/">Blog Name 2</a></li>

<li>3.<a href="http://blogwidgetbox.blogspot.com/">Blog Name 3</a></li>

<li>4.<a href="http://blogwidgetbox.blogspot.com/">Blog Name 4</a></li>

<li>5.<a href="http://blogwidgetbox.blogspot.com/">Blog Name 5</a></li>

</div>

You can setting these:
border: 1px solid #D8DFEA is about border size, type, and color. You can change that.
width: 250px is about box width, can change with 300px, 400px, 500px, etc...
height: 100px is about box height, can change with 200px, 300px, 400px, etc...



2. Marquee

Example:




Blog Name 1

Blog Name 2

Blog Name 3

Blog Name 4

Blog Name 5







Here's the code:

<table border="3" width="250" height="250" cellpadding="2">

<tr>

<td align="left">

<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="down" width="100%" height="250">

<a href="http://blogwidgetbox.blogspot.com/" target="_blank">Blog Name 1</a>

<br/>

<a href="http://blogwidgetbox.blogspot.com/" target="_blank">Blog Name 2</a>

<br/>

<a href="http://blogwidgetbox.blogspot.com/" target="_blank">Blog Name 3</a>

<br/>

<a href="http://blogwidgetbox.blogspot.com/" target="_blank">Blog Name 4</a>

<br/>

<a href="http://blogwidgetbox.blogspot.com/" target="_blank">Blog Name 5</a>

<br/>

</marquee>

</td>

</tr>

</table>


Anyway, you can setting that code. Here's you can set:
scrollamount="2" is about scroll speed. You can change with 3, 4, 5, etc...
direction="down" is about direction. You can change with up, right, or left.
width="100%" is about box width with %. You can change with 80%, 60%, 50%, etc...
height="250" is about box height with pixel. You can change with 300, 400, 500, etc...



3. Dropdown

Example:





Here's the code:

<form>


<select name="menu" onchange="window.open(this.options[this.selectedIndex].value,'_blank')"size=1 name=menu>


<option> - Blogroll - </option>


<option value="http://blogwidgetbox.blogspot.com/">Blog Name 1</option>


<option value="http://blogwidgetbox.blogspot.com/">Blog Name 2</option>


<option value="http://blogwidgetbox.blogspot.com/">Blog Name 3</option>


<option value="http://blogwidgetbox.blogspot.com/">Blog Name 4</option>


<option value="http://blogwidgetbox.blogspot.com/">Blog Name 5</option>


</select>


</form>




4. Post it
If you don't want your homepage looks too much widget elements, you can move Blogroll / Links List to your Post. It's make simple hompepage. See example here.


Now, you just have to choose is. I hope we can do Exchange Links. Please put my banner links in the sidebar to your blog, and tell me. I will do same with you. Good Luck! See you in the next Post.

1 comments:

Post a Comment

Followers

Blogumulus by Roy Tanck and Amanda Fazani
Free Blogger Tips, Hacks, Widgets, Templates and more