Tải về hình nền Wallpapers Stock full HD cho OnePlus chạy H2OS

by Thủ thuật android · 20/08/2015

Read More

Kèm biểu tượng chia sẻ bài viết qua Yahoo! Messenger vào Blogger

Trước đây bạn đã được hướng dẫn cách đưa biểu tượng hiển thị trạng thái trực tuyến của mình khi đang dùng Yahoo! Messenger vào blog, hôm nay chúng ta sẽ đề cập đến việc chèn thêm biểu tượng chia sẻ bài viết qua trình tin nhắn này.

Khi sử dụng biểu tượng, một thông điệp bao gồm tên bài viết đi kèm liên kết của nó sẽ tự động được chèn vào khung nhập nội dung của chương trình tán gẫu. Và đây là đoạn code:

<a expr:href='&quot;ymsgr:sendIM?+&amp;m=&quot; + data:post.url + &quot; &lt;== 

&quot; + data:post.title'><img class='icon-action' src='http://i240.photobucket.

com/albums/ff259/thuthuatblog/ymr.jpg' title='Gửi bài viết này cho bạn bè qua 

Yahoo! Messenger!'/></a>

Trong đó link biểu tượng được làm nổi bậc và bạn có thể thay bằng một trong những biểu tượng dưới (Với Firefox nhấn phải chuột chọn Copy Image Location hoặc Properties -> Chọn chép link ở Address(URL)):

Cách chèn vào Blogger:

Tùy theo template và vị trí mong muốn, nhìn chung bạn có thể đặt biểu tượng cạnh Label (Nhãn) của bài viết hoặc cạnh các thông tin khác như tác giả, giờ đăng bài,...

Đăng nhập Blogger, lưu lại template đang dùng, chọn Expand Widget Templates (Mở rộng tiện ích mẫu) và tìm đoạn vị trí gợi ý dưới:

    <div class='post-footer'>
    <div class='post-footer-line post-footer-line-1'>
     <!-- Nơi có thể đặt code -->
     <span class='post-author vcard'>
        <b:if cond='data:top.showAuthor'>
          <data:top.authorLabel/>
          <span class='fn'><data:post.author/></span>
        </b:if>
      </span> 
    <!-- Nơi có thể đặt code -->
    <span class='post-timestamp'>
        <b:if cond='data:top.showTimestamp'>
          <data:top.timestampLabel/>
        <b:if cond='data:post.url'>
          <a class='timestamp-link' expr:href='data:post.url' rel='bookmark' 

title='permanent link'><abbr class='published' expr:title='data:post.

timestampISO8601'><data:post.timestamp/></abbr></a>
        </b:if>
        </b:if>
      </span> 
    <!-- Nơi có thể đặt code -->
   <span class='post-comment-link'>
        <b:if cond='data:blog.pageType != &quot;item&quot;'>
          <b:if cond='data:post.allowComments'>
            <a class='comment-link' expr:href='data:post.addCommentUrl'

 expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 

1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/>

 <data:top.commentLabelPlural/></b:if></a>
          </b:if>
        </b:if>
      </span> 
    <!-- Nơi có thể đặt code -->
    <span class='post-icons'>
        <!-- email post links -->
        <b:if cond='data:post.emailPostUrl'>
          <span class='item-action'>
          <a expr:href='data:post.emailPostUrl' expr:title='data:top.emailPostMsg'>
              <img alt='' class='icon-action' src='http://www.blogger.com/img/

icon18_email.gif'/>
          </a>
          </span>
        </b:if>
        <!-- quickedit pencil -->
        <b:include data='post' name='postQuickEdit'/>
      </span> 
    <!-- Nơi có thể đặt code -->
   </div>

      <div class='post-footer-line post-footer-line-2'>
       <!-- Nơi có thể đặt code -->
   <span class='post-labels'>
        <b:if cond='data:post.labels'>
          <data:postLabelsLabel/>
          <b:loop values='data:post.labels' var='label'>
            <a expr:href='data:label.url' rel='tag'><data:label.name/></a>

<b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
          </b:loop>
        </b:if>
      </span> 
    <!-- Nơi có thể đặt code -->
  </div>
      <div class='post-footer-line post-footer-line-3'>
    <!-- Nơi có thể đặt code -->
       <span class='post-location'>
        <b:if cond='data:top.showLocation'>
          <b:if cond='data:post.location'>
            <data:postLocationLabel/>
            <a expr:href='data:post.location.mapsUrl' target='_blank'>

<data:post.location.name/></a>
          </b:if>
        </b:if>
      </span>
      </div>

Một cửa sổ sẽ hiện ra như thế này khi nhấn vào biểu tượng:

Có một lỗi thấy rõ ở việc hiển thị tiếng Việt tiêu đề của bài đăng trong khung nhập nội dung chat. Không biết phiên bản hiện thời Yahoo! Messenger 9.0 có khắc phục được nhược điểm này?

Nguồn huongdancachtaoblog.blogspot.com



Read More

Cách chèn tiện ích chia sẻ Addthis social sharing toolbox vào blog, website

Nguồn nguoiaolam.net

Có nhiều bạn hỏi cách chèn tiện ích chia sẻ addthis social sharing toolbox sao giống như giao diện Metro Simple mà HHV đang dùng. Thực tế thì HHV đã cung cấp đoạn code đó ở đây tuy nhiên trong bài viết này HHV sẽ hướng dẫn các bạn tùy biến tiện ích này đầy đủ và linh động hơn

1. Về trang web Addthis.com

Cách đây ít lâu trang Addthis.com vừa mới thay đổi giao diện mới đồng thời cũng bắt đầu mở rộng các tiện ích ngoài social sharing toolbox được hướng dẫn trong bài viết này còn có follow widget và welcome bar.

Addthis là một dịch vụ rất nổi tiếng tự nhận là nền tảng chia sẻ lớn nhất thế giới. Addthis cung cấp một bộ công cụ chia sẻ (social sharing tools), follow widget và welcome. Addthis giúp các tăng lượng truy cập các trang web bằng sự kết nối thông qua các dịch vụ xã hội như Facebook, Twitter, Pinterest, Google+…. Đối với các thành viên đăng ký Addthis cung cấp công cụ để theo dõi và phân tích nhằm giúp định hướng nội dung và phương thức chia sẻ.

2. Hướng dẫn cách chèn code mặc định

Cách chèn code rất cơ bản bạn vào phần trang Social Sharing Toolbox chỉ cần 3 bước là có thể lấy được code chèn vào bất kỳ trang blog/website nào.
Bước 1: Chọn nền tảng: bạn sử dụng platform nào thì chọn platform ấy, addthis hỗ trợ Blogger, Wordpress, Tumblr, TypePad, Posterous, Joomla, Drupal, Magento…

Bước 2: Chọn style, bạn có thể chọn button (một nút nhấn) hoặc toolbox tập hợp nhiều nút nhấn của các dịch vụ. Đây sẽ là phần chúng ta tùy chỉnh và tạo nên bản sắc của riêng mình. Ở đây ta lấy ví dụ là sử dụng tools box

Bước 3: Copy đoạn code và chèn code vào bất cứ vị trí nào bạn thích trong blog/website. Thông thường đoạn code có dạng như sau.

Data hosted with ♥ by Pastebin.com - Download Raw - See Original

1. <!-- AddThis Button BEGIN -->
2. <div class="addthis_toolbox addthis_default_style ">
3. <a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>
4. <a class="addthis_button_tweet"></a>
5. <a class="addthis_button_google_plusone" g:plusone:size="medium"></a>
6. <a class="addthis_counter addthis_pill_style"></a>
7. </div>
8. <script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4fbe76dc0e946530"></script>
9. <!-- AddThis Button END –>

3. Tùy biến Addthis social sharing toolbox

Trong trường hợp bạn không muốn tùy chỉnh sâu hơn Addthis social sharing toolbox thì làm theo hướng dẫn dưới đây.

1. Tối ưu hóa tốc độ trang

Bạn chỉ cần đặt một đoạn code JS cho toàn bộ trang cho nên HHV đề nghị bạn nên cắt riêng đoạn code js bên dưới và chèn nó vào ngay bên trên thẻ </body>.

Data hosted with ♥ by Pastebin.com - Download Raw - See Original

1. <script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4fbe76dc0e946530"></script>

2. Tùy chỉnh hình ảnh riêng cho button

Phần code bên dưới ưng với mỗi dịch vụ mạng xã hội hoặc chia sẻ được hiển trị trong toolbox.

Data hosted with ♥ by Pastebin.com - Download Raw - See Original

1. <a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>

Trong đó

• addthis_button_facebook_like chỉ định dịch vụ chia sẻ
• fb:like:layout="button_count" chỉ định style của nút chia sẻ (có thể có hoặc không)

Để tìm hiểu thêm về code này bạn cần tìm hiểu API của Addthis.

http://support.addthis.com/customer/portal/articles/381263-addthis-client-api#.T758EdVo1p4

Nếu bạn muốn hiển thị những dịch vụ ưa thích của mình thì cần biết đoạn code chỉ định dịch vụ chia sẻ. Theo link sau để  tham khảo các dịch vụ mà Addthis hỗ trợ.

http://www.addthis.com/services/list#.T7586tVo1p4

Điều thú vị là Addthis hỗ trợ cả ZingMe với mã chỉ định là zingme. Trong toolbox đoạn code sẽ như sau.

Data hosted with ♥ by Pastebin.com - Download Raw - See Original

1. <a class="addthis_button_zingme"></a>

Tuy nhiên bạn còn muốn thay đổi ảnh mặc định của addthis thành một hình ảnh nào khác của riêng bạn. Cũng dễ thôi, đoạn code đó là

Data hosted with ♥ by Pastebin.com - Download Raw - See Original

1. <a class="addthis_button_zingme"><img alt='Share to ZingMe' border='0' src=”imglink”/></a>

Bạn thay imglink bằng đường link của bức ảnh.

Đối với một số dịch vụ mạng xã hội nổi tiếng như Facebook, Pinterest, Google+… Addthis có rất nhiều tùy chọn khác nhau. Đến link sau để tham khảo và chọn thứ bạn thích

http://support.addthis.com/customer/portal/articles/381237-third-party-buttons#.T75709Vo1p4

Kết luận
Addthis.com cung cấp dịch vụ rất hay. Ngoài Addthis social sharing toolbox nó còn cung cấp Follow widget và Welcome bar. Nếu bạn chịu khó đăng ký thành viên bạn có thể theo dõi các nội dung được chia sẻ và cách thức chia sẻ.
Cách thức chèn code đơn giản, tùy biến dễ dàng. Nó có cộng đồng người sử dụng lớn và quan trọng hơn là hỗ trợ rất nhiều dịch vụ.
Nếu có thắc mắc đừng ngần ngại để lại comments dưới bài viết này hoặc đến trang Support

http://blog.nguoiaolam.net/p/f.html

đặt câu hỏi. Chúc bạn thành công
Hồng Hòa Vi
Nguồn nguoiaolam.net

http://blog.nguoiaolam.net/

Read More

Bến Giang Đầu

Một mình lặng ngắm biển khơi
Thuyền neo bến nhớ một thời gọi tên
Thế mà cứ ngỡ miền quên
Dõi theo chấm nhỏ con thuyền tìm ai
Trời mây bóng nước gương soi
Sao con tim lại bồi hồi nhói đau:
Chia tay khuất bến giang  đầu
Cảnh xưa còn đó
                         người đâu
                                              nơi nào!

Thơ của Nguyen Kim

https://plus.google.com/u/0/109937215280585739154

Bạn có thể tham khảo các bài thơ trong Bầu rượu túi thơ do  Khanhnguyen' s blog sưu tập từ trên các diễn đàn mạng xã hội

Read More

Tạo trang báo lỗi 404 chuyển động với CSS3

Nguồn nguoiaolam.net

Một trong những tính năng mới cập nhật của Google là cho phép tùy biến trang báo lỗi 404. Lỗi 404 (404 error) là một trong các thông báo lỗi rất phổ biến, nhằm thông tin cho người dùng khi một địa chỉ web không được tìm thấy. Việc không tìm thấy thứ mình muốn là một điều bực mình, để tránh cho độc giả khó chịu khi nhận được một dòng thông báo 404 khô khan các  trang web thường tạo một trang báo lỗi tùy biến thật đẹp hoặc hài hước. Bài viết này Hồng Hòa Vi sẽ hướng dẫn tạo một trang thông báo lỗi đơn giản với hiệu ứng chuyển động hoàn toàn bằng CSS3.

Mời bạn xem demo trước khi bắt tay vào việc nhé

Cách làm

1. Nâng cấp lên giao diện kiểu mới, vào trang Settings/Search preferences rồi tìm Custom Page Not Found  nhấn Edit. Click để xem ảnh lớn nhé

2. Chép đoạn code dưới đây vào cửa sổ được hiện ra và nhấn Save là xong

<div class="box"><div class="cover_pan"></div></div>

<style type='text/css'>
.box{background:url(https://lh3.googleusercontent.com/--Spv9VuEKYE/T3WIVthTICI/

AAAAAAAAC3E/o1Ng-OEp5SA/s1600/rect2996.png) no-repeat 0 0;height:486px} .cover_pan{background:#fff url(https://lh4.googleusercontent.com/--KGP4XXtrTM/T3WIWNH6-bI/AAAAAAAAC3I/zaRC49pVYf8/s1600/image2993.png) repeat 1055px bottom;height:486px;margin-left:1px;overflow:hidden;position:relative;width:99.5%;z-index:-1;-moz-animation-name:pan;-moz-animation-duration:40s;-moz-animation-iteration-count:infinite;-moz-animation-timing-function:linear;-webkit-animation-name:pan;-webkit-animation-duration:40s;-webkit-animation-iteration-count:infinite;-webkit-animation-timing-function:linear} @-moz-keyframes pan{0%{background-position:1338px bottom} 100%{background-position:left bottom} } @-webkit-keyframes pan{0%{background-position:1338px bottom} 100%{background-position:left bottom} } </style>

Hướng dẫn tùy biến

Nếu không thích tùy biến thì như thế là đủ tuy nhiên nếu bạn là “vọc sĩ” và muốn chỉnh sửa gì đó thì làm theo các hướng dẫn bên dưới này. Ý tưởng ở đây là tạo 2 lớp ảnh, một lớp ảnh trên làm mặt nạ (class box) và lớp ảnh dưới làm nền chuyển động (class cover_pan).

1. Kích thước

Bạn hoàn toàn có thể tùy chỉnh kích thước của của class box và class cover_pan tùy theo kích thước ảnh và kích thước của blog bạn.

2. Ảnh

Trong đoạn code trên có 2 ảnh, một ảnh nền class box và một ảnh nền của class cover_pan. Hiện tại cả 2 ảnh này đều có kích thước 800px phù hợp với kích thước Blog Thiết Kế tuy nhiên bạn có thể đồng thời thay đổi cả 2 ảnh này.

Đối với ảnh class box yêu cầu phải là ảnh gif hoặc png có độ mờ cần thiết để làm lớp mặt nạ cover. Ảnh class cover_pan thì tùy ý bạn có thể chọn bất kỳ ảnh nào miễn sao kích thước phù hợp.

2. Tốc độ

Ở đây chúng ta cho ảnh nền chạy ngang liên tục với số vòng lặp vô tận. Tốc độ chuyển đông là 40s. Có rất nhiều thứ bạn có thể thay đổi, tuy nhiên tôi nhướng phần khám phá này cho các bạn. Hãy thử tìm hiểu một chút về CSS3 và nhờ bác Google chỉ đường nhé!

Chúc bạn thành công

Hồng Hòa Vi
Nguồn nguoiaolam.net

Read More

Nút bài viết ngẫu nhiên/Random Post cho Blogspot Blogger V1

Đầu tiên các bạn vào Blog Title → Layout → Add Widget → HTML/JavaScript.

 Và copy đoạn mã code sau đây vào và Save As hay Lưu lại!

Read More

Add Floating Share Buttons Like Mashable to Blogger

Instructions To Follow:

STEP #1

Log in to Blogger, go to Layout -> Edit HTML

and mark the tick box "Expand Widget Templates"

STEP #2

Now find (CTRL+F) this code in the template:

Read More

Biết

Bạn có thể tham khảo các bài thơ trong Bầu rượu túi thơ do  Khanhnguyen' s blog sưu tập từ trên các diễn đàn mạng xã hội

Read More

Thẻ b:include và b:includable trong Blogger XML

Trong Blogger XML một trong những thẻ được xuất hiện với tần xuất khá nhiều đặc biệt là trong widget Blog mặc định đó chính là b:include và b:includable. Chắc chắn rằng rất nhiều người không biết đây là thẻ gì và sử dụng chúng ra sao, và bài viết này mình sẽ chia sẻ với mọi người nó là gì và cách thức sử dụng chúng như thế nào.

Tìm hiểu b:include và b:includable

Thẻ b:include và b:includable là gì?

Khi mà bạn muốn sử dụng nhiều lần một đoạn mã (HTML hay JS) nhiều lần trong một widget bất kỳ, nhưng đoạn mã đó quá dài, hai thẻ này chính là giải pháp dành cho bạn.

Read More

Thẻ data xuất dữ liệu trong Blogger XML

Cũng giống như những nền tảng về blog khác, Blogger hỗ trợ cho chúng ta khả năng tùy chỉnh giao diện Blogger. Một trong những thứ không thể thiếu ở đây chắc chắn có dữ liệu mà người dùng nhập vào hoặc tùy ở trong mã nguồn này (tiêu đề bài viết, tiêu đề blog, tên widget, nội dung widget,...). Hôm nay mình xin được giới thiệu đến các bạn về cách lấy dữ liệu ra để sử dụng.

<data:tên_dữ_liệu>

Read More

Chèn video Youtube, Vimeo Responsive vào Blogger / Blogspot

Hiện nay thì như bạn biết thì chúng ta có hai dịch vụ lưu trữ và chia sẻ video khá phổ biến là Youtube và Video. Để chia sẻ video thì thông thường đối với hai dịch vụ lưu trữ này chúng ta thường tải video lên đó và dùng thẻ iframe để nhúng về blog của mình. Bình thường thì chuyện này khá là ok với những website có giao diện tĩnh, còn đối với những website có tính năng responsive (tự động co giãn theo màn hình) thì khi thu nhỏ màn hình lại thì video đó vẫn giữ nguyên kích thước chúng ta quy định trong mã nhúng.

Điều này làm xấu không ít thì nhiều đối với những thiết bị có màn hình nhỏ, vì video sẽ tràn ra hoặc bị ẩn khi ở ngoài hoặc trong khung bài viết. Hôm nay qua bài viết này mình sẽ hướng dẫn các bạn một thủ thuật nhỏ giúp cho các bạn làm cho toàn bộ các mã nhúng video sử dụng thẻ iframe responsive chứ không chỉ riêng là Youtube và Video.

Read More

Thêm nút "lên trên - xuống dưới" với hiệu ứng ẩn hiện chuyên nghiệp

Công dụng: Nút lên trên, xuống dưới giúp bạn đọc blog của bạn có thể di chuyển trên blog một cách nhanh nhất, cách làm cũng khá đưn giản. Bạn thực hiện theo các bước sau..
Cách làm như sau:
1. Vào Blogger Dasboard >> template>>Edit HTML

 

2. Nhấn tổ hợp Ctrl + F mỡ khung Search box, để tìm kiếm thẻ đóng ]]></b:skin>

 

 

3. Sau khi tìm được ]]></b:skin> ta chép dán Source Code dưới đây vào phía sau nó. Source Code mới sẽ có như mẫu dưới đây:

Read More

Cách tạo Slider Blogspot với nhiều ảnh



Cách tạo Slider ảnh cho Blogspot .Slide ảnh này có 1 cái hay ho là nó sẽ hiển thị 1 list 5 ảnh và khi bạn hơ chuột vào ảnh nó sẽ hiên ra với cỡ lớn hơn ở phía trên có kèm theo tiêu đề và mà tả sơ qua bài viết Sau đây Bít Tuốt Xin chia sẻ với các bạn cách tạo 1 Slider này cho blog của bạn

Xem Demo

Cách tạo Slider ảnh cho Blogspot - Website

Read More

Attractive jQuery Image Gallery For Blogger

1. Log in to blogger account and Click drop down.

2. Now select "Layout" Like Below.

3. Click Add Gadget and select 'HTML/Javascript

4. Paste below one of below code.

<style type="text/css">

.container1 {
 width: 660px;padding: 0;margin: 0 auto;
}
.folio_block {
 position: absolute;left: 50%; top: 50%;margin: -140px 0 0 -395px;}
.main_view {float: left;position: relative;}
/*--Window/Masking Styles--*/
.window {-moz-box-shadow: 0px 0px 5px #303030;
-webkit-box-shadow: 0px 0px 5px #303030;
box-shadow: 0px 0px 5px #303030;border:1px solid #000000;height:240px; width: 660px;
margin-top:15px;overflow: hidden; /*--Hides anything outside of the set width/height--*/
position: relative;
}
.image_reel {
 position: absolute;top: 0; left: 0;
}
.image_reel img {float: left;}
.paging_btrix {
 position: absolute;bottom: 10px; right: -7px;width: 178px; height:47px;z-index: 100; /*--Assures the paging stays on the top layer--*/text-align: center;
 line-height: 40px;
 background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRq7uL4O6bQYzKKmv13ztTnQLVBVfw7jcX_r0Qjvtg-IpXT2-lqEImu90eOhzE_-A2x8K59OWqJSOOXEj4tl_z5fqlCHSJColQqHfbHcSysie2zJaQ62km66_jqCxKIdxT9JnakjFSV3s/s1600/paging_btrix_bg2.png) no-repeat;
 display: none; 
}
.paging_btrix a {
 padding: 5px;text-decoration: none;color: #fff;
}
.paging_btrix a.active {
 font-weight: bold; background: #920000; border: 1px solid #610000;
 -moz-border-radius: 3px;
 -khtml-border-radius: 3px;
 -webkit-border-radius: 3px;
}
.paging_btrix a:hover {font-weight: bold;}
</style>
<!-- bof Automatic Image Slider w/ CSS & jQuery from Soh Tanaka -->
<div class="container1">
<div class="main_view">
    <div class="window">
        <div class="image_reel">
            <a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjR2unOzx_mFGLy7T7EpKt2jHxu0WKRYdyQ-beKffeJPeLWLsCzvP6PQpWG0puNM_suddVSGJ9vNEFanNth_bZRsQirWdaw360qR7JV_dgCjKN33fxWkcJutfmZadatVSALit6amijFxuA/s1600/bloggertrix_imge1.jpg" alt="" /></a>
            <a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiEzsJkLtDuU7MDG359xZqOnqth2berfLgAZ-BH0ZZezXpZWhVIVVCeE441ITvryfjACHDVoiBBQ9XHOa3vIUZT5bCZBSk-Jxa8p49TYXH1R65tE8rhepf6iQnW6ILoWg7vU-luxSVgHM/s1600/bloggertrix_imge3.jpg" alt="" /></a>
            <a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6-GLKnd_yX41LrAKFYh57cDFuhEtxl13BNXnRlWTYebbCt1XUADiNU1SPq3-PHtsOClhJM1uuyzw1pXKjfy_l1KLdW2hmxb8Eu0jlE7gAhhn1AtOfJEQWl6vJ76cc95sgRn1aPgIull0/s1600/bloggertrix_imge2.jpg" alt="" /></a>
            <a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgx255WaBM95rX68R5VodtCI71gsHK5uEkq_17SmpfstWWiTKZX6xc6hZqtlosp9LlnM0geX7Zfmd0tUwUi1x17NhsPGzxyZJRDNZP6y1dyZC5IcVr1PAw3XyTCO0HOMk88CYp7Dg1eaTw/s1600/bloggertrix_imge4.jpg" alt="" /></a>
        </div>
    </div>
    <div class="paging_btrix">
        <a href="#" rel="1">1</a>
        <a href="#" rel="2">2</a>
        <a href="#" rel="3">3</a>
        <a href="#" rel="4">4</a>
    </div>
</div>
</div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript">

$(document).ready(function() {

 //Set Default State of each portfolio piece
 $(".paging_btrix").show();
 $(".paging_btrix a:first").addClass("active");
  
 //Get size of images, how many there are, then determin the size of the image reel.
 var imageWidth = $(".window").width();
 var imageSum = $(".image_reel img").size();
 var imageReelWidth = imageWidth * imageSum;
 
 //Adjust the image reel to its new size
 $(".image_reel").css({'width' : imageReelWidth});
 
 //paging_btrix + Slider Function
 rotate = function(){ 
  var triggerID = $active.attr("rel") - 1; //Get number of times to slide
  var image_reelPosition = triggerID * imageWidth; //Determines the distance the image reel needs to slide

  $(".paging_btrix a").removeClass('active'); //Remove all active class
  $active.addClass('active'); //Add active class (the $active is declared in the rotateSwitch function)
  
  //Slider Animation
  $(".image_reel").animate({ 
   left: -image_reelPosition
  }, 500 );
  
 }; 
 
 //Rotation + Timing Event
 rotateSwitch = function(){  
  play = setInterval(function(){ //Set timer - this will repeat itself every 3 seconds
   $active = $('.paging_btrix a.active').next();
   if ( $active.length === 0) { //If paging_btrix reaches the end...
    $active = $('.paging_btrix a:first'); //go back to first
   }
   rotate(); //Trigger the paging_btrix and slider function
  }, 5000); //Timer speed in milliseconds (3 seconds)
 };
 
 rotateSwitch(); //Run function on launch
 
 //On Hover
 $(".image_reel a").hover(function() {
  clearInterval(play); //Stop the rotation
 }, function() {
  rotateSwitch(); //Resume rotation
 }); 
 
 //On Click
 $(".paging_btrix a").click(function() { 
  $active = $(this); //Activate the clicked paging_btrix
  //Reset Timer
  clearInterval(play); //Stop the rotation
  rotate(); //Trigger rotation immediately
  rotateSwitch(); // Resume rotation
  return false; //Prevent browser jump to link anchor
 }); 
 
});
</script>

You can change photos by changing Image URLs
If you want to add links to your image. # replace with your image links.
7. Now save your HTML/Javascript'.

Nguồn MyBlogger Tricks

Read More

Resize Blogger Thumnail

Resizing Blogger Thumbnails

Mã code như sau:

