Mặc dù butthons Facebook Like, Twitter Tweet và Google+1. Các nút chia sẻ này có thể được dễ dàng thêm vào bài viết Blogger bằng cách làm theo hướng dẫn của mình, sắp xếp chúng một cách hoàn hảosao cho hợp với bố cục của mỗi blog.
Để không mất công ngồi giải thích cách sắp xép các nút like hiện tại của bạn, namkna nghĩ rằng nó dễ dàng hơn thông qua việc cung cấp cho các bạn một Code sẵn có để các bạn sử dụng. Đơn giản chỉ cần loại bỏ các nút like hiện tại của bạn và thêm mã mới.
Bạn có thể xem hình sau để thấy rõ hơn: ☼ Cách Thêm nút Google+1, Tweet, Like Facebook, Pin It buttons theo chiều ngang vào Blogspot:
1- Đăng nhập vào Blogspot
2- Chọn Mẫu (Template)
3- Chọn Chỉnh sửa HTML (Edit HTML)
4- Tìm đoạn Code sau.
<data:post.body/>
- Lưu ý: Tùy người thiết kế mà một blog có từ 1 đến 3 đoạn như trên bạn phải chèn đúng vị trí nó mới hiển thị nha.
5- Thêm vào trước nó đoạn code bên dưới:
<!-- Scripts Start --> <b:if cond='data:post.isFirstPost'> <!-- Facebook --> <div id='fb-root'/> <script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) {return;} js = d.createElement(s); js.id = id; js.src = "http://connect.facebook.net/en_US/all.js#xfbml=1"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk')); </script> <!-- Google +1 --> <script type='text/javascript'> (function() { var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = 'https://apis.google.com/js/plusone.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); })(); </script> <!-- Twitter --> <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script> </b:if> <!-- Scripts End --> <!-- Horizontal social buttons Start --> <div class='horizontal-social-buttons' style='padding:10px 0 10px;'> <!-- Twitter --> <div style='float:left;'> <a class='twitter-share-button' data-count='horizontal' data-lang='en' data-related='' data-via='' expr:data-text='data:post.title' expr:data-url='data:post.url' href='https://twitter.com/share'>Tweet</a> </div> <!-- Google +1 --> <div style='float:left;'> <g:plusone annotation='bubble' expr:href='data:post.url' size='medium'/> </div> <!-- Facebook Like+Send --> <div style='float:left;'> <fb:like colorscheme='light' expr:href='data:post.url' font='' layout='button_count' send='true' show_faces='false'/> </div> <!-- Pinterest Start --> <b:if cond='data:blog.pageType == "item"'> <div id='pin-wrapper' style='display: inline;'> <a class='pin-it-button' count-layout='horizontal' expr:href='"http://pinterest.com/pin/create/button/?url=" + data:post.url'>Pin It</a> <a href='javascript:void(run_pinmarklet())' style='margin-left:-93px; width:43px; height:20px; display:inline-block;'/> </div> <script src='http://assets.pinterest.com/js/pinit.js' type='text/javascript'></script> <script type='text/javascript'> function run_pinmarklet() { var e=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); } </script> </b:if> <!-- Pinterest End --> </div> <div style='clear: both;'/> <!-- Horizontal social buttons End -->
6- Lưu mẫu lại và kiếm tra kết quả nha.
Chúc thành công!
Nhận xét
" <data:post.body/> " bạn xem giùm mình zới, mình dùng temp của Duy Phạm, trong đó thấy nhìu đoạn code như zậy wa, mình hok áp dụng nó đc. Bạn có thể thay thế bô Sharing của mình giùm được hok, mình ko biết mò ra sao.
Trả lờiXóa@Elvis Anh
Trả lờiXóaĐoạn thứ 4 đó bạn.
Chính xác đó bạn. Hãy bấm Ctrl + F để tìm. Và thay vào đoạn cuối cùng là ok.
Trả lờiXóaBlog của cậu hay quá. Liên kết với Blog của mình nhé!
Trả lờiXóaẢnh bìa Facebook
TRỜI ƠI LÀM MÃI KHÔNG ĐƯỢC............... TOÀN THÔNG BÁO LỖI...CÓ MẤY ĐOẠN VÌ ĐOẠN NÀY BỊ THAY = ĐOẠN LÀM READMORE THEO THUTHUATBLOG..
Trả lờiXóa@Admin Bỏ đoạn code này này bạn.:
Trả lờiXóa</div>
<div style='clear: both;'/>
<!-- Horizontal social buttons End -->
Lỗi khi phân tích cú pháp XML, dòng 2164, cột 3: The element type "div" must be terminated by the matching end-tag "".
Trả lờiXóaLỗi khi phân tích cú pháp XML, dòng 2164, cột 3: The element type "div" must be terminated by the matching end-tag "".
Trả lờiXóaanh cho em cái yh đc ko :(. chả tìm thấy code đó đâu cả :(
Trả lờiXóayh của em, bom_nhox93
Trả lờiXóa@BỜM THẰNG Yahoo của anh là langtuluongsonbac_tq nhưng anh có mấy khi vào đâu. Em chọn mở rộng tiện ích mẫu chưa em. đoạn code <data:post.body/> blog nào cũng có vì đây là code bài đăng mà.
Trả lờiXóaEm có thẻ tìm đoạn code tương tự bên dưới:
<data:post.body
Khi mình thêm cái này vào thì hay bị tình trạng:
Trả lờiXóaNếu mình bấm vào nút LIKE thì nó hiện ra chữ "xác nhận". Muốn vậy phải bấm vào chữ "xác nhận" thì số lượt LIKE mới tăng lên là +1 nữa!
Nam cho mình hỏi: Làm sao để khỏi hiện chữ "xác nhận" mà lượt LIKE vẫn được?!
Blog của mình đây. Mời bạn bỏ chút thời gian xem thử nha:
Cỏ Lấm Bụi Đường
Cảm ơn bạn nhiều!
Vào phàn cài đặt và bấm cho phép liên kết ngược nha,
XóaTứ là phần: "Hiển thị liên kết ngược?" nằm trong mục "Cài đặt" của Blog của mình hả Nam?
Trả lờiXóaỞ đó có 2 lựa chọn: Ẩn và Hiển thị
Mình đã chọn "hiển thị" và lưu rồi nhưng khi muốn LIKE bài đăng nào thì nó vẫn bị xuất hiện từ "xác nhận". Vẫn như cũ Nam ơi!
Với một số blog khi áp dụng bị lỗi xác nhận này, đây là lỗi từ nhà cung cấp add this. Mình sẽ cập nhật và thông báo kết quả sớm cho bạn.
XóaĐã tìm ra được nguyên nhân và cách khắc phục chưa Nam?
Trả lờiXóaOke đã tìm ra rồi mà quyên không nhắc bạn. bạn thay chỉnh sửa HTMNL và:
XóaTìm thẻ:
<html
- Thay thế nó thành:
<html xmlns:fb='http://ogp.me/ns/fb#'
- Đoạn code trên sẽ giúp cho các phiên bản cũ của blogger cũng tương thích với plusin này và giúp plusin chạy tốt trên cả Internet explorer.Đồng thời nâng cao hiệu xuất của plusin.
- Lưu lại và xem kết quả nha.
Dùng cách của Nam ko được vào adthis lấy code chèn vào chỗ khác lại đc.Nhưng bây gjờ muốn bỏ xác nhận đi làm như bạn nói vẫn ko được?
XóaPhần xác nhậ của face là do chính sách mới của Face với nhưng trang mới tạo thường nó bắt xác nhận để chóng SPAM like. Sau một thời gian có lượng người nhất địn bấm xác nhận nó sẽ tự mất không hiện ô đó nữa.
XóaNanm ơi?mình thêm vào được mấy nút kia rôi?nhưng khi Share bài lên facebook thì ảnh đại diện của bài đăng lại không hiện thì đúng mà lại hiển thị biểu tượng của Blog?
XóaNam tìm được cái này chưa hộ mình với?Mình loay hoay mãi mà vẫn chưa tìm ra nguyên nhân.Nếu chia sẻ lên face mà hình đại diện không đúng thì không thu hút được người vào xem.Thanks bạn.
XóaPs .Mình thấy trên fanpage của Nam các bài viết Nam chia sẻ đều hiện đúng hình bài đăng mà.
Có 2 Nguyên nhân chính:
Xóa1- Chưa có thẻ khai báo META. Bạn có thể thêm đoạn bên dưới vào sau thẻ </head>
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<meta expr:content='data:blog.url' property='og:url'/>
<meta content='article' property='og:type'/>
2. Bạn không tải hình ảnh đó trực tiếp lên blogger.
Làm sao để thanh này xuất hiện trên đầu mỗi bài viết vậy bạn?
Trả lờiXóaDán code trước dòng: <data:post.body/>
XóaĐoạn code mình như thế này:
Trả lờiXóa<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr' xmlns:fb='https://www.facebook.com/2008/fbml'>
Cứ thay vào là bị báo lỗi, không được Nam ơi!
Bạn có thể sửa thành 1 trong 2 dạng bên dưới:
Xóa<html xmlns:fb='http://ogp.me/ns/fb#' expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr' xmlns:fb='https://www.facebook.com/2008/fbml'>
hoặc
<html xmlns:fb='http://ogp.me/ns/fb#' expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
Không được Nam ơi. Thử hết tất cả cá kiểu mà vẫn không được! Chán ghê!
Trả lờiXóaRất cảm ơn bạn đã nhiệt tình hướng dẫn!
Một lưu ý nữa bạn đã cài feedburner cho blog chưa. nếu chưa hãy cài nha.
Xóa- Và nếu vẫn không dduwwocj bạn có thể share quyền vào tavannam01@gmail.con mình sẽ giúp.
Nhận xét này đã bị tác giả xóa.
Trả lờiXóanó hiện cả ở trang chủ, làm thế nào chỉ hiện ở trang bài viết vậy admin?
Trả lờiXóadãy nút này hiện cả ở trang chủ, chèn vào đâu để chỉ hiện ở cuối bài viết thôi
Trả lờiXóaEm chèn vào sau một trong các đoạn dưới đây:
XóaThẻ 1:
<div class='post-footer'>
Thẻ 2:
<div class='post-footer-line post-footer-line-1'>
Thẻ 3:
<div class='post-footer-line post-footer-line-2'>
Thẻ 4:
<div class='post-footer-line post-footer-line-3'>
Hãy thêm code của nó vào giữa cặp thẻ sau trước khi chèn nha:
Xóa<b:if cond='data:blog.pageType == "item"'>
</b:if>
sau khi them code thì các nút đó sẽ hiển thị ở chỗ nào của blog hả add.
Trả lờiXóahttp://facebookvideojacker-review.blogspot.com/
Dưới tiêu fđề bài viết nha bạn,
Xóabác namka cho e hỏi. e muốn đặt mấy cái nút trên vào trang chủ chứ không phải vào từng bài đăng cụ thể thì làm ntn vậy
Trả lờiXóaThay đoạn:
Xóa<b:if cond='data:blog.pageType == "item"'>
thành:
<b:if cond='data:blog.url == data:blog.homepageUrl'>
thank bạn nhiều thừ vài lần cuối cùng cũng đc
Trả lờiXóagiúp mình với .Mình đã chèn được vào site nhưng khi bấm like rất khó..Bấm like sau đó di chuột để post facebook là nó lại nhảy...bạn thử vào test giúp mình ...demo: http://blogh3b.blogspot.com/2013/08/anh-girl-xinh-de-thuong-moi-cap-nhat.html
Trả lờiXóa''You Might Also Like''
Trả lờiXóaBạn ơi cho mình hỏi cách tạo cái hộp như của bạn với .
Ở phía dưới bên tay phải góc màn hình ý . Cám ơn bạn nhìu .
bạn xem BÀI NÀY nhé!
XóaĐúng vậy. Đấy là thủ thuật facebook recommendations Cảm ơn truong linh đã trả lời hộ anh.
XóaCảm ơn Namkna!
Trả lờiXóaMình đã áp dụng và thực hiện thành công!
Mẫu của mình có 3 đoạn code , sau một hồi mình đã dán đoạn code trên sau đoạn thứ 2 và thành công, có thay đổi một chút vì chỉ giữ lại like facebook thôi và mình đưa nút like này xuống cuối mỗi bài đăng.
Có một vấn đề mình muốn nhờ Namkna là khi nhấn like, nó hiện ra một bảng để có thể add commnet và post facebook, nhưng bảng này không hiện ra hết được, do đó mình không click và post facebook được, làm thế nào để khắc phục được vấn đề này vậy bạn Namkna?
Bảng này bị ẩn do thuộc tính overflow:hidden nằm trong các thuộc tính của mỗi class và ị phần mai bạn xóa nó đi là oke.
XóaCảm ơn Nam Ta, mình đã làm được rồi!
XóaKhông có gì đâu bạn ak. :)
XóaOài, namkna là người Tuyên Quang ak, add nick facebook mình nhé: https://www.facebook.com/hung.saukiu.9
Trả lờiXóaUk bạn cũng là người TQ hả thế thì là người đồng hương cùng quê rồi :)
XóaOh đọc face anh namkna suốt mà đến đấy mới biết là đồng hương Tuyên Quang @@
XóaUK anh sinh ra và lớn lên ở Hàm Yên - Tuyên Quang mà. Em ở khu vực nào của Tuyên Quang thế?. Khi nào có dịp anh em đi làm cốc trà đá nói chuyện chơi nhỉ :)
XóaNam ơi?chỉ hộ mình cái.Mình loay hay mãi mà vẫn chưa được.http://www.caunang.org/
Trả lờiXóabạn hãy gửi mẫu cùng tem vào tavannam01@gmail.com mình thêm cho nha.
XóaNhận xét này đã bị tác giả xóa.
Trả lờiXóaMình làm như vậy được rồi nhưng mỗi khi ấn like facebook nó cứ bắt xác nhận mãi , bạn có cách nào khắc phục không chỉ giúp mình với
Trả lờiXóaĐây không phải là lỗi bạn ak.
XóaHình thức này được face đưa ra để áp dụng với một số trang có lượng like tăng đột biến hoặc những trang mới tạo chưa có nhiều đánh giá và truy cập từ người dung (chưa có xếp hạng cụ thể). Họ bắt xác nhận để chứng tỏ trang của bạn không sử dụng robot hay tools để tăng like bất hợp phap.
Bạn yên tâm khi có một lượng người nhất định bấm vào xác nhận để like và chia sẻ thì phần xác nhận đó sẽ tự động biến mât. Tức là nó chỉ áp dụng với trang của bạn trong một thời gian nhất định thôi. Hiện tại chưa thể can thiệp để bỏ nó đi, vấn đề ở đây là chờ đợi vào thời gian và cùng chờ mọi người xác nhận. bạn có thể nhờ bạn bè like và xác nhận để rút ngắn quá trình này.
nó rất tốt.. cảm ơn
Trả lờiXóathanks nhiều
Trả lờiXóa