media icons Archives - Special Passive Income

When you add responsive Social Media Icons to your blog you increase the chances of community engagement through your blog post. The Era is changed and having an online presence in this era is a must! It is important that you have access to every location and get found by people... and that is done by social media. You can have a wider audience range through the add responsive Social Media icons on your site and that linking them to your social networks. The time has come were using Social Media Icons have become a must as this increases your blog engagement and spreads awareness about your online presence. to know more about Top 10 Best Shopify Themes click here How to Add Responsive Social Media Icons in Blogger? Step 1- Firstly, install a responsive theme from any external source where you can easily find the add responsive social media icons. This step is important as the blogger is not as attractive or good. In blogger, you will find a social plugin option to add social icons but that will not allow you to choose your position. If you go for a customized theme, you will find all the required settings. Step 2- You will find the blogger dashboard- click on the labels section. Step 3- You will find a blogger Social Media button widget at the Top in the header menu widget and also on the Right Sidebar of the blog or website. Step 4- Now click on edit Social Top then edit existing or add new social links that you want to add as a social icon to your blog or website. Step 5- Now you can Add, write names of the social media platform in the tab “New Site Name” and the URL in the tab “New Site URL” and click on add link. How to add responsive Social Media icons to blogger sidebar? Step 1- Firstly, install a responsive theme from any external source where you can easily find the add social media icons. This step is important as the blogger is not as attractive or good. In blogger, you will find a social plugin option to add social icons but that will not allow you to choose your position. If you go for a customized theme, you will find all the required settings. Step 2- You will find the blogger dashboard- click on the labels section. Step 3- You will find a blogger responsive Social Media icons widget at the Top in the header menu widget and also on the Right Sidebar of the blog or website. Step 4- Now click on edit Social Top then edit existing or add new social links that you want to add as a social icon to your blog or website. Step 5- Now you can Add, write names of the social media platform in the tab “New Site Name” and the URL in the tab “New Site URL” and click on add link. To adjust the position, or edit, or delete any social icon you can simply use the up and down arrow and edit or delete any image or icon. Also read: Start Blog Basic To Advance How to add responsive Social Media icons to blogger header Step 1- Go to Blogger Theme and click on the HTML button. Step 2- Anywhere in the code click and Press CTRL+F type “]]>>/b:skin>” press enter then Paste the first code above the “]]>>/b:skin>” tag. Step 3- Press CNTRL+F and type “ ”or” ”line. Step 4- Go to your Blogger Blog. *Note- Replace RED URLs with your Social URLs How to add responsive Social Media Icons to blogger posts? Step 1- Go to blogger > Theme> Backup theme Step 2- Click Edit HTML Step 3- Search ]]> and paste the CSS Code above ]]> /* ##### JumboShare Simplified ####### */ #MBTshares-wrap{margin:20px 0px;border-top: 1px dotted #eee;padding: 10px 0;border-bottom: 1px dotted #eee;overflow:hidden} #MBTshares{display:inline-block;overflow:hidden;text-align:left;white-space:nowrap;font-family:arial;font-size:11px;margin:0px 5px 0; line-height: 1.4em;} #horiz{position:relative; padding:0; margin:0;} #horiz #MBTshares{position:relative;top:-8px; padding-top:20px;} #MBTshares a:hover{text-decoration:none!important;} /***Facebook***/ .mbt-fb{background:transparent linear-gradient(#4C69BA,#3B55A0) repeat scroll 0 0;border:medium none;border-radius:2px;color:#FFF;cursor:pointer;font-weight:700;height:20px;line-height:20px;padding:0 6px;text-shadow:0 -1px 0 #354C8C;white-space:nowrap;text-shadow:0 -1px 0 #354C8C} .mbt-fb:focus,.mbt-fb:hover,.mbt-fb:active{background:transparent linear-gradient(#5B7BD5,#4864B1) repeat scroll 0 0;border-color:#5874C3 #4961A8 #41599F;box-shadow:0 0 1px #607FD6 inset} .mbt-fb i{padding:2px 2px 0 4px;font-size:11px;color:#3B5998;background:#fff;margin-right:4px;margin-top:3px} .mbt-fb:hover, .mbt-fb:visited, .mbt-tw:hover,.mbt-tw:visited, .mbt-linkedin:hover ,.mbt-linkedin:visited{color:#fff!important;} /***Gplus, Pinit, Stumbleupon***/ .mbt-gp{box-shadow:0 1px 0 rgba(0,0,0,0.05);transition:background-color .218s ease 0s,border-color .218s ease 0s,box-shadow .218s ease 0;background-color:#FFF;background-image:none;border:medium none;border-radius:2px;border:1px solid rgba(0,0,0,0.17);color:#262626;cursor:pointer;font-weight:700;height:20px;line-height:20px;padding:0 6px 0 4px;white-space:nowrap} .mbt-gp:hover, .mbt-gp:visited{color:#262626!important;} #MBTshares .pinit{background:#f9f9f9!important} #MBTshares .stumb{background:#f0fafe!important;border:1px solid #cde3ea} #MBTshares .stumb:hover{border:1px solid #b7d5df;box-shadow:0 1px 0 rgba(0,0,0,0.1)} #MBTshares .stumb i{color:#eb4823!important;font-size:13px!important;margin-top:1px!important} .mbt-gp:focus,.mbt-gp:hover,.mbt-gp:active{border:1px solid rgba(0,0,0,0.25);box-shadow:0 1px 0 rgba(0,0,0,0.1)} .mbt-gp i{padding:2px 2px 0 0;font-size:11px;color:#DB4437;margin-right:2px;margin-top:3px} .mbt-gp .fa-pinterest{padding:0 2px 0 0;font-size:14px} #MBTshares .bufferimg{width:15px; margin-top:2px; padding:0 1px 0 0; } /***LinkedIn***/ .mbt-linkedin{transition:background-color .218s ease 0s,border-color .218s ease 0s,box-shadow .218s ease 0;background-color:#0077B5;text-shadow:0 -1px #005887;border:medium none;border-radius:2px;border:1px solid #066094;color:#fff;cursor:pointer;font-weight:700;height:20px;line-height:20px;padding:0 2px 0 1px;white-space:nowrap} @media screen and (-webkit-min-device-pixel-ratio:0) { .mbt-linkedin{padding:0 5px 0 1px} } .mbt-linkedin:focus,.mbt-linkedin:hover,.mbt-linkedin:active{border:1px solid #0369A0;background-color:#0369A0} .mbt-linkedin i{padding:0;font-size:17px;color:#FFF;margin-right:0;position:relative;left:1px} .mbt-linkedin .ibg{background:#0369A0 none repeat scroll 0 0;width:17px;display:inline-block;border-right:1px solid #006095;border-radius:2px;height:20px;padding:0 2px 0 1px;margin:0 2px 0 -1px} /**Twtter, Print, Whatsapp, viber**/ .mbt-tw{position:relative;height:22px;padding:4px 8px 1px 4px;font-weight:700;color:#FFF;cursor:pointer;background-color:#1B95E0;border-radius:3px;box-sizing:border-box} .mbt-tw:focus,.mbt-tw:hover,.mbt-tw:active{background-color:#0C7ABF} .mbt-tw i{padding:0 0 0 1px;font-size:14px;color:#fff;margin-right:2px;margin-top:0} .mbt-o{max-width:100%} .mbt-o,.mbtcount-o,.mbt-fb,.mbt-gp,.mbt-linkedin,.mbt-tw,.label,#mbtcount{display:inline-block;vertical-align:top} .mbtcount-o{position:relative;min-width:15px;height:17px;text-align:center;padding:1px 5px;margin-left:2px;background:#FFF none repeat scroll 0 0;border:1px solid #e7e7e7;border-radius:2px;display:none!important; } #MBTshares .printme {background-color:#333;} #MBTshares .printme:focus,#MBTshares .printme:hover,#MBTshares .printme:active{background-color:#000} #MBTshares .whatsapp{background-color:#73D40B;} #MBTshares .whatsapp i{font-size:15px!important;} #MBTshares .whatsapp:focus,#MBTshares .whatsapp:hover,#MBTshares .whatsapp:active{background-color:#65BA09} #MBTshares .viber{background-color:#7b519d;} #MBTshares .viber:focus,#MBTshares .viber:hover,#MBTshares .viber:active{background-color:#8558aa} #MBTshares .viberimg{width:13px; margin-top:0px; padding:0 3px 0 0; } #mbtcount{color:#666;white-space:nowrap;text-decoration:none;padding:2px 0 0} #mbtcount:hover{text-decoration:none} #MBTshares .arrow{height:0;left:-10px;position:relative;top:-15px;width:5px;z-index:2} #MBTshares .ext{min-height:18px!important} #MBTshares .arrow s,#MBTshares .arrow i{border-color:transparent #e7e7e7;border-style:solid;border-width:4px 5px 4px 0;display:block;position:relative;top:19px} #MBTshares .arrow i{border-right-color:#FFF;left:2px;top:11px} .share-btn{position:relative;display:inline-block; display:none!important;} .share-btn .h2{font-size:30px;font-weight:700;font-family:arial;color:#73D40B;height:31px; line-height: 1.4em;} .share-btn .h4{font-size:12px;font-family:arial} /*#########Horizontal Switch###########*/ .switchoff2{display:inline-block;} .mbtswitch2{padding:0 15px 0 3px;position:relative;top:-15px;margin:20px 0 0 3px;display:inline-block;max-width:30px;height:20px;cursor:pointer;background-color:#fff;border:1px solid #eee;border-radius:2px;outline:0 none;font:16px fontawesome;color:#ddd} .mbtswitch2:hover{color:#73D40B} .mbtswitch2 i.active:after{content:'f067';position:relative;left:7px;top:2px;font-style:normal} .mbtswitch2 i.inactive:after{content:'f068';position:relative;left:7px;top:2px;font-style:normal} @media only screen and (max-width:230px) { .tcount{border-bottom: 2px solid #74D50C; border-right:none; min-width:100%;} #horiz #MBTshares {width: 100%;} Step 4- Paste the following Code above inside your template Step 5- Now add jQuery script above tag //<![CDATA[ /* ##### FREE JUMBOSHARE SIMPLIFIED ####### Developed by: www.MyBloggerTricks.com Dual licensed under the MIT license and GPL license. Copyright (c) 2015-2016 STCnetwork.org */ $(document).ready(function() { $(".mbtswitch").click(function(){$(".switchoff").slideToggle();if($(".mbtswitch i").attr("class")"active"){$(".mbtswitch i").removeClass("active").addClass('inactive')}else if($(".mbtswitch i").attr("class")"inactive"){$(".mbtswitch i").removeClass("inactive").addClass('active')}}); $(".mbtswitch2").click(function(){$(".switchoff2").slideToggle();if($(".mbtswitch2 i").attr("class")"active"){$(".mbtswitch2 i").removeClass("active").addClass('inactive')}else if($(".mbtswitch2 i").attr("class")"inactive"){$(".mbtswitch2 i").removeClass("inactive").addClass('active')}}); }); //]]> Step 6- Save the Template FAQs What are share buttons? Share buttons are floating buttons in the shape of a square or rectangle that allows one to click on social media. Through these buttons, one can easily share the content through code if it has links. How do I add an Instagram button to my Blogger Blog? Step 1- Click on “Get Widget” button Step 2-Click on “Copy to Clipboard” button Step 3- In blogger dashboard click “Layout” in the Sidebar area Step 4- Click “Add a gadget” Step 5- Select “HTML/JavaScript” title to your gadget Step 6- In the min box, right click and select “Paste” How do I put a link to my blog on Instagram? Upload your image to your Instagram and use the filter you wish. In the description or link in the profile and click on Post. How to manage the finance of your blog, check out amazing article here..! Wrap UP: Social Media Icons help in increasing blog traffic and knowing how to add Responsive Social Media Icons in Bloggers helps one to do drive more traffic to the blog or website. The article provides all the information that are required to add the icons.

