How to Add Professional Info Box on Facebook Page Welcome Tab

Last time I had shared with you that how you can get DoFollow backlinks from facebook but as in previous post I told that you can design...

Info box Facebook page
Last time I had shared with you that how you can get DoFollow backlinks from facebook but as in previous post I told that you can design your DoFollow link or welcome tab easily through HTML and CSS, now you don’t need to dirty your hands in coding and design because I have made the simple and pro looking info box for your welcome tab this infobox has some qualities as mentioned below.
  • It is Fast, simple and pro looking.
  • It has Social media link interaction.
  • Easy Customization through CSS and ready with DoFollow link.

How to Add Info Box in Welcome Tab

Follow the below steps to add this info box in your Facebook page welcome tab.

Move on your Facebook page in which you added the DoFollow link.

Click on Welcome Tab>> Edit Tab and replace the previous HTML code with the below code.
It will show you some errors of relative URLS so fill the Blue highlighted text with your blog info and press Save & Publish that's it.
<html>
<head>
<link href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css' rel='stylesheet'/>
<link href="https://fonts.googleapis.com/css?family=Roboto:500,900" rel="stylesheet">
<style>
.author-box {
background: #03A9F4;
color: #FFFFFF;
margin: 20px 0 30px 0;
padding: 10px;
overflow: auto;
-webkit-border-radius: 4px;
border-radius: 4px;
border-right: #929292 solid 3px;
-moz-box-shadow: inset 20px 0px 20px 0px #111;
} .author-box p { margin: 0;
padding: 0;
} .author-box img { background: #FFFFFF;
float: left;
margin: 0 10px 0 0;
padding: 4px;
border: 1px solid #E6E6E6;
-webkit-transition: background-color 2s;
transition: background-color 2s;
cursor:pointer;
} .author-box img:hover { background-color:rgba(58, 58, 58, 0.18);
} .description { font-size: 17px;
font-family:'Roboto', sans-serif;
} h1.heading1 { margin: auto;
font-family:'Roboto', sans-serif;
/* margin-left: -21%;
*/ } a.social { border: 1px solid #fff;
padding: 15px;
color: #03a9f4;
background: #fff;
text-decoration: none;
} .follow-box { display: block;
margin-top: 39px;
margin-bottom: 10px;
} h1.heading1 { margin: auto;
padding: 15px;
font-family: 'Roboto', sans-serif;
display: block;
background: #fff;
color: #2196F3;
} a.dofollow-link { color: rgb(33, 150, 243);
text-decoration: none;
} </style>
</head>
<body>
<div class='author-box'>
<p><img alt="YOUR-ALT-TAG" src="YOUR-PAGE-PROFILE-IMAGE-URL-HERE" width="200px" height="230px"/><h1 class="heading1"><b>Welcome To <a class="dofollow-link" href="http://www.protechnify.com/">PRO TECHNIFY</a></b></h1><br><div class="description">
<p>YOUR-BLOG-DESCRIPTION-HERE...<a class='dofollow-link' href='http://www.YOUR-BLOG-URL-HERE.com/'>More</a></p>
</div><div class='follow-box'><a class='social' href='GOOGLE-PLUS-URL-HERE' target='blank' ><i class="fa fa-google-plus" aria-hidden="true"></i></a> <a class='social' href='TWITTER-URL-HERE' target='blank'><i class="fa fa-twitter" aria-hidden="true"></i></a> <a class='social' href='PINTEREST-URL-HERE' target='blank'><i class="fa fa-pinterest-p" aria-hidden="true"></i></a><br/>
</div>
</body>
</html>
I hope you like this professional info box for the facebook page welcome tab. Keep in touch with us for more widgets and amazing tricks like this.

COMMENTS

Name

Android,2,backlinks,7,Blogger,45,Errors,1,How To,31,Make Money Online,2,SEO,13,SMM,10,Templates,8,Tools,7,Tricks,15,Web designing,17,Widgets,24,WordPress,4,
ltr
item
PRO TECHNIFY: How to Add Professional Info Box on Facebook Page Welcome Tab
How to Add Professional Info Box on Facebook Page Welcome Tab
https://1.bp.blogspot.com/-85vJl6mwGp8/V_ztKauMz-I/AAAAAAAAJfg/_Rj5XRP5eo0EOTsNsnbt-pX6CB86ufOIwCLcB/s640/Info-box-facebook-page.jpg
https://1.bp.blogspot.com/-85vJl6mwGp8/V_ztKauMz-I/AAAAAAAAJfg/_Rj5XRP5eo0EOTsNsnbt-pX6CB86ufOIwCLcB/s72-c/Info-box-facebook-page.jpg
PRO TECHNIFY
http://www.protechnify.com/2016/10/add-professional-info-box-on-facebook-page.html
http://www.protechnify.com/
http://www.protechnify.com/
http://www.protechnify.com/2016/10/add-professional-info-box-on-facebook-page.html
true
8223102945718438291
UTF-8
Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS CONTENT IS PREMIUM Please share to unlock Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy