• Tư vấn điều trị
      bệnh khàn tiếng


    www.trikhantieng.com

    Liên hệ + 0913163316

BlogList111

Việt Nam Gia Phả, nơi lưu trữ Gia Phả của người Việt Nam  Kiến thức Blogspot Ngonluanho: Nhung cau chuyen thap lua-Tin-Cay-Men Vngreenzone Là một nơi chia sẻ kinh nghiệm làm blogger - Nơi tôn vinh tâm hồn blogger Việt

Tạo nút Tăng/Giảm cỡ chữ trong bài viết Blogger

30
06/12/2010

Nút Tăng/Giảm cỡ chữ cũng rất cần thiết cho blog của bạn. Nó giúp người đọc chọn lựa cỡ chữ phù hợp với thị lực của họ. Thông thường trong một blogspot, việc tăng hay giảm cỡ chữ chỉ được được thiết lập cho phần nội dung bài viết (post body). Javascript sẽ giúp bạn thực hiện điều này một cách dễ dàng.

Bước 1: Trước tiên đăng nhập Blogger, vào Design >> Edit HTML, chọn Expand Widget Templates, đặt đoạn code Javascript dưới đây vào trước thẻ </head>.

<script type='text/javascript'>
//<![CDATA[
function fontIncrease(){
var obj = document.getElementById("text_Font");
if (obj.style.fontSize==""){obj.style.fontSize="12px"};
if (obj.style.fontSize=="10px"){obj.style.fontSize = "12px";}
else if (obj.style.fontSize=="12px"){obj.style.fontSize = "15px";}
else if (obj.style.fontSize=="15px"){obj.style.fontSize = "17px";}
else if (obj.style.fontSize=="17px"){obj.style.fontSize = "19px";}
else if (obj.style.fontSize=="19px"){obj.style.fontSize = "21px";}
}
function fontDecrease(){
var obj = document.getElementById("text_Font");
if (obj.style.fontSize==""){obj.style.fontSize="12px"};
if (obj.style.fontSize=="21px"){obj.style.fontSize = "19px";}
else if (obj.style.fontSize=="19px"){obj.style.fontSize = "17px";}
else if (obj.style.fontSize=="17px"){obj.style.fontSize = "15px";}
else if (obj.style.fontSize=="15px"){obj.style.fontSize = "12px";}
else if (obj.style.fontSize=="12px"){obj.style.fontSize = "10px";}
}
//]]>
</script>

Bước 2: Tìm các dòng

<div class='post-header'>
<div class='post-header-line-1'/>
</div>

rồi đặt sau đó với đoạn code bên dưới.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<a alt='Tăng cỡ chữ' title='Tăng cỡ chữ' href='javascript:fontIncrease()'>A+</a> |
<a alt='Giảm cỡ chữ' title='Giảm cỡ chữ' href='javascript:fontDecrease()'>A-</a>
</b:if>

Bước 3: Đặt dòng <div id='text_Font'> vào sau dòng <div class='post-body'> (ở một số Template là <div class='entry'>).

Tiếp tục đặt thẻ đóng </div> vào trước dòng <div class='post-footer'>. Lưu Template là OK.

{30 bình luậnAdd yours ?}

Sungharim
09:34:00, 26 thg 12, 2010

Pro ơi tôi làm mãi nó vẫn cứ báo lỗi
Mẫu của bạn không thể được phân tích cú pháp vì được tạo không đúng. Hãy đảm bảo tất cả các phần từ XML được đóng chính xác.
Thông báo lỗi XML: The element type "b:if" must be terminated by the matching end-tag "".

hjx. chưa tìm ra lỗi.!

Reply
huy
22:37:00, 26 thg 12, 2010

Pro xem lại bước 3 đi. Tui làm đến bước 3 thì báo lỗi. Hình như lộn code thì phải

Reply
Sungharim
22:56:00, 26 thg 12, 2010

Nó báo là: Mẫu của bạn không thể được phân tích cú pháp vì được tạo không đúng. Hãy đảm bảo tất cả các phần từ XML được đóng chính xác.
Thông báo lỗi XML: The element type "b:includable" must be terminated by the matching end-tag "".

