Sâu Ciu Blog

Hướng dẫn ghép Template Wap/Web cho BlogSpot

Mar 3, 2014 | Đăng: Trịnh Minh Cảnh
Bạn có một template blogger với giao diện máy tính nhưng thất vọng với giao diện di động mặc định của blogger hoặc bạn có một template blogger giao diện di động và cảm thấy bất tiện khi không có giao diện máy tính




Hôm nay mình sẽ hướng dẫn các bạn thêm ghép một template di động hoặc template máy tính trở thành một template mang 2 giao diện máy tính và di động
Đơn giản dễ hiểu thực hiện không quá 5 phút đồng hồ cho công việc này !

I. Nội dung code template
Bước 1
Các bạn phải hiểu nguyên lý hoạt đôgnj của nó là như thế này

<b:if cond='data:blog.isMobile'>
Nội dung code trên DI ĐỘNG
<b:else/>
Nội dung code trên MÁY TÍNH
</b:if>

Vì vậy khi bạn ghép bất cứ một template wap vào 1 template web hay ngược lại thì nội dung code của wap là bên trên và web là bên dưới còn code như nào hay sang bước tiếp theo

Bước 2
Lấy code của template ghép (ví dụ mình đang muốn ghép template wap vào 1 template web và đương nhiên bước này mình sẽ lấy code của 1 template wap nào đấy)
Các bạn bỏ qua toàn bộ nội dung code trong template và chỉ lấy đoạn code dưới đây

<body>
Copy toàn bộ nội dung trong từ sau <body> đến trước </body>
</body>

Bạn nên copy đoạn code trên và để vào 1 chỗ nào đó vào tiếp tục bước tiếp theo

Bước 3
tùy chỉnh code của template muốn ghép ( lưu ý code này của template web)
Bạn tìm đoạn này trong template

<body>
A
</body>

A là đoạn code của template và bạn thêm vào nó đoạn code như sau

<body>
<b:if cond='data:blog.isMobile'>
B
<b:else/>
A
</b:if>

Màu đỏ là code gốc, Màu xanh là code khi thêm vào
Và ở đây B chính là đoạn Code đã thực hiện ở bước 2

Bước 4
Sau khi thực hiện sau các bạn bấm lưu template lại và nó sẽ báo lỗi như sau

More than one widget was found with id: Blog1. Widget IDs should be unique.

ở đây Blog1 chính là id widget bị lỗi, chúng ta copy Blog1 và tìm kiếm trong template sẽ có 2 cái là Blog1 ta đổi tên 1 trong 2 cái thành Blog2 chẳng hạn rồi tiếp tục lưu template và tiếp tục nhận 1 lỗi khác chúng ta tiếp tục sửa cho khi nào lưu thành công thì thôi

Lưu ý: đây là lỗi trùng lặp id widget do template code A va B có 2 widget trùng ID với nhau nên ta tìm và đổi 1 trong 2 cho nó khác nhau là được

II. CSS của template
Sau khi thực hiện ghép code xong tất nhiên chúng ta phải ghép cả CSS chứ không nó ra cái của ma của quỷ gì
Đầu tiên là xóa hết CSS trong đoạn

<b:skin>
....
</b:skin>

Tiếp theo thêm đoạn code này vào trước thẻ </head>


<style>
<b:if cond='data:blog.isMobile'>
A
</b:else>
B
</b:if>
</style>

A là CSS của template wap
B là CSS của template web

Done. Sâu Ciu Blog
Nguồn: Sơn Trần (OiVL.BlogSpot.Com)
Mail Facebook Google twitter

Hướng dẫn ghép Template Wap/Web cho BlogSpot

Bài viết Hướng dẫn ghép Template Wap/Web cho BlogSpot
Hướng dẫn ghép Template Wap/Web cho BlogSpot Hướng dẫn ghép Template Wap/Web cho BlogSpot
910 8

Bài viết Hướng dẫn ghép Template Wap/Web cho BlogSpot

8 nhận xét

Tải game
28/3/14 19:17
Cảm ơn bạn chia sẻ, mình dùng blogger thấy giao diện cũ của nó tệ thật
Trả lời
tai game mien phi
13/5/14 18:23
bài này hay và hữu ích lắm, thanks
Trả lời
Anonymous
4/6/14 03:00
Lỗi khi phân tích cú pháp XML, dòng 1370, cột 3: The element type "b:if" must be terminated by the matching end-tag "". là lỗi gì vậy bạn
Trả lời
Anonymous
5/6/14 17:21
lỗi More than one section was found with id: sidebar. Section IDs should be unique. là gì vậy
Trả lời
Cường Coca
25/3/15 17:18
Css nằm ngoài đoạn skin sử lí sao bạn!
Trả lời
Cường Coca
25/3/15 17:18
Css nằm ngoài đoạn skin sử lí sao bạn!
Trả lời
Bài viết của bạn rất hay, xin hỏi bạn, vì sao blog của mình về phim mà khi vào bằng di động thì lại có 2 cái mô tả và nó hiện luôn link ID của phim ạ, cảm ơn bạn.
Trả lời
Đoàn Thành Trung
16/8/15 20:06
mình thấy làm như thế này chỉ được giao diện ngoài màn hình chính. giao diện bên trong wap có dạng /?m=1 thì lại báo k có bài đăng.
Trả lời