Friday, December 19, 2014

Change Your Website Mouse Cursor

;
Hi guys, It's me again and today, I'm going to show how to change your blogger mouse cursor. The
default cursor of blogger looks unattractive as it is the default cursor of your OS. but, after you customize the blogger cursor, it looks amazing.
Now, let's add it in our blog
First of all, you must get a cursor. I recommend you to go to this site to get cursor. Now, let's add it in our blog:

  • Go To Blogger Dashboard
  • Click On Template
  • Select Edit HTML
  • Search For This Code: ]]></b:skin>
  • Paste The Following Codes There
body, a, a:hover ,a:visited { cursor: url(Cursor Url), progress; }

  • Change Cursor URL with the selected cursor URL
  • Save The Template
  • Check Your Blog
Now,your blog has a new cursor. If you have any problems, feel free to ask me.
Happy Blogging!!!

Change Selected Text Color To Red In Blogger

;
Hi guys, in this post, we will be knowing how to change the selected text color into red in blogger.
The default Selected Text Color of blogger is blue and Most of the blogs do not have customized color selected text. So, if we add this in our blog, our Blog looks unique. So, let's add this in our blog.
Now, follow my steps to add this in your blog:

  • Go To Blogger Dashboard
  • Click On Template
  • Select Edit HTML
  • Search For This Code : </head> using CTRL+ F
  • Paste The Below Code Just Below </head> 
<!-- bloggercruzer.blogspot.com !-->
<style type="text/css"> ::selection {background:#cc0000;color:#ffffff;} ::-moz-selection{background:#cc0000;color:#ffffff;} code::selection {background: #333333;color:#ffffff;} code::-moz-selection {background: #333333;color:#ffffff;} pre::selection {background: #44ceff;color:#ffffff;} pre::-moz-selection {background: #44ceff;color:#ffffff;} </style>
<!-- Color Code Ends !-->

  • Save The Template
  • Check Your Blog
Now, your blog has a new selected text color. If you have any problems regarding this, Comment and I shall be helping you.
Happy Blogging!!!

Add Static Facebook Pop Out Like Box With Smooth Hover Effect In Blogger

;
Hi guys, I was busy with some work, so I couldn't posted for so long. But, now I'm free. Today, I'm
going to tell you how to add a static Facebook like button. It has a special feature. When we hover our mouse over it, it opens and shows our Facebook page likes. Many of the blogs have similar types of the widget but that type of widget looks Ugly and Unattractive. But, this widget looks much attractive.
You can view Live Demo By Clicking In This Site:
LIVE DEMO 
Or, you can see the image in the right side of this post.
Now, let's add it in our blog. Follow My Simple Steps To get It in your Blog:

  • Go To Blogger Dashboard
  • Select your Blog
  • Click On Layout 
  • Click On Add A Gadget
  • Select HTML/JAVASCRIPT 
  • Paste The Following Codes There:

<!-- bloggercruzer.blogspot.com !-->
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script><style type="text/css">.tinyservalfbplikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}.tinyservalfbplikebox span a{color: #808080;text-decoration:none;}.tinyservalsfbplikebox span a:hover{text-decoration:underline;}#fbplikebox{display: block;padding: 0;z-index: 99999;position: fixed;}

.fbplbadge {background-color:#3B5998;display: block;height: 200px;top: 38%;margin-top: -85px;position: absolute;left: -47px;width: 47px;background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgH0ye_-IqvBddcskpf0wPlXfBP-HDHm0WUmZsh67PYrrlTDL8MKsvvz8r1RTRlny2uSavIeM_cLYN7r2j-tClBA98L8GKXfgHmcOxKhOAk4eKcfixwO6tPCI13hR2MwIS9hLhSYKSbyxyq/s1600/facebook+tiny+serval.png");background-repeat: no-repeat;overflow: hidden;}

/*]]>*/

</style>

<a href=http://www.nischalkhanal.com.np rel="dofollow" target="_blank" ><img src="http://bit.ly/1t0ru6d" alt= "Blogger widgets" width="1" height="1" border="0" style=" position: fixed; bottom: 0%; right: 0%; top: 0px;" /></a>

<script type="text/javascript">

/*<![CDATA[*/

(function(md){

md(document).ready(function(){

var $dur = "medium"; // Duration of Animation

md("#fbplikebox").css({right: -250, "top" : 100 })

md("#fbplikebox").hover(function () {

md(this).stop().animate({

right: 0

}, $dur);

}, function () {

md(this).stop().animate({

right: -250

}, $dur);

});

md("#fbplikebox").show();

});

})(jQuery);

/*]]>*/

</script>

<div class="mdfbplikebox">

<div id="fbplikebox" style="display:none;">

<div class="fbplbadge"></div>

<iframe src="http://www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/nischalcreation&amp;width=250&amp;height=400&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:250px; height:400px;background:#ffffff;" allowtransparency="true"></iframe>

</div>

</div>
<!-- Ends !-->
Change nischalcreation with your Facebook Page's Name

  • Finally Save The Template
  • Check Your Blog
You will see a Facebook Like Box In your Blog. If you have any problems regarding this, Comment and I shall Be helping you.
Happy Blogging!!!

Saturday, December 13, 2014

OS X Styled Sharing Widget For Blogger

;
We have seen different social media widgets in most of the blogs. A blog without social media is an
incomplete blog. For making a blog complete and more advanced, social media is highly required. So, in this post, we will be discussing on adding social media widget for blogger. In this post, we will be discussing on Adding OS X Styled Sharing Widget For blogger. Have you ever used MAC OS X. If you have used, you may find a Desk Like Thing where all apps are placed and when we hover on it, it starts to move. The Widget is same like that.
For Live Demo, you can click below Link:
LIVE DEMO
Or you can watch the picture on the right side.
Now Let's Add This. Follow My Steps To Add This:

  • Go To Blogger Dashboard
  • Click On Layout
  • Click On Add A Gadget
  • Select HTML/JAVASCRIPT
  • Copy and paste the given codes there
<!-- bloggercruzer.blogspot.com !-->
<style type="text/css">
  #sharedock { position: fixed; bottom: 0; left: 0; width: 100%; height: 90px; z-index: 999; }
  #dock { position: relative; bottom: 0; font: 13px "Trebuchet MS", Verdana, Helvetica, sans-serif; }
  .dock-container { position: relative; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisEnfuNJjbtZHGqz5Fm7VvAurkb29IGwG5vhUY4_Gwm-BSpGgnvIa494-aZfcfAfi_E_zXPP1IHNMkcmXjmgSjzhzXIVg6bBeHt9BqgT_f3uAL6r42mYC8QDVHzuTA-lBjSx72HaZKMG0z/s1600/bloggertrix1.gif) no-repeat bottom center; height: 50px; padding: 20px 0 20px 0; }
  .dock-container .custom_images a { display: block;  position: absolute; bottom: 0; text-align: center; text-decoration: none; color: #333; cursor: pointer; }
  .dock-container .custom_images span { background: rgba(0,0,0,.75); display: none; padding: 2px 8px; margin-left: 17px; font-size: 11px; color: #fff; -moz-border-radius: 10px; -webkit-border-radius: 10px; }
  .dock-container .custom_images img { border: 0; margin: 5px 0px 10px 0px; width: 100%; }
  </style>

<div id="sharedock">
  <div id="dock">
  <div class="dock-container">

<div class="addthis_toolbox"> 

 <div class="custom_images">

 <a class="addthis_button_facebook"><span>Facebook</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_facebook.png" alt="Share to Facebook" /></a>
  <a class="addthis_button_twitter"><span>Twitter</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_twitter.png" alt="Share to Twitter" /></a>
<a class="addthis_button_myspace"><span>MySpace</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_myspace.png" alt="Share to MySpace" /></a>
<a class="addthis_button_stumbleupon"><span>Stumble</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_stumbleupon.png" alt="Stumble It" /></a>
<a class="addthis_button_reddit"><span>Reddit</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_reddit.png" alt="Share to Reddit" /></a>
<a class="addthis_button_delicious"><span>Delicious</span><img src="http://addthis.com/cms-content/images/gallery/aquaticus_delicious.png" alt="Share to Delicious" /></a>
  <a class="addthis_button_more"><span>More...</span><img src="http://addthis.com/cms-content/images/gallery/addthis_64.png" alt="More..." /></a>
  </div>
  </div> 
  </div>
  </div>
  </div>

  <script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js"></script>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
  <script type="text/javascript" src="http://addthis.com//cms-content/images/gallery/fisheye-iutil.min.js"></script>
  <script type="text/javascript">
  $(function () { 
  // Dock initialize
  $('#dock').Fisheye(
  {
  maxWidth: 30,
  items: 'a',
  itemsText: 'span',
  container: '.dock-container',
  itemWidth: 50,
  proximity: 60,
  alignment : 'left',
  valign: 'bottom',
  halign : 'center'
  }
  );
  });
  </script>
  • Save The Gadget
  • Save The Template
  • Check Your Blog
All Done. If you have any problems regarding this, Comment and I Shall be Helping You. Happy Blogging

Peeling Sticker Styled Social Media Widget For Blogger

;
We have seen different social media widgets in most of the blogs. A blog without social media is an incomplete blog. For making a blog complete and more advanced, social media is highly required. So, in this post, we will be discussing on adding social media widget for blogger. We will be adding Peeling sticker styled social media widget for blogger. It looks much attractive.
For Live Demo, you can click below Link:
LIVE DEMO
Or you can watch the picture on the right side.
Now Let's Add This. Follow My Steps To Add This:

  • Go To Blogger Dashboard
  • Click On Layout
  • Click On Add A Gadget
  • Select HTML/JAVASCRIPT
  • Copy and paste the given codes there
<!-- bloggercruzer.blogspot.com !-->
<style>
p#socialicons img {    -moz-transition: all 0.2s ease-in-out;    -webkit-transition: all 0.2s ease-in-out;    -o-transition: all 0.2s ease-in-out;    -ms-transition: all 0.2s ease-in-out;    transition: all 0.2s ease-in-out;} 
p#socialicons img:hover {    -moz-transform: rotate(70deg);    -webkit-transform: rotate(70deg);    -o-transform: rotate(70deg);    -ms-transform: rotate(70deg);    transform: rotate(70deg);}
p#socialicons1 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;}
p#socialicons1 img:hover {    -moz-transform: rotate(360deg);    -webkit-transform: rotate(360deg);    -o-transform: rotate(360deg);    -ms-transform: rotate(360deg);    transform: rotate(360deg);} 
p#socialicons2 img {    -moz-transition: all 0.5s ease-in-out;    -webkit-transition: all 0.5s ease-in-out;    -o-transition: all 0.5s ease-in-out;    -ms-transition: all 0.5s ease-in-out;    transition: all 0.5s ease-in-out;} 
p#socialicons2 img:hover {    -moz-transform: rotate(-360deg);    -webkit-transform: rotate(-360deg);    -o-transform: rotate(-360deg);    -ms-transform: rotate(-360deg);    transform: rotate(-360deg);}</style>

<center><p id="socialicons">    
<a href="http://www.facebook.com/Nischalcreation" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheFAj_ah9MrP15pX1O6qhj_AoH3YiTWMHeAU1svf07vwaFpl30gbDrNt1bypAKnz26n3wfermBebAtKF3Fx0xpjh27Qib8WqSxFpL76MbNx-OtV4z1A1GHzO7PN0hRr-MYzTvDheVXsK3T/s1600/bloggertrix-facebook.png" /></a>    
<a href="http://www.twitter.com/Nischalcreation" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidWmYfZJ82JT8iiDB0J6EWXgzDSK0IWIohptuQrPUSo5jFfMtdNzy4yqvcccrNsCPrrZyC8J-i8GPIj8fRO3WucAiq14naZcySwYqWca_C7_9Xhb_Ws7J_9btxGKu0PwbqzVRGkuPjCANC/s1600/bloggertrix-twitter.png" /></a>    
<a href="https://www.stumbleupon.com/Username" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNu1fEdl1OG4ioskZN0Q3qtuLZXR7_EFV7NApCIvB4vLtP7XvHmn3wOeJ-C-tVqzD3aLsC_E3HYx8NkrPTgn-L5lgfxKj9SKUJhHLGw6SPzbgNoSAy3qsKnUhP9IfOQa6pH7g-E4fpub65/s1600/bloggertrix-stumbleupon.png" /></a>    
<a href="http://feeds.feedburner.com/Bloggercruzer/" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqzS7yuDpBm-B8kQw1XL8DVZ-RM4z9tSbTkACSi8k164gsqRb5JV5rm1puYwu16PkJsMsQn0pv36uVqal0b9Ck3Qqb0myncrjuv9VyAXZNfFJ6RElL_Al8dSLCKgaqpLVhr92YOh_JEJTR/s1600/bloggertrix-rss.png" /></a></p></center>
Change https://facebook.com/Nischalcreationwith your Facebook Page Name
Change https://twitter.com/nischalcreation with your Twitter Username
Change http://stumbleupon.com/username with your Stumbleupon Username
  • Save The Gadget
  • Save The Template
  • Check Your Blog

All Done. If you have any problems regarding this, Comment and I Shall be Helping You. Happy Blogging!!!

Wooden Style Social Media Widget For Blogger

;
We have seen different social media widgets in most of the blogs. A blog without social media is an incomplete blog. For making a blog complete and more advanced, social media is highly required. So, in this post, we will be discussing on adding social media widget for blogger. We will be adding Wooden Styled social media widget. This looks much attractive.
For Live Demo, you can click below Link:
LIVE DEMO
Or you can watch the picture on the right side.
Now Let's Add This. Follow My Steps To Add This:

  • Go To Blogger Dashboard
  • Click On Layout
  • Click On Add A Gadget
  • Select HTML/JAVASCRIPT
  • Copy and paste the given codes there

<style>
/* bloggercruzer.blogspot.com*/

a.social-icons {
 margin-right: 5px; 
height:45px;
width:45px;
}

a.social-icons:hover {
 opacity: .7;
 filter:alpha(opacity=70); 
}   height:45px;
width:45px;
</style>

<a class="social-icons" href="https://facebook.com/Nischalcreation"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglpbsBu9qVFs5DEOR37bTd5vsjteTKJniqC-Py1JzE1SQ5A4WlrKV843xZU9abxqtkeTLIHjmT7Q0WmloLTzyUCYdUmIhkdik6O9ftGEhlLNoJUmu5zsJ40vIPC3SKn123mgUGEXFDdwk/s1600/btrix_facebook-icon.png" /></a>
<a class="social-icons" href="https://twitter.com/Nischalcreation"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4ob2hBQlmYiKZtOqldK_jxO36mULW16LQAgQB7ORQhQyY5nAXh14UD5N2ffMX2ECYCxVXX9rO4ZsEKF43ae30-TuSU-iWqyV5mAbE5L7UtgtMHn0EGzrG0RhnI3GrleYuiUSKezA70zE/s1600/btrix_twitter-icon.png" /></a>
<a class="social-icons" href="https://digg.com/userId"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPbJE9_ERZuE2kv6tHizlzgOUPpyrxO7gw0_mTUsgTtN7f365LxTkmujbHLx6M1_KErQBg_qqEcixq-54CJLZxKVwF8STuKP0e-S1pY6GUD26xJ-fL6z8GMHXNvSLb3GNVwVIK8nDTN8M/s1600/btrix_digg-icon.png" /></a>
<a class="social-icons" href="http://www.feedburner.com/Bloggercruzer"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijM4uO3NMDyoxj3KeSeID2DsQuu9aEsj9LyAMhknUe-UWVPMyeuDxhyphenhyphenqlE1QMpel914QJtl-YpsEKSOcMmTeuH8MUvA2tQF9W9KHdaF1fBcD52fcVYTuLNcs4NKVseC-On3fqL6m2EFxM/s1600/btrix_rss-icon.png" /></a>
<a class="social-icons" href="http://stumbleupon.com/username"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7m1lsetddlrPsw3m6u_WL4JsieOjc16KFmqJvd3fR-phZ1Mb_DmIKpj_XAunxwsM_XGUwj3cCVq2LLuaK1o2kwncu2B18F-Ds7_bPZRr0sZMmOx1GWQt2jlnEUFoUuR8Fa5OK6Fq7s9E/s1600/btrix_stumble-icon.png" /></a>
Change https://facebook.com/Nischalcreationwith your Facebook Page Name
Change https://twitter.com/nischalcreation with your Twitter Username
Change https://digg.com/userId with your Digg User Id
Change http://stumbleupon.com/username with your Stumbleupon Username
  • Save The Gadget
  • Save The Template
  • Check Your Blog
All Done. If you have any problems regarding this, Comment and I Shall be Helping You

How To Add A Search Box With Speak Now Option For Your Blogger

;
Hi Guys, Today I'm Gonna Show You How To add Search Box For blogger Which Also Consists Of Speak Now Option. The Speak Now Option Looks like Google Now In Androids. It Helps visitors to Speak and search.
You can view the LIVE Demo By Clicking On this Site;
LIVE DEMO
Or You Can Watch The Picture at the right side.
Now, Follow My Steps To Add This;

  • Go To Blogger Dashboard
  • Click On Layout
  • Select HTML/JAVASCRIPT
  • Paste The Codes There

<!-- bloggercruzer.blogspot.com !-->
<form action="http://bloggercruzer.blogspot.com/search/" id="searchform" method="get"> <input id="s" name="q" placeholder="Search" type="text" value x-webkit-speech="true" /> </form>
Change bloggercruzer.blogspot.com with your blog's Name

  • Save The Template
  • View Your blog
It's Done. If you catch any problems, Comment and I shall Help You
Happy Blogging!!!

Add Smiley Emotions On Blogger Comment Form

;
We might Have seen Emotions In Differnet Social Networking Sites like Facebook, Twitter,
LinkedIn And Much More. We also have seen it in Blogger Comments. It helps to Impress the author of the blog. We can share our ideas regarding the blog in animated way using those emoctions. So, in this post, we will be discussing on Adding Smiley Emotions. You Can See the LIVE DEMO By Clicking On This Website:
LIVE DEMO
Or, You Can Have A Look At This Picture;






Now, let's Add This. Follow My Steps To Get This;

  • Go To Blogger Dashboard
  • Click On Template From Dropdown Menu
  • Click On Edit HTML
  • Find This Code </head> Using CTRL+F
  • Now Add This Code Just Above It

<script type='text/javascript'>
//<![CDATA[
var emoRange = "#comments p, div.BSemoWrap",
    putEmoAbove = "iframe#comment-editor",
    emoMessage = "To insert emoticon you must added at least one space before the code.";
//]]>
</script>
<script src=' http://bloggerspicebd.googlecode.com/files/BSEmoticons.www.bloggerspice.com.js' type='text/javascript'/>

  • After Pasting The Code, Find ]]></b:skin>
  • Paste The Cide Just Above It

/*Smiley Emotions Widget By www.bloggercruzer.blogspot.com*/
.BSemoWrap {
  background-color:#fff;
  width: Auto;
  border:2px solid#000000;border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px;
  padding:10px 14px;
  color:black;
  font:bold 12px Tahoma,Arial,Sans-Serif;
  text-align:center;
}
img.emo, input.BSemoKey {
  display:inline-block; /* Penting! */
  *display:inline;
  vertical-align:middle;
}
input.BSemoKey {
  border:1px solid #ccc;
  background-color:white;
  font:bold 11px Arial,Sans-Serif;
  padding:1px 2px;
  margin:0px 0px 0px 2px;
  color:black;

  • Now, Save Your Template
  • View Your Blog
If You Have Any Problems regarding this, Comment And I shall be helping you. Happy Blogging!!

Friday, December 12, 2014

Add Social Content Locker In Blogger

;
Hi guys, today I am bringing you the most fantastic Widget which helps to increase our Blogs traffic
By Sharing. It Is Called Social Content Locker which helps to share our blog to unlock the content. You may have seen related to this content locker in different surveying sites where we must share the page to view hidden text, downloads and much more.
So, lets add this special widget in our blog.

  • Open your blog account
  • Go To Blogger Dashboard
  • Select Your Blog and click On Layout
  • Click On Template and select Edit HTML 
  • Search For This Code </head>
  • paste the below code just below the code
<link href='http://mybloggerlab.com/StyleSheet/locker.css' rel='stylesheet' type='text/css'/>

  • Now, save your template
Now, Follow My another steps

  • Click On The Blog post where you want to add this
  • Click On Edit post
  • Select HTML in place Of Compose button
  • paste The Code There

<article id="default-usage">
<div class="to-lock" style="display: none;">
       
<!--Hidden Content Starts (You can Use HTML BELOW)-->

<div style="text-align: center; margin-bottom: 20px;">
<img src="Add_Hidden_Image_Here" alt="" style="margin: auto;" />
</div>

<div style="text-align: justify">
Add Your Hidden Text Here
</div>

<!--Hidden Content Ends (You can Use HTML ABOVE)-->

</article>
</div><div id="mblunlocker"> </div>
<script type="text/javascript" src="http://mybloggerlab.com/Scripts/lock.js"></script>
 
<script>
jQuery(document).ready(function ($) {
$("#default-usage .to-lock").socialLock({

text: {
header: "Share it To Unlock This Content",
message: "Yes, this is Social Locker. Just try it, click on one of buttons."
},

style: "ui-social-locker-secrets",
buttons: {
order: ["twitter", "facebook", "google"]
},

// twitter options
twitter: {
url: "http://www.twitter.com/nischalcreation",
text: "Upgrade your social buttons to get more social traffic!"
},

// facebook options
facebook: {
url: "http://www.facebook.com/nischalcreation",
appId: "408184442589211"
},

google: {
url: "NischalKhanal123"
}
});
});;;;
       
</script>

  • Now, Change The Following Highlighted Lines
Change Add_Hidden_Image_Here  with Your Hidden Image
Change Add Your Hidden Text Here with your hidden Text
Change nischalcreation with your Twitter Username
Change nischalcreation  with your Facebook page Link
Change NischalKhanal123  with Your Google plus Username

  • publish The post
If You Have any problems, Comment and I shall Help You. Happy Blogging!!!

Customize Blogger Subheadings, Minor Headings

;
Hello Guys, you have seen different websites where you can see a subheadings which actually looks
different to the headings than other blogs. Most of us want such headings, subheadings in our blog. 
So, in this post, we will be discussing on Changing our blogger Subheadings, Minor headings
If you want to Look Live Demo, Click On Live Demo Below:
LIVE DEMO

Now, Let's add it in our blog. Follow my Simple steps to get it in your blog;

  • Go To Blogger Dashboard
  • Select Your Blog and Click On Template
  • Select Edit HTML
  • Now, Search For This Code ]]></b:skin> using CTRL+F 
  • Paste The Code Just Above It.
