tag:blogger.com,1999:blog-5003923703309853562024-02-08T10:26:20.337+05:00Geeking NerdUnknownnoreply@blogger.comBlogger41125tag:blogger.com,1999:blog-500392370330985356.post-26375815564687579642017-07-20T22:34:00.002+05:002017-07-20T22:34:32.964+05:00Add a New Element in Blogger HeaderIn this article you will learn How to Add a New Element in Blogger Header?<br />
<br />
Adding element in blogger header means you are adding more widget areas in your blog layout. Header is mostly used to add widgets for ads to increase impressions for your ads. But some templates doesn't have widget are in header area but you can add widget area to blogger with a simple method.<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPAl8X7t8p-2w3p0syelsDKFDEiEcBOCmoT42j5JLGBxGZmOI4uKC5SiaAdnf9W6lQE9622VXSNfXIrkgqqeJz2GiAYfPaTV_STQeMdN5LheXZo6BccOU9RcWt-3N84APlw1-hZs9-0Mv3/s1600/add-widget-or-adsense-above-blogger-title-or-header.png" imageanchor="1"><img alt="Add a New Element in Blogger Header" border="0" height="126" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPAl8X7t8p-2w3p0syelsDKFDEiEcBOCmoT42j5JLGBxGZmOI4uKC5SiaAdnf9W6lQE9622VXSNfXIrkgqqeJz2GiAYfPaTV_STQeMdN5LheXZo6BccOU9RcWt-3N84APlw1-hZs9-0Mv3/s400/add-widget-or-adsense-above-blogger-title-or-header.png" title="Add a New Element in Blogger Header" width="400" /></a><br />
<h3>
How to Add a New Element in Blogger Header?</h3>
<div>
<br /></div>
<div>
<b>Step 1. </b>Go to Template > Edit HTML.</div>
<div>
<br /></div>
<div>
<b>Step 2.</b> Search for the following code.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
<div id='header-wrapper'></blockquote>
<div>
<br /></div>
<div>
If you can't find then search for the following code.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
<div class='region-inner header-inner'></blockquote>
<div>
<br /></div>
<div>
<b>Step 3. </b>Below the searched code you can see the following code..</div>
<div>
<br /></div>
<blockquote class="tr_bq">
<b:section class='header' id='header' <b>maxwidgets='1' </b>showaddelement='<b>no</b>'></blockquote>
<div>
<br /></div>
<div>
<b>Step 4. </b>Remove <b>maxwidgets='1' </b>and change value <b>no </b>to <b>yes.</b></div>
<div>
<b><br /></b></div>
<div>
<b>Step 5. </b>Save Template and You are Done!</div>
<div>
<br /></div>
<div>
Now you can Go to Layout and check new element in blogger header or new widget area in header.</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-57786733584960115202017-07-20T22:24:00.004+05:002017-07-20T22:24:37.200+05:00Add An Image Next to Blogger Post TitleIn this article you will learn How to Add An Image Next to Blogger Post Title?<br />
<br />
Images grabs the attention of visitors. So you can say that adding image next to Blogger Post Title will encourage your visitors to read your post.<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhc-GwntKBTjU0TvQGPw2N33dbvDZNQ2JFIhawzL7Lg4ReYkMDUUHe4mC-5E-1wn9fm_J12errqF_LLom1kKfOMjiGEKXLArMISSdepJ33redlvhS0RgmVD8yn5B9QNGzJQHIGQVpmPHaud/s1600/how-to-add-an-image-next-to-Blogger-post-title.png" imageanchor="1"><img alt="Add An Image Next to Blogger Post Title" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhc-GwntKBTjU0TvQGPw2N33dbvDZNQ2JFIhawzL7Lg4ReYkMDUUHe4mC-5E-1wn9fm_J12errqF_LLom1kKfOMjiGEKXLArMISSdepJ33redlvhS0RgmVD8yn5B9QNGzJQHIGQVpmPHaud/s1600/how-to-add-an-image-next-to-Blogger-post-title.png" title="Add An Image Next to Blogger Post Title" /></a><br />
<br />
<h3>
How to Add An Image Next to Blogger Post Title?</h3>
<div>
<br /></div>
<div>
Important Note: You can add only uploaded image next to blogger post title, there will be no uploading options. You can upload image on Picassa and then copy the URL of image.</div>
<div>
<br /></div>
<div>
<b>Step 1.</b> Go To Template > Edit HTML.</div>
<div>
<br /></div>
<div>
<b>Step 2</b>. Search for the following code and Expand the code.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
<b:includable id='post' var='post'></blockquote>
<div>
<br /></div>
<div>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOZpqD6akIIcWeB1WspSM7YKUk4YmSVx20r2AnPPOSj8wWS8UYJ2Jnerkugze2BJffD7R3TyDvAlDGjcVPk-K1RbEztDJnL8YKPsZLBvM0QdZG4BuwBNJGmw-gSZc5UCn9rYelEx_CXigV/s1600/how-to-add-an-image-icon-before-post-title-in-blogger.png" imageanchor="1"><img alt="Expanding Code in Blogger" border="0" height="270" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOZpqD6akIIcWeB1WspSM7YKUk4YmSVx20r2AnPPOSj8wWS8UYJ2Jnerkugze2BJffD7R3TyDvAlDGjcVPk-K1RbEztDJnL8YKPsZLBvM0QdZG4BuwBNJGmw-gSZc5UCn9rYelEx_CXigV/s640/how-to-add-an-image-icon-before-post-title-in-blogger.png" title="Expanding Code in Blogger" width="640" /></a></div>
<div>
<br /></div>
<div>
<b>Step 3.</b> Delete the code until you reach <b><div class='post-header'>.</b></div>
<div>
<b><br /></b></div>
<div>
Deleted code may be like the following code.</div>
<div>
<br /></div>
<div>
<blockquote class="tr_bq">
<b:includable id='post' var='post'><br /> <div class='post hentry' itemprop='blogPost' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'><br /> <b:if cond='data:post.firstImageUrl'><br /> <meta expr:content='data:post.firstImageUrl' itemprop='image_url'/><br /> </b:if><br /> <meta expr:content='data:blog.blogId' itemprop='blogId'/><br /> <meta expr:content='data:post.id' itemprop='postId'/><br /> <a expr:name='data:post.id'/><br /> <b:if cond='data:post.title'><br /> <h3 class='post-title entry-title' itemprop='name'><br /> <b:if cond='data:post.link'><br /> <a expr:href='data:post.link'><data:post.title/></a><br /> <b:else/><br /> <b:if cond='data:post.url'><br /> <b:if cond='data:blog.url != data:post.url'><br /> <a expr:href='data:post.url'><data:post.title/></a><br /> <b:else/><br /> <data:post.title/><br /> </b:if><br /> <b:else/><br /> <data:post.title/><br /> </b:if><br /> </b:if><br /> </h3><br /> </b:if></blockquote>
</div>
<div>
<br /></div>
<div>
<b>Step 4.</b> Add the following code at the place of deleted code.</div>
<div>
<br /></div>
<div>
<blockquote class="tr_bq">
<b:includable id='post' var='post'><br /> <div class='post hentry' itemprop='blogPost' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'><br /> <b:if cond='data:post.firstImageUrl'><br /> <meta expr:content='data:post.firstImageUrl' itemprop='image_url'/><br /> </b:if><br /> <meta expr:content='data:blog.blogId' itemprop='blogId'/><br /> <meta expr:content='data:post.id' itemprop='postId'/><br /> <a expr:name='data:post.id'/><br /> <b:if cond='data:post.title'><br /> <table><tr><br /> <td class='posttitle'><br /> <img src='<b>URL</b>'/></td><br /> <td><h3 class='post-title entry-title' itemprop='name'><br /> <b:if cond='data:post.link'><br /> <a expr:href='data:post.link'><data:post.title/></a><br /> <b:else/><br /> <b:if cond='data:post.url'><br /> <b:if cond='data:blog.url != data:post.url'><br /> <a expr:href='data:post.url'><data:post.title/></a><br /> <b:else/><br /> <data:post.title/><br /> </b:if><br /> <b:else/><br /> <data:post.title/><br /> </b:if><br /> </b:if><br /> </h3><br /> </td><br /> </tr></table><br /> <br /> <style><br /> h3.post-title {<br /> margin: 0px !important;<br /> }<br /> </style><br /> <br /> </b:if></blockquote>
</div>
<div>
<br /></div>
<div>
<b><u>Important Note</u></b>: Replace the <b>URL </b>with the URL of an image which you want show next to blogger post title.</div>
<div>
<br /></div>
<div>
<b>Step 5.</b> Save Template and You are Done!</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-7098549362142570482017-07-20T22:12:00.002+05:002017-07-20T22:12:29.271+05:00Change Older,Newer and Home Links with Image or Text in BloggerIn this article you will learn How to Change Older,Newer and Home Links with Image or Text in Blogger?<br />
<br />
Older, Newer and Home Links are shown in blogger when we are viewing posts from homepage. Many bloggers want to customize them to use their own words or graphic images. Yes, you can customize or change older, newer and home links with image or text. All you need is to read this article carefully.<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrw1FsAnNu_OzspT4d07hvvtvfKvXOfNlne_ygzcJ5Sw0mzd3i5IE_8p5ZikIOFqJgXgtKIL2T8Y3rj0asac163ZW3SY_0dTlb2QXIL12EJ2pv_mr4Pjrhs4LDgX6fHnC9iPUp3g9UemKs/s1600/how+to+replace+older+newer+posts+and+home+links+in+blogger+blogspot+with+images+picture.png" imageanchor="1"><img alt="Change Older,Newer and Home Links with Image or Text in Blogger" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrw1FsAnNu_OzspT4d07hvvtvfKvXOfNlne_ygzcJ5Sw0mzd3i5IE_8p5ZikIOFqJgXgtKIL2T8Y3rj0asac163ZW3SY_0dTlb2QXIL12EJ2pv_mr4Pjrhs4LDgX6fHnC9iPUp3g9UemKs/s400/how+to+replace+older+newer+posts+and+home+links+in+blogger+blogspot+with+images+picture.png" title="Change Older,Newer and Home Links with Image or Text in Blogger" /></a><br />
<br />
<h4>
What Customization You can Do with Links?</h4>
<br />
<h4>
<ul>
<li><span style="font-weight: normal;">Change the text for Older, Newer and Home. (</span>e.g <span style="font-weight: normal;">Previous, Next and Homepage)</span></li>
<li><span style="font-weight: normal;">You can also add icon with Text.</span></li>
<li><span style="font-weight: normal;">You can also replace Older, Newer and Home with Images.</span></li>
</ul>
</h4>
<h3>
How to Change Older,Newer and Home Links with Image or Text in Blogger?</h3>
<div>
<br /></div>
<div>
Step 1. <span style="font-weight: normal;">Go to </span>Template <span style="font-weight: normal;">> </span>Edit HTML<span style="font-weight: normal;">.</span></div>
<div>
<span style="font-weight: normal;"><br /></span></div>
<div>
Step 2.<span style="font-weight: normal;"> Find for the following code.</span></div>
<div>
<span style="font-weight: normal;"><br /></span></div>
<div>
<blockquote class="tr_bq">
<span style="font-weight: normal;"> <b:if cond='data:newerPageUrl'></span><span style="font-weight: normal;"> <span id='blog-pager-newer-link'></span><span style="font-weight: normal;"> <a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'><</span>data:newerPageTitle<span style="font-weight: normal;">/></a></span><span style="font-weight: normal;"> </span></span><span style="font-weight: normal;"> </b:if></span><span style="font-weight: normal;"><br /></span><span style="font-weight: normal;"> <b:if cond='data:olderPageUrl'></span><span style="font-weight: normal;"> <span id='blog-pager-older-link'></span><span style="font-weight: normal;"> <a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'><</span>data:olderPageTitle<span style="font-weight: normal;">/></a></span><span style="font-weight: normal;"> </span></span><span style="font-weight: normal;"> </b:if></span><span style="font-weight: normal;"><br /></span><span style="font-weight: normal;"> <a class='home-link' expr:href='data:blog.homepageUrl'><</span>data:homeMsg<span style="font-weight: normal;">/></a></span></blockquote>
</div>
<div>
<span style="font-weight: normal;"><br /></span></div>
<div>
Step 3.<span style="font-weight: normal;"> Now find the following codes in the searched code and change the values.</span></div>
<blockquote class="tr_bq">
<span style="font-weight: normal;"><br /></span><data:newerPageTitle/> <span style="font-weight: normal;">which shows Newer Posts link</span><data:olderPageTitle/><span style="font-weight: normal;"> which shows Older Posts link</span><data:homeMsg/> <span style="font-weight: normal;">which shows Home link</span></blockquote>
<div>
<br /></div>
<h4>
1. To Change with Text:</h4>
<div>
<div>
<span style="font-weight: normal;">You have to replace in original code with any text you like:</span></div>
<div>
<ul>
<li>replace <data:newerPageTitle<span style="font-weight: normal;">/> with, for </span>example Next</li>
<li>replace <data:olderPageTitle<span style="font-weight: normal;">/> with, for </span>example Previous</li>
<li>replace <data:homeMsg<span style="font-weight: normal;">/> (only the first one) with, for </span>example Homepage</li>
</ul>
</div>
</div>
<h4>
2.Add Icon or Image with Text:</h4>
<div>
<span style="font-weight: normal;">Add the following code at the beginning of starting tag of bold text.</span></div>
<div>
<span style="font-weight: normal;"><br /></span></div>
<blockquote class="tr_bq">
<span style="font-weight: normal;"><img src="</span>URL<span style="font-weight: normal;">"/></span></blockquote>
<div>
<span style="font-weight: normal;"><br /></span></div>
<div>
<span style="font-weight: normal;">Change the URL with image or icon URL you want to show.</span></div>
<div>
<span style="font-weight: normal;"><br /></span></div>
<div>
<span style="font-weight: normal;">It should be like that after adding code.</span></div>
<div>
<span style="font-weight: normal;"><br /></span></div>
<div>
<img src="URL"/><data:newerPageTitle/></div>
<div>
<span style="font-weight: normal;"><br /></span></div>
<h4>
3. Change Older, Newer and Home Links with Image:</h4>
<div>
<span style="font-weight: normal;">Replace the original tag with the following code.</span></div>
<div>
<span style="font-weight: normal;"><br /></span></div>
<blockquote class="tr_bq">
<span style="font-weight: normal;"><img src="</span>URL<span style="font-weight: normal;">"/></span></blockquote>
<div>
<span style="font-weight: normal;"><br /></span></div>
<div>
<div>
<span style="font-weight: normal;">Replace </span><data:newerPageTitle/> <span style="font-weight: normal;">With the Image for Newer Posts</span></div>
<div>
<span style="font-weight: normal;">Replace </span><data:olderPageTitle/> <span style="font-weight: normal;">With the image for Older Posts</span></div>
<div>
<span style="font-weight: normal;">Replace </span><data:homeMsg/> <span style="font-weight: normal;">With the Image for Homepage</span></div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-69714666621508078202017-07-20T21:47:00.002+05:002017-07-20T21:47:51.904+05:00Add Static Facebook Pop Out Like Box with Hover EffectIn this article you will learn How to Add Static Facebook Pop Out Like Box with Smooth Jquery Hover Effect?<br />
<br />
Static Facebook Pop Out Like Box will add a floating light box on the left side of the blog. Only floating Facebook button will be shown and your page like box will be shown when someone will hover on Facebook button.<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrunLTzAKnPUX5eHb4aFK5DheyzOBWdrBSb7X1K6WrLITuxuGYAXNoJKd12sNMO9bkDfej90hQhpxUUhC7-GNPIUMn8qqjQ1IJr5oSVE6Eyz1upSbLLiS8acdvxR55rIjjE8IJCtGVzXNH/s1600/floating+static+facebook+like+box+widget+for+blogger+blogspot.png" imageanchor="1"><img alt="Static Facebook Pop Out Like Box with Hover Effect" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrunLTzAKnPUX5eHb4aFK5DheyzOBWdrBSb7X1K6WrLITuxuGYAXNoJKd12sNMO9bkDfej90hQhpxUUhC7-GNPIUMn8qqjQ1IJr5oSVE6Eyz1upSbLLiS8acdvxR55rIjjE8IJCtGVzXNH/s400/floating+static+facebook+like+box+widget+for+blogger+blogspot.png" title="Static Facebook Pop Out Like Box with Hover Effect" /></a><br />
<br />
<h3>
How to Add Static Facebook Pop Out Like Box with Smooth Jquery Hover Effect?</h3>
<div>
<br /></div>
<div>
<b>Step 1. </b>Go to <b>Template </b>> <b>Edit HTML</b>.</div>
<div>
<br /></div>
<div>
<b>Step 2.</b> Search for the following code.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
</head></blockquote>
<div>
<b><br /></b></div>
<div>
<b>Step 3.</b> Add the following code just above the searched code.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script></blockquote>
<div>
<br /></div>
<div>
<b>Step 5. </b>Save Template.</div>
<div>
<br /></div>
<div>
<b>Step 6. </b>Go to <b>Layout </b>> Add a <b>New Gadget </b>> Add <b>HTML/Javascript </b>Gadget.</div>
<div>
<br /></div>
<div>
<b>Step 7. </b>Paste the following code in <b>HTML/Javascript </b>Gadget.</div>
<div>
<br /></div>
<div>
<blockquote class="tr_bq">
<style type="text/css"><br />#fbplikebox {<br /> display: block;<br /> padding: 0;<br /> z-index: 99999;<br /> position: fixed;<br /> background: <b>#ffffff</b>;<br />}<br />.fbplbadge {<br /> background-color: <b>#3B5998</b>;<br /> display: block;<br /> height: 150px;<br /> top: 50%;<br /> margin-top: -75px;<br /> position: absolute;<br /> left: -47px;<br /> width: 47px;<br /> background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKEaxNeO3Y4yINHs9uknrz68nurjyELJgw0G0HSfveLDsAzZ9Jq2XMzq8_-U_2MqqxPKRJZNlmpgL-ZWApySWVIuaBA1BxkSf17Oj1XnHt9fb8RM-9rm7ahDIORJUzIjNLO6qpbyNiYKg/s1600/vertical-right.png");<br /> background-repeat: no-repeat;<br /> overflow: hidden;<br /> -webkit-border-top-left-radius: 8px;<br /> -webkit-border-bottom-left-radius: 8px;<br /> -moz-border-radius-topleft: 8px;<br /> -moz-border-radius-bottomleft: 8px;<br /> border-top-left-radius: 8px;<br /> border-bottom-left-radius: 8px;<br />}<br /></style><br /><script type="text/javascript"><br />/*<![CDATA[*/<br /> (function(w2b){<br /> w2b(document).ready(function(){<br /> var $dur = "medium"; // Duration of Animation<br /> w2b("#fbplikebox").css({right: -250, "top" : 100 })<br /> w2b("#fbplikebox").hover(function () {<br /> w2b(this).stop().animate({<br /> right: 0<br /> }, $dur);<br /> }, function () {<br /> w2b(this).stop().animate({<br /> right: -250<br /> }, $dur);<br /> });<br /> w2b("#fbplikebox").show();<br /> });<br /> })(jQuery);<br />/*]]>*/<br /></script><br /><div id="fbplikebox" style="display:none;"><br /> <div class="fbplbadge"></div><br /> <iframe src="http://www.facebook.com/plugins/likebox.php?href=<b>FACEBOOK-PAGE-URL</b>&amp;width=<b>250</b>&amp;height=<b>250</b>&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23C4C4C4&amp;stream=false&amp;header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:<b>250px</b>; height:<b>250px</b>;" allowtransparency="true"></iframe><br /></div></blockquote>
</div>
<div>
<br /></div>
<div>
<b>Step 8. </b>Change <b>FACEBOOK-PAGE-URL </b>with your Facebook Page URL. You have to also do changes with URL as follow.</div>
<div>
<ul>
<li>Change "<b>:</b>" with</li>
</ul>
<blockquote class="tr_bq">
%3A</blockquote>
</div>
<div>
<ul>
<li>Change "<b>/</b>" with</li>
</ul>
<blockquote class="tr_bq">
%2F</blockquote>
</div>
<div>
<br /></div>
<div>
<b><u>Example</u></b>:</div>
<div>
<br /></div>
<div>
<b>My Facebook Page URL is</b></div>
<div>
<br /></div>
<div>
<blockquote class="tr_bq">
http://www.facebook.com/DownTechz</blockquote>
</div>
<div>
<br /></div>
<div>
After Replacing code it will look like</div>
<div>
<br /></div>
<blockquote class="tr_bq">
http%3A%2F%2Fwww.facebook.com%2FDownTechz</blockquote>
<div>
<br /></div>
<h4>
Customization for Facebook Pop Out Like Box</h4>
<div>
<ul>
<li>To change the background color, change the value <b>#ffffff </b>with color code.</li>
<li>To change the facebook button color, change the value <b>#3B5998 </b>with color code.</li>
<li>To change the size of the static facebook like box, change the value <b>250 </b>with the size you want for your static facebook like box.</li>
</ul>
<div>
<b>Step 8. </b>Click Save and You are Done!</div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-43624920786746521692017-07-20T21:11:00.000+05:002017-07-20T21:21:38.970+05:00Customize Blockquote in Blogger | 6 Blockquote Style Codes<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwlIZ3_JZDJMRNuJ4nuU3UytUSlSGzVLMY4RLOX41B5eoxLNqa2PhvDleUtPQ1VEJKOGY49Hp_wmB5M1KR0vzh3fdOQSGa9I_5NPVrNXUEVG0ZLCsubwX7UbEWUqb2_NDzdAn55Xm9tBMp/s1600/2017-07-20_211623.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Customize Blockquote in Blogger | 6 Blockquote Style Codes" border="0" height="286" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwlIZ3_JZDJMRNuJ4nuU3UytUSlSGzVLMY4RLOX41B5eoxLNqa2PhvDleUtPQ1VEJKOGY49Hp_wmB5M1KR0vzh3fdOQSGa9I_5NPVrNXUEVG0ZLCsubwX7UbEWUqb2_NDzdAn55Xm9tBMp/s640/2017-07-20_211623.png" title="Customize Blockquote in Blogger | 6 Blockquote Style Codes" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Customize Blockquote in Blogger | 6 Blockquote Style Codes</td></tr>
</tbody></table>
<br />
In this article you will learn How to Customize Blockquote in Blogger? You can also see 6 blockquote style codes which you can use in you blog or website.<br />
<br />
Blockquote is used to add quotations in post. Blockquote make your quotations different from other text in you blog. Reading this tutorial you will be able to customize blockquote in blogger. There is also 6 blockquote styles which you can use in your blog.<br />
<br />
<b>Important Note</b>: You can also use these styles on any website.<br />
<br />
<h3>
How to Customize Blockquote in Blogger?</h3>
<div>
<br /></div>
<div>
<b>Step 1.</b> Go to Template > Edit HTML.</div>
<div>
<br /></div>
<div>
<b>Step 2.</b> Search for the following code.</div>
<div>
<blockquote class="tr_bq">
<br />
</head></blockquote>
</div>
<div>
<br /></div>
<div>
<b>Step 3.</b> Above the searched code paste the style code for blockquote. You can see the list of blockquote styles below with codes.</div>
<div>
<br /></div>
<h3>
6 Blockquote Style Codes</h3>
<div>
<b><br /></b></div>
<div>
<b><span style="font-size: large;">Blockquote Style 1</span></b></div>
<div>
<br style="background-color: white; box-sizing: border-box; color: #121212; font-family: "Playfair Display", serif; font-size: 15px; text-rendering: optimizeLegibility; user-select: text !important;" />
<div class="code1" style="background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQbSEe8Ff3y8048AN-nRJhy9LNmAhibJeXkPMJ3dwDbaLrznRGgJiOTYOqbag0YZ3SSHmnIrA6WiSjRSe9Mbb30ffXR4wtHpZUkcbzz-L-3owLEEvZinikGwIS145_pcxlm4laQ6HciNi3/s1600/teacher.png") no-repeat rgb(255, 255, 255); border: 0px; box-sizing: border-box; clear: both; color: white; font-family: Consolas, "Courier New", Courier, mono, serif; font-size: 15px; height: 260px; list-style-type: none; margin: 15px 35px 15px 15px; overflow: auto; padding: 5px 8px 15px 165px; transition: all 0.3s ease-in-out; user-select: text; vertical-align: baseline; width: 250px; word-wrap: break-word;">
Geeking Nerd blockuote styles for you.</div>
<blockquote class="tr_bq" style="background: rgb(247, 247, 247); border-bottom-color: initial; border-bottom-style: initial; border-image: initial; border-left-color: rgb(202, 202, 202); border-left-style: solid; border-right-color: initial; border-right-style: initial; border-top-color: initial; border-top-style: initial; border-width: 0px 0px 0px 6px; box-sizing: border-box; color: #121212; font-family: Georgia, "Times New Roman", Times, serif; font-size: 11px; font-stretch: normal; font-style: italic; line-height: 20px; margin: 1.5em 10px; padding: 5px 10px; user-select: text; vertical-align: baseline; word-wrap: break-word;">
<style><br />
.post blockquote {<br />
overflow:auto;width:250px;height:260px;<br />
font-family: "Consolas", "Courier New", Courier, mono, serif;<br />
color:#ffffff;<br />
margin : 15px 35px 15px 15px;<br />
padding : 5px 8px 15px 165px;<br />
clear : both;<br />
list-style-type : none; word-wrap:break-word;<br />
background : url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQbSEe8Ff3y8048AN-nRJhy9LNmAhibJeXkPMJ3dwDbaLrznRGgJiOTYOqbag0YZ3SSHmnIrA6WiSjRSe9Mbb30ffXR4wtHpZUkcbzz-L-3owLEEvZinikGwIS145_pcxlm4laQ6HciNi3/s1600/teacher.png);<br />
background-repeat: no-repeat;<br />
-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition-duration:all .3s ease-in-out;transition:all .3s ease-in-out;<br />
}<br />
.post blockquote:hover{<br />
background : url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKEZdHyfqRzSD-VdbPbPdpwZB4FwG1pJbQoRercTeJfTngBR0cGcOOAeePYj8mC7MH7HsO6NyP-QZqJdNZTkx3jDX3uYwRqxO8jWPtSMU-05HP5wYP-91bE2Bvai2qSeAGSLfRoKLeGHVo/s1600/hover+html+teacher.png);<br />
background-repeat: no-repeat;<br />
color:#F1F1F1;<br />
}<br />
</style></blockquote>
<br />
<span style="color: #121212; font-family: "playfair display" , serif;"><b><span style="font-size: large;">Blockquote Style 2</span></b></span><br />
<span style="color: #121212; font-family: "playfair display" , serif; font-size: medium;"><br /></span>
<br />
<div class="code2" style="background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiR2vwYvFC5K4jY-MKR5qBSgPST05EnsOjqpCzBiWz59GBZwCn9lmBWc-AcDQVZwqnhtrHG5f7gluZN6HYuUQ5wfz7nzgX-RIB3VkU22U0RcxzwQhu5biHCtHDnEz8V3hz9fezPmIaHWca/s1600/notepad1.gif") left top repeat-y rgb(245, 243, 243); border: 1px solid rgb(204, 204, 204); box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 20px; box-sizing: border-box; clear: both; font-family: Consolas, "Courier New", Courier, mono, serif; font-size: 15px; height: auto; line-height: 1.7em; list-style-type: none; margin: 15px 35px 15px 15px; overflow: auto; padding: 2px 10px 5px 60px; user-select: text !important; vertical-align: baseline; width: 400px;">
Geeking Nerd blockuote styles for you.<br />
Geeking Nerd blockuote styles for you.<br />
Geeking Nerd blockuote styles for you.<br />
Geeking Nerd blockuote styles for you.<br />
Geeking Nerd blockuote styles for you.</div>
<blockquote class="tr_bq" style="background: rgb(247, 247, 247); border-bottom-color: initial; border-bottom-style: initial; border-image: initial; border-left-color: rgb(202, 202, 202); border-left-style: solid; border-right-color: initial; border-right-style: initial; border-top-color: initial; border-top-style: initial; border-width: 0px 0px 0px 6px; box-sizing: border-box; color: #121212; font-family: Georgia, "Times New Roman", Times, serif; font-size: 11px; font-stretch: normal; font-style: italic; line-height: 20px; margin: 1.5em 10px; padding: 5px 10px; user-select: text; vertical-align: baseline; word-wrap: break-word;">
<style><br />
.post blockquote {<br />
overflow:auto;width:400px;height:auto;<br />
font-family: "Consolas", "Courier New", Courier, mono, serif;<br />
margin : 15px 35px 15px 15px;<br />
padding : 2px 10px 5px 60px;<br />
line-height:1.7em;<br />
clear : both;<br />
color:#000;<br />
list-style-type : none;<br />
background : #F5F3F3 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiR2vwYvFC5K4jY-MKR5qBSgPST05EnsOjqpCzBiWz59GBZwCn9lmBWc-AcDQVZwqnhtrHG5f7gluZN6HYuUQ5wfz7nzgX-RIB3VkU22U0RcxzwQhu5biHCtHDnEz8V3hz9fezPmIaHWca/s1600/notepad1.gif) repeat-y top left;<br />
border : 1px solid #ccc;<br />
-webkit-box-shadow: 0px 0px 20px rgba(0, 0, 0, .3);<br />
-moz-box-shadow: 0px 0px 20px rgba(0, 0, 0, .3);<br />
box-shadow: 0px 0px 20px rgba(0, 0, 0, .3);<br />
}<br />
</style></blockquote>
<br />
<span style="color: #121212; font-family: "playfair display" , serif; font-size: large;">Blockquote Style 3</span><br />
<span style="color: #121212; font-family: "playfair display" , serif; font-size: medium;"><br /></span>
<br />
<div class="code33" style="background: rgb(255, 255, 255); border-bottom-width: 0px; border-left: 15px solid rgb(235, 242, 248); border-right: 1px dotted rgb(235, 242, 248); border-top-width: 0px; box-shadow: rgb(204, 204, 204) -1px 2px 5px; box-sizing: border-box; line-height: 1.5; margin: 0px 0px 20px; padding: 15px 20px 15px 45px; position: relative; text-align: justify; vertical-align: baseline;">
<div style="color: #446578; font-family: georgia, serif; font-size: 14px;">
Geeking Nerd blockuote styles for you.</div>
<span style="color: #446578; font-family: "georgia" , serif;"><span style="font-size: 14px;">Geeking Nerd blockuote styles for you.</span></span><br />
<span style="color: #446578; font-family: "georgia" , serif;"><span style="font-size: 14px;">Geeking Nerd blockuote styles for you.</span></span><br />
<span style="color: #446578; font-family: "georgia" , serif;"><span style="font-size: 14px;">Geeking Nerd blockuote styles for you.</span><br /><span style="font-size: 14px;">Geeking Nerd blockuote styles for you.</span></span></div>
<blockquote class="tr_bq" style="background: rgb(247, 247, 247); border-bottom-color: initial; border-bottom-style: initial; border-image: initial; border-left-color: rgb(202, 202, 202); border-left-style: solid; border-right-color: initial; border-right-style: initial; border-top-color: initial; border-top-style: initial; border-width: 0px 0px 0px 6px; box-sizing: border-box; color: #121212; font-family: Georgia, "Times New Roman", Times, serif; font-size: 11px; font-stretch: normal; font-style: italic; line-height: 20px; margin: 1.5em 10px; padding: 5px 10px; user-select: text; vertical-align: baseline; word-wrap: break-word;">
<style><br />
.post blockquote {<br />
display:block;<br />
background: #fff;<br />
padding: 15px 20px 15px 45px;<br />
margin: 0 0 20px;<br />
position: relative;<br />
font-family: Georgia, serif;<br />
font-size: 14px;<br />
line-height: 1.5;<br />
color: #446578;<br />
text-align: justify;<br />
border-left: 15px solid #EBF2F8;<br />
border-right: 1px dotted #EBF2F8;<br />
-moz-box-shadow: -1px 2px 5px #ccc;<br />
-webkit-box-shadow: -1px 2px 5px #ccc;<br />
box-shadow: -1px 2px 5px #ccc;<br />
}<br />
.post blockquote:before{<br />
content: "\201C";<br />
font-family: Georgia, serif;<br />
font-size: 60px;<br />
font-weight: bold;<br />
color: #8DACC0;<br />
position: absolute;<br />
left: 10px;<br />
top:5px;<br />
}<br />
.post blockquote:after{<br />
content: "";<br />
}<br />
.post blockquote a{<br />
text-decoration: none;<br />
background: #eee;<br />
cursor: pointer;<br />
padding: 0 3px;<br />
color: #c76c0c;<br />
}<br />
.post blockquote a:hover{<br />
color: #666;<br />
}<br />
</style></blockquote>
<span style="color: #121212; font-family: "playfair display" , serif; font-size: medium;"><br /></span>
<span style="color: #121212; font-family: "playfair display" , serif; font-size: large;"><b>Blockquote Style 4</b></span><br />
<span style="color: #121212; font-family: "playfair display" , serif; font-size: medium;"><br /></span>
<br />
<div class="code43" style="background-color: #f6f6f6; border: 1px solid rgb(225, 225, 225); box-sizing: border-box; margin: 5px 15px; padding: 10px 15px; vertical-align: baseline;">
<div style="color: #121212; font-family: times; font-size: 15px;">
Geeking Nerd blockuote styles for you.</div>
<span style="color: #121212; font-family: "times";"><span style="font-size: 15px;">Geeking Nerd blockuote styles for you.</span></span><br />
<span style="color: #121212; font-family: "times";"><span style="font-size: 15px;">Geeking Nerd blockuote styles for you.</span></span><br />
<span style="color: #121212; font-family: "times";"><span style="font-size: 15px;">Geeking Nerd blockuote styles for you.</span></span><br />
<span style="color: #121212; font-family: "times";"><span style="font-size: 15px;">Geeking Nerd blockuote styles for you.</span></span><br />
<span style="color: #121212; font-family: "times";"><span style="font-size: 15px;">Geeking Nerd blockuote styles for you.</span></span></div>
<blockquote class="tr_bq" style="background: rgb(247, 247, 247); border-bottom-color: initial; border-bottom-style: initial; border-image: initial; border-left-color: rgb(202, 202, 202); border-left-style: solid; border-right-color: initial; border-right-style: initial; border-top-color: initial; border-top-style: initial; border-width: 0px 0px 0px 6px; box-sizing: border-box; color: #121212; font-family: Georgia, "Times New Roman", Times, serif; font-size: 11px; font-stretch: normal; font-style: italic; line-height: 20px; margin: 1.5em 10px; padding: 5px 10px; user-select: text; vertical-align: baseline; word-wrap: break-word;">
<style><br />
.post blockquote {<br />
padding:10px 15px;<br />
margin: 5px 15px;<br />
border: 1px solid #E1E1E1;<br />
background-color: #F6F6F6;<br />
font-size: 15px;<br />
font-family: Times;<br />
}<br />
.post blockquote:before {<br />
content: "\201C";<br />
color: #F13937;<br />
font-family: Times;<br />
font-size:50px;<br />
font-weight: bold;<br />
line-height:0px;<br />
vertical-align:middle;<br />
}<br />
.post blockquote:after {<br />
content: "\201D";<br />
color: #F13937;<br />
font-family: Times;<br />
font-size:50px;<br />
font-weight: bold;<br />
line-height:0px;<br />
vertical-align:middle;<br />
padding:15px 0px 0px 5px;<br />
}<br />
</style></blockquote>
<span style="color: #121212; font-family: "playfair display" , serif; font-size: medium;"><br /></span>
<span style="color: #121212; font-family: "playfair display" , serif; font-size: large;"><b>Blockquote Style 5</b></span><br />
<br style="background-color: white; box-sizing: border-box; color: #121212; font-family: "Playfair Display", serif; font-size: 15px; text-rendering: optimizeLegibility; user-select: text !important;" />
<div class="code53" style="background: linear-gradient(rgb(184, 219, 41), rgb(90, 143, 0)) 0px 0px repeat scroll rgb(255, 255, 255); border-radius: 10px; border: 0px; box-sizing: border-box; color: white; font-family: Cambria, Georgia, sans-serif; font-size: 1.6em; font-stretch: normal; font-weight: bold; line-height: 1.4; margin: 30px 15px 5px; padding: 15px 30px; position: relative; user-select: text !important; vertical-align: baseline;">
Geeking Nerd blockuote styles for you.<br />
Geeking Nerd blockuote styles for you.<br />
Geeking Nerd blockuote styles for you.<br />
Geeking Nerd blockuote styles for you.<br />
Geeking Nerd blockuote styles for you.<br />
Geeking Nerd blockuote styles for you. </div>
<blockquote class="tr_bq" style="background: rgb(247, 247, 247); border-bottom-color: initial; border-bottom-style: initial; border-image: initial; border-left-color: rgb(202, 202, 202); border-left-style: solid; border-right-color: initial; border-right-style: initial; border-top-color: initial; border-top-style: initial; border-width: 0px 0px 0px 6px; box-sizing: border-box; color: #121212; font-family: Georgia, "Times New Roman", Times, serif; font-size: 11px; font-stretch: normal; font-style: italic; line-height: 20px; margin: 1.5em 10px; padding: 5px 10px; user-select: text; vertical-align: baseline; word-wrap: break-word;">
<style><br />
.post blockquote {<br />
background: linear-gradient(#B8DB29, #5A8F00) repeat scroll 0 0 rgba(0, 0, 0, 0);<br />
border-radius: 10px 10px 10px 10px;<br />
color: #FFFFFF;<br />
margin: 30px 15px 5px;<br />
padding: 15px 30px;<br />
position: relative;<br />
font: 1.6em/1.4 Cambria,Georgia,sans-serif;<br />
font-weight: bold;<br />
}<br />
.post blockquote:after {<br />
border-color: rgba(0, 0, 0, 0) #B5D928;<br />
border-style: solid;<br />
border-width: 50px 0px 0px 20px;<br />
top: -50px;<br />
content: "";<br />
display: block;<br />
left: 50px;<br />
position: absolute;<br />
width: 0;<br />
}<br />
</style></blockquote>
<span style="color: #121212; font-family: "playfair display" , serif; font-size: medium;"><br /></span>
<span style="color: #121212; font-family: "playfair display" , serif; font-size: large;"><b>Blockquote Style 6</b></span><br />
<span style="color: #121212; font-family: "playfair display" , serif; font-size: medium;"><br /></span>
<br />
<div class="code63" style="background: none 0px 0px repeat scroll rgb(255, 255, 255); border-radius: 240px; border: 10px solid rgb(252, 142, 66); box-sizing: border-box; color: #333333; font-family: Cambria, Georgia, sans-serif; font-size: 1.5em; font-stretch: normal; font-weight: bold; line-height: 1.4; margin: 1em 140px 80px; padding: 30px; position: relative; text-align: center; user-select: text !important; vertical-align: baseline;">
Geeking Nerd blockuote styles for you.<br />
Geeking Nerd blockuote styles for you.<br />
Geeking Nerd blockuote styles for you.<br />
Geeking Nerd blockuote styles for you. </div>
<blockquote class="tr_bq" style="background: rgb(247, 247, 247); border-bottom-color: initial; border-bottom-style: initial; border-image: initial; border-left-color: rgb(202, 202, 202); border-left-style: solid; border-right-color: initial; border-right-style: initial; border-top-color: initial; border-top-style: initial; border-width: 0px 0px 0px 6px; box-sizing: border-box; color: #121212; font-family: Georgia, "Times New Roman", Times, serif; font-size: 11px; font-stretch: normal; font-style: italic; line-height: 20px; margin: 1.5em 10px; padding: 5px 10px; user-select: text; vertical-align: baseline; word-wrap: break-word;">
<style><br />
.post blockquote {<br />
background: none repeat scroll 0 0 #FFFFFF;<br />
border: 10px solid #FC8E42;<br />
border-radius: 240px 240px 240px 240px;<br />
color: #333333;<br />
margin: 1em 140px 80px;<br />
padding: 70px 70px;<br />
position: relative;<br />
text-align: center;<br />
font: 1.5em/1.4 Cambria,Georgia,sans-serif;<br />
font-weight: bold;<br />
}<br />
.post blockquote:before {<br />
background: none repeat scroll 0 0 #FFFFFF;<br />
border: 10px solid #FFBD54;<br />
border-radius: 50px 50px 50px 50px;<br />
bottom: -40px;<br />
content: "";<br />
display: block;<br />
height: 50px;<br />
position: absolute;<br />
right: 100px;<br />
width: 50px;<br />
z-index: 10;<br />
}<br />
.post blockquote:after {<br />
background: none repeat scroll 0 0 #FFFFFF;<br />
border: 10px solid #5A8F00;<br />
border-radius: 25px 25px 25px 25px;<br />
bottom: -60px;<br />
content: "";<br />
display: block;<br />
height: 25px;<br />
position: absolute;<br />
right: 50px;<br />
width: 25px;<br />
z-index: 10;<br />
}<br />
</style></blockquote>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-11117718534921534712017-07-20T20:52:00.000+05:002017-07-20T20:52:41.073+05:00Add Simple Related Posts Widget in BloggerIn this article you will learn How to Add Simple Related Posts Widget in Blogger?<br />
<br />
We have written an article <a href="http://geekingnerd.blogspot.com/2017/07/add-related-posts-widget-in-blogger.html" target="_blank">How to Add Related Posts Widget with Thumbnails in Blogger?</a> which shows thumbnails or snippets with related posts. In this article we are writing that how you can add simple related posts widget in blogger.<br />
<br />
You have to add simple relate posts widget when you are taking care of your site speed. In blogger we can't use plugins etc to make our site speed faster. To make blogspot blog fast loading we have to use minimum scripts, CSS etc. You can see the screenshot of the widget below.<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkQfaEUNxmht5ugzkLZD_qa0asPzc4gJ5UPcGmsrg6rxx8Foc5QK41bHVPRGLhGGjeNYhxfPqbjpcT4EoasmyQKKLuCoG0CzuLf9sXIrus-Jf3IYqyU7_gnyj_fvrqJPNEjiBTqLCkxH5D/s1600/simple-related-posts-titles-for-blogger.png" imageanchor="1"><img alt="Simple Related Posts Widget in Blogger" border="0" height="153" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkQfaEUNxmht5ugzkLZD_qa0asPzc4gJ5UPcGmsrg6rxx8Foc5QK41bHVPRGLhGGjeNYhxfPqbjpcT4EoasmyQKKLuCoG0CzuLf9sXIrus-Jf3IYqyU7_gnyj_fvrqJPNEjiBTqLCkxH5D/s320/simple-related-posts-titles-for-blogger.png" title="Simple Related Posts Widget in Blogger" width="320" /></a><br />
<br />
But if you want to make your blog attractive then you should <a href="http://geekingnerd.blogspot.com/2017/07/add-related-posts-widget-in-blogger.html" target="_blank">Add Related Posts Widget with Thumbnails in Blogger?</a><br />
<br />
<h3>
How to Add Simple Related Posts Widget in Blogger?</h3>
<div>
<br /></div>
<div>
<b>Step 1.</b> Go to <b>Template </b>> <b>Edit HTML</b>.</div>
<div>
<br /></div>
<div>
<b>Step 2.</b> Find for the following tag.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
</head></blockquote>
<div>
<br /></div>
<div>
<b>Step 3.</b> Paste the following code above the searched tag.</div>
<div>
<br /></div>
<div>
<blockquote class="tr_bq">
<b:if cond='data:blog.pageType == &quot;item&quot;'><style type='text/css'><br />#related-posts {<br />margin: 15px 0px;<br />}<br />#related-posts h2 {<br /><span style="color: red;">font-size: 27px;</span>font-weight: normal;<br /><span style="color: red;">color: #fff;</span>text-shadow: 1px 0px 2px #888;<br />margin-bottom: 0.75em;<br />}<br />#related-posts a {<br />font-size: 13px;<br /><span style="color: orange;">color: #949494;</span>text-transform: capitalize;<br />border-bottom:1px dotted #E2E2E2;<br />display:block;<br />padding:13px;<br />text-decoration: none;<br />}<br />#related-posts a:hover {<br />color: #555;<br />background: <span style="color: #990000;">#F4F4F4</span>;<br />}<br />#related-posts ul {<br />padding: 0px;<br />list-style-type: none;<br />background: <span style="color: #990000;">#f9f9f9</span>;<br />border-left: 5px solid #f2f2f2;<br />}<br />#related-posts li {<br />padding: 0px;<br />}<br /></style><br /><script type='text/javascript'><br />var relatedpoststitle=&quot;Related Posts&quot;;<br /></script><br /><script type='text/javascript'><br />//<![CDATA[<br />var relatedTitles=new Array();var relatedTitlesNum=0;var relatedUrls=new Array();function related_results_labels(json){for(var i=0;i<json.feed.entry.length;i++){var entry=json.feed.entry[i];relatedTitles[relatedTitlesNum]=entry.title.$t;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){relatedUrls[relatedTitlesNum]=entry.link[k].href;relatedTitlesNum++;break}}}}function removeRelatedDuplicates(){var tmp=new Array(0);var tmp2=new Array(0);for(var i=0;i<relatedUrls.length;i++){if(!contains(tmp,relatedUrls[i])){tmp.length+=1;tmp[tmp.length-1]=relatedUrls[i];tmp2.length+=1;tmp2[tmp2.length-1]=relatedTitles[i]}}relatedTitles=tmp2;relatedUrls=tmp}function contains(a,e){for(var j=0;j<a.length;j++){if(a[j]==e){return true}};return false}function printRelatedLabels(currenturl){for(var i=0;i<relatedUrls.length;i++){if(relatedUrls[i]==currenturl){relatedUrls.splice(i,1);relatedTitles.splice(i,1)}}var r=Math.floor((relatedTitles.length-1)*Math.random());var i=0;if(relatedTitles.length>1){document.write('<h2>'+relatedpoststitle+'</h2>')}document.write('<ul>');while(i<relatedTitles.length&&i<20&&i<maxresults){document.write('<li><a href="'+relatedUrls[r]+'">'+relatedTitles[r]+'</a></li>');if(r<relatedTitles.length-1){r++}else{r=0}i++}document.write('</ul>');relatedUrls.splice(0,relatedUrls.length);relatedTitles.splice(0,relatedTitles.length);}<br />//]]><br /></script></b:if></blockquote>
</div>
<div>
<br /></div>
<h4>
Customization for Simple Related Posts Widget:</h4>
<div>
<br /></div>
<div>
<ul>
<li>To change size and color change the values <span style="color: red;">27px </span>and <span style="color: red;"> #fff </span>.</li>
<li>To change the link color for related posts, change the color code with <span style="color: orange;">#949494</span></li>
<li>To change background color change color code <span style="color: #660000;">#f9f9f9</span> .</li>
<li>To change background on mouse hover (When mouse will be on widget), change color code <span style="color: #990000;">#F4F4F4 </span>.</li>
</ul>
<div>
<br /></div>
</div>
<div>
<b>Step 4.</b> Search for the following code.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
<b:includable id='postQuickEdit' var='post'></blockquote>
<div>
<br /></div>
<div>
<b>Step 5. </b>Expand the searched code by clicking on "<b>...</b>".</div>
<div>
<br /></div>
<div>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimm_SA2ZDjBKWUxDyAm2AJG02OJNwCMb_qMJgPDCJiexA4zDQRBbfkRJmGXcDLONL8TJyjQqV5BDWAfxDoTFW69m3XjMCo_w6wsP4A2_o2-dPAGHGopcU8PxcMbma3qOpmNRoieAXrpkjQ/s1600/how-to-add-related-posts-widget-to-blogger.png" imageanchor="1"><img alt="Expanding Code in Blogger" border="0" height="131" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimm_SA2ZDjBKWUxDyAm2AJG02OJNwCMb_qMJgPDCJiexA4zDQRBbfkRJmGXcDLONL8TJyjQqV5BDWAfxDoTFW69m3XjMCo_w6wsP4A2_o2-dPAGHGopcU8PxcMbma3qOpmNRoieAXrpkjQ/s400/how-to-add-related-posts-widget-to-blogger.png" title="Expanding Code in Blogger" width="400" /></a></div>
<div>
<br /></div>
<div>
<b>Step 6.</b> Now paste the following code above <b></b:includable> </b>tag.</div>
<div>
<br /></div>
<div>
<blockquote class="tr_bq">
<b:if cond='data:blog.pageType == &quot;item&quot;'><div id='related-posts'> <b:loop values='data:post.labels' var='label'> <b:if cond='data:label.isLast != &quot;true&quot;'> </b:if> <b:if cond='data:blog.pageType == &quot;item&quot;'> <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=6&quot;' type='text/javascript'/></b:if></b:loop><br /><script type='text/javascript'> var <b>maxresults=5</b>; removeRelatedDuplicates(); printRelatedLabels(&quot;<data:post.url/>&quot;); </script><a style="font-size: 9px; color: #CECECE; float: right;" href="https://geekingnerd.blogspot.com/2017/07/add-simple-related-posts-widget-in.html" rel="follow" >Simple Related Posts Widget</a></div></b:if></blockquote>
</div>
<div>
<br /></div>
<div>
<b><u>Important Note</u></b>: To change the number of related posts change the value "<b>5</b>".</div>
<div>
<br /></div>
<div>
<b>Step 7. </b>Save Template and You are Done!</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-22763915682872028162017-07-18T22:52:00.001+05:002017-07-18T22:52:08.980+05:00How to Add Related Posts Widget in Blogger with Thumbnails?<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTS4DGKTn1aDQ5jElLBb3q3XQEOguSro_k-ayYP6SNy-_MSF8_Ns-DXQTTY1QyNFTsjrDJil9H7Z7qNgnk0BD66jjg6vpWpo1PB1QLLJhbYrwbZ1_kcmxCYJk2rb4kT6oSuxJR0dwdoFid/s1600/how+to+add+related+posts+widget+in+blogger+with+thumbnails.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="How to Add Related Posts Widget in Blogger with Thumbnails?" border="0" height="344" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTS4DGKTn1aDQ5jElLBb3q3XQEOguSro_k-ayYP6SNy-_MSF8_Ns-DXQTTY1QyNFTsjrDJil9H7Z7qNgnk0BD66jjg6vpWpo1PB1QLLJhbYrwbZ1_kcmxCYJk2rb4kT6oSuxJR0dwdoFid/s640/how+to+add+related+posts+widget+in+blogger+with+thumbnails.jpg" title="How to Add Related Posts Widget in Blogger with Thumbnails?" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><h2>
How to Add Related Posts Widget in Blogger with Thumbnails?</h2>
</td></tr>
</tbody></table>
<div>
In this article you will learn How to Add Related Posts Widget in Blogger with Thumbnails Below Blogger Post?</div>
<div>
<br /></div>
Want to decrease you blog bounce rate. Yes, you can do this by adding related posts widget with thumbnails below blogger posts. This widget will auto show related posts below blog posts from the same category. For Example your post is in Blogger category then related posts widget will show posts in Blogger category.<div>
<br /></div>
<div>
This practice will encourage your visitors to spend more time on your blog. Don't know how to add related posts widget below post in blogger. Here is a way by which you can do this.</div>
<div>
<br /></div>
<h3>
How to Add Related Posts Widget in Blogger with Thumbnails?</h3>
<div>
<br /></div>
<div>
<b>Step 1. </b> Login Blogger Account.</div>
<div>
<b>Step 2. </b>Go to Template > Edit HTML.</div>
<div>
<b>Step 3.</b> Search for the following code.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
</head></blockquote>
<div>
<b><br /></b></div>
<div>
<b>Step 4. </b>Add the following code above the <b></head></b> tag.</div>
<div>
<br /></div>
<div>
<blockquote class="tr_bq">
<!--Related Posts with thumbnails by TechzTutorials--><br /><span style="background-color: yellow;"><b:if cond='data:blog.pageType == &quot;item&quot;'></span><style type='text/css'><br />#related-posts{float:left;width:auto;}<br />#related-posts a{border-right: 1px dotted #eaeaea;}<br />#related-posts h4{margin-top: 10px;background:none;font:18px Oswald;padding:3px;color:#999999; text-transform:uppercase;}<br />#related-posts .related_img {margin:5px;border:2px solid #f2f2f2;object-fit: cover;<span style="background-color: red;">width:110px</span>;<span style="background-color: red;">height:100px</span>;-webkit-border-radius: 5px;-moz-border-radius: 5px; border-radius: 5px; }<br />#related-title {<span style="background-color: orange;">color:#333</span>;text-align:center;text-transform:capitalize;padding: 0px 5px 10px;<span style="background-color: orange;">font-size:12px</span>;<span style="background-color: red;">width:110px</span>; height: 40px;}<br /></style><br /><script type='text/javascript'><br />//<![CDATA[<br />var relatedTitles=new Array();var relatedTitlesNum=0;var relatedUrls=new Array();var thumburl=new Array();function related_results_labels_thumbs(json){for(var i=0;i<json.feed.entry.length;i++){var entry=json.feed.entry[i];relatedTitles[relatedTitlesNum]=entry.title.$t;try{thumburl[relatedTitlesNum]=entry.gform_foot.url}catch(error){s=entry.content.$t;a=s.indexOf("<img");b=s.indexOf("src=\"",a);c=s.indexOf("\"",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){thumburl[relatedTitlesNum]=d}else thumburl[relatedTitlesNum]='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjUfx8QJhRZ9ZM64XMx5i6ZOjfKtuQGzz02areRrGFZN-ehd9cpmsosCJ4mf7oCHHZInbri2gcYygfhkreWOl-oaY2qz7l8LN10-wL7tAFtSeEq7nnOlt6hK-aIopTKrGz4BxJHtsNGaC7/s1600/no-thumbnail.png'}if(relatedTitles[relatedTitlesNum].length>35)relatedTitles[relatedTitlesNum]=relatedTitles[relatedTitlesNum].substring(0,35)+"...";for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){relatedUrls[relatedTitlesNum]=entry.link[k].href;relatedTitlesNum++}}}}function removeRelatedDuplicates_thumbs(){var tmp=new Array(0);var tmp2=new Array(0);var tmp3=new Array(0);for(var i=0;i<relatedUrls.length;i++){if(!contains_thumbs(tmp,relatedUrls[i])){tmp.length+=1;tmp[tmp.length-1]=relatedUrls[i];tmp2.length+=1;tmp3.length+=1;tmp2[tmp2.length-1]=relatedTitles[i];tmp3[tmp3.length-1]=thumburl[i]}}relatedTitles=tmp2;relatedUrls=tmp;thumburl=tmp3}function contains_thumbs(a,e){for(var j=0;j<a.length;j++)if(a[j]==e)return true;return false}function printRelatedLabels_thumbs(){for(var i=0;i<relatedUrls.length;i++){if((relatedUrls[i]==currentposturl)||(!(relatedTitles[i]))){relatedUrls.splice(i,1);relatedTitles.splice(i,1);thumburl.splice(i,1);i--}}var r=Math.floor((relatedTitles.length-1)*Math.random());var i=0;if(relatedTitles.length>0)document.write('<h4>'+relatedpoststitle+'</h4>');document.write('<div style="clear: both;"/>');while(i<relatedTitles.length&&i<20&&i<maxresults){document.write('<a style="text-decoration:none;margin:0 4px 10px 0;float:left;');if(i!=0)document.write('"');else document.write('"');document.write(' href="'+relatedUrls[r]+'"><img class="related_img" src="'+thumburl[r]+'"/><br/><div id="related-title">'+relatedTitles[r]+'</div></a>');if(r<relatedTitles.length-1){r++}else{r=0}i++}document.write('</div>');relatedUrls.splice(0,relatedUrls.length);thumburl.splice(0,thumburl.length);relatedTitles.splice(0,relatedTitles.length)}<br />//]]><br /></script><br /></b:if><br /><!--Related Posts with thumbnails by TechzTutorials Scripts and Styles End--></blockquote>
</div>
<div>
<br /></div>
<div>
<b><u>Important Note</u></b>:</div>
<div>
<br /></div>
<div>
<ul>
<li>To change the width and height of thumbnails change the values of <span style="background-color: red;">110px</span> and <span style="background-color: red;">100px</span><span style="background-color: white;">.</span></li>
<li><span style="background-color: white;">To change the size and color of title text change the values </span><span style="background-color: orange;">#333</span> and <span style="background-color: orange;">12px</span>.</li>
<li><span style="background-color: white;">Remove the code "</span><span style="background-color: yellow;"><b:if cond='data:blog.pageType == &quot;item&quot;'>"</span><span style="background-color: white;"> if you want related posts widget both at homepage and post pages.</span></li>
</ul>
<div>
<br /></div>
<div>
<b>Step 5. </b>Now find the following code. You will this code two times you have to go to the 2nd one.</div>
</div>
<div>
<br /></div>
<div>
<blockquote class="tr_bq">
<div class='post-footer'></blockquote>
<br />
<b>Step 6.</b> Just above the searched code paste the following code.<br />
<br />
<blockquote class="tr_bq">
<!-- Related Posts with Thumbnails by Techz Tutorials Code Start--><br /><span style="color: red;"><b:if cond='data:blog.pageType == &quot;item&quot;'></span><br /><div id='related-posts'><br /><b:loop values='data:post.labels' var='label'><br /><b:if cond='data:label.isLast != &quot;true&quot;'><br /></b:if><br /><script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;<span style="color: yellow;">max-results=5</span>&quot;' type='text/javascript'/></b:loop><br /><script type='text/javascript'><br />var currentposturl=&quot;<data:post.url/>&quot;;<br />var<span style="color: yellow;"> maxresults=5;</span><br />var relatedpoststitle=&quot;<b><span style="color: orange;">Related Posts</span>:</b>&quot;;<br />removeRelatedDuplicates_thumbs();<br />printRelatedLabels_thumbs();<br /></script><br /></div><div class='clear'/><div style="font-size: 9px;float: right; margin: 5px;"><a style="font-size: 9px; text-decoration: none;" href="http://helplogger.blogspot.com/2012/03/how-to-add-related-posts-widget-to.html" rel="nofollow" >Related Posts Widget</a></div><br /><span style="color: red;"></b:if></span><br /><!-- Related Posts with Thumbnails by Techz Tutorials Code End--></blockquote>
<br />
<b><u>Important Note</u></b>:<br />
<br />
<br />
<ul>
<li>Change the value <span style="color: yellow;">5 </span>with the number of post you want to show as related posts.</li>
<li> If you want related posts widget to be shown in home page then you have to remove the code in red.</li>
</ul>
<div>
<b>Step 7.</b> If you are not able to see the related posts widget then add the code from <b>Step 6 </b>above the following code.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
<b:includable id='postQuickEdit' var='post'></blockquote>
<b><br /></b>
<b>Step 8.</b> Save Template.<br />
<b>Step 9.</b> Done!<br />
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-83423157641986414722017-07-18T22:25:00.002+05:002017-07-18T22:25:37.641+05:00How to Change Comment Button with Image in Blogger?<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHPCXdYZHc6Bkno6gMPxATYREykMDFBc-dAfrvQDYPu1ip6AJu4dc_H-sVs1U9jVmCrFSjhuye5axuDGvfD_tlUrUHr5zf5T8JatYgmXfFMiZPMkpQLolJa16yImm4w1cCcWsA9SAdToqo/s1600/how+to+change+comment+buttom+with+image+in+blogger.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="How to Change Comment Button with Image in Blogger?" border="0" height="344" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHPCXdYZHc6Bkno6gMPxATYREykMDFBc-dAfrvQDYPu1ip6AJu4dc_H-sVs1U9jVmCrFSjhuye5axuDGvfD_tlUrUHr5zf5T8JatYgmXfFMiZPMkpQLolJa16yImm4w1cCcWsA9SAdToqo/s640/how+to+change+comment+buttom+with+image+in+blogger.jpg" title="How to Change Comment Button with Image in Blogger?" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><h2>
How to Change Comment Button with Image in Blogger?</h2>
</td></tr>
</tbody></table>
In this article you will learn How to Change Comment Button with Image in Blogger?<br />
<br />
Comments are also one of the factor for your site rankings. What you can do to encourage your visitors to comment on your blog. One way to encourage visitors to comment on your blog is, Change Comment Button with Image.<br />
<br />
Here is a method which you can use to change comment button with graphical image in blogger. By this simple method your blog comment button will be replaced with an awesome image.<br />
<br />
<h3>
How to Change Comment Button with Image in Blogger?</h3>
<div>
<b>Step 1. </b>Login Blogger Account.</div>
<div>
<b>Step 2. </b>Go to <b>Template</b> > <b>Edit HTML</b>.</div>
<div>
<b>Step 3. </b>Search for the following code.</div>
<blockquote class="tr_bq">
<br /><a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><br /><span style="background-color: yellow;"><data:postCommentMsg/></span></a></blockquote>
<div>
<br /></div>
<div>
<b><u>Important Note</u></b>: If you can't find that code then you can search for the following code.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
<span style="background-color: yellow;"><data:postCommentMsg/></span></blockquote>
<div>
<br /></div>
<div>
<b>Step 4.</b> Replace the <span style="background-color: yellow;"><data:postCommentMsg/></span><span style="background-color: white;"> with the image URL you want to replace with. You can also see some image URLs which you can use instead of comment buttons.</span></div>
<div>
<span style="background-color: white;"><b><br /></b></span></div>
<div>
<b>Step 5.</b> Now find for the following code.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
<h4 id='comment-post-message'><data:postCommentMsg/></h4></blockquote>
<div>
<br /></div>
<div>
<b>Step 6. </b>Also replace this code with the Image URL.</div>
<div>
<br /></div>
<div>
<b>Step 7.</b> Now search for the following code.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
<p><data:blogCommentMessage/></p></blockquote>
<div>
<b><u><br /></u></b></div>
<div>
<b><u>Important Note</u></b>: You will find this code many times but you have to go to 4th one.</div>
<div>
<br /></div>
<div>
<b>Step 8. </b>Add the following code after the above searched code.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
<center><img src="<span style="background-color: #b6d7a8;">Image-URL</span>"/></center></blockquote>
<br />
Change <span style="background-color: #b6d7a8;">Image-URL</span><span style="background-color: white;"> with the </span>URL of the image you want to use as comment blogger. Remove Center tags if you don't want to show the image in center.<br />
<br />
<b>Step 9. </b>Save Template.<br />
<b>Step 10. </b>Done!<br />
<br />
Here are some cods for images which you can use as comment button with image in blogger.<br />
<br />
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnirko13My3GOxZtJ3XePwnnV9HsRmgkO8J-PNpG_vbrRg-p254toM7cSVhri0r8fdxlQSUQtmQvPbcww_j1G0UCJfAP5clCxP0slf039xSDNKWyhRmQRL-Yv016o_WbDH36-BCBAIuuA/s1600/leave+a+comment.png" /><br />
<br />
<blockquote class="tr_bq">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnirko13My3GOxZtJ3XePwnnV9HsRmgkO8J-PNpG_vbrRg-p254toM7cSVhri0r8fdxlQSUQtmQvPbcww_j1G0UCJfAP5clCxP0slf039xSDNKWyhRmQRL-Yv016o_WbDH36-BCBAIuuA/s1600/leave+a+comment.png" /></blockquote>
<br />
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglPeYqE7oJPlYxz_Ezp2SWy-q5_9coJruyeruqz9-venH3gSJAbGdGPVQON2jsn_R22RZKO7Fp6taUGIFcPRAyxth_tEBnwvJEBnWjmh-ImRnc24JnxGO4QJGZlwxLuv-H69dWsu0gBb8/s1600/Post+a+comment+blogger.png" style="background-color: white; border: none; color: #404040; font-family: "Open Sans", Arial, sans-serif; font-size: 13px; list-style: none; margin: 0px; max-width: 700px; outline: none; padding: 0px; text-align: center; user-select: text !important;" /><br />
<br />
<blockquote class="tr_bq">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglPeYqE7oJPlYxz_Ezp2SWy-q5_9coJruyeruqz9-venH3gSJAbGdGPVQON2jsn_R22RZKO7Fp6taUGIFcPRAyxth_tEBnwvJEBnWjmh-ImRnc24JnxGO4QJGZlwxLuv-H69dWsu0gBb8/s1600/Post+a+comment+blogger.png" /></blockquote>
<br />
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGY7wLDFwRz998WRuEmyXZWKpeOSklzUzfS27jwuDRLdzQ9E0tA5g8sbuw4FK4YZKozbucb_luJH8c9TWQLfRCLQlYf4i1_uji1I7Vy2VLoFP1bb9soH2O7gwRHBef518C6d71kEAm8Sxr/s1600/animated+comment+arrow.gif" style="background-color: white; border: none; color: #404040; font-family: "Open Sans", Arial, sans-serif; font-size: 13px; list-style: none; margin: 0px; max-width: 700px; outline: none; padding: 0px; text-align: center; user-select: text;" /><br />
<br />
<blockquote class="tr_bq">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGY7wLDFwRz998WRuEmyXZWKpeOSklzUzfS27jwuDRLdzQ9E0tA5g8sbuw4FK4YZKozbucb_luJH8c9TWQLfRCLQlYf4i1_uji1I7Vy2VLoFP1bb9soH2O7gwRHBef518C6d71kEAm8Sxr/s1600/animated+comment+arrow.gif" /></blockquote>
<br />
<br />
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjorNeOh9Frj0QIkfYmSJYIhJiwlAGSFh2xWNbhmPWKQ_iesxK2yPbRW-jVQcH8OjQUUZk_yTuMAnUYugVmtXIgTogy4HIPNy1_fc5CJFXt4vgn3fPlFlohMpBFbeCp1O-ifKguikqIxe99/s1600/leave+a+comment2.png" style="background-color: white; border: none; color: #404040; font-family: "Open Sans", Arial, sans-serif; font-size: 13px; list-style: none; margin: 0px; max-width: 700px; outline: none; padding: 0px; text-align: center; user-select: text !important;" /><br />
<br />
<blockquote class="tr_bq">
<span style="background-color: white; color: #404040; font-family: "Open Sans", Arial, sans-serif; font-size: 13px;"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjorNeOh9Frj0QIkfYmSJYIhJiwlAGSFh2xWNbhmPWKQ_iesxK2yPbRW-jVQcH8OjQUUZk_yTuMAnUYugVmtXIgTogy4HIPNy1_fc5CJFXt4vgn3fPlFlohMpBFbeCp1O-ifKguikqIxe99/s1600/leave+a+comment2.png" /></span></blockquote>
<span style="background-color: white; color: #404040; font-family: "Open Sans", Arial, sans-serif; font-size: 13px;"><br /></span>
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3ifNWEmqDsxTXP31xI3UG4K62F9v4GdUN4sStWPjaxbyJwP0lGjUM9hnOHkFHKcekgxjYpTVnVJC1hRcaYaOkVQY_B-GP68Rj53nWuSwZi_s9OWKzjpXpBtIDH5CPkLR6rG1lQsioMNX2/s1600/comment.gif" style="background-color: white; border: none; color: #404040; font-family: "Open Sans", Arial, sans-serif; font-size: 13px; list-style: none; margin: 0px; max-width: 700px; outline: none; padding: 0px; text-align: center; user-select: text !important;" /><br />
<br />
<blockquote class="tr_bq">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3ifNWEmqDsxTXP31xI3UG4K62F9v4GdUN4sStWPjaxbyJwP0lGjUM9hnOHkFHKcekgxjYpTVnVJC1hRcaYaOkVQY_B-GP68Rj53nWuSwZi_s9OWKzjpXpBtIDH5CPkLR6rG1lQsioMNX2/s1600/comment.gif" /></blockquote>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-52666903732630233242017-07-18T22:03:00.002+05:002017-07-18T22:03:24.092+05:00How to Optimize Images for SEO and Increase Blog Traffic?<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjM7OxWD66DSAaz-776aU0IRbhDq-mCWrKMySjTn5aITbh5JDiv_uFkLjisr2QS3LSdWg0BbCCUkeMkTK-AJBonnmhu6zI-R1BdR5CxvV9FPScMCRUYtex7GeKKtvuNgfrajXruHuqDt4jR/s1600/how+to+optimize+images+for+seo+and+increase+in+traffic.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="How to Optimize Images for SEO and Increase Blog Traffic?" border="0" height="344" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjM7OxWD66DSAaz-776aU0IRbhDq-mCWrKMySjTn5aITbh5JDiv_uFkLjisr2QS3LSdWg0BbCCUkeMkTK-AJBonnmhu6zI-R1BdR5CxvV9FPScMCRUYtex7GeKKtvuNgfrajXruHuqDt4jR/s640/how+to+optimize+images+for+seo+and+increase+in+traffic.jpg" title="How to Optimize Images for SEO and Increase Blog Traffic?" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><h2>
How to Optimize Images for SEO and Increase Blog Traffic?</h2>
</td></tr>
</tbody></table>
In this article you will learn<b> How to Optimize Images for SEO and Increase Blog Traffic? </b>Many newbie bloggers are not aware of image optimization. If you are also a newbie then you may be think that <b>How Optimizing Images Helps in Better Rankings? </b>Search Engine rankings depends on <b>keywords </b>and article or content <b>quality</b>. Yes you are right but How can you forget about images.<br />
<br />
Maybe you download images to insert them on your blogs. If not then you are not taking care of your blog professionalism. Images encourage visitors to read your article. If you download then you may see that images have been saved with odd names and we think that changing name is useless. If you want to optimize images for SEOand increase blog traffic then you must change the name of the image according to the keyword of your post or article.<br />
<br />
<h3>
1. Changing Name to Optimize Images:</h3>
<div>
As we have mentioned that pictures you download comes with odd names. Google Image Search is used widely and even images in google also comes with odd names. We are not blaming Google because google doesn't upload images. Images are uploaded by users.</div>
<div>
<br /></div>
<div>
If you want to optimize images for SEO then you must change the name of the image with the keyword of your post.</div>
<div>
<br /></div>
<div>
<b>For Instance</b>: I select the title of the post as name for the first image of post and keywords for other images of the same post.</div>
<div>
<br /></div>
<h3>
2. Adding Alt Attributes to Optimize Images for SEO</h3>
<div>
<br /></div>
<div>
After changing name next comes Alt Attribute. Alt Attribute is the most important aspect of image optimization. Search engines are not able to read multimedia like graphic images or flash. Without Alt Attributes Images are meaningless for Search Spiders. Alt Attributes tells the Search Spiders about the image.</div>
<div>
<br /></div>
<div>
Have you checked your website SEO in sites like <a href="http://www.woorank.com/" rel="nofollow" target="_blank"><b>WooRank</b></a>, <a href="http://seositecheckup.com/" rel="nofollow" target="_blank"><b>SEOSiteCheckup</b></a>. If yes then may be you have seen there that your website images Alt Attribute is missing. Which affects you Blog SEO Score.</div>
<div>
<br /></div>
<div>
To add Alt Attributes to Optimize Images for SEO and Increase Blog Traffic you can open properties of image after uploading.</div>
<div>
<br /></div>
<div>
Keep in mind that your Title and Attribute should not be too large. Try to use your keywords as Alt Attributes. You can also use Title and Alt Attributes same.</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-38143684345751181372017-07-18T15:41:00.000+05:002017-07-18T15:41:02.537+05:00SEO Optimization for Blogger Title for Higher Search Results<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOzw6fUsiuv5ZuhgZHGc1mFC1vFdlrTB4PIUX-2GrvgsvJ34M5TQRyM61KyUYDGBdisF0hgtZY3yFo38oyaVbGeM423GQLhNVXFyZJgfqTX3nHRL1EWLXlhTOpJ-nLIM3ZwfndDn1BYS6T/s1600/seo+optimization+for+blogger+title+for+higher+search+results.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="SEO Optimization for Blogger Title for Higher Search Results" border="0" height="344" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOzw6fUsiuv5ZuhgZHGc1mFC1vFdlrTB4PIUX-2GrvgsvJ34M5TQRyM61KyUYDGBdisF0hgtZY3yFo38oyaVbGeM423GQLhNVXFyZJgfqTX3nHRL1EWLXlhTOpJ-nLIM3ZwfndDn1BYS6T/s640/seo+optimization+for+blogger+title+for+higher+search+results.jpg" title="SEO Optimization for Blogger Title for Higher Search Results" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><h2>
SEO Optimization for Blogger Title for Higher Search Results</h2>
</td></tr>
</tbody></table>
In this article you will learn SEO Optimization for Blogger Title for Higher Search Results.<br />
<br />
Swapping Blogger Title can help in better search engine results. I can also help in increasing click-through-rate. Accoring to Search Engine Optimization (SEO) title is the most important part to rank in search engines.<br />
<br />
By default Blogger Blog title shows the blogger blog name before the page title. After changing the blogger title it will show the page title 1st and after page title it will show blog name.<br />
<br />
Search engines will show this kind of titles of your blog. Page title at the beginning increases chance to being found on search engines.<br />
<br />
<h3>
SEO Optimization for Blogger Title for Higher Search Results</h3>
<div>
<b>1.</b> Login Blogger Account.</div>
<div>
<b>2. </b>Go to <b>Template </b>> <b>Edit HTML</b>.</div>
<div>
<b>3.</b> Search for the following code.</div>
<div>
<br /></div>
<div>
<title><data:blog.pageTitle/></title></div>
<div>
<br /></div>
<div>
<b>4. </b>You have to replace the code with the following code.</div>
<div>
<br /></div>
<div>
<div>
<b:if cond='data:blog.pageType == "item"'></div>
<div>
<title><data:blog.pageName/> | <data:blog.title/></title></div>
<div>
<b:else/></div>
<div>
<title><data:blog.pageTitle/></title> </b:if></div>
</div>
<div>
<br /></div>
<div>
<b>5. </b>Save Template.</div>
<div>
<b>6. </b>Done!</div>
<div>
<br /></div>
<div>
This is not enough to be found in search engines. But Title is the most important perspective for SEO Optimization of Website or Blog. </div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-6751351538499622912017-07-18T15:27:00.003+05:002017-07-18T15:27:59.281+05:00How to Hide Blogger Attribution Gadget?<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgo8Ih_SPfh0cgJz1aaCCswV2ecUc_Oht2cnSQnJ2FMdRDctSBmrMi7-XZQae07TKdj_tD_GhLQqlJKmRsb95q23y4STZTF_-wy4cXNOwevd5xNOA05N66K0JvOcrO6fej6566kNPcVc-1D/s1600/how+to+hide+blogger+attribution+gadget.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="How to Hide Blogger Attribution Gadget?" border="0" height="344" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgo8Ih_SPfh0cgJz1aaCCswV2ecUc_Oht2cnSQnJ2FMdRDctSBmrMi7-XZQae07TKdj_tD_GhLQqlJKmRsb95q23y4STZTF_-wy4cXNOwevd5xNOA05N66K0JvOcrO6fej6566kNPcVc-1D/s640/how+to+hide+blogger+attribution+gadget.jpg" title="How to Hide Blogger Attribution Gadget?" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><h2>
How to Hide Blogger Attribution Gadget?</h2>
</td></tr>
</tbody></table>
In this article you will learn How to Hide Blogger Attribution Gadget?<br />
<br />
Attribution Gadget is the default gadget by Blogger which shows "<b>Powered by Blogger</b>" in footer area. The purpose of this gadget is to give credits to blogger. May be you have tried to remove this widget. But you can't remove blogger attribution gadget in this way as it is locked by blogger. Don't worry it doesn't mean that you can not remove blogger attribution widget. You can Hide Blogger Attribution by a simple method.<br />
<br />
<h3>
How to Hide Blogger Attribution Gadget?</h3>
<br />
<b>1. </b>Login Blogger Account.<br />
<b>2. </b>Go to <b>Template </b>> <b>Edit HTML</b>.<br />
<b>3. </b> Search for the following code.<br />
<br />
<blockquote class="tr_bq">
</head></blockquote>
<br />
<b>4. </b>Above the <b></head> </b>tag add the following code.<br />
<br />
<blockquote class="tr_bq">
<style>#Attribution1{display: none;}</style></blockquote>
<br />
<b>5. </b>Save Template.<br />
<b>6. </b>Done! Hiding Blogger Attribution Gadget.Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-31914199848318948642017-07-18T15:18:00.002+05:002017-07-18T15:19:09.368+05:00How to Add Gadget/Widget Inside your Blogger Header?<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9jzf-zbCSVdmq-1tLIijYqifJ_ZFvLWCQUimgO_1id6h7MUIgh_MkLDhE9VkQcUNgElBYh2MxJWQFamoHXAQf7CJTc8YDtZ1_N7KlTuAUaowNfd7jIsx_JIy8JOfE4OHDak-_dfgJfDSb/s1600/how+to+add+widget+gadget+are+inside+blogger+header.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="How to Add Gadget/Widget Inside your Blogger Header?" border="0" height="344" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9jzf-zbCSVdmq-1tLIijYqifJ_ZFvLWCQUimgO_1id6h7MUIgh_MkLDhE9VkQcUNgElBYh2MxJWQFamoHXAQf7CJTc8YDtZ1_N7KlTuAUaowNfd7jIsx_JIy8JOfE4OHDak-_dfgJfDSb/s640/how+to+add+widget+gadget+are+inside+blogger+header.jpg" title="How to Add Gadget/Widget Inside your Blogger Header?" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><h2>
How to Add Gadget/Widget Inside your Blogger Header?</h2>
</td></tr>
</tbody></table>
In this article you will learn How to Add Gadget/Widget Inside your Blogger Header?<br />
<br />
May be you have seen blogger blogs which have widget area in blogger header. You can add widgets in blogger header. Many of the blogger use Adsense ads in blogger header to increase impressions.<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVFgk7VKYfpB0DMa2RE2hWGPttG8asPxb5CjsFfNthWPueSBbDd33vl50KhNbUWIE-Uyvt5IgmWB3fQz1VjucdzHfcwkOwbOQF6xb06OimY48E9iHefJJploCMRHqI-q5MBQHghVsNQLJM/s1600/how-to-add-gadget-or-widget-inside-blogger-header-blogspot.png" imageanchor="1"><img alt="How to Add Gadget/Widget Inside your Blogger Header?" border="0" height="348" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVFgk7VKYfpB0DMa2RE2hWGPttG8asPxb5CjsFfNthWPueSBbDd33vl50KhNbUWIE-Uyvt5IgmWB3fQz1VjucdzHfcwkOwbOQF6xb06OimY48E9iHefJJploCMRHqI-q5MBQHghVsNQLJM/s640/how-to-add-gadget-or-widget-inside-blogger-header-blogspot.png" title="How to Add Gadget/Widget Inside your Blogger Header?" width="640" /></a><br />
<br />
Some Blogger Templates have gadget/widget area by default. If you are using blogger templates which doesn't have gadget/widget area inside blogger header then you can follow this tutorial to learn How to Add Gadget/Widget Inside your Blogger Header?.<br />
<br />
<b><u>Important Note</u></b>: You must create a backup of your template before following this method.<br />
<br />
<h3>
How to Add Gadget/Widget Inside your Blogger Header?</h3>
<div>
<br /></div>
<h4>
Resize Blogger Header:</h4>
<div>
<br /></div>
<div>
If your template has not widget/gadget area in blogger header then maybe your template header width will be full size. before adding widget/gadget inside your blog header you have to resize you blog header te create a space for widget.</div>
<div>
<br /></div>
<h4>
How to Resize Blogger Header?</h4>
<div>
<br /></div>
<div>
<b>1.</b> Login Blogger Account.</div>
<div>
<b>2.</b> Go to <b>Template </b>> <b>Edit HTML</b>.</div>
<div>
<b>3.</b> Search for the following code.</div>
<div>
<br /></div>
<div>
<blockquote class="tr_bq">
<b:section class='header' id='header' maxwidgets=</blockquote>
</div>
<div>
<br /></div>
<div>
<b><u>Important Note</u></b>: If you are unable to find this code then make sure that there is no space before or after the code.</div>
<div>
<br /></div>
<div>
<b>4.</b> After finding the code, replace <b>class='header' </b>with <b>class='header-left'</b> .</div>
<div>
<b>5.</b> Now you have to find the following code.</div>
<div>
<br /></div>
<div>
<blockquote class="tr_bq">
<div class='header-cap-bottom cap-bottom'></blockquote>
</div>
<div>
<br /></div>
<div>
You will see <b>two </div></b> tags before the searched code.</div>
<div>
<br /></div>
<div>
<b><u>Important Note</u></b>: If you are using<b> custom template</b> downloaded from <b>3rd Party </b>then maybe you will not find these codes. In this case, you have to <b>leave the 4th and 5th steps</b> and add the codes of <b>6th and 7th steps</b> right after the <b></b:section></b> tag.</div>
<div>
<br /></div>
<div>
<b>6.</b> Paste the following code just above the two <b></div></b> tags.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
<div style='clear:both;'/></blockquote>
<div>
<br /></div>
<h4>
How to Add Gadget/Widget Inside your Blogger Header?</h4>
<div>
<br /></div>
<div>
<b>7.</b> Add the following code above <b><div style='clear:both;'/></b> (<b>6th Step</b>)</div>
<div>
<br /></div>
<blockquote class="tr_bq">
<b:section class='header-right crosscol' id='header-right' maxwidgets='1' showaddelement='yes'/></blockquote>
<div>
<br /></div>
<div>
<b>8. </b> Find the following tag.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
</head></blockquote>
<div>
<br /></div>
<div>
<b>9.</b> Above the <b></head></b> tag add the following code.</div>
<div>
<br /></div>
<div>
<blockquote class="tr_bq">
<style><br />
.header-left{<br />
display: inline-block;<br />
float: left;<br />
}<br />
#header-right {<br />
display:inline-block;<br />
float:right;<br />
}<br />
</style></blockquote>
</div>
<div>
<br /></div>
<div>
Important Note: If you widget is wider than your overall area that both widgets will occupy then you have to add<b> margin-right property</b> to move it on the right. See the<b> code example </b>below.</div>
<div>
<br /></div>
<div>
<div>
<blockquote class="tr_bq">
<style><br />.header-left{<br />display: inline-block;<br />float: left;<br />}<br />#header-right {<br />display:inline-block;<br />float:right;<br /><b>margin-right: -20px; </b>}<br /></style></blockquote>
</div>
</div>
<div>
<br /></div>
<div>
<b>10.</b> Save Template.</div>
<div>
<b>11.</b> Go to Layout and you will see two Widgets/Gadgets area in your blogger header area.</div>
<div>
<br /></div>
<div>
Don't worry about the position of new widget area in layout. This is because of the different template. Just make sure that you drag the newly created widget just below the "Header" section.</div>
<div>
<br /></div>
<div>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhxXOPAvHjHKpZkuYrWt1XbcgoStZuxeYL0QvMecmWdmKAhjcC_3R6FOfK_P9nlr49daQ1J1bsr6QpAP_hy1H8J5iDdHNHeJTYgBfmbp-6XX_SCSTS12XAOjWDDBB5uTpWi9_p55yBk2BMB/s1600/how-to-add-a-gadget-inside-blogger-header.png" imageanchor="1"><img alt="new widget area in blogger header" border="0" height="134" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhxXOPAvHjHKpZkuYrWt1XbcgoStZuxeYL0QvMecmWdmKAhjcC_3R6FOfK_P9nlr49daQ1J1bsr6QpAP_hy1H8J5iDdHNHeJTYgBfmbp-6XX_SCSTS12XAOjWDDBB5uTpWi9_p55yBk2BMB/s640/how-to-add-a-gadget-inside-blogger-header.png" title="new widget area in blogger header" width="640" /></a></div>
<div>
<br /></div>
<div>
You can add search box, social follow buttons, social sharing buttons, adsense ads and more in your new widget/gadget area.</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-90854752970806651112017-07-18T14:44:00.003+05:002017-07-18T14:44:59.553+05:00How to Add Facebook Like Button Below Post Titles?<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjenWsWZjz9Ien_p4d1nshB8dH3Rbt_oHrWSZ9Qcpr_bD-OE9aHbtncaR8_o6D2irmS-kc6OZGMRQJ77s6XQCjPkei6LXEbch5uLeJs9mAgV2vpXYJVilLYz0bnJiYLA7iKi5aojji43tYj/s1600/how+to+add+facebook+like+button+below+post+title.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="How to Add Facebook Like Button Below Post Titles in Blogger?" border="0" height="344" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjenWsWZjz9Ien_p4d1nshB8dH3Rbt_oHrWSZ9Qcpr_bD-OE9aHbtncaR8_o6D2irmS-kc6OZGMRQJ77s6XQCjPkei6LXEbch5uLeJs9mAgV2vpXYJVilLYz0bnJiYLA7iKi5aojji43tYj/s640/how+to+add+facebook+like+button+below+post+title.jpg" title="How to Add Facebook Like Button Below Post Titles in Blogger?" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><h2>
How to Add Facebook Like Button Below Post Titles in Blogger?</h2>
</td></tr>
</tbody></table>
In this article you will learn How to Add Facebook Like Button Below Post Titles in Blogger?<br />
<br />
Adding Facebook like button below posts will your visitors to like your post directly from your blog without going to your Facebook page. This like button will be shown below titles of your blog post which will encourage your visitors to like your post.<br />
<br />
Maybe you know that how Facebook likes helps to get our site ranked. If you will get post like then the friends of the user who liked your post will also see your blog post. This can help you to get more audience on your blog post.<br />
<br />
<h3>
How to Add Facebook Like Button Below Post Titles?</h3>
<div>
<br /></div>
<div>
<b>1.</b> Login <b>Blogger Account</b>.</div>
<div>
<b>2.</b> Go to <b>Template </b>> <b>Edit HTML</b>.</div>
<div>
<b>3.</b> <b>Search </b>for the following <b>code</b>.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
<data:post.body/></blockquote>
<div>
<br /></div>
<div>
<b><u>Important Note</u></b>: You may find the above code<b> more than one time</b>. You should stop at <b>2nd </b>or <b>3rd </b>if this method doesn't works at <b>2nd</b>.</div>
<div>
<br /></div>
<div>
<b>4.</b> Just <b>above </b>the <b>searched code</b>, <b>Paste </b>the following <b>code</b>.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
<p><iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=button_count&amp;show_faces=false&amp;width=100&amp; action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:100px; height:20px;'/></p></blockquote>
<div>
<br /></div>
<div>
<b>5.</b> Save Template.</div>
<div>
<b>6.</b> <b>Done</b>! Adding Facebook Like Button Below Post Title.</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-55175477267809136722017-07-18T13:37:00.002+05:002017-07-18T13:37:34.205+05:00How to Auto Add Read More in Blogger Posts?<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOrcsTT8GkR9zP_ch9ne4F9M6IY23n11Jqm7OyIG9YEqbHhVy-mspneJe5xdX_vF5d5yGp05OBi7NZFZYYHohHcbWNiptVbUcqv3apeA9hCqONJi-l5pXRtZd8Yqkz7Decr5rjSvjtNVKN/s1600/how+to+auto+add+read+more+in+blogger+posts.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="How to Auto Add Read More in Blogger Posts?" border="0" height="344" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOrcsTT8GkR9zP_ch9ne4F9M6IY23n11Jqm7OyIG9YEqbHhVy-mspneJe5xdX_vF5d5yGp05OBi7NZFZYYHohHcbWNiptVbUcqv3apeA9hCqONJi-l5pXRtZd8Yqkz7Decr5rjSvjtNVKN/s640/how+to+auto+add+read+more+in+blogger+posts.jpg" title="How to Auto Add Read More in Blogger Posts?" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><h2>
How to Auto Add Read More in Blogger Posts?</h2>
</td></tr>
</tbody></table>
In this article you will How to Auto Add Read More in Blogger Posts?<br />
<br />
May be you have seen blogs with read more button below post showing only a summary or excerpt of post. You have to click read more button to read the full post. Read More button is for blogs homepage. What if your blog homepage is showing full post? Your page load time will increase and if your visitors are viewing your homepage then they will not scroll down full post for viewing other posts.<br />
<br />
You should add read more button in blogger posts and add a summary of the content. When your visitors will see your homepage there will be more chances that they will read more posts of your blog. With this practice your viewers will see the more articles on your blog and there are more chances that they click on your posts. This can also decrease bounce rate of your blog.<br />
<br />
<h3>
How to Auto Add Read More in Blogger Posts?</h3>
<div>
<b>1.</b> Login <b>Blogger Account.</b></div>
<div>
<br /></div>
<blockquote class="tr_bq">
<data:post.body/></blockquote>
<div>
<br /></div>
<div>
<b><u>Important Note</u></b>: You will see the code many times. You have to go for the 3rd code like this.</div>
<div>
<br /></div>
<div>
<b>3. </b>Replace that <b>code </b>with <b>following code</b>.</div>
<div>
<br /></div>
<div>
<blockquote class="tr_bq">
<b:if cond='data:blog.pageType != &quot;static_page&quot;'><br /><b:if cond='data:blog.pageType != &quot;item&quot;'><br /><div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div><br /><script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;,&quot;<data:post.url/>&quot;,&quot;<data:post.title/>&quot;);</script><br /> <span class='readmore' style='float:right;'><a expr:href='data:post.url'>Read More &#187;</a></span></b:if></b:if><br /><b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if><br /><b:if cond='data:blog.pageType == &quot;static_page&quot;'><data:post.body/></b:if></blockquote>
</div>
<div>
<br /></div>
<div>
<b><u>Important Note</u></b>: If adding this code doesn't add read more button then you should also replace the code the 2nd <b><data:post.body/> </b>.</div>
<div>
<br /></div>
<div>
<b>4.</b> Now add the following script above the <b></head> </b>tag.</div>
<div>
<br /></div>
<div>
<blockquote>
<script type='text/javascript'><br />posts_no_thumb_sum = <span style="background-color: red;">495</span>;<br />posts_thumb_sum = <span style="background-color: lime;">401</span>;<br />img_thumb_height = <span style="background-color: yellow;">161</span>;<br />img_thumb_width = <span style="background-color: cyan;">181</span>;<br /></script><br /><script type='text/javascript'><br />//<![CDATA[<br />function removeHtmlTag(strx,chop){<br />if(strx.indexOf("<")!=-1)<br />{<br />var s = strx.split("<");<br />for(var i=0;i<s.length;i++){<br />if(s[i].indexOf(">")!=-1){<br />s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);<br />}<br />}<br />strx = s.join("");<br />}<br />chop = (chop < strx.length-1) ? chop : strx.length-2;<br />while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;<br />strx = strx.substring(0,chop-1);<br />return strx+'...';<br />}<br />function createSummaryAndThumb(pID, pURL, pTITLE){<br />var div = document.getElementById(pID);<br />var imgtag = "";<br />var img = div.getElementsByTagName("img");<br />var summ = posts_no_thumb_sum;<br />if(img.length>=1) {<br />imgtag = '<span class="posts-thumb" style="float:left; margin-right: 10px;"><a href="'+ pURL +'" title="'+ pTITLE+'"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px" /></a></span>';<br />summ = posts_thumb_sum;<br />}<br />var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';<br />div.innerHTML = summary;<br />}<br />//]]><br /></script><br /><b:if cond='data:blog.pageType != &quot;static_page&quot;'><br /><b:if cond='data:blog.pageType != &quot;item&quot;'><br /><style type='text/css'><br />.post-footer {display: none;}<br />.post {margin-bottom: 10px; border-bottom: 1px dotted #E6E6E6; padding-bottom: 20px;}<br /> .readmore a {text-decoration: none; }<br /></style><br /></b:if><br /></b:if></blockquote>
<br />
<h4>
Customization for Auto Read More Posts:</h4>
<div>
<ol>
<li>To change the post summary or excerpt length if no image or thumbnail found in the post, change <span style="background-color: red;">495</span><span style="background-color: white;"> with the characters length you want to show as summary or excerpt.</span></li>
<li>To change the post summary or excerpt length if there is a thumbnail, change <span style="background-color: lime;">401</span> with the characters length you want to show as summary or excerpt.</li>
<li>If you want to change the size of the thumbnail then change the value <span style="background-color: cyan;">181</span><span style="background-color: white;"> for width and </span><span style="background-color: yellow;">161</span><span style="background-color: white;"> for height.</span></li>
</ol>
</div>
<span style="background-color: white;"><br /></span>
<span style="background-color: white;"><b>6.</b> Save Template.</span><br />
<span style="background-color: white;"><b>7.</b> Done!</span><br />
<span style="background-color: white;"><br /></span>
<span style="background-color: white;"><b><u>Important Note</u></b>: If it doesn't work then you must paste the code of 4th method above <b></body></b> tag instaed of above <b></head> </b>.</span></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-41598739495446799402017-07-17T16:10:00.002+05:002017-07-17T16:10:33.135+05:00How to Kill Processes from the Windows Command Line?<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcNzkRwpLP_ZjLSxn5cVMiJLN2Uy8pRTcX04j2BG8bRSfKQ1qlcdHW0LYYETQzaSmOsa-577HyrAohyphenhyphenTYjJTFR8t3h4VgjxCwlIzg_7Lwes56QdLm7WlJWWQYE24Eq4aZ8k801AV91K6wM/s1600/how+to+kill+processes+from+the+windows+command+line.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="How to Kill Processes from the Windows Command Line?" border="0" height="344" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcNzkRwpLP_ZjLSxn5cVMiJLN2Uy8pRTcX04j2BG8bRSfKQ1qlcdHW0LYYETQzaSmOsa-577HyrAohyphenhyphenTYjJTFR8t3h4VgjxCwlIzg_7Lwes56QdLm7WlJWWQYE24Eq4aZ8k801AV91K6wM/s640/how+to+kill+processes+from+the+windows+command+line.jpg" title="How to Kill Processes from the Windows Command Line?" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><h2>
How to Kill Processes from the Windows Command Line?</h2>
</td></tr>
</tbody></table>
<div class="tr_bq">
In this article you will learn How to Kill Processes from the Windows Command Line? Command lines for various actions like changing priority, viewing or suspending process.</div>
<div class="tr_bq">
<br /></div>
<div class="tr_bq">
If you have used Linux/Unix then you may be know the ability to kill processes using command line. Linux provides a set of commands which doesn't exist in Windows by default. But we can also kill processes from the Windows Command Prompt. Reading this tutorial you will be able to delete processes from the Windows Command Line.</div>
<br />
You can see the commands at <a href="http://retired.beyondlogic.org/solutions/processutil/processutil.htm" rel="nofollow" target="_blank"><b>Beyond Logic Website</b></a> which we can use to View/Kill/Suspend Processes. These are simple commands which provide us utility to perform these actions including changing the priority of the process.<br />
<br />
<b>Syntax:</b><br />
<b><br /></b>
<blockquote class="tr_bq">
process -k “Process ID”<br />process -k “Process Name”</blockquote>
<br />
<br />
<b>Example to Use:</b><br />
<b><br /></b>
<blockquote>
> process -k “notepad.exe”<br />Command Line Process Viewer/Killer/Suspender for Windows NT/2000/XP V2.03<br />Copyright(C) 2002-2003 Craig.Peacock@beyondlogic.org<br />Killing PID 2304 ‘notepad.exe’<br />OR:<br />> process -k 2192<br />Command Line Process Viewer/Killer/Suspender for Windows NT/2000/XP V2.03<br />Copyright(C) 2002-2003 Craig.Peacock@beyondlogic.org<br />Killing PID 2192 ‘notepad.exe’</blockquote>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-50517588205248610962017-07-17T15:59:00.000+05:002017-07-17T15:59:29.780+05:00How to Display List of Started Services in Command Prompt?<div class="tr_bq">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiY7QqlVjkS8EzMYs42V4cMJPFC_AVBHCzXsfWJLjAnoyov1mT52b7ka3b6NoStJOFcx9hczCyetJsIvPP0I8cgqPs1U_Tg9hK6cBx3VVZrPAoxpxYBO-2dt19vMEklfVpD7HLDlJKOWjub/s1600/how+to+display+list+of+started+services+in+command+prompt.jpg" imageanchor="1"><img alt="How to Display List of Started Services in Command Prompt?" border="0" height="344" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiY7QqlVjkS8EzMYs42V4cMJPFC_AVBHCzXsfWJLjAnoyov1mT52b7ka3b6NoStJOFcx9hczCyetJsIvPP0I8cgqPs1U_Tg9hK6cBx3VVZrPAoxpxYBO-2dt19vMEklfVpD7HLDlJKOWjub/s640/how+to+display+list+of+started+services+in+command+prompt.jpg" title="How to Display List of Started Services in Command Prompt?" width="640" /></a></div>
<div class="tr_bq">
<br /></div>
<div class="tr_bq">
In this article How to Display List of Started Services in Command Prompt?</div>
<br />
Windows provide this utility to interact with the services panel with command line. With the command prompt we can use this utility to start, pause, continue and stop services. May be you don't know that you can also display list of started services that are running on your computer with command line.<br />
<br />
<h3>
How to Display List of Started Services in Command Prompt?</h3>
<div>
<br /></div>
<div>
<b>1. </b>Enter the following command link in command prompt (cmd).</div>
<div>
<br /></div>
<blockquote class="tr_bq">
net start</blockquote>
<br />
<b>2. </b>This will show you the services running on your computer as given below.<br />
<br />
<blockquote>
These window services are started:</blockquote>
<blockquote class="tr_bq">
AMD External Events Utility<br />Application Information<br />Background Intelligent Transfer Service<br />Base Filtering Engine<br />COM+ Event System<br />DCOM Server Processor Launcher<br />Device Install Service<br />DHCP Client<br />Diagnostic Policy Service<br />Diagnostic Service Host<br />Diagnostic System Host<br />DNS Client<br />Human Interface Device Access<br />IPsec Policy Agent<br />Local Session Manager<br />Netwrok Connections<br />Network List Service<br />Network Location Awareness<br />Network Store Interface Service<br />Plug and Play<br />Power </blockquote>
<blockquote class="tr_bq">
The command completed succesfully.</blockquote>
<div>
<br /></div>
<div>
<b><u>Note</u></b>: Output will vary based on your machine.</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-43759203236970334572017-07-17T15:43:00.000+05:002017-07-17T15:44:03.558+05:00How to Fix Firefox Memory Leak on Windows?<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-bZsLDS1L9xmvMiGy0g0bhvwpLzvvOngxvPYnMfUDZg6QJc5YP5Xo8mEpL9Bo1WWicqtEMfHeGGVPrrx3h7DGMv1TB5qk3GEjq9t6Qm0ae9-iR73X-7OE2B-r_wEUbPTxPWQWPlsHlrNL/s1600/how+to+fix+firefox+memory+leak+on+windows.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="How to Fix Firefox Memory Leak on Windows?" border="0" height="345" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-bZsLDS1L9xmvMiGy0g0bhvwpLzvvOngxvPYnMfUDZg6QJc5YP5Xo8mEpL9Bo1WWicqtEMfHeGGVPrrx3h7DGMv1TB5qk3GEjq9t6Qm0ae9-iR73X-7OE2B-r_wEUbPTxPWQWPlsHlrNL/s640/how+to+fix+firefox+memory+leak+on+windows.jpg" title="How to Fix Firefox Memory Leak on Windows?" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><h2>
How to Fix Firefox Memory Leak on Windows?</h2>
</td></tr>
</tbody></table>
In this article you will learn How to Fix Firefox Memory Leak on Windows?<br />
<br />
When you minimize a window the application goes in-active. In this way, memory usage goes down because application is not active. But Firefox doesn't follow this practice. Here is a way by which you can force Firefox to stop using extra memory usage.<br />
<br />
<h3>
How to Fix Firefox Memory Leak on Windows?</h3>
<div>
<b>1. </b>Type the following code in <b>Address Bar </b>of Firefox.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
about:config</blockquote>
<br />
<b>2. </b>You will see a window like the screenshot below.<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibo3yXYmmbRJKWfKELDPenfnpvUk9ti2mB0GTldYbHAf4m-KQknc7HXL6PV7j6pzObSXjLxb0uB80WbnO7tvu_UCnwQgz1XKJukX0ZYbyg4IknuyQ-vvQ-S-VSuaTxqJEwteOykPDC0_As/s1600/image06.png" imageanchor="1"><img alt="Firefox About Config" border="0" height="376" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibo3yXYmmbRJKWfKELDPenfnpvUk9ti2mB0GTldYbHAf4m-KQknc7HXL6PV7j6pzObSXjLxb0uB80WbnO7tvu_UCnwQgz1XKJukX0ZYbyg4IknuyQ-vvQ-S-VSuaTxqJEwteOykPDC0_As/s640/image06.png" title="Firefox About Config" width="640" /></a><br />
<br />
<b>3. </b>Now you have to <b>Right Click </b>anywhere in th Window and choose <b>New </b>> <b>Boolean </b>and enter the following text.<br />
<br />
<blockquote class="tr_bq">
config.trim_on_minimize</blockquote>
<br />
<b>4. </b>To change the value you can either <b>Right Click </b>, Double Click and select <b>Toggle</b>.<br />
<b>5. </b>Restart Firefox. Now you can see Firefox Memory usage going down when we minimize Firefox.<br />
<b>6. </b>Done!<br />
<br />
<b style="text-decoration-line: underline;">Important Note</b>: Value should be set to true in order to work for this.Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-35959742844378746552017-07-17T15:01:00.002+05:002017-07-17T15:01:33.108+05:00How to Display the Routing Table in Ubuntu?<span style="background-color: white;"><span style="color: #222222; font-family: Open Sans, sans-serif;"><span style="font-size: 15px;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEg_GXDngglXcPAE37tTp7SEDfEFn_9ohh1pHZ5ODMp1jHXARqVQo_7sAJqLmrdml7lN5i3K-uUv7i-0vD3H6iRUpsen2TzgGD5c4DhcINpTVleygXL6lWH8C9_2BUy8w_FI-KWGTs26QE/s1600/how+to+display+routing+table+in+ubuntujpg.jpg" imageanchor="1"><img alt="How to Display the Routing Table in Ubuntu?" border="0" height="344" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEg_GXDngglXcPAE37tTp7SEDfEFn_9ohh1pHZ5ODMp1jHXARqVQo_7sAJqLmrdml7lN5i3K-uUv7i-0vD3H6iRUpsen2TzgGD5c4DhcINpTVleygXL6lWH8C9_2BUy8w_FI-KWGTs26QE/s640/how+to+display+routing+table+in+ubuntujpg.jpg" title="How to Display the Routing Table in Ubuntu?" width="640" /></a></span></span></span><br />
<span style="background-color: white;"><span style="color: #222222; font-family: Open Sans, sans-serif;"><span style="font-size: 15px;"><br /></span></span></span>
<span style="background-color: white;"><span style="color: #222222; font-family: Open Sans, sans-serif;"><span style="font-size: 15px;">In this article you will learn How to Display the Routing Table in Ubuntu??</span></span></span><br style="background-color: white; color: #222222; font-family: "Open Sans", sans-serif; font-size: 15px; outline: 0px; transition: all 0.3s ease;" /><br />
<h3 style="background: 0px 0px rgb(255, 255, 255); border: 0px; color: #222222; font-family: "Open Sans", sans-serif; margin: 0px 0px 15px; outline: 0px; padding: 0px; position: relative; transition: all 0.3s ease; vertical-align: baseline;">
How to Display the Routing Table in Ubuntu?</h3>
<div style="background: 0px 0px rgb(255, 255, 255); border: 0px; color: #222222; font-family: "Open Sans", sans-serif; font-size: 15px; margin: 0px; outline: 0px; padding: 0px; transition: all 0.3s ease; vertical-align: baseline;">
<br style="outline: 0px; transition: all 0.3s ease;" /></div>
<div style="background: 0px 0px rgb(255, 255, 255); border: 0px; color: #222222; font-family: "Open Sans", sans-serif; font-size: 15px; margin: 0px; outline: 0px; padding: 0px; transition: all 0.3s ease; vertical-align: baseline;">
1. Open Terminal Window.</div>
<div style="background: 0px 0px rgb(255, 255, 255); border: 0px; color: #222222; font-family: "Open Sans", sans-serif; font-size: 15px; margin: 0px; outline: 0px; padding: 0px; transition: all 0.3s ease; vertical-align: baseline;">
2. Run the following Command.</div>
<div style="background: 0px 0px rgb(255, 255, 255); border: 0px; color: #222222; font-family: "Open Sans", sans-serif; font-size: 15px; margin: 0px; outline: 0px; padding: 0px; transition: all 0.3s ease; vertical-align: baseline;">
<br style="outline: 0px; transition: all 0.3s ease;" /></div>
<blockquote class="tr_bq" style="background: 0px 0px rgb(255, 255, 255); border-bottom-color: initial; border-bottom-style: initial; border-image: initial; border-left-color: rgb(204, 204, 204); border-left-style: solid; border-right-color: initial; border-right-style: initial; border-top-color: initial; border-top-style: initial; border-width: 0px 0px 0px 3px; color: #222222; font-family: "normal helvetica", sans-serif; font-size: 14px; font-stretch: normal; line-height: 22px; margin: 10px 0px 10px 50px; outline: 0px; padding: 0px 0px 0px 15px; transition: all 0.3s ease; vertical-align: baseline;">
netstat -rn</blockquote>
<br />
<span style="background-color: white; color: #222222; font-family: "Open Sans", sans-serif; font-size: 15px;">3. You will see output as following.</span><br style="background-color: white; color: #222222; font-family: "Open Sans", sans-serif; font-size: 15px; outline: 0px; transition: all 0.3s ease;" /><br />
<blockquote class="tr_bq" style="background: 0px 0px rgb(255, 255, 255); border-bottom-color: initial; border-bottom-style: initial; border-image: initial; border-left-color: rgb(204, 204, 204); border-left-style: solid; border-right-color: initial; border-right-style: initial; border-top-color: initial; border-top-style: initial; border-width: 0px 0px 0px 3px; color: #222222; font-family: "normal helvetica", sans-serif; font-size: 14px; font-stretch: normal; line-height: 22px; margin: 10px 0px 10px 50px; outline: 0px; padding: 0px 0px 0px 15px; transition: all 0.3s ease; vertical-align: baseline;">
Kernel IP routing table<br style="outline: 0px; transition: all 0.3s ease;" />Destination Gateway Genmask Flags MSS Window irtt Iface<br style="outline: 0px; transition: all 0.3s ease;" />192.168.1.0 0.0.0.0 255.255.255.0 U 0 0 0 eth0<br style="outline: 0px; transition: all 0.3s ease;" />169.254.0.0 0.0.0.0 255.255.0.0 U 0 0 0 eth0<br style="outline: 0px; transition: all 0.3s ease;" />127.0.0.0 0.0.0.0 255.0.0.0 U 0 0 0 lo<br style="outline: 0px; transition: all 0.3s ease;" />0.0.0.0 192.168.1.1 0.0.0.0 UG 0 0 0 eth0</blockquote>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-44647771518150894782017-07-17T14:58:00.001+05:002017-07-17T14:58:16.549+05:00How to Display the Routing Table in Windows?<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjk1o46uRLWjGVG9lHoryIcfT7ZCvpbCt0olymMm-THQ55PsX8yFxQZ4ym_G1Uj2Qy0RLwp55_CVztFiUieSXaaSewdDxcp0FrpUs-WNFy6udq-lSNnWB9C2LBp7d6eL_SuBH2ZrCpvEX7f/s1600/how+to+display+routing+table+in+windows.jpg" imageanchor="1"><img alt="How to Display the Routing Table in Windows?" border="0" height="344" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjk1o46uRLWjGVG9lHoryIcfT7ZCvpbCt0olymMm-THQ55PsX8yFxQZ4ym_G1Uj2Qy0RLwp55_CVztFiUieSXaaSewdDxcp0FrpUs-WNFy6udq-lSNnWB9C2LBp7d6eL_SuBH2ZrCpvEX7f/s640/how+to+display+routing+table+in+windows.jpg" title="How to Display the Routing Table in Windows?" width="640" /></a><br />
<br />
In this article you will learn How to Display the Routing Table in Windows?<br />
<br />
<h3>
How to Display the Routing Table in Windows?</h3>
<div>
<br /></div>
<div>
1. Open Command Prompt.</div>
<div>
2. Run the following Command.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
netstat -rn</blockquote>
3. You will see output as following.<br />
<br />
<blockquote class="tr_bq">
Kernel IP routing table<br />Destination Gateway Genmask Flags MSS Window irtt Iface<br />192.168.1.0 0.0.0.0 255.255.255.0 U 0 0 0 eth0<br />169.254.0.0 0.0.0.0 255.255.0.0 U 0 0 0 eth0<br />127.0.0.0 0.0.0.0 255.0.0.0 U 0 0 0 lo<br />0.0.0.0 192.168.1.1 0.0.0.0 UG 0 0 0 eth0</blockquote>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-83049913905066198732017-07-17T14:51:00.000+05:002017-07-17T14:51:00.075+05:00How to Restore MySQL Database from a Backup File?<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjo3LIjk1wexVC30_WXmmvw6oche9lQd3tx6DA6QXGWRuc9E6RZDLETQD2UvoD1hiJ00tlg85oNFGrOH2WzUmHAYNjMgb792SeelzcbDzAyU4wdwA_c21_s-FHPxvXXcMHf2o8PxojpB0pb/s1600/how+to+restore+mysql+database+from+a+backup+file.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="How to Restore MySQL Database from a Backup File?" border="0" height="344" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjo3LIjk1wexVC30_WXmmvw6oche9lQd3tx6DA6QXGWRuc9E6RZDLETQD2UvoD1hiJ00tlg85oNFGrOH2WzUmHAYNjMgb792SeelzcbDzAyU4wdwA_c21_s-FHPxvXXcMHf2o8PxojpB0pb/s640/how+to+restore+mysql+database+from+a+backup+file.jpg" title="How to Restore MySQL Database from a Backup File?" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><h2>
How to Restore MySQL Database from a Backup File?</h2>
</td></tr>
</tbody></table>
In this article you will learn How to Restore MySQL Database from a Backup File?<br />
<br />
There may be many reason because of which you have to restore your MySQL Database. Here is a way by which you can Restore MySQL Database from a Backup file.<br />
<br />
<b><u>Important Note</u></b>: I recommend you to test this method before applying to your database to make sure that your database backups are working correctly.<br />
<br />
<h3>
How to Restore MySQL Database from a Backup File?</h3>
<div>
<b>1. </b>Syntax of Code:</div>
<div>
<br /></div>
<div>
<blockquote class="tr_bq">
mysql -h hostname -u username -pthepassword databasename < dumpfile.sql</blockquote>
<b>2. </b>Example:<br />
<br />
<blockquote class="tr_bq">
mysql -h localhost -u root -p72aDufi8 db01 < thedumpfile.sql</blockquote>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-27250785647972659152017-07-17T13:34:00.002+05:002017-07-17T13:34:22.797+05:00How to Get Windows 10 Style Start Menu in Windows 8.1?<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLI_VqFsB4PQQRr6lgIeFqRXi4FBjbBKH8f3U6Xi4kOr-zGjBaJGrXmtrqgokP8hBwIBBKyLwsZjUKzijpK3MqkhtruV8dBxa_76BYk3I6prI0maaXkebINP4Vti_dXZWK8WKyYFYWyrf2/s1600/how+to+get+windows+10+style+start+menu+in+windows+8.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="How to Get Windows 10 Style Start Menu in Windows 8.1?" border="0" height="344" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLI_VqFsB4PQQRr6lgIeFqRXi4FBjbBKH8f3U6Xi4kOr-zGjBaJGrXmtrqgokP8hBwIBBKyLwsZjUKzijpK3MqkhtruV8dBxa_76BYk3I6prI0maaXkebINP4Vti_dXZWK8WKyYFYWyrf2/s640/how+to+get+windows+10+style+start+menu+in+windows+8.jpg" title="How to Get Windows 10 Style Start Menu in Windows 8.1?" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><h2>
How to Get Windows 10 Style Start Menu in Windows 8.1?</h2>
</td></tr>
</tbody></table>
In this article you will learn How to Get Windows 10 Style Start Menu in Windows 8.1?<br />
<br />
If you are using Windows 8.1 then you can add Windows 10 Style Start Menu in Windows 8.1. Why not upgrade to Windows 10. If your computer/laptop doesn't fulfill requirements to install Windows 10 then you can use this method to add a feature of Windows 10 in Windows 8.1.<br />
<br />
<b><u>Important Note</u></b>: Some of the antivirus programs detects that this an adware/ads. But don't worry this is tested program and there is no ad or any virus.<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQJPiY4NZyfmuaSSQHvuJQQAAPX1i03-X4KH9OQKMU5GIz-AFzVShXAeriFMo-qkNoTKBwOb18m40ABuX-Qrw61gcjQgw4trRdEeySVwRm0Fcrd0ueYsO8vhKkVk_DHx6c8jK9PVnLcO05/s1600/00_lead_image_windows10_start_menu.png" imageanchor="1"><img alt="Windows 10 Style Start Menu in Windows 8.1" border="0" height="185" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQJPiY4NZyfmuaSSQHvuJQQAAPX1i03-X4KH9OQKMU5GIz-AFzVShXAeriFMo-qkNoTKBwOb18m40ABuX-Qrw61gcjQgw4trRdEeySVwRm0Fcrd0ueYsO8vhKkVk_DHx6c8jK9PVnLcO05/s400/00_lead_image_windows10_start_menu.png" title="Windows 10 Style Start Menu in Windows 8.1" width="400" /></a><br />
<br />
<h3>
How to Get Windows 10 Style Start Menu in Windows 8.1?</h3>
<div>
<b>1. <a href="https://downtechz.blogspot.com/2017/07/vistart-windows-start-menu-81-full.html" rel="" target="_blank">Download ViStart </a></b>and Run the program.</div>
<div>
<br /></div>
<div>
The file that you will download from the above link is used to run the program. When you will run the ViStart it will create "<b>ViStart Directory</b>" in "<b>App Data Folder</b>" which will give access to software to install skins.</div>
<div>
<br /></div>
<div>
<b>2. </b>When you will run the program, Right Click on ViStart icon in taskbar system tray and the select <b>Exit </b>to close the program.</div>
<div>
<br /></div>
<div>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjieedS7qpxzeOM45E0pdIZCNfZ1oDHssfiD-dV0FWuqfhtwrHfdW_aharJbycUPbGLggq4a20-xDY-tkc6Tyn0Tp3XYJg8yjukAFUrQe59QlAosQ_i_pyKQ0DbVagYKhk_lZ-tct6GLgJK/s1600/01_closing_vistart.png" imageanchor="1"><img alt="Closing ViStart" border="0" height="230" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjieedS7qpxzeOM45E0pdIZCNfZ1oDHssfiD-dV0FWuqfhtwrHfdW_aharJbycUPbGLggq4a20-xDY-tkc6Tyn0Tp3XYJg8yjukAFUrQe59QlAosQ_i_pyKQ0DbVagYKhk_lZ-tct6GLgJK/s400/01_closing_vistart.png" title="Closing ViStart" width="400" /></a></div>
<div>
<b><br /></b></div>
<div>
<u><b>Important Note</b></u><b>: </b>You may see that when you will exit ViStart, the Start orb on the Taskbar disappeared. This seems to be a minor bug. You can still access the Start screen by pressing the Windows key. You can get the Start orb back by logging out and back in or by restarting your computer.</div>
<div>
<br /></div>
<div>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7UmGu5UFbmhlTHc44MiefgpYRSsFw9PJj9fpP6h_aeqNnY3OHzaC-gFS84BWogwA8OVoW_419F34HlJ4JCSYNXetdV1BAROrGXP0gLPnYIUp2SdM3S2SJbQh4mFVvUIMr_7tP18aOxtqz/s1600/08_start_button_gone.png" imageanchor="1"><img alt="ViStart Start Button Gone" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7UmGu5UFbmhlTHc44MiefgpYRSsFw9PJj9fpP6h_aeqNnY3OHzaC-gFS84BWogwA8OVoW_419F34HlJ4JCSYNXetdV1BAROrGXP0gLPnYIUp2SdM3S2SJbQh4mFVvUIMr_7tP18aOxtqz/s400/08_start_button_gone.png" title="ViStart Start Button Gone" /></a></div>
<div>
<br /></div>
<div>
<b>3.</b> Download Windows 10 Start Menu Skin Pack You like. Extract the Skin if they are in ZIP, RAR Format.</div>
<div>
<br /></div>
<div>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhloiPNFGzUEkJJMTapn2cAQmYWa9DLbYkaGMqtxbvLVa772ukvhsFRcJxXSWWfkb-7Luf6ozWxNONevDK2y3Dv8amxqZAvj87E-TP1cvE5hIfg2k-DlDCt1dRq6XH5q9SiW_HYa0Fg0844/s1600/05_copying_skin_folders.png" imageanchor="1"><img alt="Copy Windows 10 Skin Pack" border="0" height="296" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhloiPNFGzUEkJJMTapn2cAQmYWa9DLbYkaGMqtxbvLVa772ukvhsFRcJxXSWWfkb-7Luf6ozWxNONevDK2y3Dv8amxqZAvj87E-TP1cvE5hIfg2k-DlDCt1dRq6XH5q9SiW_HYa0Fg0844/s400/05_copying_skin_folders.png" title="Copy Windows 10 Skin Pack" width="400" /></a></div>
<div>
<br /></div>
<div>
<b>4. </b>Hit <b>Windows Key + R </b>to open <b>Run</b>. Type the <b>following line </b>in the <b>dialog box </b>and click <b>ok</b>.</div>
<blockquote class="tr_bq">
%apdata%\ViStart\_skins</blockquote>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguUaWu66_Acx_gb4ik5d1JtUgE2CSnOrG-p9sFIhY1IP9QXUf4fPVj58JBffdoTF0QCamMTstrGhoO3mgjN_EGcmn8HvOlAs7vm7rioktgVDGSC4TKwCS8lAInZ55YWtdWYJfYhYOvdxya/s1600/06_opening_vistart_skins_folder.png" imageanchor="1"><img alt="Opening ViStart Skins" border="0" height="161" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguUaWu66_Acx_gb4ik5d1JtUgE2CSnOrG-p9sFIhY1IP9QXUf4fPVj58JBffdoTF0QCamMTstrGhoO3mgjN_EGcmn8HvOlAs7vm7rioktgVDGSC4TKwCS8lAInZ55YWtdWYJfYhYOvdxya/s400/06_opening_vistart_skins_folder.png" title="Opening ViStart Skins" width="400" /></a><br />
<br />
<b>5. </b>Copy and paste the extracted skins in the <b>_skins </b>directory.<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFtJNzRMKFoHDn5p6ZUCSt3gcjNS7-B3VHXmDQSPL3WvxAtTS0gPLjSZpH5WUwUaEUPhglf2_g7xSIdeQbSb8q5T4y-QUF10VbcjHCNCOwXDCq8y1lbTtS24p4kt3XcE6UfWApvkJEzjEH/s1600/07_pasting_skins_into_skins_folder.png" imageanchor="1"><img alt="Pasting Skin in Skin Directory" border="0" height="296" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFtJNzRMKFoHDn5p6ZUCSt3gcjNS7-B3VHXmDQSPL3WvxAtTS0gPLjSZpH5WUwUaEUPhglf2_g7xSIdeQbSb8q5T4y-QUF10VbcjHCNCOwXDCq8y1lbTtS24p4kt3XcE6UfWApvkJEzjEH/s400/07_pasting_skins_into_skins_folder.png" title="Pasting Skin in Skin Directory" width="400" /></a><br />
<br />
<b>6. </b>Now go to the folder from where you copied the skins. There you will find file <b>English.xml. </b>Copy the file.<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-byisUY5Nf7PhbSekHwbK2H4y_X2PRLqb6dJKcAogGfvpf6NYFWfXjJOr3gbi8MZEZ8ppE13_PE6soj31v03s4hXSZjXRl6Zz__2dJImOjLsIzWL2pY_KfsC-HvVYFDnFbVuFdTX2qLg5/s1600/09_copying_xml_file.png" imageanchor="1"><img alt="Copying English XML File" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-byisUY5Nf7PhbSekHwbK2H4y_X2PRLqb6dJKcAogGfvpf6NYFWfXjJOr3gbi8MZEZ8ppE13_PE6soj31v03s4hXSZjXRl6Zz__2dJImOjLsIzWL2pY_KfsC-HvVYFDnFbVuFdTX2qLg5/s400/09_copying_xml_file.png" title="Copying English XML File" /></a><br />
<br />
<b>7. </b><b> </b>Hit <b>Windows Key + R </b>to open <b>Run</b>. Type the <b>following line </b>in the <b>dialog box </b>and click <b>ok</b>.<br />
<blockquote class="tr_bq">
%apdata%\ViStart\Languages</blockquote>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdMwq1Az9uR4Bgyk92QoAtELNKzVF8lBQxMplhLappqk9-FRGF4AADeqUnIErs8GOVjudoUml2IODbNtqIt3zaEwwrvg9gg78ExBJQU1nT6AI6k6Uk1dWmkQmUR0ZqTImYVStlkG3-Cs7j/s1600/10_opening_parent_vistart_folder.png" imageanchor="1"><img alt="Open Parent ViStart" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdMwq1Az9uR4Bgyk92QoAtELNKzVF8lBQxMplhLappqk9-FRGF4AADeqUnIErs8GOVjudoUml2IODbNtqIt3zaEwwrvg9gg78ExBJQU1nT6AI6k6Uk1dWmkQmUR0ZqTImYVStlkG3-Cs7j/s400/10_opening_parent_vistart_folder.png" title="Open Parent ViStart" /></a><br />
<br />
I recommend you to change to name of original file already in the directory <b>English.xml </b>file before copying the file into new directory.<br />
<b><u>Important Note</u></b>: You can rename file by pressing F2 Key.<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBaKVE_X1-t46yF2n_0c-3DrVALTrST0UirH6VPcLZGwXpC60ltfK2CMquhue2_ubaDzokOkHjJzhR-p0y8FtDeW8VAbUMg17-tMOojAu626KBnrUqQR8esyrL3_O3lvRMdDaBnmpO4Weu/s1600/12_renaming_english_xml_file.png" imageanchor="1"><img alt="Renaming XML FIle" border="0" height="296" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBaKVE_X1-t46yF2n_0c-3DrVALTrST0UirH6VPcLZGwXpC60ltfK2CMquhue2_ubaDzokOkHjJzhR-p0y8FtDeW8VAbUMg17-tMOojAu626KBnrUqQR8esyrL3_O3lvRMdDaBnmpO4Weu/s400/12_renaming_english_xml_file.png" title="Renaming XML FIle" width="400" /></a><br />
<br />
<b>8. </b>After renaming the original file paste the file you cpoied before.<br />
<br />
<b>10. </b>To make the start menu like Windows 10. Right Click on icon of ViStart in System Tray and Select Options.<br />
Now you can see the options.<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirlMeY03G4yfdHZmU0lA1r-OmVreb9D78M-RgAjNSqn-7ZQAVYvMTWBQgh41V5zL8xH7MXtxdFhJj7VkOka9eQp7-d5AwvwE94SMjEb1NKGWYhvV9Ej-nlMCrsjQv0n4Lfg8rrYwAEKNAP/s1600/15_selecting_a_windows10_style.png" imageanchor="1"><img alt="Selecting Windows 10 Style" border="0" height="286" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirlMeY03G4yfdHZmU0lA1r-OmVreb9D78M-RgAjNSqn-7ZQAVYvMTWBQgh41V5zL8xH7MXtxdFhJj7VkOka9eQp7-d5AwvwE94SMjEb1NKGWYhvV9Ej-nlMCrsjQv0n4Lfg8rrYwAEKNAP/s400/15_selecting_a_windows10_style.png" title="Selecting Windows 10 Style" width="400" /></a><br />
<br />
You can also select the style of Start orb.<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVTQeZJne8uRgMekZ0o8joed0rIyuqwMpFUGihYgp7shX-reWtnF7f9cf_7tJePUcUFpwxBFaWB0BEVMwgBKdON9IY7PEFz1JdoS8B-ZoM3u88cSNDMQbzots8OBF1Rpdw1UzYIvGHpqFP/s1600/15a_selecting_start_orb_style.png" imageanchor="1"><img alt="Selecting Start orb Style" border="0" height="285" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVTQeZJne8uRgMekZ0o8joed0rIyuqwMpFUGihYgp7shX-reWtnF7f9cf_7tJePUcUFpwxBFaWB0BEVMwgBKdON9IY7PEFz1JdoS8B-ZoM3u88cSNDMQbzots8OBF1Rpdw1UzYIvGHpqFP/s400/15a_selecting_start_orb_style.png" title="Selecting Start orb Style" width="400" /></a><br />
<br />
<b>11. </b>Click on <b>Configure </b>to select the options which you want to display in start menu.<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPSJm3xAQ29DphIQSEbGfbAh6lyG9EsRguAIW4AYlegykDnJ_SaErgU8y_B1M4CO1WOnYPr6nBoImjqH9dOipFMkjsWQV3Hd8yltjU2oxPdRcTuyhR3w0sjMKDIznfy_OApuRurTrpKfUg/s1600/16_configure_screen.png" imageanchor="1"><img alt="Configuring Start Menu Screen" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPSJm3xAQ29DphIQSEbGfbAh6lyG9EsRguAIW4AYlegykDnJ_SaErgU8y_B1M4CO1WOnYPr6nBoImjqH9dOipFMkjsWQV3Hd8yltjU2oxPdRcTuyhR3w0sjMKDIznfy_OApuRurTrpKfUg/s400/16_configure_screen.png" title="Configuring Start Menu Screen" /></a><br />
<br />
<b>12. </b>The desktop screen allows you to configure how start button and windows key behaves. You can also select the option show or hide ViStart Icon in System Tray. You can also use some features of Windows 8.<br />
<br />
<b><u>Important Note</u></b>: If you will change the settings for Windows 8 then you must restart your computer.<br />
<br />
<b>13. </b>After styling the start menu close the Control Panel of ViStart.<br />
<br />
<b>14. </b>Done!Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-388443678032983642017-07-17T12:41:00.000+05:002017-07-17T12:41:12.494+05:00How to Hide Windows Vista Welcome Screen?<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiV8KHT07Z_PWmKVx99UA3__OspNc4Le78RENbyCMw2vt5jc-R83tbndN4hGpwP8WdV-_CcuyDJsElZOyIGRxAJVBs2rd7izYRsWvoH-MM1vW-O_b7fyMRl1FNJwiT4apv9PQ2H4zOHNw1Z/s1600/how+to+hide+show+windows+vista+welcome+screen.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="How to Hide Windows Vista Welcome Screen?" border="0" height="344" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiV8KHT07Z_PWmKVx99UA3__OspNc4Le78RENbyCMw2vt5jc-R83tbndN4hGpwP8WdV-_CcuyDJsElZOyIGRxAJVBs2rd7izYRsWvoH-MM1vW-O_b7fyMRl1FNJwiT4apv9PQ2H4zOHNw1Z/s640/how+to+hide+show+windows+vista+welcome+screen.jpg" title="How to Hide Windows Vista Welcome Screen?" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><h2>
How to Hide Windows Vista Welcome Screen?</h2>
</td></tr>
</tbody></table>
In this article you will learn How to Hide Windows Vista Welcome Screen?<br />
<br />
Windows Vista Welcome Screen can be hide by just simple method.<br />
<br />
<h3>
Hide Windows Vista Welcome Screen</h3>
<ol>
<li>You can see small checkbox at the bottom left corner of the Welcome window.</li>
<li>Unmark the checkbox. Unmarking checkbox will prevent welcome screen to appear at startup next time.</li>
</ol>
<div>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrTLlXiUw8SNOc-dphdcKYlobhMDNhUudhrKusjBhRQBRVAFhxbzFNneKYYj-g0g3uQ6HTCHjCZfpIUhtC7IAAPkm1-tF6MaF028NJuUN2_lLziT9kkw620zGAI69KW-ndVTuvMyBK02bj/s1600/image0.png" imageanchor="1"><img alt="Windows Vista Welcome Screen" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrTLlXiUw8SNOc-dphdcKYlobhMDNhUudhrKusjBhRQBRVAFhxbzFNneKYYj-g0g3uQ6HTCHjCZfpIUhtC7IAAPkm1-tF6MaF028NJuUN2_lLziT9kkw620zGAI69KW-ndVTuvMyBK02bj/s400/image0.png" title="Windows Vista Welcome Screen" /></a></div>
<h3>
<br /></h3>
<h3>
Show Windows Vista Welcome Screen</h3>
<div>
<ol>
<li>You can see small checkbox at the bottom left corner of the Welcome window.</li>
<li>Mark the checkbox. Marking the checkbox will prevent welcome screen to appear at startup next time.</li>
</ol>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-54972808590211523162017-07-17T08:43:00.003+05:002017-07-17T08:43:32.556+05:00How To Remove Blogger Threaded Comments?<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpDWXGQTh5FpEuGlWtl-LJexnriUSjk5KAa563-klHDdWkOll4lpvoPf2O3xGJJ70Khr45sJEUGW0p3GUKiTJiw0WA1EwZqtKK3wHiWVAu9cAtkal53DQCnWHHO9P-7EGOgNF7dt6KV6Vt/s400/how+to+remove+blogger+threaded+comments.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="How To Remove Blogger Threaded Comments?" border="0" data-original-height="216" data-original-width="400" height="344" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpDWXGQTh5FpEuGlWtl-LJexnriUSjk5KAa563-klHDdWkOll4lpvoPf2O3xGJJ70Khr45sJEUGW0p3GUKiTJiw0WA1EwZqtKK3wHiWVAu9cAtkal53DQCnWHHO9P-7EGOgNF7dt6KV6Vt/s640/how+to+remove+blogger+threaded+comments.jpg" title="How To Remove Blogger Threaded Comments?" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><h2>
How To Remove Blogger Threaded Comments?</h2>
</td></tr>
</tbody></table>
<div class="separator" style="clear: both; text-align: center;">
</div>
In this article you will learn How To Remove Blogger Threaded Comments? What are Blogger Threaded Comments?<br />
<br />
<h3>
What are Blogger Threaded Comments?</h3>
Blogger Threaded Comments allow users to reply to comments of other users. Blogger Threaded Comments has 2 type of commenting original comments and replies to original comments. Want to remove blogger threaded comments? Follow my guide.<br />
<br />
<b>Important Note</b>: Backup your template before applying this method.<br />
<br />
<h3>
How To Remove Blogger Threaded Comments?</h3>
<div>
<ul>
<li>Login Blogger Account.</li>
<li>Go to <b>Template </b>><b> Edit HTML</b></li>
<li>Click <b>Ctrl + F</b>.</li>
<li>Search for the following code. You can also search the code by entering the<b> first line of code</b> in <b>search box</b>.</li>
</ul>
<div>
<blockquote class="tr_bq">
<b:if cond='data:post.showThreadedComments'><br /> <b:include data='post' name='threaded_comments'/><br /> <b:else/><br /> <b:include data='post' name='comments'/><br /> </b:if><br /> </b:if><br /> <b:if cond='data:blog.pageType == &quot;item&quot;'><br /> <b:if cond='data:post.showThreadedComments'><br /> <b:include data='post' name='threaded_comments'/><br /> <b:else/><br /> <b:include data='post' name='comments'/><br /> </b:if><br /> </b:if></blockquote>
</div>
</div>
<div>
<ul>
<li>After finding the above code replace that code with the following code. If you find the above code twice then you must replace that code twice.</li>
</ul>
<div>
<blockquote class="tr_bq">
<b:include data='post' name='comments'/><br /> </b:if><br /> <b:if cond='data:blog.pageType == &quot;item&quot;'><br /> <b:include data='post' name='comments'/></blockquote>
</div>
</div>
<div>
<ul>
<li>Save Template.</li>
<li>Done!</li>
</ul>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-22242832911539322882017-07-17T08:22:00.002+05:002017-07-17T08:24:44.360+05:00How to Add Videos/Images in Blogger/Blogspot Comments?<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlcJjWS8fckswS9FFSh4aL2qNy2xQ3ZNSrdSbSVhh-OOpMNl70Ciy4yvMoSnvvE_cwxhE0ooRvN6mMFQNtYGVxvqPeRzStBu5jtsXtUcELRAkNIqrnr02WanNn1xr-BFDh8EJ6pJ8u0KDB/s400/how+to+add+images+videos+in+blogger+comments.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="How to Add Videos/Images in Blogger/Blogspot Comments?" border="0" data-original-height="216" data-original-width="400" height="344" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlcJjWS8fckswS9FFSh4aL2qNy2xQ3ZNSrdSbSVhh-OOpMNl70Ciy4yvMoSnvvE_cwxhE0ooRvN6mMFQNtYGVxvqPeRzStBu5jtsXtUcELRAkNIqrnr02WanNn1xr-BFDh8EJ6pJ8u0KDB/s640/how+to+add+images+videos+in+blogger+comments.jpg" title="How to Add Videos/Images in Blogger/Blogspot Comments?" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><h2>
How to Add Videos/Images in Blogger/Blogspot Comments?</h2>
</td></tr>
</tbody></table>
<div class="separator" style="clear: both; text-align: center;">
</div>
In this article you will learn How to Add Videos/Images in Blogger/Blogspot Comments? Let your Visitors know How to Insert Videos/Images above Blogger Comment Box? How to Add YouTube Videos in Blogger Comments? How to Add Images or Pictures in Blogger Comments?<br />
<br />
You may want to add videos or images in blogger comments. In this tutorial I will show you how you can add videos/images in blogger comments.<br />
<br />
You can do this just by adding scripts and some tags.<br />
<br />
<h3>
How to Add Videos/Images in Blogger/Blogspot Comments?</h3>
<div>
<ul>
<li>Login Blogger Account.</li>
<li>Go to Template > Edit HTML.</li>
<li>Find for the "</body>" tag.</li>
<li>Paste the following code above or before the "</body>" tag.</li>
</ul>
<div>
<blockquote class="tr_bq">
<script src='https://code.jquery.com/jquery-latest.js' type='text/javascript'/><br />
<script src='https://googledrive.com/host/0B4n9GL3eVuV-cEhJOFFLTWdSYXM' type='text/javascript'/><br />
<script src='https://googledrive.com/host/0B4n9GL3eVuV-QjAwRmpVbEVHZm8' type='text/javascript'/></blockquote>
</div>
</div>
<div>
<ul>
<li>Save Template.</li>
</ul>
<h3>
How to Add YouTube Videos in Blogger Comments?</h3>
</div>
<div>
<ul>
<li>To add YouTube videos in blogger comments, just copy the URL of the video and paste in the comment section. After commenting the YouTube Video URL you will be able to see IFrame of the video in blogger comments.</li>
</ul>
<h3>
How to Add Images or Pictures in Blogger Comments?</h3>
</div>
<div>
<ul>
<li>To add images or pictures in blogger comments paste the below code in comments section.</li>
</ul>
<div>
<blockquote class="tr_bq">
[img]<span style="color: blue;">your-image-url</span>[/img]</blockquote>
</div>
</div>
<div>
<b><u>Important Note</u></b>: Change <span style="color: blue;">your-image-url </span>with the URL of the image or picture which you want to comment.</div>
<div>
<br /></div>
<h3>
Let your Visitors know How to Insert Videos/Images above Blogger Comment Box</h3>
<div>
This is not default feature of the blogger comments. Maybe your visitors are not known that your blog comments have feature to add videos/images. To let your visitors know you should follow my guide.</div>
<div>
<ul>
<li>Go to Blogger Dashboard.</li>
<li>Settings > Posts, Comments and Sharing.</li>
<li>Search for the Comment Form Message Section.</li>
<li>Click on Add Link and then enter your text to let your visitors know. <b>e.g</b></li>
</ul>
<div>
<div style="font-weight: bold;">
Do you want to share image or video? Use this code <b>[img]image-url-here[/img]</b></div>
<div>
<ul>
<li>After adding text Save.</li>
<li>Done!</li>
</ul>
</div>
</div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-500392370330985356.post-85164176447099923082017-07-16T21:39:00.003+05:002017-07-16T21:43:15.929+05:00How to Add Facebook Like/Fan Box in Blogger?<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnG_P0jyh6H75yfXNT42mW1FzOGDS1Aol2U0zAgkxc4nhxw_8DyguTojbMYXywYOFwzsMFj5WNoUIVI2vrh_b7Vd8i24hG_3O4OFoOHUZqZKC7NN7UwE5cf8xNR3OBX63DibuHHzLVllmW/s1600/how+to+add+facebook+like+fan+box+in+blogger.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="How to Add Facebook Like/Fan Box in Blogger?" border="0" height="344" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnG_P0jyh6H75yfXNT42mW1FzOGDS1Aol2U0zAgkxc4nhxw_8DyguTojbMYXywYOFwzsMFj5WNoUIVI2vrh_b7Vd8i24hG_3O4OFoOHUZqZKC7NN7UwE5cf8xNR3OBX63DibuHHzLVllmW/s640/how+to+add+facebook+like+fan+box+in+blogger.jpg" title="How to Add Facebook Like/Fan Box in Blogger?" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><h2>
How to Add Facebook Like/Fan Box in Blogger?</h2>
</td></tr>
</tbody></table>
In this article you will learn <b>How to Add Facebook Like/Fan Box in Blogger? How to Create a Facebook Like/Fan Box?</b><br />
<br />
A Facebook Like or Fan Box is a great plugin. You can allow your visitors to subscribe your blog via Facebook without going to your Facebook page or leaving your blog. The Facebook Like or Fan Box also shows the faces of people who liked your page.<br />
<br />
<h3>
How to Create a Facebook Like Box?</h3>
<div>
<ul>
<li>Find your Facebook Fan Page URL. Our Facebook Fan Page URL is <a href="https://facebook/DownTechz">https://facebook/DownTechz</a></li>
<li>Go to <b><a href="https://developers.facebook.com/docs/plugins/page-plugin" rel="nofollow" target="_blank">Facebook Developers Plugin</a>.</b></li>
<li>Enter your Page URL.</li>
</ul>
<div>
<br /></div>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAoGEGmRP_qwsB5jMzXI49gzTP2_BnjI9aECvgz-3FtHZEuD3UG6cXXTEw1aHcgXhvApBiF1DZwKg2f24R0GCO1GZr2IMRxRqScXRkPigVgHILrdaf4QePQarDcVVLsb6oRlq2X6CiT1OR/s1600/facebook-developers-like-box-plugin.png" imageanchor="1"><img border="0" height="465" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAoGEGmRP_qwsB5jMzXI49gzTP2_BnjI9aECvgz-3FtHZEuD3UG6cXXTEw1aHcgXhvApBiF1DZwKg2f24R0GCO1GZr2IMRxRqScXRkPigVgHILrdaf4QePQarDcVVLsb6oRlq2X6CiT1OR/s640/facebook-developers-like-box-plugin.png" width="640" /></a></div>
<div>
<ul>
<li>If you don't want to show timeline of your page then you can remove timeline from Tabs.</li>
<li>Select the options you want in your Facebook Like Box.</li>
<li>When you will click on Get Code you will be given 2 options "JavaScript SDK" and "IFRAME".</li>
<li>In this tutorial we will use IFRAME.</li>
</ul>
<div>
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUrN-5ZOfcSf5A3_Lh_LmvDN6KZsGF_wC-vW1mPRmNDtbX5__25M9GlGfqPCUvQ8K6PzjFH-FjapYg8jb9jqkmttKdvCdqFeU86gaJUY7DA6tBtHjt9jgeSg8v8Ujg80bF5Fh8LQ_aZJ_u/s1600/facebook+like+box+iframe+code+developers.png" imageanchor="1"><img alt="Facebook Like Box Iframe Code" border="0" height="330" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUrN-5ZOfcSf5A3_Lh_LmvDN6KZsGF_wC-vW1mPRmNDtbX5__25M9GlGfqPCUvQ8K6PzjFH-FjapYg8jb9jqkmttKdvCdqFeU86gaJUY7DA6tBtHjt9jgeSg8v8Ujg80bF5Fh8LQ_aZJ_u/s640/facebook+like+box+iframe+code+developers.png" title="Facebook Like Box Iframe Code" width="640" /></a></div>
<h3>
</h3>
<h3>
How to Add Facebook Like/Fan Box in Blogger?</h3>
</div>
<div>
<ul>
<li>Login Blogger Account.</li>
<li>Go to Layout > Add a Gadget > HTML/JavaScript.</li>
<li>Enter the IFrame Code in HTML/JavaScript Gadget.</li>
<li>Click Save.</li>
<li>Done!</li>
</ul>
</div>
Unknownnoreply@blogger.com0