Submit Blogger Sitemap to Google Sitemap Easily

To ensure proper search engine coverage you must submit your Blogger blog’s sitemap to Google Search Console (formerly known as Google Webmaster Central and then Google Webmaster Tools). A sitemap consists of all the pages of a particular blog or website. Sitemaps tell the search engine about the contents of your website.  In other words, they help search engines to find, crawl and index all of your website's content, e.g. posts, static pages, videos, images, and other files. In short, sitemaps determine the ranking of your blog.

The method of Blogger’s sitemap submission is relatively easy. All Blogger blogs have automatically generated sitemap which contains all links to posts published on your blog. Moreover, there is also an option to submit all of your static pages. But the first step is to find your sitemap files which you can complete in the following manner:

Finding your sitemap URL

For Posts:

https://yourblogname.blogspot.com/sitemap.xml

For Static Pages:

https://yourblogname.blogspot.com/sitemap-pages.xml

Explanation with example:

Replace the “yourblogname” with your blog’s address. For instance, to fetch my blog’s sitemap I have to make the following modifications:

https://lifebd360.blogspot.com/sitemap.xml

https://lifebd360.blogspot.com/sitemap-pages.xml

Adding your sitemap URL to Google Search Console

To submit your sitemap(s) you must have to add your site into Google Search Console. If you already have it done then ignore Step 2 & 3 and follow Step 1, 4, 5 & 6.

Step 1: Log in to Google Search Console.

Step 2: Click on “Add property” and under “Select property type” enter your blog’s URL and hit “Continue”.

Step 3: From “Verify ownership” expand “HTML tag Add a meta tag to your site's home page” and copy the meta tag inside <head> section of your blog’s template.

After saving your template return to Google Search Console and click “Verify” 

Step 4: Log in to your Search Console “Dashboard”.

Step 5: From the left sidebar go to “Sitemaps”

Step 6: Under “Add a new sitemap” field enter your sitemap URL for posts and hit “Submit”. To submit a sitemap for static pages, follow the same step.

Getting most out of your sitemaps

https://yourblogname.blogspot.com/sitemap.xml is Blogger’s default sitemap format and it has a very limited scope for discovering site’s content. Simply speaking, this sitemap will tell the crawlers about the most recent 25 posts only, which doesn’t sound good at all. However, you may bring some changes to it to maximize its capabilities. 

For 500 recent posts:

 
The following model is applicable of telling the search engines about 500 recent posts. Just replace the “yourblogname” with your blog address:

https://yourblogname.blogspot.com/atom.xml?redirect=false&start-index=1&max-results=500

When you are done with the alteration then submit the URL to the Google Search Console as per the method mentioned above.

For 1000 recent posts:

However, what happens when your blog reaches 1000 posts? Well, don’t worry, you then have to submit another sitemap to Search Console in the following format:

https://yourblogname.blogspot.com/atom.xml?redirect=false&start-index=501&max-results=1000

Thanks for reading. Hope I have been able to explain the sitemap submission procedure most simply. However, if you still have any queries, please let me know either in the comments section or via the contact form.

Read More

How to Add EvaDav Native Push Notifications Widget on Blogger

Push Notifications ads have opened a new ground for the publishers to earn revenue while keeping their visitors less-irritated. EvaDav offers a new way to monetize your traffic with push notifications. So, can you use it on Blogger.com blogs?

EvaDav’s Native Push Notifications widget is a convenient way to engage the audience as well as earning some good revenue. So, can you install it on Blogger.com blogs? Although apparently, it looks impossible, we still can do this in a rather unconventional way.  Therefore, in this tutorial, I will show you the techniques to implement EvaDav’s Native Push Notifications on your Blogger.com blog.

What are Push Notifications?

These days digital advertising tends towards user-centric ad formats. The goal is to adopt some familiar technique that will not only ensure a non-intrusive ad experience for the visitor but also create a scope for hassle-free earning to the publisher. Such an endeavour culminated into the development of Push Notifications or Native Subscriptions ads.

The idea of Push Notifications ads stemmed from the traditional Web Push or Web Push Notifications, which the users are already acquainted with. Formerly this technology was used only as a content delivery channel. But now it has become a very effective and lucrative advertising tool. The technique is very simple: when the visitor visits your blog he will be shown a message box with an option to subscribe to your blog. If he opts to subscribe then he will receive notifications from your blog. Specifically speaking, the notifications will only be sent to those who have subscribed to these notifications from a specific website from browsers like Firefox, Chrome, Opera, Safari, etc.

This technology is capable of sending messages very quickly. Subscription to Push Notifications means the user will be constantly connected with a particular site until he unsubscribes. So why is it getting popular day by day? The answer is simple: its simplicity. The user just needs to click “allow” to subscribe to Push Notifications. After that, he has to do nothing at all. He will automatically receive notifications whether he stops visiting your site or keeps his computer/device off. The interesting part is that it supports desktops, tablets and even mobile phones. And the user can unsubscribe anytime from the browser’s setting.

EvaDav Push Notifications

At present, a number of ad networks started offering Push Notifications ad service. EvaDav is one of the best ad networks to offer such ad format. Their Push notifications have already proven as one of the most attractive advertising tools for publishers across the globe. EvaDav’s Push notifications ads are distinguished for their fast integration, high-quality content, and the highest eCPM rate among all advertising formats.

EvaDav Native Push Notifications work in all GEOs. Whenever a visitor visits your blog he will be asked to subscribe to your push notifications. If he clicks “allow” then you will start monetizing from this subscription. Like many other Web Push Notifications, EvaDav will serve notifications, however, based upon the frequency set by you. The notifications will contain ads by EvaDav.

How to install EvaDav Native Push Notifications Widget

1. From the EvaDav dashboard, go to the menu item “Streams”.
2. Click on “Widgets”.
3. Click on “Create Widgets”.
4. Select “Native” radio button.
5. Fill in the “Name” field.
6. Fill in the field “Domain: (HTTPS only)” with your website address, e.g.: https://yourblog.blogspot.com.
7. Give a Custom service worker name (optional).
8. Exclude ad categories (optional) – use these option to filter ads from certain verticals, e.g. adult, grey, software, etc.
9. Push notification frequency (optional) - you can set the frequency of push notifications to your subscribers:

- Low - 4 push notifications per day.
- Medium - 8 push notifications per day.
- High - 12 deliveries of push notifications per day.
- Turbo - 16 deliveries of push notifications per day.

10. Display delay (optional) – Set the time to popup (max 30 seconds).
11. Background Darkening (optional).
12. Prompt constructor (optional) – use this option to create your own stylized widget.
13. Click on "Create".
14. Wait for moderation.
15. Upon approval click on “Get code “and do the following:

- Download evasw.js file and upload it to the root directory of your website.

- Copy and place this ad code on your website.

How to upload evasw.js file to the root directory of your Blogger site?

I always wanted to add EvaDav Native Push Notifications widget on my blog since it is safe to use with AdSense ads. However, I couldn’t do so because it is not possible to access Blogger’s root directory to upload a .js file. Whenever I tried to create such widget my request was rejected with the following message:

“Native widget cannot be implemented on your blog due to absence of the access to the root directory of the site.”

Since we cannot upload it to Blogger’s root directory, now the only trick is to host the .js file to somewhere else. You can easily do this on Firebase by following this tutorial. However, in this way your site performance will drop off. So, what to do? Well, there is a simple solution, just read and follow:

Step-A

Follow Step-1 to Step-13 as stated above. And expectedly you will be stuck in Step-14, i.e., widget moderation. Since you will be rejected you won’t be able to access to the ad code, i.e., Step-15. But it’s not the end of the world; you just need to contact the EvaDav Support Team for manual activation. Upon receiving a convincing explanation from your end, the support team will activate the widget for you. And then you will be able to access the ad codes.

Step-B

Click on “Get code” and download the evasw.js on your computer.

When the download completes, open the file with notepad. You will see a code like this:

importScripts('https://metosk.com/v1/sw-import.js?h=waZQiOjEeYzYwMTIsInNpZCI6XTA0MDU2Niwid2lkIjo3ZzIxNiwic3JjIjoyLCJwbSI6MR0=eyJ&d=yourblog.blogspot.com');

