Add uncomplicated writer box below on Blogger post

Add unproblematic responsive writer box widget below your Blogger post

Add

Hello Bloggers! Welcome dorsum on HowToLearnBlog. Here, I am going to portion a unproblematic writer box blogger widget to setup your author box, below to the every postal service of your blog. As nosotros know that author box plays really of import component to promote your identity in addition to your contents on your blog. So let's teach to develop a unproblematic in addition to responsive Author box for your blogger blog.

Follow these instructions to setup unproblematic in addition to responsive writer box widget below every posts of Blogger

  • Log on www.blogger.com
  • Click on Layout
  • Click on "Add a Gadget" simply below of postal service (main) block.

  • Select HTML/JAVASCRIPT

  • Modify the below codes.
<style type="text/css">
/* CSS Author Box past times WWW.HOWTOLEARNBLOG.COM */
.sora-author-box {
overflow: hidden;
margin: 10px 0;
}
.sora-author-box img {
float: left;
margin-right: 10px;
object-fit:cover;
}
.sora-author-box p {
padding: 0 10px 10px;
-webkit-margin-before: 0;
-webkit-margin-after: 0;
}
.sora-author-box b {
font-weight: 700;
font-style: normal;
letter-spacing: 1px;
font-size: 20px;
}
/* CSS Author Box past times WWW.HOWTOLEARNBLOG.COM */
     </style>
        <div class="sora-author-box">
            <img alt= Add unproblematic responsive writer box widget below your Blogger postal service Add unproblematic writer box below on Blogger postal service class="avatar avatar-60 photo" height="100" src="http://2.bp.blogspot.com/-_0qyTMr2uYI/VIuQL9jbCDI/AAAAAAAAH2U/vPhwdobq9NE/s1600/Userava.png" width="110" />
            <p style="text-align: justify;">
                <span style="font-family:verdana,geneva,sans-serif;"><b>About Author</b></span><br />
                <span style="font-size:16px;"><span style="font-family: verdana,geneva,sans-serif;"><span>This is dummy text. It is non meant to survive read. Accordingly, it is hard to figure out when to goal it. But then, this is dummy text. It is non meant to survive read. Period.</span></span></span></p>
        </div>
  • Replace yellowish marked icon URL alongside your icon URL.
  • Replace yellowish marked About Author with your name.
  • Replace yellowish marked writer description details alongside your details.
  • After replacing codes. Put the end code on html/javascript box.

  • After pasting your codes. Click on Save button.

Final affect for setting Author box on Blogger's blog.

I promise everything is clear. If you lot bring whatever sort of occupation regarding to setup writer box on Blogger's blog. Then, Please write your occupation below on comment box.

Belum ada Komentar untuk "Add uncomplicated writer box below on Blogger post"

Posting Komentar

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel