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...
- 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>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.
<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>
COMMENTS