Make Blog Pager With Image 2

Next Post, Prev Post, Newer Post, Older Posts, Home, etc or usually displayed in other similar plain text are example of blog pager.

My previous article was to share tutorial about how to customize blog pager with image.
http://feelwantsearchlearn.blogspot.com/2013/07/make-blog-pager-with-image.html

The above article has shown you the way to change blog pager to image by changing codes on HTML Structure Integration.
*In an easy interpretation : HTML Structure Integration normally located  below    ]]></b:skin>

Here I'm going to share with you (especially beginners in blogging) another way how to change the display of the blog pager to image by adding some codes on CSS Style Integration.
*Again in an easy interpretation :  CSS Style Integration normally located  above    ]]></b:skin>

Copy these codes and paste them anywhere  above   ]]></b:skin>
OR  it will be better if you can easily find on css area the codes related to blog-pager, then paste / add the below mentioned codes to them.

.blog-pager-older-link,.blog-pager-newer-link{width:32px;height:32px;display:block;text-indent:-9999px;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmTd_umMM5XUKPwaWMsLjwPpjFpJ2rQqLGh0JL_e2NPexc1aCxsPVB_tXOh-uITduoWjLPSF3fb4ntmHT52-0a7dBxuExZ-9iUbbp-tSrhzfliap14k4iXGiNx0qn9ZMthLRESou9M_MEi/s1600/rightarrow.png);background-repeat:no-repeat}
.blog-pager-newer-link{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxHQ4u_RDIwHi2mZvUF9wcn5brmHsvmYGxSqhavYhqYvmy1DsP58gOA8mW8Tx-3r5ETwn1NtScNH1mlwzyty3SG4J2sQ8IufmCDp-5nJ7v6LBYJ4iEdpXnxLxh0rqadMFSYAL8-cYQzb9F/s1600/leftarrow.png)}
.blog-pager-older-link,.blog-pager-newer-link{width:32px;height:32px;display:block;text-indent:-9999px;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmTd_umMM5XUKPwaWMsLjwPpjFpJ2rQqLGh0JL_e2NPexc1aCxsPVB_tXOh-uITduoWjLPSF3fb4ntmHT52-0a7dBxuExZ-9iUbbp-tSrhzfliap14k4iXGiNx0qn9ZMthLRESou9M_MEi/s1600/rightarrow.png);background-repeat:no-repeat}
.blog-pager-newer-link{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxHQ4u_RDIwHi2mZvUF9wcn5brmHsvmYGxSqhavYhqYvmy1DsP58gOA8mW8Tx-3r5ETwn1NtScNH1mlwzyty3SG4J2sQ8IufmCDp-5nJ7v6LBYJ4iEdpXnxLxh0rqadMFSYAL8-cYQzb9F/s1600/leftarrow.png)}
.home-link{display:none}
.feed-links {
margin-top: 10px;
clear: both;
line-height: 2.5em;
}

Note: The URLs in blue are the image url. You can also change with other image you like if you want :))).

Pretty easy isn't it?. Happy blogging!