<!-- ######### Writing Callback Function ############# -->
<script type="text/javascript">
//----------------------------Defaults
var ListBlogLink = window.location.hostname;
var ListCount = 5;
var TitleCount = 70;
var ListLabel =" ";
var ChrCount = 80;
var ImageSize = 100;
//----------------------------Function Start
function mbtlist(json) {
document.write('<ul class="mbtlist">');
for (var i = 0; i < ListCount; i++)
{

Read More

Hướng dẫn cách trỏ tên miền Blogger – Blogspot (100% không bị chặn)

Có nhiều bạn hỏi liên lạc qua email hoặc bình luận hỏi thăm cách trỏ tên miền Blogger Blogspot làm sao để không bị chặn mặc dù HHV đã có bài hướng dẫn cách khắc Cách khắc phục lỗi trỏ tên miền Blogger. Hôm nay HHV sẽ hướng dẫn lại một lần nữa chi tiết cách làm từng bước cũng như chụp ảnh màn hình một số nhà cung cấp tên miền nổi tiếng hiện nay.

Bài viết này sẽ được cập nhật thường xuyên các dãy IP hữu hiệu nhất nên các bạn hãy bookmark lại bài viết này để đọc khi gặp sự cố. HHV sẽ cố gắng cập nhật mọi thông tin nhanh nhất.

Bước 1: Lấy code xác nhận

Đăng nhập vào Blogger với quyền quản trị vào Settings >> Basic. Tìm chỗ có dòng chữ Publishing click vòa dòng chữ Add a custom domain

Sau đó clikc "Switch to advanced settings."

Gõ tên miền riêng của bạn vào ô và nhấn nút Save lại. Bạn sẽ gặp một thông báo như sau

Do bạn chưa cài đặt tên miền nên việc bị lỗi là bình thường. Bạn chỉ cần ghi nhớ đoạn code được tô màu hồng. Đây là đoạn code được dùng ở bước hai trong việc xác nhận tên miền chính chủ

Bước 2: Cài đặt tên miền

Nếu có khả năng đọc hiểu tiếng Anh bạn có thể làm theo hướng dẫn Google ở đây. Tuy nhiên đối với tình hình bị chặn tứ bề như ở VN thì ta dùng cách khác.
Để cài đặt tên miền ta cần ít nhất 3 bản ghi: 1 bản ghi CNAME và 2 bản ghi A

• Bản ghi CNAME để xác nhận bạn là người chủ đích thực của tên miền
• 2 bản ghi A dùng để trỏ tên miền về host của Google.

1. CNAME record
Ở phần Name, Label hoặc Host thêm “wvwrwwznsj5c” và trỏ về “gv-vyfzhc2ukpp24sz4jdbvmli46w65hb3flbxqkjkqujjmuuca.domainverify.googlehosted.com” (phần Destination, Target hoặc Points To)

Name, Label, Host	Destination, Target hoặc Points To
wvwrwwznsj5c	gv- vyfzhc2ukpp24sz4jdbvmli46w65hb3flbxqkjkqujjmuuca.domain verify.googlehosted.com

Trong đó các đoạn code được tô vàng được lấy ở bước 1 và khác nhau hoàn toàn ở mỗi blog.
2, A record
Trong 2 bản ghi A một để trỏ tên miền gốc (naked domain – vd: nguoiaolam.net) về Google và 1 để trỏ tên miền bạn cần sử dụng (tên miền con – vd: www.nguoiaolam.net, blog.nguoiaolam.net, ebook.nguoiaolam.net …) về Google.
Lưu ý Blogger phân biệt rất rõ ràng miền nguoiaolam.net và tên miền www.nguoiaolam.com. Để
Vào phần quản trị DNS tên miền và tạo 2 bản ghi A như sau

www (hoặc blog…)	64.233.183.121
@	64.233.183.121

Bước 3: Cập nhật cài đặt trong blog bạn

Trước khi thực hiện bước này bạn cần phải đợi vài tiếng để hệ thống DNS cập nhật kịp thời. Thông thường bạn cần phải đợi từ 12 đến 24 giờ để hệ thống hoàn toàn cập nhật. Nếu quá gấp rút tiến hành bước này, nguy cơ lớn là blog bạn bị gián đoạn truy cập.
Sau khi đã trỏ tên miền riêng của bạn về hệ thống server của Google bước tiếp theo bạn cập nhật blog của mình để Google có thể hợp nhất tên miền riêng vào blog hiện tại.
Bạn đăng nhập vào lại Blogger và thực hiện tuần tự như ở Bước 1. Tuy nhiên lúc này do đã xác nhận tên miền lẫn trỏ tên miền về Host của Google nên bạn sẽ không gặp lỗi nữa. Vậy là xong Blogspot của bạn sẽ được chuyển ngay sang tên miền mới toàn bộ bài viết không bị mất đi, các đường link vẫn giữ nguyên và được Google tự động chuyển.
Tuy nhiên để hợp nhất tên miền gốc và tên miền con bạn sử dụng (vd: www hoặc blog…) bạn cần làm thêm một bước nữa. Trong phần Settings > Basic >Publishing bạn nhấn Edit  và đánh dấu check vào dòng chữ Redirect …. to …. Save lại là được

Chúc các bạn thành công!
Hồng Hòa Vi.

---

Cập nhật ngày 11/01/2013

74.125.31.121

---

Mình sẽ cập nhật hình ảnh chụp các màn hình set up của từng dịch vụ đặt dưới này. Các bạn tham khảo sẽ thấy rõ ràng hơn rất nhiều

Read More

HTTPS chính thức hỗ trợ Blogger / Blogspot

Vào ngày 30 tháng 9 vừa qua thì Blogspot đã thông báo chính thức hỗ trợ HTTPS cho nền tảng này. Nhưng tiếc một cái là hiện tại nó không hỗ trợ đối với những blog sử dụng tiên miền tùy chỉnh.

Lợi ích của sử dụng HTTPS với  Blogger / Blogspot

 HTTPS là một giao thức giúp bảo mật cho người dùng sử dụng những website có hỗ trợ nó: nó giúp ngăn chặn những người xấu theo dõi hoặc đánh cắp thông tin của chủ blog cũng như khách truy cập, nó cũng giúp kiểm tra xem bạn đã vào một website thực sự án toàn chưa và đảm bảo rằng bạn không bị chuyển hướng đến những website độc hại.

Hướng dẫn thêm HTTPS vào Blogger / Blogspot

Như đã đề cập thì nó đã hỗ trợ từ ngày 30/09/2015 rồi, nên đơn giản bạn chỉ cần đăng nhập vào https://www.blogger.com, chọn blog mà bạn muốn kích hoạt  HTTPS, chuyển đến mục Cài đặt, và chuyển từ "Không" sang "Có" tại phần Cài đặt HTTPS. Và cũng như đề cập thì nó chưa có hỗ trợ cho những blog đang xài domain nhé.

Sau hi bật xong blog sẽ tự động chuyển giao thức từ HTTP thành HTTPS. Lưu ý là nếu bạn kích hoạt tính năng này thì có thể một số Blogger Template sẽ rất có khả năng bị mất một vài tính năng được nhúng bên ngoài như Javascript, jQuery,.. vì không thể hoạt động được với HTTPS. Để sử nó làm sao thì bạn phải tự chỉnh sửa lại hoặc đợi tác giả template cập nhật lại cho phù hợp.

Chúc bạn thành công! Đừng quên để lại ý kiến của bạn tại đây để chúng ta cùng thảo luận nhé.

Nguồn Lâm Kiều - KslZone.NET

Read More

Thay thế Blogger OpenID mặc định

Trước đây Blogger có hỗ trợ cung cấp OpenID cho toàn thể mọi người sử dụng mã nguồn này. Nhưng đột nhiên không biết bao giờ thì OpenID không còn sử dụng được nữa dẫn đến nhiều bức xúc cho người dùng toàn thế giới. Có khá nhiều câu hỏi chuyện gì đã xảy ra trên Google Forum nhưng chẳng có lời hồi đáp nào.

Hướng dẫn thay thế Blogger OpenID bị lỗi

Cũng tương tự như Feedburner đột nhiên vào năm ngoái nếu mình nhớ không lầm, chức năng tự động đăng bài lên Twitter cũng đột nhiên bị lỗi mà không có bất kì câu trả lời nào. Như vậy để tìm ra hướng giải quyết cho OpenID đã hưu hỏng ở Blogger, mình đã tìm kiếm ra được một dịch vụ tương đối ổn đó chính là StackExchange OPENID.

OpenID là gì?

Nói nôm na một cách đơn giản thì OpenID chính là một dịch vụ cho phép người dùng có thể truy cập vào một trang web bất kì có hỗ trợ đăng nhập bằng OpenID, và đơn giản bạn chỉ cần điền tên miền mà dịch vụ OpenID cấp cho bạn. Đối với mã nguồn Blogger thì địa chỉ OpenID chính là địa chỉ domain của chính nó.

Ưu điểm của việc sử dụng OpenID đối với Blogger

Bạn có thể dễ dàng đăng nhập vào những website có hỗ trợ OpenID, cũng như bạn có thể lấy được backlink tại hầu hết tất cả website sử dụng Blogger bằng cách nhận xét một cách đơn giản.

Sử dụng StackExchange OPENID như thế nào?

Bắt đầu vào trọng tâm của bài viết thôi, cách thức làm cực kì đơn giản, bạn chỉ cần đăng kí, chèn code và sử dụng. Để tiến hành đăng ký, bạn truy cập vào địa chỉ sau đây

https://openid.stackexchange.com/account/register

bây giờ bạn điền những thông tin cần thiết vào, lưu ý là phần tên cũng chính là tên hiển thị khi bạn nhận xét ở website khác (bạn có thể đổi thoải mái sau khi đăng ký xong nên yên tâm).

Đăng ký tài khoảng StackExchange OpenID

tiếp tục bấm Send Confirmation Email và trang web chuyển sang trang thông báo kích hoạt tài khoản.

Thông báo vào email để kích hoạt toàn khoản

như vậy bạn chỉ cần vào email kích hoạt là xong.

Sau khi kích hoạt thành công bạn đăng nhập vào trang web, giao diện trang rất đơn giản, bạn tìm đến chữ Use your own URL to log in và click vào nó. Ở đây nó sẽ hiện lên 2 đoạn mã



Đoạn mã sử dụng dịch vụ OpenID

bạn sao chép chúng và chèn nó vào sau thẻ <head> của template trên Blogger của bạn là được. Lưu ý là Blogger bắt buộc phải có thẻ đóng, do do các bạn thêm dấu "/" vào trước ">" nhé.

Hướng dẫn nhận xét bằng OpenID

Ok đây là thành quả của chúng ta, bạn truy cập vào một trang có hỗ trợ dịch vụ OpenID, mình ví dụ ở một website sử dụng mã nguồn Blogger bất kì như blog mình chẳng hạn. Tại khung nhập liệu của nhận xét phần Nhận xét với tên: bạn chọn vào OpenID sau đó gõ địa chỉ OpenID của bạn vào, cũng chính là địa chỉ blog của bạn.

Nhập địa chỉ OpenID để nhận xét

sau khi nhập xong bấm tiếp tục, và bạn có thể nhận xét như bình thường.

Xác nhận cung cấp thông tin cho Blogger

Khi bấm xuất bản sẽ chuyển sang trang StackExchange bạn chỉ cần bấm vào Confirm là được. Đối với mỗi website hỗ trợ thì chỉ cần xác nhận 1 lần duy nhất.

Lời kết

Sau khi hoàn tất thì bạn đã thành công việc sử dụng dịch vụ này để nhận xét ở rất nhiều những website có hỗ trợ. Nhược điểm nhuy nhất là bạn không thể chỉnh sửa và thay thế ảnh đại diện mặc định mà thôi. Như vậy với thủ thuật nhỏ này mong rằng các bạn có thể lấy được thêm nhiều backlink cho website của mình cũng như nhận xét một cách dễ dàng trên nhiều website khác mà không cần đăng ký. Thủ thuật này có hữu ích cho bạn không, để lại ý kiến cho mình phía dưới nhé!

Nguồn Lâm Kiều - KslZone.NET

Read More

Tự động bôi đen khung chứa code bằng nhấp đúp chuột

Xin cáo lỗi cùng các bạn, Admin đang trong quá trình tu chỉnh bài viết

Sorry,You are trying to reach an invalid page...!

Click here to go to Homepage 

Have a nice Day...

Read More

Tiện ích nhận xét mới nhất cho Blogger

Trong đi đảo qua các bài viết cũ để bổ sung chất lượng cũng đi như tối ưu hóa lại liên kết nội thì mình nhận thấy một thứ. Blog của mình chia sẻ khá nhiều những tiện ích (widget) cho Blogger nhưng lại thiếu một tiện ích cũng khá nhiều người đã chia sẻ rồi, đó là "nhận xét mới nhất". Thế nên mình nghĩ chắc làm luôn một vài bài viết về tiện ích này luôn cho đủ bộ.

Thế nên bài viết này mình xin chia sẻ đến các bạn tiện ích "nhận xét mới nhất" để thêm vào Blogger của mọi người, có thể là blog của bạn có rồi, hoặc biết rồi cũng như là chưa biết nhưng vẫn mong các bạn quan tâm.

Lợi ích từ tiện ích nhận xét mới nhất là gì?

Lợi ích bạn có thể thấy tại tiện ích này khá tương tự như những tiện ích khác ví dụ như "bài đăng mới nhất". Nó cung cấp cho người dùng những thông tin từ những bài viết đang được những người khác quan tâm, từ đó lôi kéo được họ xem những bài viết đó nhớ sức ảnh hướng của cộng đồng. Từ việc người dùng xem được nhiều trang hơn thì cũng sẽ giảm tỉ lệ bounce rate (tỉ lệ thoát) và sẽ được Google đánh giá cao hơn trong việc blog của bạn cung cấp nhiều thông tin hữu ích hơn đến với người dùng.

Hướng dẫn thêm tiện ích nhận xét mới nhất vào Blogger

Để thêm tiện ích này vào Blogger / Blogspot thì vô cùng đơn giản, thông thường thì người ta thường chèn nó vào các vị trí như bên phần sidebar hoặc footer (chân trang). Mà để chèn vào Blogger thì rất đơn giản, bạn vào "Bố cục" thêm một tiện ích "HTML/Javascript" mới và sao chép dán đoạn mã này vào phần nội dung của tiện ích đó.

<style type=text/css>
ul.nxmoi {
padding: 0;
list-style: none;
}
ul.nxmoi li {
margin-bottom: 10px;
border-bottom: 1px dashed #d2d2d2;
padding-bottom: 10px;
}
</style>
<script>//<![CDATA[
var sl_nhanxet = 7,
    kt_nhanxet = 100;

// Recent Comment
function nhanxetmoi(json) {
    var entry, commurl, commsum;
    document.write('<ul class="nxmoi">');
    for (var i = 0; i < sl_nhanxet; i++) {
        entry = json.feed.entry[i];
        if (i == json.feed.entry.length) break;
        for (var k = 0; k < entry.link.length; k++) {
            if (entry.link[k].rel == 'alternate') {
                commurl = entry.link[k].href;
                break;
            }
        }
        commsum = ("content" in entry) ? entry.content.$t : ("summary" in entry) ? entry.summary.$t : "";
        commsum = commsum.replace(/<.*?>/g, "");
        if (commsum.length > kt_nhanxet) commsum = commsum.substring(0, kt_nhanxet) + "...";
        document.write('<li><strong><a rel="nofollow" href="' + commurl + '">' + entry.author[0].name.$t + ':</a></strong> <span>' + commsum + '</span></li>');
    }
    document.write('</ul>');
}
//]]></script>
 <script src='http://www.kslzone.net/feeds/comments/summary?alt=json-in-script&amp;callback=nhanxetmoi'></script>
</style>

ở đoạn mã trên có ở thứ bạn có thể thay đổi được là

• sl_nhanxet là số lượng nhận xét mới nhất sẽ lấy ra
• kt_nhanxet là số lượng ký tự lấy ra tự nội dung của nhận xét đó

ngoài ra thì bạn có thể căn chỉnh css sao cho đẹp hơn cái mặc định mà mình đã làm.

Kết bài

Tiện ích nhận xét mới nhất này thì tính năng hơi bèo một tý, là không có avatar, không có tên bài đăng, không có thời gian gì hơn. Chủ yếu chỉ có tên và nội dung của người bình luận mới nhất thôi, nhưng cũng khá là tiện script nhỏ và chạy lẹ. Các bài viết sắp tới mình sẽ chia sẻ thêm từng đoạn script có nhiều tính năng hơn mời các bạn chú ý đón xem.

Nguồn kslzone.net

Ghi chú:

Phần Code gần cuối, chổ:

<script src='http://www.kslzone.net/feeds/comments/summary?alt=json-in-script&amp;callback=nhanxetmoi'></script> </style>

Bạn thay địa chỉ http://www.kslzone.net/ bằng chính địa chỉ của bạn

Read More