Hello guys! Today I'll be showing you how you can add Social media buttons on your blogger header.
Now to get started, login to your blogger dashboard.
Click on Theme/Template and Select “Edit HTML”
Now inside the template
  • html box, search for. ]]>
  • tag and paste the below code above the ]]> tag


  • #social-icons {
  • margin-bottom:-30px;
  • height:50px;
  • width:100%;
  • clear:both;
  • z-index: 2;
  • position: relative;}
  • .social-media-icons {
  • display:table}
  • .social-media-icons ul {
  • text-align:right;
  • padding:5px 5px 0 0
  • list-style-image:none;
  • list-style-position:outside;
  • list-style-type:none;}
  • .social-media-icons ul {
  • margin-bottom:0;
  • padding:0;
  • float:right;}
  • .social-media-icons li.media_icon {
  • margin-left:6px;
  • padding-left:0 !important;
  • background:none !important;
  • display:inline;
  • float:left;}
  • .social-media-icons li:hover {
  • -moz-transform: rotate(360deg);
  • -webkit-transform: rotate(360deg);
  • -o-transform: rotate(360deg);
  • transform: rotate(-360deg);
  • -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;}



  • Now search for ]]>
  •  and add the below codes above the ]]>
  •  tag