Show Guest Author Info Below Blogger Posts

Due to lack of time blog authors often have to rely on Guest posters. In return we offer them with quality back links and advertisement. In order to better serve them it is important to display some info about them in a polite and attractive manner. This will encourage more and more people to write quality articles for you. We are very selective in accepting tutorials written by our readers but once the tutorial qualifies we publish their post in the best manner possible. See the example below which shows one of MBT’s Guest Author’s info ,

Update: A Dynamic version of the same widget has been published. Please visit: Display author Box automatically

 

To create this type of attractive box for your guest authors you would need to play with some  delicious CSS and HTML . So then Lets jump straight to the main part!

How To Create a Customized Author Info Box?

1. Go To Blogger > Design > Edit HTML


2. Back up your template


3. Search for ]]></b:skin>


4. Just above it paste the code below,

/*----------Guest Poster --------*/
.mbt-gp img {
margin:0;
border:0;
}
.mbt-gp-about {
font-size:12px;
margin:0 auto;
padding:3px;
width:580px;
background:#edf6ff;
border:#9ecfff dotted 1px;
min-height:130px;
}
.mbt-gp {
padding-top:10px;
margin:0;
font-size:12px;
float:left;
width:17%;
text-align:center;
border-right:#93C0F9 solid 1px;
}
.mbt-gp-text {
float:right;
width: 80%;
padding:5px;
text-align:left;
font:12px arial,sans-serif;
text-align:justify;
margin:0;
padding:0;
}

   5.    Save your template and jump to the next part of the tutorial.

How To Add The Author Info Box Below Guest Post?

Now whenever you publish a Guest post at your blog, simply switch to the Edit HTML Mode of your Blogger Editor. And drag to the bottom of the HTML codes and just at the end add the code below,

<div class="mbt-gp-about">

  <div class="mbt-gp"><img src="GUEST-AUTHOR-IMAGE-LINK" width="80" height="70" /> GUEST-AUTHOR-NAME </div>

  <div class="mbt-gp-text">

    <p><strong>About the Guest Author:</strong>

      <br />ADD-DESCRIPTION-ABOUT-AUTHOR-INFO-HERE </p>

  </div>

</div>

See the screenshot below to know better where to add the code,



Make sure you replace the bolded text with proper details. The image size would fit perfectly if it is 200px by 125px.

Suggestion:  To customize the colours and style of the box I recommend that you use MBT HTML Editor

You will have to add just the second code for every guest post that you publish. Once you understand on how to do it then doing it again and again would become more like a fun. I just hope you find it useful and worth trying. Take care buddies. :>

Nokia T7 leaked! Photos inside

The rumored Nokia T7 has finally appeared on photos. It looks like an exact clone of the N8 at the first glance.




It has the usual 360x640 resolution expected on a Symbian^3 full touch device, an aluminium uni-body design, but it drops the one thing that made the N8 famous: the 12MP camera. Instead we get an 8MP shooter, hopefully with auto-focus.




The HDMI port has unfortunately been removed, so the price will probably be much lower than the N8's. The CPU inside will most likely be an ARM11 clocked at 700MHz, with a dedicated GPU supporting OpenGL 2.0.




The sticker on the back shows Nseries, but as you can see it's just a sticker, and the phone is in prototype phase, so we can't know for sure that this is going to be the final configuration. Anyway, by the looks of it, this device will have to compete with the C7, because I believe the price will be closer to the C7's than the N8's.

Is this downsized N8 a good idea? Maybe. I hear a lot of people saying "I love the N8's looks, but I hate the price", so those people will certainly be into this device, if it ever hits Europe, that is.