How to Beautify Newer Post, Home and Older Post

How to Beautify Newer Post, Home and Older Post
How to Beautify Newer Post, Home, and Older Post

The text that reads Newer Post, Home, and Older Post is a link that serves as a navigation menu to go to the Home page, to the latest post or to go to older posts. This navigation menu is located at the bottom of the comments column. Because the shape of the navigation menu is limited to text, it certainly looks simple or simple. So to make it more beautiful or charming, my friend bloggers need to modify their appearance.

Newer Post, Home, Older Post, New Post, Home, Old Post, how to beautify a blog,

For this reason, I will share about how to modify the appearance of Newer Post, Home and Older Post so that the three texts look beautiful with the appearance of frames and backgrounds that decorate them. To decorate the appearance of Newer Post, Home, and Older Post, my blogger friend only needs a few additions to the CSS code entered via the Blogger Template Designer page. Meaning I don't need to edit the template? 


How to Beautify Newer Post, Home, and Older Post

1.Sign in at blogger.com


2. In the Drop-Down menu select a template


3. Click the modify button


4. Click Advanced and click Add CSS


Copy and paste the following code in color Blue 

blog-pager-newer-link

{
color: # 6E6E6E;
font: bold 12px Helvetica, Arial, sans-serif;
text-decoration: none;
padding: 7px 12px;
position: relative;
display: inline-block;
text-shadow: 0 1px 0 white;
background: # F3F3F3;
background: -webkit-gradient (linear, 0% 40%, 0% 70%, from (whiteSmoke), to (# F1F1F1));
background: -moz-linear-gradient (linear, 0% 40%, 0% 70%, from (whiteSmoke), to (# F1F1F1));
border: solid 1px gainsboro;
border-radius: 2px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
margin-right: 10px;
text-align: center;
width: 70px;
}.
blog-pager-older-link
{
color: # 6E6E6E;
font: bold 12px Helvetica, Arial, sans-serif;
text-decoration: none;
padding: 7px 12px;
position: relative;
display: inline-block;
text-shadow: 0 1px 0 white;
background: # F3F3F3;
background: -webkit-gradient (linear, 0% 40%, 0% 70%, from (whiteSmoke), to (# F1F1F1));
background: -moz-linear-gradient (linear, 0% 40%, 0% 70%, from (whiteSmoke), to (# F1F1F1));
border: solid 1px gainsboro;
border-radius: 2px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
margin-right: 10px;
text-align: center;
width: 70px;
}. home
-link
{
color: # 6E6E6E;
font: bold 12px Helvetica, Arial, sans-serif;
text-decoration: none;
padding: 7px 12px;
position: relative;
display: inline-block;
text-shadow: 0 1px 0 white;
background: # F3F3F3;
background: -webkit-gradient (linear, 0% 40%, 0% 70%, from (whiteSmoke), to (# F1F1F1));
background: -moz-linear-gradient (linear, 0% 40%, 0% 70%, from (whiteSmoke), to (# F1F1F1));
border: solid 1px gainsboro;
border-radius: 2px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
margin-right: 10px;
text-align: center;
width: 70px;
}

a: link {text-decoration: none;}
a: visited {text-decoration: none;}
a: hover {text-decoration: none;}
a: active {text-decoration: none;}


Finally, click Apply to blog


Please consider sharing it with your friends on social media, and don’t forget to follow RAVIEDU on YouTubeTwitter, and Linkedin.

Post a Comment

0 Comments