Những code thông dụng cơ bản dành cho new blogger

Bài viết này mình sẽ chia sẻ lại một số code cơ bản nhưng rất thông dụng để thao tác và xử lý các bài viết dành cho new blogger, nó sẽ giúp cho các bạn tạo bố cục hợp lý và hấp dẫn khách truy cập đọc bài viết của bạn. Tuy nhiên các bạn không nên sử dụng quá bừa bãi vì việc chèn thêm nhiều đoạn script hay flash không thực sự cần thiết sẽ làm cho tốc độ tải trang của bạn chậm hơn, và có thể khiến bạn mất đi một số khách hàng thiếu kiên nhẫn.
Các bạn nên tham khảo thêm bài viết này để tối ưu tốc độ load trang blog của bạn

1. Bookmark đến vị trí nhanh trong bài viết.

<a href="url_bài_viết#Tên_gán_cho_vị_trí ">Nội_dung</a>
<a name="Tên_gán_cho_vị_trí ">Nội_dung</a>

Các bạn xem vd mình sẽ tạo neo tới đoạn code thứ 2 chèn flash như sau

<a href="http://csttol.blogspot.com/2014/08/nhung-code-co-ban-thong-dung-cho-blog.html#Chen_flash_vao_bai_viet">Đến chèn flash</a>
<a name="Chen_flash_vao_bai_viet">2.Chèn flash vào bài viết </a>

và bạn click vao Đến chèn flash để xem kết quả

2. Chèn flash vào bài viết.

Cách 1
<div style="text-align:center;"><embed wmode=Transparent pluginspage="http://www.macromedia.com/go/getflashplayer" src="LINK_FLASH" width="900" height="300"
type="application/x-shockwave-flash" scale="" play="true" loop="true"
menu="true"></embed></div>
Cách 2
<embed src="LINK_FLASH" bgcolor="#000000" type="application/x-shockwave-flash" allowscriptaccess="none"  width="400" height="400"></embed>

LINK_FLASH là địa chỉ URL của flash mà bạn cần chèn vào bài viết

3. Viền khung nội dung vào bài viết

<div style="border:#4F4F4F 1px solid; padding: 4px; background:#eee; width:400px;">
NỘI_DUNG
</div>

Đây là kết quả

4. Chèn nhạc vào bài viết

<object name='hat' width=300 height=45>
<embed  type='application/x-mplayer2'
 pluginspage='http://www.microsoft.com/Windows/Downloads/Contents/Products/MediaPlayer/'
 controls='controlpanel' width=300 height=45 src='LINK_NHẠC'
 autostart="0" showstatusbar="0" ShowControls='true' loop='0' name='hat'></embed></object>

LINK_NHẠC // Phải là link trực tiếp (VD: http://...bài_hát.mp3)
loop='0' // Không lặp lại
loop='1' // Lặp lại một lần
loop='-1' // Lặp lại mãi mãi
autostart="0" // Không tự play
autostart="1" // Play ngay khi web tải xong

5. Tạo button ẩn hiện nội dung

<div>
<div>
<input type="button" value="Xem" style="width:75px; font-size:11px; margin:0px; padding:4px; border="1"" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';this.innerText = ''; this.value = 'Ẩn'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Xem'; }">
</div>
<div>
<div style="display: none;  border:#4F4F4F 1px solid; padding: 4px; background:# ">

NỘI_DUNG

</div>
</div>
</div>

Kết quả

Chào mừng bạn đến với csttol.blogspot.com Chia sẻ những gì mình biết

6. Tạo hiệu ứng khi di chuyển chuột vào link liên kết

<a href="LINK"  target="blank" onmouseover="oldColor=this.style.backgroundColor;this.style.backgroundColor='#eee';" onmouseout="this.style.backgroundColor=oldColor;">TEN_LINK</a>

Kết quả
BLOG THẬT ĐƠN GIẢN

Trên đây là những đoạn code cơ bản nhưng rất hay được sử dụng trong các web/blog hiện nay mình sẽ tiếp tục cập nhật thêm những đoạn code thú vị nữa để các bạn theo dõi, và chúc các bạn thành công trong việc chèn code vào blog của mình.
Hãy like và +1 nếu bài viết có ích cho bạn