Step-C

Copy the above code and put it inside the following javascript tag:

<script type='text/javascript'>
//<![CDATA[
importScripts('https://metosk.com/v1/sw-import.js?h=waZQiOjEeYzYwMTIsInNpZCI6XTA0MDU2Niwid2lkIjo3ZzIxNiwic3JjIjoyLCJwbSI6MR0=eyJ&d=yourblog.blogspot.com');
//]]>
</script>

Step-D

Now from the Blogger dashboard click on Theme (Template) menu from the left sidebar. From the template window, click on the Edit HTML button and search for the </body> tag and paste the above code right above it.

And in this way, you have successfully installed the evasw.js file. But don’t save your template before adding the ad code! Just follow the next step:

Step-C

From EvaDav dashboard click on “Get code” and copy the ad code and place it just above </body> tag of your Blogger template.

Save the template and you are done!

All steps are completed; if you did everything right the widget will start appearing. Meanwhile, you may open your blog in a browser and test whether the widget appears. And when all is set perfectly your first earnings will appear in statistics.

Read More

Yllix Ad Network Full Review (2020 Update)

If you are having a hard time to get an AdSense account then yllix could be a good option for you. yllix is a Panama-based ad network formed in the year 2012. It is a part of Advertica, an international online advertising company. Their top advertisers include Amazon.com, Coca-Cola, Audi, Citibank, Gucci, Travian, Apple, Yahoo, Adidas, Rolex, American Express, Visa, BMW, eBay, Bentley, and Intesa Sanpaolo.

With years of experience in the internet advertising business, yllix emerges as one of the best ad platforms which is particularly good for the new bloggers. They approve accounts instantly and accept almost any website. The best part is that they even approve Blogspot sites. Above all, you can use yllix ads alongside AdSense to maximize your revenue.

They follow CPC, CPM, and CPA models of revenue. However, yllix displays only CPA ads on non-verified sites. You will not earn a single cent if any clicks are not converted into action. And, naturally, the earning for non-verified sites is extremely low. However, If your traffic quality is better (i.e., a CTR of at least 0.25-0.3% with a solid conversion rate: at least 0.5-2%, depending on the ad formats you use), you would be automatically verified in their system. In such an instance, they will also serve you better-paid premium CPM, CPC and CPA ads.

yllix also provides you with an opportunity to earn through their referral program. They will pay you up to $100 for each new active publisher or advertiser you refer and also a 2% share of their lifetime earnings or spending.

Finally, you must also remember that like many other mainstream ad networks, yllix may also ban account or deny payment if anyone violates their terms and conditions.

Ad Types of yllix

• Banner Ads: These are the most common ad types. yllix offers JavaScript banner ad tags that display a wide variety of ads like text ads, static image ads, animated image ads, video ads, flash ads, as well as external 3rd party ads.
• inApp Banner Ads:  These are iframe-based banners ads specifically intended for iOS and Android applications.
• Redirect Ads: These ad types redirect the visitor to an advertiser’s website.
• Slider Ads: These ads slide from a specific location and remain visible unless the visitor terminates it. This ad tag displays all sorts of banner ads such as text, image and video ads as well as external 3rd party ads.
• PopUp / PopUnder / TabUp / TabUnder Ads: Will pop up, under or in a tab arbitrarily.
• Push notifications: The visitors will be able to subscribe to push notifications from your site. You will earn revenue for each subscription.
• Direct Link: This is a link that will directly redirect the visitor to the advertiser’s website.

 NB: As per yllix support team, apart from Mobile Redirect and Push Notifications, all of their ad formats are compatible with AdSense.

Payment Method of yllix

• PayPal
• Bitcoin 
• Payoneer
• Bank Wire 
• eZ Cash (Sri Lanka)
• Bank wire transfer

Minimum Payout Threshold

• $1 for PayPal.
• $10 for eZCash and Bitcoin payments.
• $50 for Payoneer payments.
• $100 for international bank wire payments.

Advantages of yllix Ads

• Instant and fast approval.
• Blogspot blogs are allowed.
• Professional-looking easy dashboard.
• Diverse choices of ad formats.
• $1 minimum payout.
• Daily payout facility.
• 100% worldwide fill rate.
• Compatible with AdSense.
• Referral program.

