Showing posts with label tao-blogspot-ban-hang. Show all posts
Showing posts with label tao-blogspot-ban-hang. Show all posts

Thursday, August 3, 2017

Hướng dẫn tạo Push Notification (thông báo đẩy) cho Blogspot

Hướng dẫn tạo Push Notification (thông báo đẩy) cho Blogspot

Giúp khách hàng biết được trang Blogspot của mình có bài viết mới



Push Notification (thông báo đẩy) là gì?

  • Push Notification là một dạng thông báo cho khách hàng biết rằng trang Blogspot của bạn vừa có bài đăng mới. Dạng thông báo đẩy cho Blogspot bằng PushCrew này hoạt động tốt trên các trình duyệt phổ biến hiện nay như: Chrome, FireFox, Coccoc ...v..v.... nên khách hàng sẽ luôn nhận được thông báo của bạn.

Ích lợi của việc dùng Push Notification (thông báo đẩy) cho trang Blogspot?

  • Push Notification hiện nay rất phổ biến và được nhiều trang web lớn thường dùng nó cho việc kinh doanh của mình (kể cả Facebook). Khi bạn sử dụng Push Notification cho trang Blogspot của bạn, đọc giả vào và đăng ký nhận thông báo thì họ ko cần phải check mail như cách dùng tiện ích "Theo dõi qua Email" sẵn có của Blogspot, mà thông báo sẽ được hiển thị ngay trên trình duyệt của họ. Đặc biệt nếu bạn tạo trang Blogspot bán hàng thì thông báo đẩy này rất có lợi cho việc kinh doanh,bán hàng của bạn. Khi bạn đăng 1 bài viết về sản phẩm mới, thông báo sẽ được hiển thị ngay trên trình duyệt của khách hàng giúp khách hàng nhận biết thông tin cập nhật và khiến cho khách hàng trở lại trang Blog bán hàng của mình sớm nhất, thu hút nhiều lượt xem bài viết hơn, dẫn đến doanh số bán hàng tăng lên

Hướng dẫn cách tạo Push Notification (Thông báo đẩy) cho Blogspot


Cách 1:
  • Bước 1: Truy cập vào website: https://pushcrew.com --> Signup for FREE
  • Bước 2: Điền đầy đủ thông tin của bạn vào --> chọn Creat Account
  • Bước 3: trong mục Setting --> chọn phần Code and Implementation --> bạn copy đoạn code trong phần SMART CODE
  • Bước 4: vào phần Quản trị Blog --> Chủ đề --> Chỉnh sửa HTML
  • Bước 5: trong phần Code, bấm Ctr+F để tìm thẻ đóng  </head>
  • Bước 6: paste đoạn code vào trước thẻ đóng </head>
  • Bước 7: Lưu mẫu và kiểm tra kết quả ^^
Cách 2: (đơn giản hơn và Sơn Nguyễn đang sử dụng)
  • Bước 1-2-3: làm tương tự như trên
  • Bước 4: vào phần Quản trị Blog --> Thêm tiện ích --> HTML/Javascript
  • Bước 5: paste đoạn code vào phần nội dung (phần Tiêu đề để trống)
  • Bước 6: Lưu và kiểm tra kết quả ^^


Cài đặt Push Notification (Thông báo đẩy)


Truy cập vào website: https://pushcrew.com -->  Đăng nhập vào

Trong phần Setting của PushCrew --> bạn vào phần Customize for Desktop
  • Display push notifications permission box after seconds on your website: số phút Push Notification (Thông báo đẩy) sẽ xuất hiện khi khách hàng truy cập vào trang Blogspot của bạn
  • Upload Logo: bạn có thể upload logo của bạn lên tại đây
  • Customize opt-in box for your website:
  • Title: Tiêu đề dòng thông báo (có thể thay đổi theo ý muốn của bạn)
  • Subtitle: Mô tả phần thông báo (có thể thay đổi theo ý muốn của bạn)
  • Allow Button Text: Tên nút Allow (có thể thay đổi theo ý muốn của bạn)
  • Disallow Button Text: Tên nút Disallow (có thể thay đổi theo ý muốn của bạn)
