add Number Page Navigation widget in BlogSpot/blogger blog ? ( সহজ ভাবে আপনার ব্লকে যুক্ত পেজ নম্বার )

0
339

You can add this widget in your blogger blog by following our three simple steps bellow

Step 1:
  • Go to Blogger Dashboard>> Template>> Edit html
  • Press Ctrl + F and search the code shown below
  • Paste given code before the above line.
<b:includable id=’mobile-index-post’ var=’post’>
  • Paste below code before the above line.
<b:includable id=’page-navi’>
<div class=’pagenavi’>
<script type=’text/javascript’>
var pageNaviConf = {
perPage: 7,numPages: 5,firstText: &quot;First&quot;,
lastText: &quot;Last&quot;,
nextText: &quot;»&quot;,
prevText: &quot;«&quot;
}
</script>
<script type=”text/javascript” src=”http://yourjavascript.com/815315225/www.mybloggerblog.com.js”></script>
<div class=’clear’/>
</div>
</b:includable>
Step 2:
  • Now Find This Code
<b:include name=’nextprev’/>
And Replace <b:include name=’nextprev’/>  code with code shown below.
<b:if cond=’data:blog.pageType == &quot;index&quot;’>
<b:include name=’page-navi’/>
<b:else/>
<b:if cond=’data:blog.pageType == &quot;archive&quot;’>
<b:include name=’page-navi’/>
</b:if>
<b:else/>
<b:if cond=’data:blog.pageType == &quot;item&quot;’>
<b:include name=’nextprev’/>
</b:if>
</b:if>
Step 3:
  • Now Find ]]></b:skin>
  • Copy the below code and paste before the ]]></b:skin>
#blog-pager, .pagenavi {
     clear: both;
     text-align: center;
     margin: 30px auto 10px;
}
#blog-pager a, .pagenavi span, .pagenavi a {
     margin: 0 5px 0 0;
     padding: 2px 10px 3px;
     text-decoration: none;
     color: #fff;
     background: #2973FC;
     -moz-border-radius: 2px;
     -khtml-border-radius: 2px;
     -webkit-border-radius: 2px;
     border-radius: 2px;
-webkit-transition: all .3s ease-in;
-moz-transition: all .3s ease-in;
-o-transition: all .3s ease-in;
transition: all .3s ease-in;
}
#blog-pager a:visited, .pagenavi a:visited {
     color: #fff;
}
#blog-pager a:hover, .pagenavi a:hover {
     color: #fff;
     text-decoration: none;
     background: #000;
}
#blog-pager-older-link, #blog-pager-newer-link {
     float: none;
}
.pagenavi .current {
     color: #fff;
     text-decoration: none;
     background: #000;
}
.pagenavi .pages, .pagenavi .current {
     font-weight: bold;
}
.pagenavi .pages {
     color: #fff;
     background: #2973FC;
}
ভালো লাগলে একবার যেতে পারেন আমার ব্লগ . ইচ্ছা করলে আমাকে ফেসবুক এ আপনার ফ্রেন্ড করেনিতে পারেন আমার ফেসবুক
টিউনারপেজের নতুন টিউন আপনাকে ইমেইল করব?
Unlimited Web Hosting
Unlimited Web Hosting
Unlimited Web Hosting
Unlimited Web Hosting

একটি উত্তর ত্যাগ

Please enter your comment!
Please enter your name here

16 + 15 =