Breaking

Showing posts with label Blogging tricks. Show all posts
Showing posts with label Blogging tricks. Show all posts

Saturday, May 06, 2017

1:38 pm

See How to add clock widget to your blog

SEE HOW TO ADD CLOCK WIDGET TO YOUR BLOG 

As a blogger if you have been checking other blogs and reading their articles you should have noticed that theres a clock akeays ticking continuously. Have always searched for a way to make one and now have gotten it. 
On this tutorial adding a clock widget to your blog would be the target


Why should I have one? 
  • Visitors would be have interest in coming back to check more articles from yoir blog
  • It makes your blog look more mature as adding clock widget is now the style almost all bloggers lokeand they're using
  • It makes your site looks more attractive 
How to install the clock widget to blog
  • Firstly, log in to your blogger dashboard 
  • Then click on the the add widgets where you want the clock to stay

Then select HTML/JAVASCRIPT 

  • Click on the +button and add the code below 
<iframe scrolling="no" frameborder="no" clocktype="html5" style="overflow:hidden;border:0;margin:0;padding:0;width:91px;height:30px;"src="http://www.clocklink.com/html5embed.php?clock=008&timezone=Nigeria_Lagos&color=red&size=91&Title=&Message=&Target=&From=2017,1,1,0,0,0&Color=red"></iframe>
After adding the code save the template and view 
>> you've successfully installed the widget
Do you experience any difficulty understanding and trying or you want another clock widget  drop your comment to get help



1:58 am

See How to rename your label on blogger

HOW TO RENAME YOUR LABEL ON BLOGGER 


Maintaining a logical category structure on a blog is extremely important, as it not only helps keep things organized, it also helps with user-friendliness. A category navigation makes it easy for users to find your articles, and also helps them discover similar titles on your blog. In Google Blogger, categories are named Labels, whereas in WordPress, category navigation is maintained by Categories as well as Tags. Managing Labels in Blogger isn't as straightforward as in WordPress, but it is fairly simple. In this post, we'll look at how to create, edit, or delete labels in Blogger.




If you've spent any time working in WordPress, you will know how easy it is to create, edit, or delete Categories and Tags from the admin panel. But assigning those categories and tags to posts is another matter, which is where Blogger scores. Even though Blogger doesn't have straightforward controls for creating or editing labels, it uses a pretty slick and easy implementation for them, making it very simple to assign/un-assign labels to individual posts.

There are times when you will need to change a label probably die yo a change in idea or a change of style to meet the needs of your blog  or the categy of blogging you've decide to switch to or change to. 

Theres actually no one click way of changing the name but on this tutorial we would be letting you know how to change the label name to suit your updated interests and desire but it is very easy and doesn't take much time in getting it done

Procedures>>
  • Login to your blogger Dashboard then look at the upper right side on dashboard 
  • Have you found it? Well done! 
  • Click on it to display all the labels present on your blog 
  • After then tick all the post on the label 
  • After ticking all the post Click on the icon at the left hand side of the publish button. 
  • Then select the the label all the post are published and the label will be deleted 
  • To assign another label with a changed name click on the same icon on the left side to publish and insert new name
     
  • Then insert your new label name and save


Do you experience any difficulty understanding and trying the article kindly drop your comment to get help 


1:16 am

See How to add social links to your blog

HOW TO ADD SOCIAL LINKS TO YOUR BLOG

At some time We all need social like buttons on our blog, don’t we? We need social like buttons on our blogs so our readers can always reach us and get more social with us. We also need these social buttons so our readers can like and always get exclusive updates from us.
One of my friends used media link button that i like and I would be sharing it with you guys. 
so I collected the codes from him and added it to one of my blogs :). It is one week plus now since I’ve added it to my blog and I am still using it. Do you know why I haven’t removed it? Because it is converting beautifully – even better then my previous social like button on that blog. Would you like to see how it looks? Here it is 

How to install the share widget to your blog 
  • Login to your blog dashboard and locate Layout 
  • Decide the section on the layout to install the social link and click on add gadget
  • Click on it and find HTML/JAVASCRIPT 
  • Then click on the +button to add the gadget then paste the following code 


<style> #social a:hover {background-color: transparent;opacity:0.7;} #social img { -moz-transition: all 0.8s ease-in-out; -webkit-transition: all 0.8s ease-in-out; -o-transition: all 0.8s ease-in-out; -ms-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } #social img:hover { -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg); } </style> <center><div id="social">

<style type="text/css">

<!--

.folding {

list-style-type: none;

margin: 0;

padding: 0;

}

&nbsp;

.csstransforms3d .folding {

perspective: 700px;

}

&nbsp;

.folding li {

height: 50px;

color: #fff;

padding-left: 30px;

border-left: 30px solid rgba(0,0,0,.1);

}

&nbsp;

.csstransforms3d .folding li {

transition: ease .15s all;

}

&nbsp;

.csstransforms3d .folding li:nth-child(even) {

margin-top: -1px;

transform-origin: 50% 100%;

transform: rotateX(10deg);

}

&nbsp;

.csstransforms3d .folding li:nth-child(odd) {

transform-origin: 50% 0%;

transform: rotateX(-10deg);

}

&nbsp;

.folding .fb {

background-color: #3959a6;

}

&nbsp;

.folding .tw {

background-color: #2fc6ff;

}

&nbsp;

.folding .gp {

background-color:#d84d30;

}

&nbsp;