Pro xem lại giúp nhé !

Reply
07:21:00, 27 thg 12, 2010

Code đã test rồi OK bạn à, do bước 3 bạn đặt code chưa đúng thôi. Bạn để lại địa chỉ blog của bạn trong bình luận để mình test và hướng dẫn nhé. K có gì là k thể giải quyết được.

Reply
08:50:00, 27 thg 12, 2010

K hoạt động là đúng rồi bởi vì bạn đã đặt dòng <div id="text_Font"> trước dòng <div class="post-footer"> là k đúng rồi. Phải đặt dòng <div id="text_Font"> ngay trước dòng <div class='post-body entry-content'> thì mới được chứ. Bạn cần nhớ <div class="post-body"> cũng như <div class='post-body entry-content'> mà thôi.

Reply
21:29:00, 16 thg 2, 2011

Anh Hà ơi sao cái nút tăng giảm cỡ chữ này không hoạt động, em đã làm giống theo hướng dẫn của anh, mong anh giải đáp giùm!
http://khosachonline.blogspot.com/2011/02/trang-nuoc-chuong-duong-chuong-5.html

Reply
23:11:00, 16 thg 2, 2011

Tại em làm sai Bước 3 chi. Anh bảo đặt <div id='text_Font'> vào sau dòng <div class='post-body'> (ở Template của em là đặt sau dòng <div class='post-body entry-content'>). Em đem đặt trước dòng đó thì biểu làm sao nó hoạt động được chứ lị. Chú ý đặt thẻ đóng </div> cho đúng nữa nhé.

Reply
23:18:00, 16 thg 2, 2011

@Huỳnh Nhật Hà
Cảm ơn anh! Em làm được rồi!

Reply
20:31:00, 26 thg 2, 2011

Trang của em không tìm thấy code ở bước 2, vậy em phải đặt ở đâu?
http://lynhatruc.blogspot.com
Anh chỉ giùm em?

Reply
21:14:00, 26 thg 2, 2011

@Binh Lee Đối với Template của e thì đặt trước hoặc sau thẻ <div class='post-entry'>

Reply
21:55:00, 26 thg 2, 2011

@Huỳnh Nhật HàNó báo lỗi hoài, anh xem giùm em nha!

Reply
22:02:00, 26 thg 2, 2011

Em đã thử đặt code bước 2 trước và sau thẻ của anh nói nhưng vẫn báo lỗi!

Reply
22:18:00, 26 thg 2, 2011

Quan trọng là Bước 3, đặt không đúng sẽ báo lỗi ngay.

Reply
22:19:00, 26 thg 2, 2011

Anh có cần em gửi template của em qua cho anh xem không?

Reply
22:29:00, 26 thg 2, 2011

Hì hì, em đã tìm ra lỗi rồi, nhưng bây giờ lại bị vấn đề hình trên imageshack đó anh!

Reply
22:44:00, 26 thg 2, 2011

Tạm thời em thay <img src='http://img560.imageshack.us/img560/881/amas.jpg' title='Tăng cỡ chữ'/> bằng + A và thay <img src='http://img709.imageshack.us/img709/7121/amenos.jpg' title='Giảm cỡ chữ'/> bằng – A nhé. Khi nào rảnh mới upload lại 2 cái hình này. Hình trên imageshack hết băng thông nên chưa thay hết được.

Reply
22:55:00, 26 thg 2, 2011

Có rảnh anh nhớ coi lại giùm em trang http://www.nguontrithuc.tk luôn bị lỗi phân trang! Thanks!

Reply
22:16:00, 1 thg 3, 2011

Anh coi giùm trang của em không có <div class='post-header'>
<div class='post-header-line-1'/>
</div> , vậy phải đặt code ở đâu? Và ở bước 3 không có <div class='post-footer'> vậy phải đặt thẻ đóng </div> ở đâu?
À, do em đặt tên là admin tại để đăng bài trong blog của mình, anh đừng có hiểu lầm là em muốn mạo danh nghe!
trang của em: http://giaitri2011.blogspot.com/

Reply
23:05:00, 1 thg 3, 2011

Trang của em bị ếch ở Imageshack tấn công hàng loạt, anh chả thấy gì cả. Em xử lý lỗi ảnh đi nhé.
:47)

Reply
13:29:00, 2 thg 3, 2011

@Huỳnh Nhật HàAnh xem lại giùm em nghe!

Reply
13:39:00, 2 thg 3, 2011

Đối với Template của e thì ở Bước 2 đặt code trước thẻ <div class='byline'>, ở Bước 3, đặt <div id='text_Font'> vào sau thẻ <div class='entry'> rồi đặt thẻ đóng </div> vào trước thẻ <div class='postmeta'>
:59)

Reply
10:38:00, 15 thg 4, 2011

anh ơi anh xem giúp cho trang của em với ạ! em làm mãi không được! E không tìm thấy mấy cái dòng ở bước 2 anh ạ!
Trang của em là meoblog. net a ạ

Reply
08:04:00, 17 thg 10, 2011

Anh Hà ơi . Nhờ anh xem hộ trang blog của tôi
http://giangquynhgtvt.blogspot.com
Đã làm đúng theo các bước nhưng sao lại không hiện ảnh và chữ tăng giãm chữ nhỉ .

Reply
13:30:00, 17 thg 10, 2011

@giangquynhgtvt Bạn làm lại nhé, do trước cái image up lên imageshack.us hết băng thông hiện hình con ếch nên lỗi.

Reply
20:42:00, 17 thg 10, 2011

Anh Hà ơi ! Sao tôi đã chỉnh lại nhưng cũng không hiện nút tăng giãm . Anh xem hộ tôi lỗi ở đâu nhé .
http://giangquynhgtvt.blogspot.com
Cảm ơn anh rất nhiều.

Reply
21:43:00, 17 thg 10, 2011

@giangquynhgtvt E ác thiệt đó, chưa làm Bước 2 bảo sao nó hoạt động được.

Reply
08:31:00, 18 thg 10, 2011

@Huỳnh Nhật Hà
Anh Hà ơi . Tôi đã kiểm tra và làm đúng như các bước . Nhưng vẫn không hiện gì hết . Anh xem giùm tôi nhé .
http://giangquynhgtvt.blogsopt.com
Cảm ơn anh

Reply
08:33:00, 18 thg 10, 2011

Vẫn không được anh Hà ơi , dù đã làm đúng các bước. Nhờ anh xem hộ tí nhé !
http://giangquynhgtvt.blogspot.com . Thank

Reply
15:54:00, 18 thg 10, 2011

@giangquynhgtvt Thử làm theo bài này: http://www.thuthuatblogger.info/2010/11/tang-giam-co-chu-bang-javascript.html
Chỉ hoán thay đổi Bước 1 và Bước 2 tương ứng thôi nhé. Nhớ thay 'body',1 thành 'text_Font',1

Reply
10:47:00, 23 thg 2, 2012

anh Hà ơi, nó báo lỗi như vầy hoài nè: Lỗi khi phân tích cú pháp XML, dòng 1739, cột 5: The element type "b:includable" must be terminated by the matching end-tag "". Blog của mình là: http://hoanggiang83.blogspot.com. Thanks

Reply
Nội quy! Đóng lại Khi bạn viết bình luận, cần tuân thủ một số quy tắc sau:
» Bình luận phải nghiêm túc và không chứa các liên kết quảng cáo.
» Có thể sử dụng các thẻ <b> … </b>,<i> … </i>, <a href="URL..."> ... </a>.
» Yêu cầu thủ thuật tại mục Yêu cầu thủ thuật hoặc hỏi tại mục Hỏi và Đáp.
More →
Chữ đậm Chữ nghiêng Chữ nghiêng 2 Chèn Link Chèn Link Mã hóa code Help ?Nhấn vào biểu tượng hoặc kiểu chữ hoặc chèn link sau đó nhấn nút Chọn rồi copy (Ctrl + C) để paste (Ctrl + V) vào khung viết bình luận. Mã hóa code nếu bạn muốn đưa code vào bình luận.

Chọn Xóa

Next post: Bài đăng Mới hơn

Previous post: Bài đăng Cũ hơn