CSS Styling Links

In hypertext systems, such as the World Wide Web, a link is a reference to another document. Such links are sometimes called hot links because they take you to other document when you click on them.. Links can be styled with any CSS property (e.g. color, font-family, background, etc.). Special for links are that they can be styled differently depending on what state they are in. The four links states are:

• a:link - a normal, unvisited link
• a:visited - a link the user has visited
• a:hover - a link when the user mouses over it
• a:active - a link the moment it is clicked

CSS code :

<style type="text/css">
a:link {color:#FF0000;}    /* unvisited link */
a:visited {color:#00FF00;} /* visited link */
a:hover {color:#FF00FF;}   /* mouse over link */
a:active {color:#0000FF;}  /* selected link */
</style>
<b><a href="http://godheg.blogspot.com/" target="_blank">Godheg</a></b>

Result :

Godheg

Read More

How to remove Post Subscribe To Posts (Atom)

Tips and tricks this time is to remove posts Subscribe to posts (atom) which is in the latest version of the blogger template. posts subscribe to: post (atom) or subscribe to: post (atom) is located under the posts serves as a feed from our blog. The goal is that visitors can easily find your feed address. But if you already use a feed from Feedburner service. Then the presence of this writing is not so important anymore.

For those who prefer to not display this section, you may use the following ways:

• Log in to Blogger. Click the Layout -> Edit HTML
• Tick ​​the "Expand Widget Templates"
• Then find the code below:

<div class='feed-links'> <data:feedLinksMsg/> <b:loop values='data:links' var='f'> <a class='feed-link' expr:href='data:f.url' expr:type='data:f.mimeType' target='_blank'> <data:f.name/> (<data:f.feedType/>)</a> </b:loop> </div>

• If you have found, delete the code and then click Save Template
• Please click on View Blog to see results

Look at the picture :

Good luck !!!

Read More

How to set the Unordered List In the Post with Pictures

Well on this occasion I will share about the blogger guide. I will discuss the guidelines Unordered List or change the display which is usually called bullets. Unordered list format is usually used in the post if short sentences outlining the points raised or down is not sorted sequentially and usually preceded by the symbol • (dot). Using Unordered List format also shows that good quality articles, orderly, and neat. It will also attract the visitors on your blog and read one article that uses the format Unordered List in the post. Unordered List view which I will share with you this has attractive mini display icon, bottom border for each sentence, also has a background color.

How to set the Unordered List In the Post with Pictures :

• First step :

Go to your dashboard>>Template>>edit html>>proceed>>check expand template widget. Note : back up your template first. Use ctrl + f and find this code (or similar to this code),  .post-body ul , modified with this code :

.post-body ul,
.post-body ol{
  margin: 1em;
  padding-left: 1em;
}
.post-footer ul{
  margin: 1em;
  margin-top: -0.5em;
  padding-left: 1em;
}
.post-body ul li,

.post-footer ul li {list-style-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0z1LT-n__xtkjdF2Vgct37K3MeVppu2F1p9XWBI5Bc6ZJfBrOnjw-wY3jVqIMJKDirbdBUzobutK6qWbXN3v5kI17-Qu0oAbF6CMkJ6WQyPG8xpqv3w05Ly_rC703uSAzzjHe88m7R2g/s400/uncheck.gif);

  border-bottom: 1px solid #ccc;
  padding: .2em 0 .2em .5em;
}
.post-body ul li:hover,
.post-footer ul li:hover {cursor: pointer;
list-style-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0QIywsK7uLmgMP3Jnj9MI_GCkNpzfybZbxVMbYfhzb1pZfZEptcRSUH5t3_Blz9EnVEYdPDCQMW2tsgVQmtDw9L35PXBfB3zfdfc8K79f4hIsJZP0dGlNkYvb9ZrGHVDlFjhi1yNhaGA/s400/check.gif); background-color: #f2f2f2; color: #B1291F;
}

If your template not yet installed, please put the code under the code .post {................}

• Second step

Save your template.

Read More

How To Hide Blog Title and Description

The purpose of this article is, for those of you who want to put banners in the header of your blog, make sure the blog title and description had been lost. Why? Because, at the time of banner attached. Title and description of the blog will still appear on the header.How To Hide Blog Title and Description. You can follow the following tutorial.

• First step :

Go to your dashboard>>Template>>edit html>>proceed>>check expand template widget. Note : back up your template first. Use ctrl + f and find this code (or similar to this code) :

#header h1 {
font-family:'Segoe UI', Calibri, 'Myriad Pro', Myriad, 'Trebuchet MS', Helvetica, sans-serif;
font-size:26px;
font-size-adjust:none;
font-stretch:normal;
font-style:normal;
font-variant:normal;
font-weight:bold;
letter-spacing:-1px;
line-height:normal;
margin:5px 5px 0;
padding:15px 20px 3px 0;
text-transform:none;
}
#header .description {
color:#999999;
font-family:georgia;
font-size:12px;
font-size-adjust:none;
font-stretch:normal;
font-style:italic;
font-variant:normal;
font-weight:normal;
letter-spacing:0;
line-height:normal;
margin:0 5px 5px;
max-width:700px;
padding:0 20px 15px 0;
text-transform:none;
}

Add code display: none; at the end before closing the code }as below :

#header h1 {
font-family:'Segoe UI', Calibri, 'Myriad Pro', Myriad, 'Trebuchet MS', Helvetica, sans-serif;
font-size:26px;
font-size-adjust:none;
font-stretch:normal;
font-style:normal;
font-variant:normal;
font-weight:bold;
letter-spacing:-1px;
line-height:normal;
margin:5px 5px 0;
padding:15px 20px 3px 0;
text-transform:none;
display:none;
}
#header .description {
color:#999999;
font-family:georgia;
font-size:12px;
font-size-adjust:none;
font-stretch:normal;
font-style:italic;
font-variant:normal;
font-weight:normal;
letter-spacing:0;
line-height:normal;
margin:0 5px 5px;
max-width:700px;
padding:0 20px 15px 0;
text-transform:none;
display:none;
}

• Second step:

Save your template and see the results.

Read More