Privacy Policy is a page inside your blog or website that contains all the the types of personal information your blog or website is receiving or collecting from your readers or visitors and how you as the owner of the site uses this vital information. It also explains how your website tracks your visitors IP address, what kind of browser he is using, his location, what pages he read and on what page he exits the site. To know more about the Privacy Policy of this page visit here.

But, one thing is for sure, this blog alone do not have the capability to personally track its visitors worldwide. I also do not have the ability to store cookies and log files because I do not have enough server and powerful computer to do such thing. All I have is a laptop worth $227.77. Meaning, all visitors here are safe of their personal privacy.

Okay! We are now going to make a Privacy Policy bar that only appears in homepage bottom page of your website. This bar is also floating and it also has the exit button that you can immediately press to hide the bar. See the sample image below, you can enlarge it to see it clearly.


The good thing about this Privacy Policy bar that we are going to make is:
> First, it is absolutely for free.
> Second, you do not need to register for an account.
> The code will all be pasted inside your Blogger Template, as well as the HTML/Javascript gadget.

Now, let's do this!

STEPS:

1. First, that you need to do is a page that contains your Privacy Policy. If you are a blogger and a publisher under Google Adsense. You can just copy the Privacy Policy of this page here. Note: If you are not an Adsense Publisher, then, you can search Google to know how to make your own.

2. After you copied all the contents, go to your Blogger account > click Pages > New Page. Paste all the content that you have copied. Make sure you change the www.sharingthat.xyz URL with your own.

3. Name your page as "Privacy Policy" and then click the Publish button.

4. Now, go to Blogger > Template > Edit HTML. Search (press CTRL + F) for the closing body tag </body

5. When you found it, copy and paste the code below above the closing body tag.
<!-- Popup Privacy Policy sharingthat.xyz Script -->
<link href='https://netdna.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css' rel='stylesheet'/>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'/>
<script>
function show_popup() {
  document.getElementById(&#39;popup&#39;).style.display = &#39;block&#39;;
}
window.onload = show_popup;
$(&#39;.popup-closer&#39;).click(function() {
 $(&#39;#popup&#39;).hide();
});
</script>
<!-- Popup Privacy Policy Script End -->

6. When done, save your template.

7. Then, go to Blogger > Layout. Click "Add a gadget" in the sidebar and select "HTML/Javascript" widget. Copy and paste the given code below inside it.
<!-- Style sheet of Popup PP sharingthat.xyz -->
<style>
#popup {
  z-index: 4532;
  position:  fixed;
  left: 0;
  bottom: 0;
  display: block;
  width:100%;
  height:70px;
  color: white;
  background-color: black;
}
.popup-closer {
  position:absolute;
  top: 5px;
  right: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 20px;
  padding: 5px;
  cursor: pointer;
}
</style>
<!-- Style sheet of Popup PP End -->

<div id="popup">
<br />
<center>
<span style="font-size: 12px; padding: 5px;">This site uses cookies. By continuing to browse our site, you accept the use of cookies and our <a href="PUT YOUR PRIVACY POLICY PAGE URL HERE">Privacy Policy</a>.</span></center>
  <div class="popup-closer">x</div>
</div>

8. When done, save your widget.

9. Check your new Privacy Policy bar at the bottom of your blog. Note: This bar will appear in all pages and posts of your blog. So we still need to do one more thing. And that is to make the bar only appear in your homepage.

10. Go back to your Blogger > Layout and find the HTML/Javascript that you added at step no.7. When you find it already, click Edit and find its ID. See the image below on how to find the ID.


11. When you find it, you need to remember it. For mine, the ID is HTML6. Just click the Cancel button to hide your widget.

12. Now, go to Blogger > Template  > Edit HTML. Find (press CTRL + F) your widget by typing the ID that you got in step 10.



13. When you found it, your code will be the same as the image below.


14. The whole code will be the same as the given code below. Notice all the red line of code below. You need to find these to lines in your own template and copy and paste the two given blue line of codes below each red line. When done, save your template.
      <b:widget id='HTML6' locked='false' title='' type='HTML' version='1'>
        <b:widget-settings>
          <b:widget-setting name='content'>&lt;!-- Style sheet of Popup PP --&gt;
&lt;style&gt;
#popup {
  z-index: 4532;
  position:  fixed;
  left: 0;
  bottom: 0;
  display: block;
  width:100%;
  height:70px;
  color: white;
  background-color: black;
}
.popup-closer {
  position:absolute;
  top: 5px;
  right: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 20px;
  padding: 5px;
  cursor: pointer;
}
&lt;/style&gt;
&lt;!-- Style sheet of Popup PP End --&gt;
&lt;div id=&quot;popup&quot;&gt;
&lt;br /&gt;
&lt;center&gt;
&lt;span style=&quot;font-size: 12px; padding: 5px;&quot;&gt;Advertisers on this site use cookies. By continuing to browse our site, you accept the use of cookies and our &lt;a href=&quot;https://www.sharingthat.xyz/p/privacy-policy.html&quot;&gt;Privacy Policy&lt;/a&gt;.&lt;/span&gt;&lt;/center&gt;
  &lt;div class=&quot;popup-closer&quot;&gt;x&lt;/div&gt;
&lt;/div&gt;</b:widget-setting>
        </b:widget-settings>
        <b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>
  <b:include name='quickedit'/>
</b:if>
</b:includable>
      </b:widget>

The <b:if cond='data:blog.url == data:blog.homepageUrl'> is the code use to make a widget to only appear in homepage of your blog. And the </b:if> is the closing tag of the if statement.

15. Now, retest your Privacy Policy bar, and you will notice that it only appears in homepage and not in your pages or posts anymore.

16. Done!

If you have something to share or ask about this tutorial, leave a comment below. Thank you!