• Righteous Kill

    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque sed felis. Aliquam sit amet felis. Mauris semper, velit semper laoreet dictum, quam diam dictum urna, nec placerat elit nisl in quam. Etiam augue pede, molestie eget, rhoncus at, convallis ut, eros. Aliquam pharetra. Nulla in tellus eget odio sagittis blandit. Maecenas at nisl. Nullam lorem mi, eleifend a, fringilla vel, semper at, ligula. Mauris eu wisi. Ut ante dui, aliquet nec, congue non, accumsan sit amet, lectus. Mauris et mauris. Duis sed massa id mauris pretium venenatis. Suspendisse cursus velit vel ligula. Mauris elit. Donec neque. Phasellus nec sapien quis ...

    read-more
  • Quisque sed felis

    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque sed felis. Aliquam sit amet felis. Mauris semper, velit semper laoreet dictum, quam diam dictum urna, nec placerat elit nisl in quam. Etiam augue pede, molestie eget, rhoncus at, convallis ut, eros. Aliquam pharetra. Nulla in tellus eget odio sagittis blandit. Maecenas at nisl. Nullam lorem mi, eleifend a, fringilla vel, semper at, ligula. Mauris eu wisi. Ut ante dui, aliquet nec, congue non, accumsan sit amet, lectus.Mauris et mauris. Duis sed massa id mauris pretium venenatis. Suspendisse cursus velit vel ligula. [caption id="attachment_111" align="alignright" width="300" caption="Image with caption"][/caption] Mauris elit. Donec neque. ...

    read-more
  • Etiam augue pede, molestie eget.

    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque sed felis. Aliquam sit amet felis. Mauris semper, velit semper laoreet dictum, quam diam dictum urna, nec placerat elit nisl in quam. Etiam augue pede, molestie eget, rhoncus at, convallis ut, eros. Aliquam pharetra. Nulla in tellus eget odio sagittis blandit. Maecenas at nisl. Nullam lorem mi, eleifend a, fringilla vel, semper at, ligula. Mauris eu wisi. Ut ante dui, aliquet nec, congue non, accumsan sit amet, lectus. Mauris et mauris. Duis sed massa id mauris pretium venenatis. Suspendisse cursus velit vel ligula. Mauris elit. Donec neque. Phasellus nec sapien quis ...

    read-more
  • Hellgate is back

    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque sed felis. Aliquam sit amet felis. Mauris semper, velit semper laoreet dictum, quam diam dictum urna, nec placerat elit nisl in quam. Etiam augue pede, molestie eget, rhoncus at, convallis ut, eros. Aliquam pharetra. Nulla in tellus eget odio sagittis blandit. Maecenas at nisl. Nullam lorem mi, eleifend a, fringilla vel, semper at, ligula. Mauris eu wisi. Ut ante dui, aliquet nec, congue non, accumsan sit amet, lectus. Mauris et mauris. Duis sed massa id mauris pretium venenatis. Suspendisse cursus velit vel ligula. Mauris ...

    read-more
Previous Next

Tiện ích Bookmark and Share Homepage cho Blogger

Posted by Phạm Hữu Dư On - - 1 nhận xét


