Thấy nhiều bạn không biết cách tích hợp wap/web cho blogspot, nay mình sẽ viết lại hướng dẫn cụ thể.Để tích hợp giao diện Wap / Web cho blogger cho blogger không khó, có điều bạn cần biết đôi chút về html và bố cục của blogspot.
Công cụ duy nhất là Notepad++. Link download: http://notepad-plus-plus.org/
Tại sao lại sử dụng Notepad++, đơn giản vì mình thấy nó nhẹ và dễ nhìn, dễ sử dụng.
DEMO TEMPLATE MOBILE
Bạn phải có 1 giao diện wap cho blog. Cái này bạn tự tìm nha. Mình sẽ up vài giao diện wap cho các bạn trong thời gian tới.
Chú ý: giao diện wap sẽ không hiện thị ở Destop được mà phải thêm m?=1 ở phía sau thì mới hiện thị được.
Các giao diện share trên mạng mà hiện thị ở Destop được thì đa phần khi tích hợp sẽ bị lỗi css ở bài viết.
Khi đã có giao diện wap để tích hợp ta bắt đầu:
1. Tùy chỉnh nhận biết hiện thị giao diện Wap/Website
Vào Blog -> Mẫu -> Điện thoại di động -> Chọn Tùy chỉnh
2. Màn hình co giãn theo thiết bị
Mở template blog giao diện Destop của bạn bằng Notepad++ thêm dưới
3. Tách css, script , html bố cục Blog
Tìm
Tiếp theo nhấc toàn bộ các script qua chèn ở dưới
Đến bố cục bài viết chuyển toàn bộ nội dung từ đến hết qua chèn phía dưới các script
Vậy là ta có bố cục giao diện destop ở file mới vừa chuyển qua như sau:
html, section blog ở đây
Với giao diện Wap cũng làm tương tự như vậy
4. Tích hợp 2 giao diện vào làm 1
Quay trở lại với templates gốc lúc này ở trong đến hết
không có nội dung gì cả
Giờ ta sẽ cho thẻ điều kiện để nhận biết giao diện wap/web
Tìm thêm bên dưới
Nơi chứa giao diện Mobile
Nơi chứa giao diện Destop
Giờ các bạn chỉ cần coppy toàn bộ nội dung ở template Destop và Mobile vừa chuyển qua dán vào Nơi chứa giao diện Mobile và Nơi chứa giao diện Destop là xong
Xong lưu template. lúc này có thể bạn sẽ thấy Blog báo lỗi trùng thẻ Blog và id
Tìm Blog1 thay bằng Blog2
Tìm id='main' thay bằng id='main2'
Lưu templates và hưởng thành quả
Để xem giao diện Mobile bạn thêm ?m=1 vào sau domain. Ví dụ: http://www.ancplayer.com?m=1
Chúc thành công ! Hãy like nếu thấy bài viết có ích.
Nguồn : http://www.ancplayer.com/