How To Replace Newer, Older & Home Navigation Links With Image Buttons

Important!!! Back Up your Template before Making any changes in Template.

1. Go to Blogger Dashboard -> Design tab -> Edit HTML tab
2. Click on Expand Template Widgets checkbox

Replacing The Older Link
Search for <data:olderPageTitle/> and replace with below code



<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrE0hpzzdeiuhuXo88DNSykX2I2MJvtbjtysJZkdgBs_jDnibjfPQyLROo886pW-t1k8W7d2avi0n4oY_54b9z0iU-G7fFf4q8FnsYZREH3gnuGDAiCmaM5qVbWuaycV5Md6j0lhPI4dZR/s1600/w2b_next.png' style='border: 0 none;vertical-align: middle;'/>




Replacing The Newer Link
Search for <data:newerPageTitle/> tag and replace with below code



<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlNRSiUi397yRKxGn-TOFmaTwTvr3rhoUvPxVsxu6BvjrlWUSX2kTZulaz13UNN4wGGFqEorAghfYxIHJSaiW00mTVGN1AihC2ejtbztSmXzHil5y3u-ZhnZ-qynT3wC0jKZuZDMoFcDq1/s1600/w2b_prev.png' style='border: 0 none;vertical-align: middle;'/>

Replacing The Home Link
Search for <data:homeMsg/> tag and replace with below code



<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjCARSK9Gc5EtqIaUMkwuM2BwtUOlZRVnv9-YPnkGVxvZCFYp2TonIaqeU11xDOCbocsO4AeE2bUYXvxFwWno28GgjEEPX_K2G3mqJeMxshM9PsrZleIkXtHlvshtqJVHKX70IGCd1avxb/s1600/w2b_home.png' style='border: 0 none;vertical-align: middle;'/>

You can change your own icons by replacing the image Url in the above three codes.