Monday, June 27, 2011

Make A Box On Blogger Contents


Make a list of contents is very easy, for people who have long experience in bloggers anyway. But for those of us who have not experienced at all what to do? in said it is difficult not, not easy to say. Can say mediocre? like what song is well ....
yes already, do not need lip service, your heart may be so is not it? Okay, just let us hasten you do not run in the cafe, who knows you rent cafe? So sorry.
The trick ya:



1. Login to blogger. Open the Layout -> Page Elements
2. Click the Add a Gadget -> HTML / Javascript. Then enter the code in the following


<style>
.list {
border-bottom:1px dotted #ddd;
line-height:1.2em;
padding:3px;
}
</style>

<div style="overflow:auto; padding:3px; margin:0px 0px 0px 0px; width:380px; height:180px; background-color: #ffffff; border:1px solid #ffffff;">

<div class="list">
1. <a href=" http://cisadane-code.blogspot.com ">post title</a></div>

<div class="list">
2. <a href="http://cisadane-code.blogspot.com">post title</a></div>

</div>

Description:
You need to know. width: 380px is the desired width, change according to the width you want. background-color: # ffffff is the color of the backround and you can change color according to the templates that are customized.

What if I want to add a post? easy, you just copy and paste the following code

2. <a href="http://cisadane-code.blogspot.com"> post title </ a> </ div

And do not forget to replace the number 2 to number 3, and so if you want to add the next post.

3. if it is done live Save your Template. Done.

less good if you use traditional numbers on the title, how to convert it into icon images? there are still really the answer, see the code below. 

<style>
.list {
border-bottom:1px dotted #ddd;
line-height:1.2em;
padding:3px;
}
</style>

Dengan kode
<style>
.list {
background: url("url adress") no-repeat left center;
border-bottom:1px dotted #ddd;
line-height:1.2em;
padding:3px 0px 0px 20px;
}
</style>

Red paper with a URL address change you!

Done, good luck .... hope can be useful is amen 

No comments:

Post a Comment

thank you for commenting on our blogs