7/8/16

[Mời dùng thử] Chatbot maxo cho facebook messenger

Mới đây, Facebook đã chính thức tích hợp "bot" vào ứng dụng Messenger ,để cung cấp cho người dùng nhiều tính năng hơn, đặc biệt là hỗ trợ mua sắm, đặt vé máy bay, đặt phòng khách sạn hay tóm tắt các tin tức quan trọng.

Sau mấy ngày mày mò, Maxo cũng đã làm được một con bot đơn giản cho facebook của blog :https://www.facebook.com/maxo.panotour/ , mời các bạn dùng thử nha.
Trong bài viết tiếp theo mình sẽ hướng dẫn các bạn tạo 1 con bot tương tự.

MỜI CÁC BẠN DÙNG THỬ MAXO CHATBOT


Hiện con bot đã được facebook xét duyệt nên các bạn có thể thử bằng cách nhấn vào đường dẫn sau:
hoặc

Vài ứng dụng của bot maxo


- Tự động trả lời các câu hỏi đơn giản, mình chỉ soạn sẵn vài mẫu hỏi đáp đơn giản, các bạn cứ test thoải mái , sẽ cập nhật thêm vào, nếu cùi quá sẽ tích hợp con simsimi.
- Thông báo giờ giấc : khi trong câu hỏi có: "mấy giờ" , "time"
- Xem ảnh demo ảnh 360 : hỏi "demo" hoặc "@demo"
- Xem bài viết mới nhất trên blog: hỏi "blog" hoặc "@blog"
- Thông báo thời tiết hiện tại ở tỉnh/ tp việt nam: hỏi "tên tỉnh /tp" vd: "hồ chí minh" hoặc "ho chi minh"
- Xem ảnh gif : gõ "gif" hoặc "@gif"

6/11/16

[Hướng dẫn] Cách tạo & đăng ảnh 360 độ lên facebook

Mới đây ngày 9/10 Mark Zuckerberg chính thức giới thiệu tính năng đăng ảnh 360 lên facebook, ứng dụng khá thú vị để giới thiệu nhà hàng , khách sạn, resort , bất động sản ... hay đơn giản là chia sẻ các cảnh đẹp khi đi du lịch, phượt.


Trong bài viết này Maxo sẽ hướng dẫn chi tiết cách thực hiện nha.

Cách chụp ảnh xoay 360 độ:

Các bạn tùy ý sử dụng 1 trong 4 cách dưới đây tùy theo nhu cầu nha.

1. Dùng ứng dụng chụp ảnh Panorama trên Smartphone:

Đây là cách đơn giản nhất để tạo ảnh Panorama, tuy không thấy được toàn cảnh 360 độ , nhưng đây là cách làm nhanh nhất để tạo ra ảnh 360. Khá đơn giản nên mình không đi vào chi tiết nha.

2. Sử dụng App Google Street View:


Các bạn có thể tại ứng dụng này theo link sau: Ios  / Android 
App này rất dễ sử dụng, sau khi chụp xong sẽ cho lựa chọn đăng lên Google Street View và gửi 1 ảnh vào thư viện ảnh trên điện thoại. Điểm hạn chế là chất lượng ảnh phụ thuộc vào điện thoại sử dụng và phải được chụp đúng kỹ thuật.

3. Sử dụng camera chuyên chụp 360:

Hiện Facebook 360 đang hỗ trợ tốt cho các thiết bị như Ricoh Theta S , 360 Cam , Allie Home , Gear 360360fly 4KSphericam 2KODAK PIXPRO SP360 4K. Ưu điểm là cho ảnh chụp 360 độ rất nhanh, chất lượng cao hơn 2 phương pháp ở trên. Còn mặt hạn chế là chi phí đầu tư cao.

4. Dùng máy ảnh DSLR + lens Fisheye / App ghép ảnh 360

Phương pháp này khá phức tạp, đòi hỏi kỹ thuật chụp và xử lý ảnh sau khi chụp, dành cho các dự án chuyên nghiệp, đòi hỏi ảnh phải có chất lượng cao. Không chỉ up lên facebook, còn có thể tích hợp lên website với nhiều tính năng như bản đồ, lồng nhạc , hiệu ứng , hotspot ...

Các bạn quan tâm có thể tham khảo dịch vụ này tại đây: www.maxo.vn

Cách đăng ảnh 360 lên facebook:

Sau khi hoàn thành, ảnh 360 độ của bạn sẽ tương tự như ví dụ này:
Ảnh full 360 độ sẽ có tỉ lệ 2:1 (dàix2 : rộngx1)

Vào facebook , kéo thả hoặc chọn ảnh rồi đăng lên , facebook sẽ tự động nhận dạng ảnh 360. Done! Rất đơn giản phải không nào, chúc các bạn thành công.