Ps: Phía trên sẽ có phần xem trước để bạn tiện thay đổi các thông số

Bấm Save để hoàn tất ^^

Để xem thêm các thủ thuật Blogger khác, bạn bấm vào "Blogger" trên thanh menu nhé!

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

Để tìm các bài viết trên Google nhanh nhất, hãy tìm theo cú pháp: "từ khóa tìm kiếm + nguyentruongson.info"

<<< Bài trước
Bài 43: Thiết kế website Bất động sản miễn phí bằng Blogspot (cơ bản)
Bài 44: Thiết kế website Bất động sản chuyên nghiệp bằng Blogspot (nâng cao)
Bài sau >>>

Tuesday, July 25, 2017

Thiết kế website Bất động sản chuyên nghiệp bằng Blogspot (nâng cao)

Thiết kế website Bất động sản chuyên nghiệp bằng Blogspot

Mẫu Blogger Templates có Slide hình ảnh rất sinh động và hoàn toàn miễn phí




Tiếp nối chuỗi Serie tạo blog Bất động sản miễn phí bằng Blogspot, hôm nay Sơn Nguyễn tiếp tục làm video hướng dẫn các bạn cách thiết kế website Bất động sản bằng Blogspot nâng cao. Thực hành xong bài này các bạn sẽ thấy rất khác so với bài trước vì bài trước chỉ là tạo Blogspot cơ bản rồi cài đặt, chỉnh sửa, thiết kế để nhìn bắt mắt hơn, nhưng làm xong bài này thì các bạn còn tạo Blogspot chuyên nghiệp hơn ^^



  • Link download Blogger Templates trong video tại đây
  • Nhớ SUBSCRIBE (đăng ký) kênh để nhận được video mới nhất: https://goo.gl/5QxXSf
Mọi thắc mắc, góp ý các bạn cứ comment bên dưới nhé

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

P/s: Nếu bạn thấy bài này hay, hữu ích thì hãy share cho bạn bè và đồng nghiệp của mình nữa nhé

Monday, July 24, 2017

Thiết kế website Bất động sản miễn phí bằng Blogspot (cơ bản)

Thiết kế website Bất động sản miễn phí bằng Blogspot

Giúp các bạn môi giới mới vào nghề có 1 website chuyên nghiệp để nâng cao hiệu quả kinh doanh



Trong công việc hiện nay, việc sở hữu ít nhất 1 website bán hàng ko còn là 1 điều xa xỉ với những người làm trong lĩnh vực kinh doanh bán hàng. Chính vì điều đó đã có rất nhiều công ty, tổ chức hay cá nhân đang làm dịch vụ thiết kế website bán hàng nhằm phục vụ nhu cầu ngày càng tăng của rất nhiều thượng đế này. Chi phí thiết kế website cũng khá đa dạng, với nhiều mức giá tùy vào độ chuyên nghiệp và độ bảo mật của website

Trong lĩnh vực Bất động sản, nhiều môi giới chuyên nghiệp hiễn nhiên họ đều có 1 trang web riêng để giới thiệu các dự án Bất động sản họ đang bán và nâng cao thương hiệu cá nhân của họ. Tuy nhiên, với các bạn trẻ mới vào nghề thì việc bỏ ra chi phí lớn để thiết kế website riêng cho mình là 1 vấn đề khá lớn. Và điều này đã hạn chế rất lớn vào kết quả kinh doanh của  họ. Chính vì vậy, hôm nay Sơn Nguyễn sẽ giúp các bạn khắc phục điều này bằng cách hướng dẫn các bạn thiết kế website Bất động sản miễn phí bằng Blogspot, trông chuyên nghiệp ko khác gì các trang web trả phí là bao nhiêu cả :D