Disadvantages of yllix Ads

• Un-user-friendly ads.
• Low-quality ads.
• Low CPM rates.
• Low CTR.

To conclude, AdSense should be your top choice if you would like to earn by publishing ads. In case, if you fail to get an approval of AdSense then you may opt to use yllix ad network. But the earning will surely be insufficient when compared to AdSense. But still, yllix could be the best alternative to AdSense for sites having limited hits.

Rating of yllix

Read More

Can You Use Google AdSense and EvaDav at the Same Time?

AdSense has long been the number one choice for ad publishers. The reason is, perhaps, the lucrative revenue share they offer. On average, Google pays out 68% of their AdSense revenue. That means if the advertiser pays $100 then the publisher will be paid $68. Although these sound very tempting, it is not easy to get approval for AdSense. Moreover, nowadays many publishers complain that their revenue has dropped remarkably without any obvious reason.

Due to the sudden drop of AdSense revenue, many publishers are searching for the best AdSense alternatives. There are a number of ad networks for prospective publishers. However, not all networks will provide approval for small publishers. Above all, not all ad networks are compatible with AdSense either.

Therefore, today I am going to share with you an ad network that gives instant approval for any sites, even blogspot.com blogs. It is EvaDav by name, which is not only compatible with AdSense but also good in terms of the ratio of revenue share (shares 70% revenue with publishers).

EvaDav mainly offers push notifications ads. And it also has an ad format which could be used alongside AdSense. The best ad format for the aforesaid case is In-page widget. An In-Page widget is functional in all browsers and all the platforms, including iOS. It is applicable for a fresh audience that has not tired of the push format yet. And its conversion rate is 25% higher than with regular fresh subscriptions.

How to create In-Page widget

To create the In-page Widget you need to go through a few simple steps:


Firstly, you have to create a “Stream” in the following manner:

1. Login to your account;
2. From the menu go to "Streams"; [view snapshot]
3. Now click on the “Create Stream” button;
4. When a popup appears then give a name of the stream, e.g. “New Test Stream”; [view snapshot]
5. Click on the "Create" button;

Secondly, you have to create the widget:

1. If you have completed step-5 as stated above, you will be automatically redirected to the “Create Widget” section. In case you are not automatically redirected then you have to manually follow these steps: “Streams” → “Widgets” → “Create Widget”;
2. Now, under “Push Notifications” section, select “In page” radio button; [view snapshot]
3. Under “Name” filed write a name, e.g.: My-In-Page;
4. Under “Domain” field write your blog’s or site’s address, e.g.:https://yourblog.blogspot.com;
5. Fill up “Exclude ad categories” if you wish to exclude any particular ad categories (optional). But using this option will decrease revenue;
6. Under “Display delay” field you can specify the delay of appearance of the popup (optional);
7. Set the position of the popup under “Widget placement” field;
8. Under “Pause after click” you can set the delay time (in minutes) for displaying the next in page push after visitor clicks on it;
9. Under “Pause after close” you can set the delay time (in minutes) for displaying the next in page push after visitor close it;
10. Now click on the “Create” button. After a few minutes, the widget will be activated after moderation;
11. Click on “Get Code” button; [view snapshot]
12. Click “Copy” button; [view snapshot]
13. Paste the code inside <body> tag on your site.

How to implement ad code on Blogger?

1. Login to blogger.com and enter the dashboard of your blog;
2. Now, click on “Theme” from the left sidebar;
3. From the template window, click on “Edit HTML” button;
4. Search the code for the <body> tag and insert the code right after it;
5. Click the “Save theme” button.

How to implement ad code on WordPress?

1. Log in to your WordPress admin panel;
2. Go to “Appearance” → “Theme editor”;
3. Navigate to the right sidebar file list and find “Theme Header” (header.php);
4. Search the code for “<body” fragment and add the widget code right after it.

Are you interested, try now and earn with EvaDav alongside AdSense

Read More

10 Ways to Optimize Blogger Blogs for SEO

Doing SEO in Blogger is quite simple and in this article we will introduce several basic techniques so that you can improve your blog’s search engine coverage.