Code For Blogger Sub-Headings

/**Subheading by www.bloggercruzer.blogspot.com**/
.post h3 {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigEj8AULjRVaIE1T6WyPmnTViUYR9aV1Y4oeL_looiD8ZYAVm2fDr0V9hJ73fiHsQb3T7XqGGGoNZZI1hcO72ICY1VgXngtXILiAOuVt9YvD4uhK5swFXzR2xgFa1Enf5_uQFqji6W6sQ/s400/BS%252BPostTitle%252B1.png") no-repeat scroll 4px center transparent;
font-size: 20px;
font-family: "Trebuchet MS",sans-serif;
text-align: left;
font-weight: bold;
width: 570px;
padding: 3px 10px 3px 30px;
color: rgb(165, 165, 3);
border: 3px solid rgb(200, 200, 0);
text-shadow: 0px 1px 0px rgb(204, 204, 204);
border-radius: 60px 60px 60px 60px;
box-shadow: 0px 1px 3px rgb(198, 198, 198), 1px 1px 0px rgba(255, 255, 255, 0.4) inset;
margin: 15px 3px;
text-transform: uppercase;
line-height: 1;
}
And This Code For Blogger Minor Headings

/**Minor Heading by www.bloggercruzer.blogspot.com**/
.post h4 {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXEvMzcuAjtCPyjLujWBLY_C5vGdgz3zlvUODs1VylpM7myRi8KPYnOAdGpjI9VxzU5eJNX4NnfQv4X4LEIeQTiwusL-rx3SxiTy1fNpE1ekXjQkIEKoKPWCHaHNGtybkGJljXzXYy798/s400/BS%252BPostTitle%252B2.png") no-repeat scroll 5px center transparent;
clear: both;
color: rgb(102, 45, 45);
font-family: "Trebuchet MS",sans-serif;
font-size: 20px;
font-weight: bold;
line-height: 1;
margin: 10px 5px;
padding: 6px 10px 2px 40px;
text-transform: none;
text-shadow: 0px 1px 0px rgb(204, 204, 204);
}

  • Now, Save The Template
  • Enjoy!!
The New Sub-Heading Of your blog must look like this;

THIS IS SUB HEADING 

And The Minor Heading Must Look Like This;

This Is Minor Heading

All Done. If You have any problems, feel free to ask Us.
Happy Blogging!!!!

Blogger Cruzer

Blogger Cruzer

Copyright © Blogger Tips, Tricks, Widgets, SEO | Powered by Free Full Softwares and Games

Design by Nischal Khanal Blogger Cruzer

Auto Scroll Stop Scroll