Ở bài viết trước, iTechPlus đã giới thiệu đến các bạn tiện ích giúp quảng bá bài viết lên các mạng xã hội thông qua Social Bookmarking nhằm get traffic từ các trang mạng phổ biến như Twitter, Facebook,…
Không nằm ngoài mục đích đó, hôm nay iTechPlus tiếp tục giới thiệu đến các bạn một tiện ích tương tự, đó là Bookmark and Share Homepage.
Tạm thời mình sẽ chia sẻ 2 Style của tiện ích này cho các bạn lựa chọn. Xem DEMO tại đây.
1. Style 1 :
Bookmark and Share Homepage Widget Style 1
Hình minh họa
Cách thực hiện :
1. Vào Thiết kế > Phần tử trang
2. Tạo một widget HTML\JavaScript và dán vào đoạn code bên dưới :
<style type="text/css">
#subscribe {background:#666;width:280px;padding:10px;border:double #000}
.addthis_toolbox{padding:15px 0 5px 0;text-align:center}
.addthis_toolbox .custom_images a{width:32px;height:32px;margin:0 1px 0 0px;padding:0}
.addthis_toolbox .custom_images a:hover img{opacity:1}
.addthis_toolbox .custom_images a img{opacity:0.85}
.rssbox, .twitterbox, .facebookbox{background:#000;border:1px solid #999;padding:10px;margin:10px 0 0 0}
.rssbox:hover, .twitterbox:hover, .facebookbox:hover{border:1px solid #f5f5f5}
.rssbox a, .twitterbox a, .facebookbox a{color:#fff;text-transform:uppercase;text-decoration:none;font:bold 12px Arial,Helvetica,Sans-serif}
.rssbox a:hover, .twitterbox a:hover, .facebookbox a:hover{color:#080808;text-decoration:underline}
</style>
<div id="subscribe">
<div class="addthis_toolbox">
<div class="custom_images">
<a class="addthis_button_twitter"><img alt="Twitter" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHgSnHCmc4QLUIqOYXYUOU_xoCGp5KkxpJZ5LrJIyOuVpuUcPv3PwPkyvJ-FWE3aszGTQ0X1-vBku4IkAkIAKi8AdT0JAEm_nimD8vb29attygoq3eBJ8YkJCoph_hSm5C6Im1keZ40-A/s1600/twitter.png" width="32"/></a>
<a class="addthis_button_delicious"><img alt="Delicious" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUJbv59Mb7-xhmKlILmT-0LAa-BmmyQmum8kjF4CgpT9UE3Ct9azWbeT5V72m91viPaN0woWLvqveFG5BFQh2husOSN4gPLs32GpGD0JSyHW2ffOYUBWhcU44HWLGiC91hHByL6TMsJrk/s1600/delicious.png" width="32"/></a>
<a class="addthis_button_facebook"><img alt="Facebook" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYFXFwjCWrDVoHvmlSMfqITcjYyRQtyx3iZz5AG7aiHHdlNxgIrJlDYBZ9gDJQRFmNlEEv5EYA-bv4lEoPj-lGNA1-NPcf4YKAVa7I5ze4lwPA51Rn96RVLaVVcxmm8FfKbN5eIhdoYfc/s1600/facebook.png" width="32"/></a>
<a class="addthis_button_digg"><img alt="Digg" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhddaZjQLk9XxtUKsb8p8GYJNuILhS-Canmo9OTEJZTztfSk8Vt5_TckuCFlD8-KMaRr7umzK-12_DIoDPlorgzTH2S4J5FP8c3obx45FrwyAdXxowskaAGfjokkUtp9YyOMwPM_Av463A/s1600/digg.png" width="32"/></a>
<a class="addthis_button_stumbleupon"><img alt="Stumbleupon" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh078nH5UVw6RsPMO4aYmu6Xr7O-pz-izcQ_cUXWuN4vlORzaR4WXRCfC7R6SkT4eOqPrCEuL7jqh0RTDJwjMCjGnH5pRV286dk0dw8pZa5kI_-JcApTN_lgXyzVusLa2SwtA5UBN1Fmuc/s1600/stumbleupon.png" width="32"/></a>
<a class="addthis_button_favorites"><img alt="Favorites" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSaAPdsUXoz_lQBYDIUi4NEs_UmkvceWG3PN_MyehFV-4nb0HGNX6uXygFE3l5V2NFpMJTPLhk9F-YHmtkC2KkoTl9MLUdjXvCDEkgNe_dVa_XMh2LmTHgW17kcoORQuRDV91jw4zd5vQ/s1600/favorites.png" width="32"/></a>
<a class="addthis_button_more"><img alt="More" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9HD00CSkueXC-mIKZ-5zifnIrH66ehxf5LeRkIvRFj7dqxvsbpnYYxtdWRcJZs2EfrVilmsWXGOgzh7VZYxVrNzeJPrtN_hoipar0CA3ujG22CNAVxBigV1F2MHnr7-wXfPyBSmuyLEg/s1600/more.png" width="32"/></a>
</div>
<script src="http://s7.addthis.com/js/250/addthis_widget.js" type="text/javascript"></script>
</div>
<div style="clear:both;"></div>
<div class="rssbox">
<a href="http://www.itechplus.info/feeds/posts/default" target="_blank"><img alt="RSS Feed" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjap5gupeugOSUkdYwRuIMA-lmIA2XPxjmdD5b6QrnToruozTEk6mw6EVZte8SWIsNlxL4ZTHoVDYbJB1BNiwTsCFKkkdfkA3qTsZrJsUO1gsTFRd25h5KD7C0K6KPSjCEfBQsEnr8mvs8/s1600/rss.png" style="vertical-align:middle; margin-right: 10px;" title="RSS Feed"/></a><a href="http://www.itechplus.info/feeds/posts/default" target="_blank">Subscribe to Our RSS feed! </a>
</div>
<div class="twitterbox">
<a href="http://twitter.com/itechplus" target="_blank"><img alt="Follow Us on Twitter!" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjL5zFFp4Q2RMS7_3SBc-IA0viGutYh41ZwFiIKU4Tn2uIeT4PbQRkWAcNaA6e7ka1DSI4iiIeFxQhTrsjVNgfue6fSb28SUebeX7hL1o5viSd7C1xrVzPz5OmtBXGpCyjvXm1jO_mRtVo/s1600/social-connect-twitter.png" style="vertical-align:middle; margin-right: 10px;" title="Follow Us on Twitter!"/></a><a href="http://twitter.com/itechplus" target="_blank">Follow Us on Twitter!</a>
</div>
<div class="facebookbox">
<a href="http://www.facebook.com/itechplus" target="_blank"><img alt="Be Our Fan on Facebook" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKXFlV7I9qwmMbyH9VB-6Kk6JvI_ExSicpLqeHM-VJzxdC9fZ0WLajR0VDO8VWTOosfsRCu_657S5SsN09jVviTkTOLipl0zeAzo7xy85iLKUsuubRymDcNXxy-qGJr7o6pA6FIZygSHQ/s1600/social-connect-facebook.png" style="vertical-align:middle; margin-right: 10px;" title="Be Our Fan on Facebook"/></a><a href="http://www.facebook.com/itechplus" target="_blank">Be Our Fan on Facebook</a>
</div>
</div>
Thay code in đậm màu xanh tương ứng với địa chỉ Blog bạn và Username của bạn trên Twitter & Facebook.
3. Save and Done.
2. Style 2:
Bookmark and Share Homepage Widget Style 2 Hình minh họa
Cách thực hiện :
1. Vào Thiết kế > Phần tử trang
2. Tạo một widget HTML\JavaScript và dán vào đoạn code bên dưới :
<style type="text/css">
#subhome {border:double #000; width:180px;padding:10px;background:#666}
.subhome ul {margin:0;padding:0}
.subhome li {list-style-type:none;padding:4px}
.subhome li a:link, .subhome li a:visited{color:#fff}
.subhome img {width:25px;height:25px;margin:0 10px -5px}
</style>
<div id="subhome">
<center><img src="http://www.presidiacreative.com/wp-content/themes/dailypress/images/rss.gif" width="90" height="90"/></center>
<ul class="subhome">
<li><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwliT7IQBefH-Zv7aouWGtHQRl9Rb2eNj4KqAtXBFwCIvrkn2tfeIHhSCdov4Pz5v2-W0W5TL_3DhCinu631h0jUTet8jaJkflWhFR6gourYeqt5w0Jy_pxz7XYvkAiQj60RGNNe4ZxVg/s400/FACEBOOK.png"/><a href="http://www.facebook.com/sharer.php?u=http://www.itechplus.info" target="_blank" rel="nofollow">Share on Facebook</a></li>
<li><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEic0YaQ4cg4Uc9_jcYtbhLCO3kuptATuGlnT8BOlGcQFksAbG90y_iPaCFk9pdJ6Uix43Fbma8vwvngctrYNruch0b-kH8cWh4zN3w2P39WBbQBHXf3pGo8qovKFoKGqUmFARsw8pXn83s/s400/TWITTER.png"/>
<a href="http://twitthis.com/twit?url=http://www.itechplus.info">Share on Twitter</a></li>
<li><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh76WL0L4vIAqGkPXulVmMcuGobi_niGD_xTfqjNNaX2bTG9HjjWmousYAejVcno_wmI1HcvlkIC8QBJmKkLedMUduQjKRl5lMVDC-6Yjr57P4bP1q-EiYTufNHsewLCJSJWWLdZUKX0Xg/s400/STUMBLE-UPON.png"/><a href="http://www.stumbleupon.com/submit?url=http://www.itechplus.info" target="_blank" rel="nofollow">Share on StumbleUpon</a></li>
<li><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjA6c5cD3W6ZeK66Dyb-ptyzkUXpbeqStHqs77-D6zXmaD0NVU0lrmjs8yy171uS1yz1RWKdIxlbovmPobG8F0escAYkuDMQqceG2S7JWbJxbHpZNHtAkUwwRc-3WM3GuVpuuptDtKJ0Vo/s400/DELICIOUS.png"/><a href="http://del.icio.us/post?url=http://www.itechplus.info" target="_blank" rel="nofollow">Share on Delicious </a></li>
<li><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhDrnddux9Z8vd7GGulDm4P4iKdcp__cufpFh0UcD7yxW8Rvz4T27XDw6N9T0RDT6A2-tXfq-Fp64zH6uQCsKr9FKM8eLkJ945IANC09Fy-g36AlrmmVe7Nh5y6kXSpde16J2gaE4z1OM/s400/DIGG.png"/><a href="http://digg.com/submit?phase=2&url=http://www.itechplus.info" target="_blank" rel="nofollow">Share on Digg </a></li>
<li><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqwrUf__Xq2huusG56QyNAHUnWP2zMAFrUqRlDSnxTJDt4P6-R4HDgRfloZ68MW-MuvONLQBIzS5XTOqKaK4cg1TFNImF0l6JQvIoT-j6J7flwCU2RK52ASobJCdW7-_yTnzGoe1T508U/s400/Google-icon.jpg"/><a href="http://www.google.com/bookmarks/mark?op=edit&amp;output=popup&amp;bkmk=http://www.itechplus.info" target="_blank" rel="nofollow" title="Bookmark this blog on Google">Bookmark on Google</a></li>
<li><img alt="Email" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgf5PQh4OnF2jZI4nT2MXJ4MduRS_tSmY1AUOMdmT8IbWIRUcHlG9Red7XBBorsiC5WMQQ91Kl_6bkCjv17HRuPI1UBTjMhjShNV4ThTSvCytVXQN4gQzmvRSnVteLBxsyevBV_bCevLF_v/s400/Email+Orange_128.png"/><a href="http://feedburner.google.com/fb/a/mailverify?uri=itechplus&amp;loc=en_US" target="_blank" rel="nofollow">Receive Email Updates</a>
</li>
</ul>
</div>
Thay code in đậm tương ứng với địa chỉ Blog bạn và Feed Name của bạn trên Feedburner.
3. Save and Done.
* Lưu ý : các bạn nên download tất cả hình ảnh của widget tương ứng và upload lên host riêng đề phòng nó “die” bất tử.
Chúc các bạn thành công !

Categories:

One Response so far.

Leave a Reply