Showing posts with label Blogger Tricks. Show all posts
How To Remove Auto Read More Option From Blogger
How to remove auto read more feature from blogger’s blog?
Remove Auto Read more feature from your BlogSpot blog. Manage your blog as you want as we know blogger is most popular blogging service provider we are all thanks full for Google blogger service its make blogging very easy. By using of blogger blog you can publish you blog you don’t need to have extra knowledge of java html or any web development skill.
www.vktechzone.com wants to help to all new blogger who start blogging but they need some help to improve their blog traffic or design.
What is auto read more feature?
Auto read more is automatic feature that make post summary and show in page for read full post you need to click that post this feature is good feature for manage blog easily but some time we don’t want to use this feature. So you can remove this feature.
Why we need remove auto read more feature?
As we know in online market many blogger template are available for use but maximum template come with auto read more feature and you don’t want to break post and you want to show continue post in single page so don’t worry you can remove this auto read more feature.
How to remove auto read more?
Follow Below step
-
Note: Before change in HTML please take template Backup
- Go to your blogger Template option >> Click Edit HTML option.
Now find the below code it will be you find after <div class='post-body entry-content'>code.
Find Below given code
Note: some part of the code can be different, according to your template. But you can find this code easily.
Now replace above code with below Code.Now Save your Template. Your have done it
Now Refresh and Check your site auto read more option has removed from your template.
Incoming keywords
-
remove read more blogger template
June 25, 2015
Blogger Tricks
Add Back To Top Button in Blogger With Smooth Scrolling
Forget old way pressing scrolling button for go to the top and it’s take time to reach to top add new smooth back to top button it’s very cool widget for blogger or webpage suppose your webpage is very long and user wants to go in the top of the page it’s a best way to adding a smooth scrolling button for again go to the top.
How to add back to top smooth button
Follow Below steps for Add Back to top buttong for blogger- Go to Blogger
- Take Backup of your Blog Template
- Search For <head>
- Just Below of <head> past the following JQuery Code only if you are Not yet using Jquery Script on your blog
- Now Add Below Given Code in your blog by add a widget option
- Go to Blogger
- Go to your blog Layout option.
- Now Select Add a Gadget option.
- Now select Html/Java Script option
- Now past the above code in Content area field and press save button.
<script src='http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js'></script>
<!--Smooth Back to Top Button Start-->
<script>
jQuery(document).ready(function() {
var offset = 220;
var duration = 500;
jQuery(window).scroll(function() {
if (jQuery(this).scrollTop() > offset) {
jQuery('.back-to-top').fadeIn(duration);
} else {
jQuery('.back-to-top').fadeOut(duration);
}
});
jQuery('.back-to-top').click(function(event) {
event.preventDefault();
jQuery('html, body').animate({scrollTop: 0}, duration);
return false;
})
});
</script>
<style>
div#page {
max-width: 900px;
margin-left: auto;
margin-right: auto;
padding: 20px;
}
.back-to-top {
position: fixed;
bottom: 2em;
right: 0px;
text-decoration: none;
color: #000000;
background-color: rgba(235, 235, 235, 0.80);
font-size: 12px;
padding: 1em;
display: none;
}
.back-to-top:hover {
text-decoration: none;
}
</style>
<a href="#" class="back-to-top"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7dzI2r6m1BYVz5Weu5N3tvNdzf3Gvlwzht9MKPHomD2lEuX6gdrGAcNInR6MPmfZmeq2Cto0ANatQ9oxIWtv9saD-HvIqJRcDoOCGkGem7LyY_urw1eei8kSLJC0G8M8DnLNHVJdI_80c/s1600/back+to+top+.png" alt="Back to Top" / ></a>
<!--Smooth Back to Top Button End-->
Note:- you can use your favorite image for up arrow Only replace https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7dzI2r6m1BYVz5Weu5N3tvNdzf3Gvlwzht9MKPHomD2lEuX6gdrGAcNInR6MPmfZmeq2Cto0ANatQ9oxIWtv9saD-HvIqJRcDoOCGkGem7LyY_urw1eei8kSLJC0G8M8DnLNHVJdI_80c/s1600/back+to+top+.png with your image URL.
How to Add Html/Java widget? Follow below steps to add Widget
Know more About How to add Gadget In blogger
June 25, 2015
Blogger Tricks
,
Widgets
How to show Adsense ads inside the post in blogger
Increase Adsense earning by showing ads middle in inside the post by adding ad code manually you can show ad but what happen when you want to make some change in post ad it’s very difficult to change in all post ads one by one. Don’t worry friends today in this post I’m going to tell you a trick to show adsense ads inside the post by using this trick you can remove or change ads by making one change in html template.
How to Add Adsense ads inside the post
- For show adsense ad or any other ads in blogger blog post follow below steps.
1st add <!-- adsense --> comment code in your post by HTML section where you want to show this ads our script automatic will replace <!-- adsense --> with your Adsense ad script or with other script you want to use.
- Now we need to add some code in blogger template.
For change in template Go to Template> HTML editor
Press CTR+F and Find <data:post.body/> you will find this several time in template replace second number of <data:post.body/> with below given code if it not working by replacing second number this so undo this and try with 3rd and again it not working again undo this and try this with 4th number <data:post.body/> why we try this with all <data:post.body/> because all blogger templates source code structure is different.
<div expr:id='"adsmiddle1" + data:post.id'></div>
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<div style="clear:both; margin:10px 0">
<!-- Add here the code of your ad -->
</div>
</b:if>
</b:if>
<div expr:id='"adsmiddle2" + data:post.id'>
<data:post.body/>
</div>
<script type="text/javascript">
var obj0=document.getElementById("adsmiddle1<data:post.id/>");
var obj1=document.getElementById("adsmiddle2<data:post.id/>");
var s=obj1.innerHTML;
var r=s.search(/\x3C!-- adsense --\x3E/igm);
if(r>0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+16);}
</script>
Note Replace <!-- Add here the code of your ad --> with you adsense ads code in html encode format use below tool for convert code in encode form.
June 14, 2015
Blogger Tricks
Blogger Conditional tags for show hide widgets
Use Blogger condition if else tag for show or hide widgets in your selected pages like post Archive Page or particular selected URL what this condition tag mean it mean b if condition this tag we use many time in our blogger template you can manage your blog as you want you can choose which widget in which page need to show this tag is very useful adjust widget according to device you can show special widget in mobile page below we have many conditional tags.
How to show Widgets only on Homepage
<b:if cond='data:blog.url == data:blog.homepageUrl'>
Put Widget code here
</b:if>
Put Widget code here
</b:if>
How to Hide Widgets onliy in Homepage
<b:if cond='data:blog.url != data:blog.homepageUrl'>
Put Widget code here
</b:if>
Put Widget code here
</b:if>
How to Show Widgets only in Index
<b:if cond='data:blog.pageType == "index"'>
Put Widget code here
</b:if>
Put Widget code here
</b:if>
How to Hide Widgets only in Index
<b:if cond='data:blog.pageType != "index"'>
WIDGET CODE GOES HERE
</b:if>
WIDGET CODE GOES HERE
</b:if>
How to Show Widgets only in Static Page
<b:if cond='data:blog.pageType == "static_page"'>
Put Widget code here
</b:if>
Put Widget code here
</b:if>
How to HIde Widgets only in Static Page
<b:if cond='data:blog.pageType != "static_page"'>
WIDGET CODE GOES HERE
</b:if>
WIDGET CODE GOES HERE
</b:if>
How to show widgets only in Post Page
<b:if cond='data:blog.pageType == "item"'>
Put Widget code here
</b:if>
Put Widget code here
</b:if>
How to Hide widgets only in Post Page
<b:if cond='data:blog.pageType != "item"'>
Put Widget code here
</b:if>
Put Widget code here
</b:if>
How to Show Gadgets only in Specific Page/Url
<b:if cond='data:blog.url == "URL OF Selected Post"'>
Put Widget code here
</b:if>
Put Widget code here
</b:if>
How to Hide widgets only in Specific Page/Url
<b:if cond='data:blog.url != "URL OF Selected Post"'>
WIDGET CODE GOES HERE
</b:if>
WIDGET CODE GOES HERE
</b:if>
How to show widgets only Post and Static Pages
<b:if cond='data:blog.url == data:post.url'>
Put Widget code here
</b:if>
Put Widget code here
</b:if>
Show widgets in Label Search
<b:if cond='data:blog.searchLabel'>
Put Widget code here
</b:if>
Put Widget code here
</b:if>
How to show in Archive Page
<b:if cond='data:blog.pageType == "archive"'>
Put Widget code here
</b:if>
Put Widget code here
</b:if>
How Show to widget only in First Post
<b:if cond='data:post.isFirstPost'>
Put Widget code here
</b:if>
Put Widget code here
</b:if>
Conditional Tag for Error page
<b:if cond='data:blog.pageType == "ERROR_PAGE"'>
Put Widget code here
</b:if>
Put Widget code here
</b:if>
Show widget Mobile
<b:if cond='data:blog.pageType == "data:blog.isMobile"'>
Put Widget code here
</b:if>
Put Widget code here
</b:if>
Hide widget in mobile
<b:if cond='data:blog.pageType != "data:blog.isMobile"'>
Put Widget code here
</b:if>
Put Widget code here
</b:if>
Apply two condition use <b:else/> tag
<b:if cond='data:blog.url == data:blog.homepageUrl'>
If condition is true.
<b:else/>
If condition is false.
</b:if>
If condition is true.
<b:else/>
If condition is false.
</b:if>
February 25, 2015
Blogger Tricks
Check any blogger blog total post or comments numbers
Know any blogger blog total post and comments number by using below given tool enters ULR of blog click proceed the report button. Note: -- Enter URL without http because http is prefix in this tool source code.
Enter any blogger blog URL to know total post and comments numbers.
Show your blog total number of post and comments number in your blog add widget in your blog
September 15, 2014
Blogger Tricks
,
Tools
Subscribe to:
Posts
(
Atom
)