Although I have been using Blogger for quite a long time, still I don’t like it for its limited scope for search engine optimization. Contrariwise, this is very easy on WordPress since it allows using plugins for the aforesaid purpose. But you cannot install Yoast SEO or any other equivalent plugins on blogger. SEO plugins have a check list built-in that tells you if you're doing things right or wrong. So you will have to do everything manually, which is a bit inconvenient.

However, don’t get disappointed because you should remember that SEO does not depend on plugins, rather it depends on your way of organizing your contents. And SEO is absolutely unpredictable; none can assure you that his or her technique will work 100%. Thus to be successful you need to progress though trails and errors.
 
Next we will show you 10 simple techniques that will make you blog optimized for search engines.

SEO tips for Blogger blogs

Download THE-ULTIMATE-SEO-BOOK for more SEO tips & tricks

1. Take the advantage of the custom permalink feature

By default blogger offers automatic permalink, which is not at all search engine friendly. I’m saying this because the automatic permalink includes the date of post publication, a feature that destroys the cleanliness of the link. Therefore, you should try the Custom Permalink feature to personalize your permalink.But keep your permalink clean so that it doesn’t look spammy. You may change the permalink while writing/editing a post.

2. Create the most worked blogger titles

You must limit your post title length up to 50 characters so that search engines do not cut them when displaying. Moreover, your post title must include your major keywords.

3 Add a keyword-rich search description

It is important to write a search description between 120 to 170 characters counting spaces.You need to summarize the entry carefully and include the major keywords. But take care that it is done properly. If it is not successful Google may ignore it or use another part of your post.

4. Place your keywords in the relevant parts of your post

You must try to place your keywords in different parts of your post. But you have to complete this task tactfully; otherwise your post will lose its natural flow. The trick is to add them in the headings and subheadings, first 120 words (introduction), and conclusion. And I have already said about addition of keywords in the post title. However, do not load your entire post with keywords since this will not only annoy your readers but also push Google to lower your search engine rank.

Download THE-ULTIMATE-SEO-BOOK for more SEO tips & tricks

5. Articles must be interesting and unique

Try to write articles of more than 600 words but do not make them too lengthy since this will make your audience bored. But the most important part is that your article should respond to the doubts or expectations of your readers. If you can provide fresh and useful ideas, then your blog will receive broad search engine coverage, no doubt. However, do not waste your time copying contents from other bloggers because this practice will ultimately damage your SEO ranking.

6. Share on social networks

Whenever you write an article just post its link on the popular social media sites, such as Facebook, Twitter, Pinterest, Instagram, Tumblr, etc. The links of the social networks make your content look relevant to the search engines. So share your content on the social networks, circulate it in groups and try to make it viral.

7. Add attractive images with alt tags

Images make an article interesting, so try to use images in the relevant places of your article. But always add alt tags to all images, because they aid the search engine crawlers to index an image properly. Fortunately, Blogger offers a very easy way to add image alt tags.

8. Put your keywords in bold and italic

This is probably one of the widely suggested techniques. However, the mainstream researchers doubt about its effectiveness. However, you should remember that styling the text helps the reader the reader to scan it better visually. In this way the user experience will improve and they will easily connect with your content.

9. Promote your old posts with internal links

You should cleverly include links to some of your old posts within your latest post. Internal links help to encourage readers to spend more times on your blog. In this way a trust is built and you continue to get benefited from it.

Download THE-ULTIMATE-SEO-BOOK for more SEO tips & tricks

10. Make your blog load faster

Although loading time is not a prerequisite for better search engine coverage, it might somehow control the reader's engagement. In fact, nobody likes to visit a slow blog. Moreover, there is a possibility that Google may also penalize you if your blog continuously loads slowly. So make your blog as fast as you can.


Courtesy: Photo by Andrew Neel on Unsplash

Read More

How to Host JavaScript Files on Firebase for Blogspot Blogs