Ngoài ra, các bạn hãy xem thêm Serie hướng dẫn blogspot ở thanh sidebar bên phải để nâng cao "tay nghề" và hoàn thiện trang web của mình ngày càng chuyên nghiệp hơn nhé

Video hướng dẫn Thiết kế website Bất động sản miễn phí bằng Blogspot (chi tiết)


Link lấy đoạn code trong video 

Mọi thắc mắc, góp ý các bạn vui lòng để lại ở phần comment phía dưới nhé

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

P/s: Nếu bạn thấy bài này hữu ích thì hãy bấm nút G+ và nút Share bên dưới cho bạn bè, đồng nghiệp của mình cùng biết nữa nhé ^^

Để tìm các bài viết trên Google nhanh nhất, hãy tìm theo cú pháp: "từ khóa tìm kiếm + nguyentruongson.info"

<<< Bài trước
Bài 41: Hướng dẫn chống Copy bài viết trên Blogspot đơn giản hiệu quả nhất
Bài 42: Hướng dẫn tạo Menu ngang và Menu dọc cho Blogspot
Bài sau >>>

Friday, April 21, 2017

Hướng dẫn tạo Bài viết liên quan cho Blogspot theo Nhãn (Label) bài viết

Hướng dẫn tạo Bài viết liên quan cho blogspot theo Nhãn (Label) bài viết

Đọc giả sẽ dễ dàng theo dõi tiếp các bài viết liên quan có cùng nhãn (label) của bài viết hiện tại


Bài viết liên quan hiển thị theo Nhãn (Label) của bài viết Blogspot

Hôm nay Sơn Nguyễn tiếp tục với Series Hướng dẫn tạo Bài viết liên quan (Related Post) cho Blogspot. Và bài hướng dẫn hôm nay sẽ là tạo Related Post theo Nhãn (Label) bài viết Blogspot

Các bước tạo Related Post theo Nhãn (Label) bài viết Blogspot:

Bước 1: Đăng nhập vào Blogspot cần tạo Related Post --> Chủ đề (trước kia là Mẫu) --> Chỉnh sửa HTML




Bước 2: đặt con trở soạn thảo trong ô code, bấm Ctrl + F để tìm dòng <div class='post-footer'>

Bước 3: Copy đoạn code bên dưới và dán (paste) vào sau dòng <div class='post-footer'> (phía dưới dòng)