* Lưu ý: Để xem được trên điện thoại, máy tính bảng cần cập nhật facebook phiên bản mới nhất!
Trong bài tiếp theo mình sẽ Hướng dẫn cách nhúng ảnh 360 độ vào website, các bạn nhớ theo dõi nha.

6/4/16

[Hướng dẫn] Thêm box gửi tin nhắn facebook trên website

Bài viết sẽ hướng dẫn cách tạo box tư vấn khách hàng bằng cách tích hợp facebook messenger vào website, đặc biệt hữu ích cho các website bán hàng hay tư vấn dịch vụ.

Tin nhắn của khách sẽ được gửi trực tiếp đến inbox fb của bạn mà không phải truy cập vào trang thứ 3 như zopim hay subiz trước kia.

Dưới đây mình sẽ hướng dẫn các bạn tạo 1 box tư vấn như thế , xem demo: vay tiêu dùng Fecredit

HƯỚNG DẪN TẠO BOX TƯ VẤN FACEBOOK MESSENGER

Như các bạn đã xem ở trang demo http://vaytieudung.maxo.vn/ , Maxo đã thêm một chút hiệu ứng và css cho đẹp hơn. Chatbox sẽ trượt lên xuống ở góc phải, có nút ẩn hiện để tránh làm phiền và chiếm diện tích, hiệu ứng text chạy tùy chỉnh và logo nhỏ.

Box tư vấn ẩn hiện & hiệu ứng chữ chạy.

Đầu tiên là code css cho box, các bạn có thể tùy chỉnh lại theo ý mình:

CSS box tư vấn facebook

<style>
#maxo_container {background-color: #fd0b1d;-moz-user-select: none;-khtml-user-drag: element;cursor: move;cursor: -moz-grab;cursor: -webkit-grab;overflow: hidden;transition-property: height;transition-duration: 0.4s;-webkit-transition: height 0.4s ease-in-out;transition: height 0.4s;z-index: 9990;position: fixed;bottom: 0;right: 5px;-webkit-box-shadow: rgba(50, 50, 50, 0.17);-moz-box-shadow: rgba(50, 50, 50, 0.17);box-shadow: rgba(50, 50, 50, 0.17);-webkit-border-radius: 5px 5px 0 0;-moz-border-radius: 5px 5px 0 0;border-radius: 0 0 0 0; padding: 1px;}#maxo_iframe_container {width:300px;border-radius: 3px;overflow: hidden;line-height: normal;}#maxo_minimize{width: 89%;padding: 7px 0px 0 0px;background: none;float:left; border-radius: 3px;}.status-icon{display: block;line-height: normal;}.status-icon a{ text-decoration:none;margin-right:10px;color: #ffffff;font-size: 13px;}#maxo_logo{float:left;margin: 5px 0 0 0px;width: 30px; text-align: center}
.float-ck { position: fixed; bottom: 0px; z-index: 9000}
* html .float-ck {position:absolute;bottom:auto;top:expression(eval (document.documentElement.scrollTop+document.docum entElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0))) ;}
#float_content_right {border: 1px solid #dddfe2;}
#hide_float_right {text-align:right; font-size: 14px;}
#hide_float_right a {background: #fd0b1d; padding: 2px 4px; color: #FFF;font-size: 14px;}
.fb-page {
    height: 300px;
    width: 300px;
}
</style>
Tiếp theo là đoạn js để đóng/mở chatbox

Javascript box tư vấn facebook

<script type="text/javascript">
function hide_float_right() {
    var content = document.getElementById('float_content_right');
    var hide = document.getElementById('hide_float_right');
    if (content.style.display == "none")
    {content.style.display = "block"; hide.innerHTML = '<a href="javascript:hide_float_right()">[X]</a>'; }
        else { content.style.display = "none"; hide.innerHTML = '<div id="maxo_container"><div id="maxo_iframe_container"><div id="maxo_logo"><a href="http://blog.maxo.vn/"><img src="https://3.bp.blogspot.com/-8i-WFZLewUU/V1aXkyDUDhI/AAAAAAAADsw/b__TLNnfu-A43b09M5FpFg4ZYZSknYLtQCLcB/s1600/logo_qc.png"></a></div><div id="maxo_minimize" onclick="return td_inst.showWidget()"> <div style="display: block;" class="status-icon"><marquee onmouseover="this.stop();" onmouseout="this.start();" scrollamount="4"><a href="javascript:hide_float_right()">BẠN MUỐN LIÊN HỆ VỚI MAXO ?</a><a href="javascript:hide_float_right()">Nhấn vào đây để gửi tin nhắn, chúng tôi sẽ trả lời bạn trong vòng 24h.</a></marquee></div></div></div>';}}