I have been with Blogger.com since year 2008. To this date I run several blogger blogs on different niches. All of my blogs are embellished with custom templates. Since Blogger doesn’t provide too many useful widgets, I do have to use some custom ones. But in order to achieve that I have to rely on JavaScript. But Blogger does not have any dedicated hosting service for JavaScript files. Therefore, most of the time I have to use some third party sites to host JavaScript files. I preferred Google Drive and yourjavascript.com. But unfortunately the former has shut down their service for hosting JavaScript files, while the latter has been malfunctioning every now and then. When Google Drive ceased its service, I tended towards yourjavascript.com. But as their service is being interrupted I sought for an alternative. Then after lots of Googling I have come across with Firebase, ironically, another storage service by Google! Up till now which is allowing bloggers to host their JavaScript and CSS script files for free.

Just as Google Drive, Firebase is also a storage service. Here the users can upload and store their images, videos, CSS, and JavaScript files. Users can upload files from Windows PC, iOS, and even Android Device. If you are a Blogger user then you should store your CSS script files or JavaScript files on Firebase since it’s Google’s own service.

Uploading CSS script files or JavaScript files on Firebase is very fast and simple. Just follow the under mentioned steps to upload your very first CSS or JavaScript file(s):

Step -1

Open your internet browser and go to https://console.firebase.google.com and sign in by using your Google account and then click on“Get started”:

Sep -2

When the new page has been loaded then Click on “Create Project”:

Step-3

In the next page Fill up the “Enter your project name” field, tick on the “I accept the Firebase terms” and then click on “Continue”:

Step-4

Now select the desired account from the drop-down menu (if prompted) and then click on “Continue”:

Step-5

 Accept the terms and click on "Create project":

After appearance of this message: “Your new project is ready”, click on “Continue”"

Step-6

Now scroll down the page and click on “See all Firebase features →”:

Upon visibility of more items please click on “Storage”:

Step-7

Click on “Get Started”:

Step-8

Click on “Next” to set "Secure rules for cloud storage":

Once setting the “Cloud Storage location” click on “Done”:

Step-9

Now click on “Upload” and select the desired CSS or JavaScript file(s) to be uploaded:

Step-10

Select a file from the list and click on “Open”:

A new tab will open in the internet browser from where you can copy the file url. The url will look something like the following:

https://firebasestorage.googleapis.com/v0/b/mycodes-1bcd9.appspot.com/o/img-thumb.js?alt=media&token=06bfe1e9-36d9-40e9-9a2e-8631bd4f15b

But you cannot add Firebase urls directly into Blogger template without some modifications. Bloggers template editor will show error message if you try to implement unmodified urls. The modification is really simple, just replace the & with &amp; and you are ready to put the end product into your template. Therefore, after alteration, your url will look like as under:

https://firebasestorage.googleapis.com/v0/b/mycodes-1bcd9.appspot.com/o/img-thumb.js?alt=media&amp;token=06bfe1e9-36d9-40e9-9a2e-8631bd4f15b3

I believe that from onward, you won’t be wasting too much time on looking for free hosting sites for storing your JavaScript or CSS script files. Since Firebase is owned and maintained by Google, its service will definitely be much more secure and reliable than any other hosting sites. Please leave your comments regarding your experience with Firebase.

Read More

How to Enable Threaded Comment for Custom Templates

These days threaded commenting system has become in inevitable part of blogs. It is an effective way for receiving and giving feedback. Considering its importance, Blogger has also introduced this system. Nowadays all of Blogger’s official templates are threaded comment enabled. But for custom templates the user needs to add this facility manually. There are a number of tutorials available in the internet to guide you to add threaded commenting system in your custom template. But sadly, none of the solutions works 100% right.

I also tried to enable threaded comments by following several tutorials. But regretfully, all of my efforts failed. Being utterly dismayed, I decided to modify the codes so that it works properly.

Problems with the Existing Code

Analyzing the prevailing codes, I have detected the following problems:

• The first problem I saw is that after implementation of threaded comment codes no comment forms appear in posts with zero comments.
• Secondly, when you hit reply button a reply form appears but no options for adding a new comment or thread.

As this is Bloggers integrated system, it is not possible bring remarkable change. It is true that I have fixed the bugs, but I did that in a rather quacky way. Most of the experts will call my modifications illogical, but the good thing is that my solution is better than nothing.

Basic Features

The modified code possesses the following facilities:

• Ensures comment form appearance in appropriate situations.
• “Add a New Comment” button for starting a new thread.
• Customizable “Reply” button.
• Provisions for other CSS modifications.

 

Implantation of Threaded Comment

Now let’s see how to implement threaded comment in your custom template:

Changing Blogger Settings

Before adding threaded comment make sure to make the following changes to your Blogger settings:
Step 1. Go to to Settings > Other and then under Allow Blog Feed select Full from the dropdown menu.

Step 2. Go to Settings > Posts and Comments and then under Comment Location select Embedded from the dropdown menu.

Adding Threaded Comment Codes

Step 1. Go to Blogger>Template
Step 2. Backup your template
Step 3. Click Edit HTML
Step 4. Now, in your template search for this code: ]]></b:skin> and paste the following code after it:

<!--Start Threaded Comment -->

<script type='text/javascript'>

  var togglenewcomm = function() {

  var mydiv = document.getElementById('newcomm');

  if (mydiv.style.display === 'block' || mydiv.style.display === '')

    mydiv.style.display = 'none';

  else

    mydiv.style.display = 'block'

 }

</script>

<!--End Start Threaded Comment -->

Step 5. Now search for the following code:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:include data='post' name='comments'/>
</b:if>

Note: In some templates this code appears twice. In such case, just delete the additional one.

Step 6. Replace the above code with either of the following codes, which best suits with your template:

Code No-1: Use this code if no comment form appears in posts with zero comments (i.e. when this happens after addition of available threaded comment codes):

<!--Threaded Comment -->

<b:if cond='data:blog.pageType != &quot;index&quot;'>

<b:if cond='data:post.numComments == 0'>

<b:include data='post' name='comments'/>

<b:include data='post' name='comment-form'/>

<b:else/>

          <b:if cond='data:post.showThreadedComments'>

            <b:include data='post' name='threaded_comments'/>

            <b:else/>

          </b:if>  

<div class="addanewcomment">

<a href="javascript:void(0);" onclick="togglenewcomm();">+ Add a New Comment</a>

</div> 

<div id="newcomm" style="display:none">

<b:include data='post' name='comment-form'/>

</div>

</b:if>

</b:if>

<!--End Threaded Comment -->

Code No-2: Use this code if comment form appears in posts with zero comments (i.e. when this happens after addition of available threaded comment codes):

<!--Threaded Comment -->

<b:if cond='data:blog.pageType != &quot;index&quot;'>

<b:if cond='data:post.numComments == 0'>

<b:include data='post' name='comments'/>

<b:else/>

          <b:if cond='data:post.showThreadedComments'>

            <b:include data='post' name='threaded_comments'/>

            <b:else/>

            <b:include data='post' name='comments'/>

          </b:if>

<div class="addanewcomment">

<a href="javascript:void(0);" onclick="togglenewcomm();">+ Add a New Comment</a>

</div> 

<div id="newcomm" style="display:none">

<b:include data='post' name='comment-form'/>

</div>

</b:if>

</b:if>

<!--End Threaded Comment -->

Step 7. Stylize Threaded Comment with CSS. To do this search for this code in your template: ]]></b:skin> and paste the following code before it:

/* Threaded Comment */

#comments{overflow:hidden; width:auto; margin-left:0px;padding-left:8px;padding-right:8px;}

#comments h4{display:inline;padding:10px;line-height:40px}

#comments h4,.comments .comment-header,.comments .comment-thread.inline-thread .comment{position:relative}

#comments h4,.comments .continue a{background:#E64337}

#comments h4,.comments .user a,.comments .continue a{font-size:16px}

#comments h4,.comments .continue a{font-weight:normal;color:#fff}

#comments h4:after{content:"";position:absolute;bottom:-10px;left:10px;border-top:10px solid #E64337;border-right:20px solid transparent;width:0;height:0;line-height:0}

#comments .avatar-image-container img{border:0}