Tag: media icons

How to Add Responsive Social Media Icons in Blogger

Recent Posts

Cointiply Bitcoin Rewards: Earn Free Bitcoin

A Beginner Guide to Creating and Selling Stock Photography and Videos

Top 10 Side Hustles to Make Some Extra Money

Boost Your Business with Google My Business: Tips and Strategies

Popular

5 Essay steps to make your own Instagram color palette

Top 10 Blogs for digital marketing professionals

How to make money on Rumble: A Beginner’s Guide to Monetizing Your Videos

HOW TO SHARE AMAZON CART?

Follow Us

Popular Posts

5 Essay steps to make your own Instagram color palette

Top 10 Blogs for digital marketing professionals

How to make money on Rumble: A Beginner’s Guide to Monetizing Your Videos

HOW TO SHARE AMAZON CART?

Most Demanded

Cointiply Bitcoin Rewards: Earn Free Bitcoin

How Does Affiliate Marketing Work?

What are the necessary skills for Affiliate Marketing?

Stay Connected

Popular Posts

5 Essay steps to make your own Instagram color palette

Top 10 Blogs for digital marketing professionals

How to make money on Rumble: A Beginner’s Guide to Monetizing Your Videos

HOW TO SHARE AMAZON CART?

Tag: media icons

Recent Posts

Popular

Follow Us

Facebook

Twitter

Facebook

Twitter

Popular Posts