AllBlogTools.com | Blogger Templates and Tricks |  |
| Posted: 29 Sep 2013 11:38 PM PDT Today's featured Blogger template is from Templateify, and it's called Montric. Montric is an elegantly-made template that has this huge image slider that fills up most of the browser window upon opening. Now this may sound like a bad move when it comes to design but it's not – that is, as long as it's used appropriately, just like how Templateify did on this particular template. This is perfect and effective if you have stunning images in your content that you could feature and which you think would successfully capture your visitors' attention thereby encouraging them to navigate your site even further and look for more striking images. It has a clean and flat designed elements and features that include a 2-column layout, right sidebar, 4-column footer, and 'Read more' button just to name a few. Even though it's packed with fully functional scripts it still manages to load very quickly. One of these scripts allows your visitors to use the keyboard to transition between the next and previous posts. The way the elements are spaced looks great giving the design that spacious and almost minimalist look. The logo located at the top left is actually made out of CSS and text and not an image, which means that you can edit it and rename it anyway you want. You can check out the live demo here. If you find it perfect for your website you can download it here where you can also find some more info on the template.
     |
| How to Add Simple Social Sharing Beneath Your Posts Posted: 29 Sep 2013 11:19 PM PDT We've featured quite a number of social sharing buttons and here's one that you may like as well. Mohammad Ishtiaq has created his own version and we'll be covering his tutorial here. As you probably know by now, social media buttons help boost your blog's traffic as your readers can share it with their social media sites. Social Networking sites such as Facebook, Twitter, Google+, Pinterest all have JavaScript so you can easily add them in your site. Here are the steps on how to add this simple social sharing buttons beneath your blog posts. Go to Blogger Dashboard > Select Blog > Template page of the Blog Select Edit HTML Add the code below before ]]></b:skin> div#social-sharing { width:550px; height: 90; background: radial-gradient(center center, circle cover, #ffffff, #f9f9f9); background: -o-radial-gradient(center center, circle cover, #ffffff, #f9f9f9); background: -ms-radial-gradient(center center, circle cover, #ffffff, #f9f9f9); background: -moz-radial-gradient(center center, circle cover, #ffffff, #f9f9f9); background: -webkit-radial-gradient(center center, circle cover, #ffffff, #f9f9f9); padding:10px; margin:0 auto; border: 1px solid #999; border-radius:5px; -webkit-border-radius:5px 5px 5px 5px; -moz-border-radius:5px 5px 5px 5px; -webkit-transition: all 0.6s ease-out; -moz-transition: all 0.6s ease-out; -o-transition: all 0.6s ease-out; -ms-transition: all 0.6s ease-out; transition: all 0.6s ease-out; } div#social-sharing:hover { -webkit-box-shadow: 1px 1px 3px #CCC inset; -moz-box-shadow: 1px 1px 3px #CCC inset; box-shadow: 1px 1px 3px #CCC inset; } #social-sharing img { width: 35px; padding: 5px; border: 0; box-shadow: 0; display: inline; opacity:1; filter:alpha(opacity=1); /* For IE8 and earlier */ } #social-sharing img:hover { -webkit-transition: all 0.6s ease-out; -moz-transition: all 0.6s ease-out; -o-transition: all 0.6s ease-out; -ms-transition: all 0.6s ease-out; transition: all 0.6s ease-out; opacity:0.6; filter:alpha(opacity=60); /* For IE8 and earlier */ } .social-sharing-title { text-align: center; padding: 3px 10px 2px 0px; margin: 0 0px 0 0; color: #8d0303; text-transform: uppercase; line-height: 25px; vertical-align: middle; font-size: 14px; } Note: You can change the Statement Text Color Highlighted in Red and the one highlighted in yellow which is the Background width with your own preference. Search for this tag <data:post.body/> and add the following code below/after it. <b:if cond='data:blog.pageType == "item"'>< center> <div id='social-sharing'> <div class='social-sharing-title'>Do You Like This ? Please Take Five Second To Share It!</div> <!-- Facebook --> <a class='face-book' expr:href='"http://www.facebook.com/sharer.php?u=" + data:post.url + "&t=" + data:post.title' rel='nofollow' target='_blank' title='Share This On Facebook'><img alt='Facebook' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3SBdvM2eQZOgm0FknPLh3Tu1k4TNCDJ2X4r8YWskge28fMH6qPTiaNmwtEb7RVGH2XC63wIe719GXD66dtPmUuuPh2iF_6MKQRmQf_WzD4APKYpkYutTG1MjucgDNjx25YnwaeUKLKQXT/s1600/Facebook.gif'/></a> <!-- Twitter --> <a class='twitter' expr:href='"http://twitthis.com/twit?url=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank' title='Tweet This'><img alt='Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_HU95lQi7X46d_DhlBcUAiOvS0NII3rij5yqwExn0I19BwiwwSIUDVuSHwpwxLtjMMGWT4NR5UzEZQpKv6I6RXIny6YbIPt7C55GXikh-XSUWgxmwI3yL9H6VbwOULTM5QlfO-xP-cQZA/s1600/twitter_bird.gif'/></a> <!-- Pinterest --> <a class='pint-er-est' href='javascript:void((function()%7Bvar%20e=document.createElement('script');e.setAttribute('type','text/javascript');e.setAttribute('charset','UTF-8');e.setAttribute('src','http://assets.pinterest.com/js/pinmarklet.js?r='+Math.random()*99999999);document.body.appendChild(e)%7D)());'><img alt='Pinterest' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcY3wgd1a0V_aQspsOzWtujBSsTb3Ns_pmpumNhEE1aSYBVkCuHqQX1nrPwvjYWfI1JaDvNkpFKBAEBe9IpVCtdvFg9ATeXkZriOams_Co0hIiKMSbweyQfH5bZQ9JN4tc-j9ssnMxa4wn/s1600/Pinterest.gif'/></a> <!-- Stumbleupon --> <a class='stumbleupon' expr:href='"http://www.stumbleupon.com/submit?url=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank' title='Stumble this'><img alt='StumbleUpon' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhimrJniBSOwvMhqlTY1FHxMH-7xF633g5BODytEc2R0TWyXcluoMccIK9nv7ae5Zwelq4O7ZuCAHKLsazbmlOfv2m7NBp3phodxxbJuHa775HwgCU4A378Vy1gH7YeZ5NhBn1cV3v_MOpY/s1600/stumbleupn.gif'/></a> <!-- Delicious --> <a class='del-icio-us' expr:href='"http://del.icio.us/post?url=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank' title='Share This On Delicious'><img alt='Delicious' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgk7DRYOdo8lXh3dWcgLL6xjwKP732qHWijAktSMgBuYrt60CM1cEv52z6jmuPXeeln7Ye8Pr7bJSDdJ7bmkWhq1W3BaUSn3cTNBI7D8m0OqGGPdTa73pPhvJ3bqztNeEuNMWt43hW0y4g8/s1600/Delicious.gif'/></a> <!-- Reddit --> <a class='reddit' expr:href='"http://reddit.com/submit?url=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank' title='Bookmark this'><img alt='Reddit' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMOS-6h8wzf_4e6BexiZgjgjZWoorUAWY1ABqMlqB_Qb5MMdVWASGiPOY5sMyeXdFDxRF9OJYRwNEhUh2TrDrP2m9KW7_iX7K7fJfTwU-kOkTAtn-9z2iHUE5VPrM_OVBTlqzj4htMDEQm/s1600/reddit.gif'/></a> <!-- Digg --> <a class='digg' expr:href='"http://digg.com/submit?phase=2&url=" + data:post.url' rel='nofollow' target='_blank' title='Digg This'><img alt='Digg' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSyhSAT5HRmITx9qRO8Y8KE47La4A09ZSF7jzsFWTxRth5T_YXWiwKcqY7dAD7M3PQUyJROv8GZyH1mL_LXjL3CnolXwRh2N5pTz7ojG_oWPd33A6TWZzE4sgZv-bsBXPi1ony33FdEgB4/s1600/digg.gif'/></a> <!-- Email --> <a href='mailto:?Subject=My Blogger Tricks&Body=Check out this site.. http://www.myblogger-tricks.com' rel='nofollow' target='_blank' title='Email This'><img alt='Email' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaMYPXbJETIFuDHDfuoNcaM_aOi5zTA9a9c6FQhVZjgLExg51KLm8HnqDWQvPs07nTHqSw46eOF2UdnwSN-9ONQx82Xb1I-UODcAO0Ft7aoCqvd3K513AYLl66i-7GB2ZrV7bVEWsIumcH/s1600/email.gif'/></a> <!-- addtoany --> <a class='a2a_dd more' expr:href='"http://www.addtoany.com/share_save?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' target='_blank' title='Share On Others Networks'><script src='http://static.addtoany.com/menu/page.js' type='text/javascript'/><img alt='Delicious' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTLegBpRKwio5XzmQ1vpOCONDn_FnwlsHPka42VZEVEnFynInvOVTdjv7R-Myrkpd0P3VkeouCNKBf1FjZE58KYCvDhwOWlDGAOUybMHujIBeY1Hk7PSDYTo7ieYNHEjybf8isYpi-4rwO/s1600/share-to-any.gif'/></a> </div> </center> Save. Note: Please make a backup first before editing your template. Check out the full tutorial here.   |
| You are subscribed to email updates from Blogger Templates, Tutorials, Tools | WordPress Themes | Allblogtools.com To stop receiving these emails, you may unsubscribe now. | Email delivery powered by Google |
| Google Inc., 20 West Kinzie, Chicago IL USA 60610 | |
No comments:
Post a Comment