Tạo trang trắng như Ngọc Trinh để tự design trên Blogger
Khi làm website thì chắc rằng một vài người sẽ nghĩ tối việc làm ra một trang đặc biệt riêng (có thể là Landing page hoặc Intro gì đó) tại website của mình. Bữa tuần trước được một bác nhờ hướng dẫn về cách thức làm cái này nên Blogger, hứa hẹn lâu rồi bây giờ mới "siêng năng" viết bài :D. Thì hôm nay mình sẽ hướng dẫn các bạn thực hiện tạo một trang đặc biệt riêng không bao gồm bất cứ thành phần nào để bạn có thể design theo ý thích ngay tại blog của mình.
Thủ thuật này nếu mà bạn để ý thì mình đã áp dụng cho "Tạo trang 404 hiển thị đầy đủ cho Blogger" và "Tạo trang demo và download cho Blogger". Lợi ích của nó là không phải dùng CSS ẩn đi toàn bộ thành phần của blog, mà nó sẽ không phát sinh bất cứ đoạn mã nào trong cặp thẻ "body", nó sẽ giúp trang xử lý cũng hư tải nhanh hơn và tốt hơn trong quá trình sử dụng.
Tiếp tục tìm đến thẻ </body> và chèn lên trên đoạn mã này
![]() |
Tạo trang trắng cho Blogger |
Tạo trang trắng tại Blogger để tự design
Ok bây giờ mình sẽ hướng dẫn lại và nó có phần tương tự với bài viết mà mình nhắc đến ở trên. Đầu tiên tìm đến thẻ <body> và chèn xuống dưới nó:<b:if cond='data:blog.url != "http://kslzone.blogspot.com/search/label/trang-design-rieng"'>
đoạn mà trên bạn sẽ thay http://kslzone.blogspot.com/search/label/trang-design-rieng bằng http://tên-miền/search/label/tên-trang-của-bạn. Mình sử dụng địa chỉ "search label" là vì 100% nó hoạt động và tiết kiệm không phải tạo một trang tĩnh trong Dashboard, nhưng bạn vẫn có thể làm thế nếu thích.Tiếp tục tìm đến thẻ </body> và chèn lên trên đoạn mã này
<b:else/>
<style type="text/css">
NỘI DUNG CSS CỦA BẠN
</style>
NỘI DỤNG HTML CỦA BẠN
</b:if>
sau khi chèn và chỉnh sửa xong những nội dung html và css của bạn thì lưu lại và mọi thứ đã quá ok. Bạn có thể truy cập vào linh ở trên để kiểm tra lại.
lúc 14:32 14 tháng 12, 2014
Không được admin ơi, làm y như trên những không lưu được mẫu :(
lúc 14:33 14 tháng 12, 2014
Nó báo lỗi gì vậy bác.
lúc 15:26 14 tháng 12, 2014
Lỗi khi phân tích cú pháp XML, dòng 3552, cột 3: The element type "body" must be terminated by the matching end-tag "</body>".
:(
lúc 16:48 14 tháng 12, 2014
Nếu chèn đúng dưới "body" và trên "/body" thì đảm bảo không có cái này đâu lạ thật.
lúc 18:26 14 tháng 12, 2014
Thật mà làm y nguyên luôn, mà có thể làm để chèn vào trang tĩnh được không, chứ nếu thêm code css với html cùng vào template thì nặng lắm :(
lúc 18:32 14 tháng 12, 2014
Chắc chắn có bước nào đó sai:
http://kslgenes.blogspot.com/search/label/trang-design-rieng
Cái này là một trang trắng tinh, loại bỏ toàn bộ thành phần trong body rồi, muốn cả thẻ head nữa thì làm tương tự thôi.
Bác mà chèn vào trang tĩnh mới gọi là nặng đấy.
lúc 19:52 14 tháng 12, 2014
Em chưa biết thủ thuật này có chức năng gì anh ạ và em cũng không tìm hiểu nhiều về cái tên Ngọc Trinh, tuy nhiên em thấy tiêu đề không liên quan lắm tới nội dung. :)
Anh hài hước thật đấy, em thấy link DEMO thì trang đó body có mã màu là #f5f5f5
Như vậy theo tính chất bắc cầu: Tiêu đề của anh "trắng như Ngọc Trinh" -> Chị ấy có làn da trắng đạt chuẩn #F5F5F5 (Điều phải chứng minh) :)
lúc 09:29 15 tháng 12, 2014
Trắng như Ngọc Trinh thì bg phải là #ffffff chứ :3
lúc 09:30 15 tháng 12, 2014
"Tạo trang 404 hiển thị đầy đủ cho Blogger" dẫn link j vậy giời :v
lúc 09:32 15 tháng 12, 2014
Ngọc trinh màu đâu có FFF được =]], như vậy là chết đuối rồi. Bác với Đồng Việt cứ chọc mình :D.
P/S: Mình đặt tiêu đề theo yêu cầu thôi kaka http://www.kslzone.net/2014/11/ma-hoa-ky-tu-html-bang-javascript.html?showComment=1418528504829#c709254743467486889
lúc 09:34 15 tháng 12, 2014
Qua đang xem cái trang Laptop After Shock copy nhầm bao giờ không biết :)))
lúc 04:42 17 tháng 12, 2014
giật tít
lúc 08:11 17 tháng 12, 2014
Tiêu đề hiệu quả nhiều người click :D
lúc 16:09 17 tháng 12, 2014
Anh Lâm có thể giúp em đánh Schema cho thanh Search trên Blog không ạ? :)
lúc 17:06 17 tháng 12, 2014
Lâm có biết cách làm tối background để cho chữ nổi bật lên như ở đây ko :)
http://www.google.com/trends/2014/story/flappy-bird.html
lúc 20:44 17 tháng 12, 2014
Nếu em xài khung search giống anh thì anh send lại code của anh đánh dấu sẵn cho em luôn :D
lúc 20:46 17 tháng 12, 2014
Phối màu thì tôi thua rồi ông ơi, tôi cũng bó tay cái vụ này lắm :)
lúc 21:04 17 tháng 12, 2014
Em đang dùng khung Search giống như của anh mà. Anh giúp em nhé :D, cảm ơn anh!
lúc 16:14 20 tháng 12, 2014
Cách này không áp dụng được với template đang dùng. KSL hướng dẫn cách là trên một trang trống đi.
Vì tớ chỉ dùng thủ thuât này để thiết kế trang About thôi nên nếu phải chèn thẳng vào template thì rất bất cập! Cố gắng giúp tớ với nhé!
lúc 16:44 20 tháng 12, 2014
Nếu mà làm trang trồng thì cũng phải tương tự thôi =.=. Không còn cách nào khả thi được.
Nếu mà muốn chơi bằng css thì trừ khi trang about đó bác tính sao nó nằm vẹn trong một khuôn chiều cao nhất định, còn không biện pháp mạnh thì địa chỉ link để mình tính thử :D.
Demo chiều cao nhất định: http://ksltest92.blogspot.com/p/error-not-found-background-ff0000.html
lúc 18:30 20 tháng 12, 2014
Đây bác: http://logictrochoi.blogspot.com/p/tu-gioi-thieu.html
Bác hướng dẫn để làm thế nào cho nó trắng bóc là được :->
lúc 05:13 25 tháng 12, 2014
....
lúc 10:19 25 tháng 12, 2014
Hình như template có chút thay đổi, trông sáng hơn :D
lúc 08:19 26 tháng 12, 2014
Thu nhỏ template lại thay màu background đậm hơn với vài cái bóng ^^
lúc 21:22 27 tháng 12, 2014
Lâm biết cách khắc phục tình trạng text bị thừa ra một khoảng trống phía sau mặc dù ko có space ko :(
https://www.upsieutoc.com/images/2014/12/27/Untitledabd59.png
lúc 21:23 27 tháng 12, 2014
Ôi troa, Lâm cũng dùng comment media từ hồi nào vậy :D
lúc 14:26 28 tháng 12, 2014
Bác kiếm .home-intronbt h1 chỉnh letter-spacing thành 0 nha. Tự lụm ảnh cho tiện khỏi phải xem link ^^
lúc 15:52 28 tháng 12, 2014
Thank Lâm, tớ tưởng hôm q thử test cái đấy về 0 xem phải ko rồi mà hoá ra chưa :d
lúc 16:21 31 tháng 12, 2014
mất Adsend hay là lâm tháo adsend ra thế ?
lúc 16:22 31 tháng 12, 2014
Vẫn hiện bình thường mà bạn :D
lúc 16:22 31 tháng 12, 2014
chắc tại mạng nhà mình
lúc 17:27 31 tháng 12, 2014
Có lẽ tại trình duyệt của anh có gắn Adblock Plus.
lúc 18:47 5 tháng 1, 2015
Tiện ích này hay nhĩ. kiểu như làm trang một trang riêng biệt tự design để tạo phong cách riêng cho từng bài viết đây ^^
lúc 19:07 5 tháng 1, 2015
Đúng rồi, có thể áp dụng nó làm nhiều thứ khác nhau lắm tiện lắm :D
lúc 21:06 24 tháng 6, 2015
Hi Em. Anh mới vọc thử và rất Ok. Cám ơn em. Mình có thể tùy biến thành nhiều trang như vậy không vậy em. Demo cái:
Demo Upanh
lúc 08:06 25 tháng 6, 2015
Bao nhiêu trang cũng được mà anh :D Cái đó có vẻ hay đó :D
lúc 09:08 25 tháng 6, 2015
Cám ơn em nhé. Tại up ảnh lên blogger hồi này không thực sự tốt cho trải nghiệm người dùng nên anh kiếm cái đó về up lên cho nhanh rồi đưa vào bài viết :)
lúc 16:39 21 tháng 7, 2015
A ơi cho e hỏi làm sao tạo nhiều trang trống tương tự khác được ạ :)
lúc 16:47 21 tháng 7, 2015
Nếu bạn có thêm trang thứ 2 thì lại lồng 1 cặp điều kiện nữa vào điều kiện else thứ nhất. Mình ví dụ, bạn thay thế cái đoạn code cuối cừng ở bài viết trên bằng thế này
<b:else/>
<b:if cond='data:blog.url == "http://www.kslzone.net/search/label/trang-thu-2"'>
Nội dung trang thứ 2
<b:else/>
Nội dung trang thứ nhất
</b:if>
</b:if>
lúc 16:49 21 tháng 7, 2015
Bạn cũng có thể sử dụng như vầy đơn giản hơn
<b:elseif cond='data:blog.url == "http://www.kslzone.net/search/label/trang-thu-2"'>
Nội dung trang thứ 2
<b:else/>
Nội dung trang thứ nhất
</b:if>
lúc 16:50 21 tháng 7, 2015
Cứ nhân bản else if lên nếu số lượng trang gia tăng nhé.
lúc 22:46 13 tháng 8, 2016
Khổ có cái là template blog của em là của thằng http://www.templateism.com/ bác ạ.
Hễ mà tạo trang trắng thì chuyển trang sang http://www.templateism.com/ ngay(nếu vào trang trắng đó).
Bữa tìm hiểu sơ qua về giải mã js. mà tìm hiểu chưa sâu nên chưa giải quyết được cái thằng http://www.templateism.com/ bác ạ.