TẠO NÚT BẤM "DOWNLOAD" CHO WEB/BLOG

Trên các trang Web/Blog chia sẻ, các bạn thường thấy họ cho download một số phần mềm, tiện ích... thông qua các nút bấm "DOWNLOAD" hoặc xem thử thông qua nút "DEMO". Tuỳ theo các trang Web/Blog mà các nút bấm này khá đẹp, có hiệu ứng động, khi rê chuột vào nó sẽ thành hình khác hoặc chữ Download sẽ biến thành màu khác...

Để làm việc này, các bạn phải có một số chương trình (phần mềm) hỗ trợ như là: Photoshop hoặc các phần mềm tạo nút bấm chuyên nghiệp...

Trong giới hạn bài viết này, tôi chia sẻ với các bạn cách tạo nút bấm "DOWNLOAD" có hiệu ứng động (thay đổi hình hoặc chữ Download đổi màu khi rê chuột vào) mà không cần phải nhờ phần mềm hỗ trợ nào hết chỉ cần bạn dán code và thay đổi link ảnh vào mà thôi...

Bạn bấm vào "Xem thử" để xem vài mẫu nút bấm "DOWNLOAD" nha.

Xem thử

Khi đang soạn bài bình thường, muốn nút bấm "DOWNLOAD" này xuất hiện ở đâu, bạn chỉ cần bấm vào thẻ HTML ở phía trên khung soạn thảo để sang chế độ HTML rồi dán code phía dưới vào, sau đó bấm thẻ VIẾT để trở về chế độ soạn thảo bài viết tiếp tục.

 Đây là code của nó:

<a href="http://dunghennessy.blogspot.com/" style="margin-left: 1em; margin-right: 1em;" target="_blank"><img onmouseout="this.src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnQ3D8anU69HGq-QIoDSL6eY9Uds-1PG7-rIWbSaDVswzBAbOlD0gBd_kKYa5iTwdR0a5CJLE1kz9Zi3tuUEoSkdpV3KxWSKDYtb5DqPILhPr40FnOL-kx18onZt988GJ58sFFVdoOOzA/s1600/cooltext655930958.png';" onmouseover="this.src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiV99Cg010ylKwsSXpX6ZS1Cz2vBR3PK7XtzWNOdXaHTn_ipRs1rZCg-mfqjGG1ers7MsEhupxrfltdKImtuE0keok9gQ0lhhU-jdfGlUmnAkKmMVt8MO9PjVOAEuYQjxwDFgiL7SIwSDA/s1600/cooltext655930958MouseOver.png';" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnQ3D8anU69HGq-QIoDSL6eY9Uds-1PG7-rIWbSaDVswzBAbOlD0gBd_kKYa5iTwdR0a5CJLE1kz9Zi3tuUEoSkdpV3KxWSKDYtb5DqPILhPr40FnOL-kx18onZt988GJ58sFFVdoOOzA/s1600/cooltext655930958.png" /></a>

Bây giờ, bạn thay đổi các dòng lệnh màu đỏ, xanh, vàng để phù hợp với blog của mình, trong đó:

* Link màu đỏ: là link mà mình muốn nút bấm liên kết đến (có nghĩa là khi bấm vào nút này sẽ đưa bạn đến link download phần mềm nào đó để download).

* Link màu xanh (2 link): đây là hình ảnh ban đầu của nút bấm khi chưa rê chuột vào.

* Link màu vàng: đây là hình ảnh sẽ thay đổi khi rê chuột vào. 

Bạn chưa có ảnh nút bấm "DOWNLOAD"???. Mời các bạn bấm vào hình phía dưới để tham khảo một số mẫu nút bấm, nếu thích thì tải về upload lên lấy link để thay vào.

Xem và tải nút "DOWNLOAD"

Chúc các bạn thành công!!!