.folding .rss {

background-color: #ff7e09;

}

&nbsp;

.rss-link {

color: #fff;

font: .9em Arial, Helvetica;

}

&nbsp;

.folding .content {

position: relative;

overflow: hidden;

display: block;

height: 20px;

padding: 15px 0;

}

&nbsp;

.csstransforms3d .folded li:nth-child(even) {

margin-top: -75px;

transform: rotateX(75deg);

background-image: linear-gradient(rgba(255,255,255,0) 50%,

rgba(255,255,255,.5));

}

&nbsp;

.csstransforms3d .folded li:nth-child(odd) {

transform: rotateX(-75deg);

}

&nbsp;

.csstransforms3d .folded .content {

display: none;

}

&nbsp;

/* Folding list heading */

.connect {

padding: 12px 0 12px 30px;

margin: 0 0 1px 0;

color: #fff;

border-left: 30px solid rgba(0,0,0,.2);

cursor: pointer;

font: bold .9em 'Lucida sans unicode',Arial, Helvetica;

background-color: #555;

}

&nbsp;

.csstransforms3d .connect {

background-image: url(data:image/png;base64[shortened]);

background-repeat: no-repeat;

background-position: -24px center;

}

-->

</style>

<h3>Connect with Naijabrainies </h3>

<ul>

<li class="fb">

<div class="content">

<a rel="nofollow" title="Like Our Facebook Page" href="https://mobile.facebook.com/naijabrainies/" target="_blank"><img border="0" src="http://2.bp.blogspot.com/-8kR6-YXcxnY/Uj-WfOLbqDI/AAAAAAAADW4/--hjjDa2DDA/s1600/FACEBOOK-48x48.png" style="margin-right:1px;" alt="Icon"/></a>

<a href=""></a>

</div>

</li>

<li class="tw">

<div class="content">

<a rel="nofollow" title="Follow Our Updates On Twitter" href="http://twitter.com/Naijabrainies " target="_blank"><img border="0" src="http://1.bp.blogspot.com/-Hb_788IoA0A/Uj-WgFPL8_I/AAAAAAAADXA/X6il1DrJ4Dw/s1600/TWITTER-48x48.png" style="margin-right:1px;" alt="Icon"/></a>

<a href=""></a>

</div>

</li>

<li class="gp">

<div class="content"></div></li></ul></div></center>


You can change the social links to your taste


Do you find the article useful or do you experience any difficulty understanding and trying the article? Kindly drop your comment 
12:34 am

New Way To Add A Simple Related Post Widget To Blogger easily

NEW WAY TO ADD A SIMPLE RELATED POST WIDGET TO YOUR BLOG 

Are you a blogger? You can now draw more of your users or audience to your blog for a very long time, giving them special articles below all your posts in order for them to keep navigating your blog.


With this simple mobile-friendly related post widget, it will be easy for you to get adsense approved because it will improve your blog navigation system, it will reduce your blog bounce rate which means users will always stay for a very long time on your blog, it will help your blog do internal linking and google will be able to crawl your blog very fast because is also one of the best SEO strategies that a blogger supposed to apply to his or her blog. Let's see how to add it to blogger.

How To Add Simple Related Post Widget To Blogger
  • Just login your blogger dashboard and go to Templates then edit HTML 
  • Then find </head>and paste the code below and paste above the </head> tag it.


<b:if cond='data:blog.pageType == &quot;item&quot;'><style type='text/css'>.related-post-title{font-size:2.3em;margin: 5px 0px;}#related-posts {margin: 0px 5px;}#related-posts a {font-size: 1.1em;color:#970E0E;text-transform: capitalize;}#related-posts a:hover {text-decoration: none;color: #555;}#related-posts ul {list-style-type: none;padding: 0px;color: #000000;}#related-posts li {  padding: 0.7em 1.2em;border-bottom: 1px solid #E2E2E2;background: url(http://2.bp.blogspot.com/-1Go6ez45KLA/VRSl96jFQPI/AAAAAAAAAwM/nIFxL71PTrA/s1600/Arrow.png).2em 1em no-repeat;}#related-posts li:hover {background: url(http://2.bp.blogspot.com/-1Go6ez45KLA/VRSl96jFQPI/AAAAAAAAAwM/nIFxL71PTrA/s1600/Arrow.png).2em 1em no-repeat #E7F0FF;}</style>   <script src='http://aireshalili.github.io/internetsmash/simple-related-post.js' type='text/javascript'/></b:if>



  • Then after that, locate <div class='post-footer'> and paste this code below it.


<!-- Ralated post Start --> <b:if cond='data:blog.pageType == &quot;item&quot;'> <div id='related-posts'><h4 class='related-post-title'>You may also like</h4><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=5&quot;' type='text/javascript'/></b:if></b:loop> <script type='text/javascript'> var maxresults=5; removeRelatedDuplicates(); printRelatedLabels(&quot;<data:post.url/>&quot;); </script></div> </b:if> <!-- END Ralated -->


Note: You can change the 5 DIGIT marked in RED to any number of posts you want in your related post Widget.

Then tap on SAVE. Wow! You have successfully added a related post Widget to your blogger.


Uses>>
  • Reduce your Alexa.
  • Makes Google crawl your blog faster.
  • It will build internal linking for your blog.
  • It will make users stay longer on your blog and reduces bounce rate.
  • It will increase your SEO ranking.
Do you find the article useful, do you encounter any problem trying it. Kindly drop your comment