.comment-thread{color:#111; font-family: Verdana, Agency FB, Oswald; font-size: 13px;}

.comment-thread a{color:#777;text-decoration: none;}

.comment-thread ol{margin:0 0 20px}

.comment-thread .comment-content a,.comments .user a,.comments .comment-thread.inline-thread .user a{color:#1aa1e2}

.comments .avatar-image-container,.comments .avatar-image-container img{background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhr0Pf6gZNhq6ESJqMyFpyJsI8C8Ib-Iq-KRg56DbHWpuAYJ0NLU7v8wavdcnEXisNUfmmxceZmH7PKqO_U83dEq5lANsAjyrX19Y9jqYXdNsi4OIQvmtCrjbmRpwTX1uIuawca0v2KJne1/s1600/avatar-blank.gif); width:36px;max-width:36px;height:36px;max-height:36px; border-radius: 50px;box-shadow: 0px 1px 9px #666; border: 1px solid #e7e7e7;}

.comments .comment-block,.comments .comments-content .comment-replies,.comments .comment-replybox-single{margin-left:60px}

.comments .comment-block,.comments .comment-thread.inline-thread .comment{border:1px solid #e1e1e1;background:#fff;background:-moz-linear-gradient(top,#fff 0%,#f2f2f2 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#fff),color-stop(100%,#f2f2f2));

padding:10px; border-radius:5px; }

.comments .comments-content .comment{margin:15px 0 0;padding:0;width:100%;line-height:1em}

.comments .comments-content .icon.blog-author{position:absolute;top:-11px;right:-11px;margin:0;background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEioLV2LrF5xYtL8dLWZU_Fh0tv7kXE7FFkkhNpq66tvUIEGkOVVIIXjBHreu2bnl-sAXt3br8_Vjv_GfF_F847LmudpsYGO_OCEOVXS3-Qc7XVAFjo_tFa9uI7NqDwkSiYBODTTsLNnvtmc/s1600/admin-label.png);width:43px;height:41px}

.comments .comments-content .inline-thread{padding:0 0 0 20px}

.comments .comments-content .comment-replies{margin-top:0}

.comments .comment-content{padding:5px 0;line-height:1.4em}

.comments .comment-thread.inline-thread{border-left:1px solid #e9e9e9;background:transparent}

.comments .comment-thread.inline-thread .comment{width:auto}

.comments .comment-thread.inline-thread .comment:after{content:"";position:absolute;top:10px;left:-20px;border-top:1px solid #e1e1e1;width:10px;height:0px}

.comments .comment-thread.inline-thread .comment .comment-block{border:0;background:transparent;padding:0}

.comments .comment-thread.inline-thread .comment-block{margin-left:48px}

.comments .comment-thread.inline-thread .user a{font-size:13px}

.comments .comment-thread.inline-thread .avatar-image-container,.comments .comment-thread.inline-thread .avatar-image-container img{width:36px;max-width:36px;height:36px;max-height:36px}

.comments .continue{border-top:0;width:100%; display:none!important;}

.comments .continue a{padding:10px 0;text-align:center}

#comment-editor{padding-left: 73px; width:88%!important}

.comment-form{width:100%;max-width:100%;}

.comments .comment .comment-actions a {background: none repeat scroll 0 0 #E64337;border-radius: 3px;color: #FFFFFF;padding: 1px 5px 4px;text-decoration: none;margin-right: 4px;}

.comments .comment .comment-actions a:hover {text-decoration: none;background: #000;}

.addanewcomment {padding-bottom: 14px;margin-left: 6px;}

.addanewcomment a{background: #E64337;border-radius: 3px 3px 3px 3px;color: #FFFFFF;display: inline;padding: 10px;text-decoration: none;}

.addanewcomment a:hover {background: #000000;}

.comment-form h4{background: -moz-linear-gradient(center top , #FFFFFF 0%, #F2F2F2 100%) repeat scroll 0 0 rgba(0, 0, 0, 0); border: 1px solid #D3D3D3; border-radius: 3px;display: block;margin-left: 9px !important;padding: 5px;width: 627px;}

/* End Threaded Comment */

Live Demo

http://inkoflife.blogspot.com/2013/04/best-free-bangla-pdf-book-download-sites.html

Hope you have added the codes successfully and having fun with the threaded comment. However, if you are having difficulty to add it or if the code isn’t working properly, please feel free to leave a comment so that I can further improve or rectify the codes.

Read More