(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 = "//connect.facebook.net/vi_VN/sdk.js#xfbml=1&version=v2.5";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
Cuối cùng là đoạn HTML , các bạn nhớ thay đổi link facebook nha!

HTML box tư vấn facebook

<div class="float-ck" style="right: 0px" >
<div id="hide_float_right">
<a href="javascript:hide_float_right()">[X]</a></div>
<div id="float_content_right">
<div id="fb-root"></div>
<div class="fb-page" data-tabs="messages"
data-href="https://www.facebook.com/maxo.panotour/" data-width="300" data-height="300"
data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true" data-show-posts="false"></div>
Chỉ đơn giản vậy thôi, chúc các bạn thành công và chia sẻ bài này nếu thấy hay nha.

4/22/16

[Hướng dẫn] Tạo hotspot wifi marketing với modem wifi thường

Hiện có rất nhiều công ty cung cấp dịch vụ wifi marketing, bên cạnh các thiết bị tích hợp sâu tính năng hotspot...nhưng nếu bạn đang tìm kiếm một giải pháp Miễn phí và tận dụng ngay modem của mình thì có thể tham khảo bài viết này.

ỨNG DỤNG CỦA WIFI MARKETING

- Tăng nhận diện thương hiệu, quảng cáo hình ảnh, tin khuyến mãi...qua trang chào Splashpage
- Tạo quảng cáo để mời người dùng ghé thăm website, xem video, tải ứng dụng của bạn

- Thu thập thông tin khách hàng: email, điện thoại...
- Social marketing: Share, like...facebook , google ,twitter...
- Hoặc tiến hành 1 cuộc khảo sát khách hàng.

HƯỚNG DẪN TẠO HOTSPOT WIFI VỚI MODEM WIFI THƯỜNG

Trong bài viết này sẽ hướng dẫn các bạn tạo 1 hệ thống wifi marketing với Modem wifi thông thường (ở đây mình dùng modem Buffalo - WZR G300), firmware modem DD- WRT , NoCashSplash.

1. Cài đặt firmware DD-WRT cho modem Các bạn tham khảo bài viết sau nha: https://goo.gl/X05HkE (mình tìm thấy trên mạng , không phải mình viết)

2. Cấu hình NoCatSplashSau khi cài firmware DD-WRT thành công, các bạn đăng nhập vào và truy cập đến đường dẫn Services / Hotspot như trong ảnh


Kéo xuống NoCatSplash, Enable và cấu hình theo các thông số sau:

Trong đó:
Gateway IP Addr: Địa chị IP của modem
Gateway Name: tên của cổng đặt tùy ý
Interface: chọn Lan (thiết bị nào cũng đòi hỏi phải đăng nhập)
Home Page: Trang chủ , chuyển hướng sau khi đăng nhập.
Allowed Web Hosts: vd nếu địa chỉ trang chào là http://abc.com/splashpage.html thì phải điền vào Allowed Web Hosts là abc.com (bao gồm host ảnh, css, js...)
Document Root: Nhập /jffs/nocat
Splash URL: địa chỉ trang chào
Exclude Ports: Mặc định, NoCatSplash sẽ ngăn chặn cổng 25, cổng SMTP để không cho phép khách truy cập gửi spam. Bạn có thể liệt ra các cổng khác – phân biệt bằng dấu cách – chẳng hạn như cổng 21 và 23 để khóa FTP và telnet.
Mac White List: để cho phép các máy khách không dây truy cập mạng mà không cần redirect đến trang “landing” của bạn. Phân biệt các địa chỉ MAC bằng dấu cách.
Login Timeout: tính theo giây, một khách truy cập cần được nhận thực trước khi bị đưa trở lại trang “landing”. Giá trị mặc định là 86400 tương đương với 24 giờ. Giá trị 3600 tương đương với một giờ.

Sau khi cấu hình xong, nhấn Save rồi reboot lại modem để NoCaSpash chạy.Tuy nhiên trước khi khởi động lại, hãy tạo trang “landing” Splash URL của bạn như những gì miêu tả bên dưới.:

<form name="login" method="post" action="http://192.168.1.1:5280/"> 
<div align="center"> 
<input type="hidden" name="accept_terms" value="yes" /> 
<input type="hidden" name="redirect" value="http://yoursite.com"> 
<input type="hidden" name="mode_login"> 
<input type="submit" value="enter"> </div> </form> 

Lưu ý:  Thuộc tính action của tag <form> trỏ tới địa chỉ IP của router, lưu ý khi bạn đã cấu hình nó thành địa chỉ khác với địa chỉ mặc định.
Trong bài viết tiếp theo mình sẽ giới thiệu thêm về hình thức đăng nhập bằng google, facebook, like hoặc share facebook để truy cập wifi. Cũng như cách tạo 1 trang splashpage reponsive cho tất cả thiết bị.
* Cập nhật:  Các bạn quan tâm tạo hotspot wifi yêu cầu đăng nhập facebook có thể tham khảo  tại đây: https://github.com/acanthus2000/social-hotspot
 

© 2016 MAXO. All rights resevered. Designed by Templateism

Back To Top