<!-- related post --><b:if cond='data:blog.pageType == &quot;item&quot;'><div class='widget-content'><h2>Các bài liên quan</h2><div id='saliproit183'/><br/><br/>&lt;script type=&quot;text/javascript&quot;&gt;homeUrl3 = &quot;nguyentruongson.info&quot;;maxNumberOfPostsPerLabel = 6;maxNumberOfLabels = 6;function listEntries10(json) {var ul = document.createElement(&#39;ul&#39;);var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?json.feed.entry.length : maxNumberOfPostsPerLabel;for (var i = 0; i &lt; maxPosts; i++) {var entry = json.feed.entry[i];var alturl;for (var k = 0; k &lt; entry.link.length; k++) {if (entry.link[k].rel == &#39;alternate&#39;) {alturl = entry.link[k].href;break;}}var li = document.createElement(&#39;li&#39;);var a = document.createElement(&#39;a&#39;);a.href = alturl;var txt = document.createTextNode(entry.title.$t);a.appendChild(txt);li.appendChild(a);ul.appendChild(li);}for (var l = 0; l &lt; json.feed.link.length; l++) {if (json.feed.link[l].rel == &#39;alternate&#39;) {var raw = json.feed.link[l].href;var label = raw.substr(homeUrl3.length+21);label = decodeURIComponent(label);var txt = document.createTextNode(label);var h = document.createElement(&#39;h4&#39;);h.appendChild(txt);var div1 = document.createElement(&#39;div&#39;);div1.appendChild(h);div1.appendChild(ul);document.getElementById(&#39;saliproit183&#39;).appendChild(div1);}}}function search10(query, label) {var script = document.createElement(&#39;script&#39;);script.setAttribute(&#39;src&#39;, &#39;http://&#39; + query + &#39;/feeds/posts/default/-/&#39;+ label +&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);document.documentElement.firstChild.appendChild(script);}var labelArray = new Array();var numLabel = 0;<b:loop values='data:posts' var='post'><b:loop values='data:post.labels' var='label'>textLabel = &quot;<data:label.name/>&quot;;var test = 0;for (var i = 0; i &lt; labelArray.length; i++)if (labelArray[i] == textLabel) test = 1;if (test == 0) {labelArray.push(textLabel);var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?labelArray.length : maxNumberOfLabels;if (numLabel &lt; maxLabels) {search10(homeUrl3, textLabel);numLabel++;}}</b:loop></b:loop>&lt;/script&gt;</div></b:if><br/><!-- /related post -->



Bước 4: Bấm Lưu mẫu và kiểm tra kết quả ^^

Chú ý:

- Thay nguyentruongson.info bằng địa chỉ Blogspot của bạn.  Lưu ý địa chỉ Blogspot của bạn ko có "http://" ở đầu và "/" ở cuối nhé (ví dụ link blogspot là: http://affiliatemarketingchitiet.blogspot.com/ thì bạn chỉ lấy affiliatemarketingchitiet.blogspot.com thôi)

- Thông số maxNumberOfPostsPerLabel: số bài viết tối đa được hiển thị của Nhãn (Label) ở mục Bài viết liên quan

- Thông số maxNumberOfLabels: Số Nhãn (Label) tối đã được hiển thị trong mục Related Post (bài viết liên quan)

- Nếu kết quả ko thấy gì thì các bạn xóa đoạn code vừa paste đi và tìm 1 trong 3 dòng dưới đây:
  1. <div class='post-footer-line post-footer-line-1'>
  2. <div class='post-footer-line post-footer-line-2'>
  3. <div class='post-footer-line post-footer-line-3'>
Sau đó dán (paste) lần lượt đoạn code vào sau dòng vừa tìm được (paste vào phía dưới dòng vừa tìm được). Nếu kiểm tra kết quả ok rồi thì thôi, còn ko thì làm lại với dòng khác (nhớ phải xóa đoạn code vừa paste đi nhé, rồi mới tìm dòng khác để paste lại đoạn code vào)

Trang blogspot làm demo cũng phải paste đoạn code vào sau dòng thứ 3 mới có kết quả ^^


Chúc các bạn thành công!
Nhớ bấm  g+ ủng hộ nhé ^^
*Đoạn code được sưu tầm trên mạng

Để tìm các bài viết trên Google nhanh nhất, hãy tìm theo cú pháp: "từ khóa tìm kiếm + nguyentruongson.info"

<<< Bài trước
Bài 37: DreamHost giảm giá Hosting 40% + Free Domain
Bài 39: Hướng dẫn tạo Bài viết liên quan (Related Post) cho Blogspot
Bài sau >>>

Wednesday, April 19, 2017

Hướng dẫn tạo Bài viết liên quan (Related Post) cho Blogspot

Hướng dẫn tạo Bài viết liên quan (Related Post) cho Blogspot

Giúp đọc giả thuận tiện theo dõi và xem thêm được nhiều bài viết khác của bạn có liên quan đến chủ đề của bải viết hiện tại của bạn



Có nhiều mẫu Template Blogger có tích hợp sẵn phần Related Post, và có 1 số mẫu thì ko. Hôm nay Sơn Nguyễn sẽ hướng dẫn các bạn cách tạo Bài viết liên quan cho Blogspot của bạn (hay còn gọi là tạo Related Post cho Blogspot)


Tạo Bài viết liên quan (Related Post) hiển thị Bài mới nhất (Recent Post)

Bước 1: Đăng nhập vào Blogspot cần tạo Related Post --> Chủ đề (trước kia là Mẫu) --> Chỉnh sửa HTML



Bước 2: đặt con trở soạn thảo trong ô code, bấm Ctrl + F để tìm thẻ đóng </head>

Bước 3: Copy đoạn code 1 bên dưới và dán (paste) vào trước thẻ </head> (phía trên thẻ)

<b:if cond='data:blog.pageType == &quot;item&quot;'><script type="text/javascript">//<![CDATA[var titles=new Array();var titlesNum=0;var urls=new Array();var time=new Array();function related_results_labels(c){for(var b=0;b<c.feed.entry.length;b++){var d=c.feed.entry[b];titles[titlesNum]=d.title.$t;for(var a=0;a<d.link.length;a++){if(d.link[a].rel=="alternate"){urls[titlesNum]=d.link[a].href;time[titlesNum]=d.published.$t;titlesNum++;break}}}}function removeRelatedDuplicates(){var b=new Array(0);var c=new Array(0);e=new Array(0);for(var a=0;a<urls.length;a++){if(!contains(b,urls[a])){b.length+=1;b[b.length-1]=urls[a];c.length+=1;c[c.length-1]=titles[a];e.length+=1;e[e.length-1]=time[a]}}titles=c;urls=b;time=e}function contains(b,d){for(var c=0;c<b.length;c++){if(b[c]==d){return true}}return false}function printRelatedLabels(a){var y=a.indexOf('?m=0');if(y!=-1){a=a.replace(/\?m=0/g,'')}for(var b=0;b<urls.length;b++){if(urls[b]==a){urls.splice(b,1);titles.splice(b,1);time.splice(b,1)}}var c=Math.floor((titles.length-1)*Math.random());var b=0;document.write("<ul>");if(titles.length==0){document.write("<li>Không có bài viết liên quan</li>")}else{while(b<titles.length&&b<20&&b<maxresults){if(y!=-1){urls[c]=urls[c]+'?m=0'}document.write('<li><a href="'+urls[c]+'" title="'+time[c].substring(8,10)+"/"+time[c].substring(5,7)+"/"+time[c].substring(0,4)+'">'+titles[c]+"</a></li>");if(c<titles.length-1){c++}else{c=0}b++}}document.write("</ul>");urls.splice(0,urls.length);titles.splice(0,titles.length)};//]]></script></b:if>

Paste đoạn code vào trên thẻ đóng </head>

Bước 4: Tiếp tục bấm Ctrl + F để tìm dòng <div class='post-footer'>

Bước 5: Copy đoạn code 2 bên dưới và dán (paste) vào sau dòng <div class='post-footer'> (phía dưới dòng)

<b:if cond='data:blog.pageType == &quot;item&quot;'><div id='related-posts'><b>Bài viết liên quan:</b><b:loop values='data:post.labels' var='label'><script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&quot;' type='text/javascript'/></b:loop><script type='text/javascript'>var maxresults=5;removeRelatedDuplicates();printRelatedLabels('<data:post.url/>');</script></div></b:if>

Paste đoạn code phía dưới dòng <div class='post-footer'>

Bước 6: Lưu mẫu và kiểm tra kết quả ^^

Chú ý:

- Thông số var maxresults = 5; Số bài viết hiển thị ở mục Bài viết liên quan (Related Post) bên dưới bài đăng của Blogspot

- Nếu kết quả ko thấy gì thì các bạn xóa đoạn code 2 vừa paste đi và tìm 1 trong 3 dòng dưới đây (bấm Ctrl + F để tìm)
  1. <div class='post-footer-line post-footer-line-1'>
  2. <div class='post-footer-line post-footer-line-2'>
  3. <div class='post-footer-line post-footer-line-3'>
Sau đó dán (paste) lần lượt đoạn code 2 vào sau dòng vừa tìm được (paste vào phía dưới dòng vừa tìm được). Nếu kiểm tra kết quả ok rồi thì thôi, còn ko thì làm lại với dòng khác (nhớ phải xóa đoạn code 2 vừa paste đi nhé, rồi mới tìm dòng khác để paste lại đoạn code 2 vào)

Trang Blogspot làm demo phải paste vào dòng thứ 3 mới ra kết quả đấy ^^


Chúc các bạn thành công!
Nhớ bấm g+ chia sẽ nhé ^^
*Các đoạn code được sưu tầm trên mạng

Để tìm các bài viết trên Google nhanh nhất, hãy tìm theo cú pháp: "từ khóa tìm kiếm + nguyentruongson.info"

<<< Bài trước
Bài 36: 10 lý do bạn nên chọn Hosting trên DreamHost
Bài 37: DreamHost giảm giá Hosting 40% + Free Domain
Bài sau >>>

Sunday, August 14, 2016

Hướng dẫn thêm Reactions (phản ứng) vào bài viết Blogspot

Hôm nay Sơn Nguyễn sẽ hướng dẫn bạn cách thêm Reactions (phản ứng) vào bài viết Blogspot.

Thực ra chức năng này đã có sẵn trong Blogger rồi, chúng ta chỉ cần "bật" nó lên thôi



Khi đọc giả vào xem Blogspot của bạn, ở phía dưới cùng của bài viết, ngoài việc chia sẻ kết nối với các trang Mạng xã hội như Facebook, Twitter, G+ ... và để lại Comment thì đọc giả còn có thể để lại những phản ứng (cảm xúc) của họ khi xem bài viết của bạn. Những Reactions (phản ứng) này do bạn tự "thiết kế" ra theo ý thích của bạn nhằm tạo sự thích thú và vui nhộn kích thích đọc giả tham gia. Vì vậy bài viết của bạn nên có chức năng Reactions (phản ứng) để đọc giả tham gia bình chọn đánh giá cho bài viết của bạn

Việc thêm Reactions (phản ứng) vào bài viết Blogspot cũng cực kỳ đơn giản. Chỉ cần vào trang Blogspot của bạn và bật nó lên thôi ^^

Video hướng dẫn thêm Reactions (phản ứng) vào bài viết Blogspot


  • Các bạn hãy bấm ĐĂNG KÝ (Subscribe) Kênh để ủng hộ và nhận được video mới nhất nhé
  • Link: https://youtu.be/KYTzmKIqVMc
Hướng dẫn thêm Reactions (phản ứng) vào bài viết Blogspot

Truy cập vào Blogger --> Đăng nhập

Trong phần quản trị --> Bố cục --> Blog Posts (Bài đăng trên Blog) --> Chỉnh sửa

Tick vào ô Phản ứng để bật chức năng này

Tiến hành chỉnh sửa, thay đổi cho Reactions (phản ứng) phù hợp với mong muốn của bạn

Bấm Lưu để hoàn tất

Check kết quả nào ^^

Để xem thêm các thủ thuật Blogger bạn bấm vào "Blogger" trên thanh menu nhé!

Để tìm các bài viết trên Google nhanh nhất, hãy tìm theo cú pháp: "từ khóa tìm kiếm + nguyentruongson.info"

<<< Bài trước
Bài 25: Hướng dẫn tạo bộ nút Social Network cho Blogspot
Bài 26: Hướng dẫn tạo hiển thị Tổng số bài viết và Comment trên Blogspot
Bài sau >>>

Tuesday, August 2, 2016

Hướng dẫn tạo hiển thị Tổng số bài viết và Comment trên Blogspot

Hôm nay Nguyễn Trường Sơn sẽ hướng dẫn tạo hiển thị Tổng số bài viết và Comment trên Blogspot.

Điều này sẽ giúp đọc giả có cái nhìn tổng quan hơn về trang Blogspot của các bạn



Video hướng dẫn tạo hiển thị Tổng số bài viết và Comment trên Blogspot 


  • Các bạn hãy bấm ĐĂNG KÝ (Subscribe) Kênh để ủng hộ và nhận được video mới nhất nhé
  • Link: https://youtu.be/7eRIXxgckrU
Hướng dẫn tạo hiển thị Tổng số bài viết và Comment trên Blogspot

Đầu tiên các bạn đăng nhập vào Blogger

Trong phần quản trị ---> Bố cục

Ở phía thanh bên bên phải (Sidebar-right) --> Thêm tiện ích --> HTML/JavaScript

  1. Nhập tiêu đề
  2. Dán đoạn code bên dưới vào phần nội dung
<script style="text/javascript">
function showpostcount(json) {
document.write('<left>Tổng Số bài Viết: <b>' + parseInt(json.feed.openSearch$totalResults.$t,10)
+ '</b></center>');}</script>
<script src="
http://www.nguyentruongson.info/feeds/posts/default?alt=json-in-script&callback=showpostcount"></script>
<p>
<script style="text/javascript"></script>
<script style="text/javascript">
function numberOfComments(json) {
document.write('<left>Tổng Số Comment: <b>' + json.feed.openSearch$totalResults.$t +
'</b></center>');}</script>
<script src="
http://www.nguyentruongson.info/feeds/comments/default?alt=json-in-script&callback=numberOfComments"></script>
  • Thay dòng màu vàng theo ý thích của các bạn nhé
  • Thay dòng màu xanh bằng trang Blogspot của các bạn

Bấm Lưu để hoàn tất

Kéo sắp xếp Widget theo vị trí mong muốn

Bấm Lưu sắp xếp để hoàn tất

Bấm Xem blog để xem kết quả ^^

Để xem thêm các thủ thuật Blogger bạn bấm vào "Blogger" trên thanh menu nhé!
P/s: đoạn code được sưu tầm trên mạng,

Monday, August 1, 2016

Hướng dẫn tạo bộ nút Social Network cho Blogspot

Hôm nay Sơn Nguyễn sẽ chia sẽ với các bạn cách tạo bộ nút Social Network cho Blogspot

Bộ Social Network này gồm 3 nút: Facebook, G+ và Twitter là 3 Mạng xã hội khá phổ biến hiện nay



Bộ Socila Network này được thiết kế theo dạng Floating gồm 1 hàng dọc nằm 1 bên của trang Blogspot/website của bạn, đã được Fix đứng im và trượt theo trang web khi bạn kéo xuống ko gây nhức mắt cho đọc giả của bạn

Socila Network Floating


Video hướng dẫn tạo bộ nút Social Network cho Blogspot

Video đã bị xóa theo kênh cũ. Vào kênh mới trong phần contact

Cách tạo bộ nút chia sẽ liên kết các mạng xã hội Social Network cho Blogspot như sau:

Truy cập vào Blogger --> Đăng nhập bằng tài khoản Gmail của bạn

Trong phần quản trị Blogspot --> Bố cục --> Chọn bất kỳ mục nào và +Thêm tiện ích --> Chọn HTML/JavaScript

Phần tiêu đề: các bạn để trống

Phần nội dung: các bạn dán đoạn code này vào

<style type="text/css">
#Share {position:fixed; top:35%; left:0%; background-color:#2AA4CF;padding:2px;z-index:10;border-bottom-right-radius:5px;border-top-right-radius:5px;}
#Share .Sharebutton {float:left;clear:both;}
</style>
<div id='Share'>
<div style="margin:4px;">
<div class='Sharebutton' id='facebook'>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'></script>
<fb:like layout='box_count' show_faces='false'></fb:like>
</div>
<br />
<div class='Sharebutton' id='google'>
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
<g:plusone size="tall"></g:plusone>
</div>
<div class='Sharebutton' id='twitter'>
<a class="twitter-share-button" href="https://twitter.com/share" data-count="vertical"> Tweet </a>
<script type="text/javascript" async src="//platform.twitter.com/widgets.js"></script>
</div>
</div>
</div>

Bấm Lưu để hoàn tất

Các bạn tự chiêm ngưỡng thành quả của mình nhé ^^

Để xem thêm các thủ thuật Blogger bạn bấm vào "Blogger" trên thanh menu nhé!
P/s: đoạn code được sưu tầm trên mạng,