Tuổi : 33 Posts : 2319 Points : 6889 Thanked : 77 10/12/2010 Birthday : 27/02/1991 Đến từ : Hải Phòng I'm : Status : DarkNo1<=> ClubTeen9x avatar-dulieu : 57,13100|50,11784|49,10840|64,12636|51,11465|48,12265|58,12156|66,11440 Admin Tuổi : 33 Posts : 2319 Points : 6889 Thanked : 77 10/12/2010 Birthday : 27/02/1991 Đến từ : Hải Phòng I'm : Status : DarkNo1<=> ClubTeen9xavatar-dulieu : 57,13100|50,11784|49,10840|64,12636|51,11465|48,12265|58,12156|66,11440
Thông tin thành viên : Click ! Posts : 2319
Points : 6889
Thanked : 77
10/12/2010
Birthday : 27/02/1991
Đến từ : Hải Phòng
I'm : Status : DarkNo1<=> ClubTeen9x
avatar-dulieu : 57,13100|50,11784|49,10840|64,12636|51,11465|48,12265|58,12156|66,11440
Tuổi : 33 Posts : 2319 Points : 6889 Thanked : 77 10/12/2010 Birthday : 27/02/1991 Đến từ : Hải Phòng I'm : Status : DarkNo1<=> ClubTeen9xavatar-dulieu : 57,13100|50,11784|49,10840|64,12636|51,11465|48,12265|58,12156|66,11440
Shop Avatar
Tiêu đề: Vài chiêu HTML để trang trí blog Wed Jan 05, 2011 3:56 pm DarkNo1<=> ClubTeen9x
Tiêu đề: Vài chiêu HTML để trang trí blog --------------------------------------------------- Cho Ðiểm Chủ Ðề Này
Những đoạn code HTML này áp dụng với 10 module tự tạo trong blog khi thêm module! Bài viết bài ni giúp nhiều bạn trang trí cho blog với những thành phần cơ bản thường thấy trên các blog. Các bước thực hiện:Chú thích: - Nhấn giữ thanh tiêu đề (màu đen) để thay đổi vị trí của các module. - Nhấn nút biểu tượng cây bút để chỉnh sửa nội dung, thiết lập của Module đó. - Nhấn nút X để xóa module khỏi trang chính, khi xóa > các module sẽ nằm trong "hộp chứa" của blog, cần lấy lại thì vào Blog của tui > Thêm module để lấy lại! Đầu tiên là chèn nhạc , cái này là cái nhiều người quan tâm, vì nhiều khi do thay đổi từ Plus, Flash loader, host... Code cho vài dạng nhạc (link host nhạc là nhaccuatui.com ) như sau:List nhạc: type="application/x-shockwave-flash" AllowScriptAccess='never' src="https://i847.photobucket.com/albums/ab37/delight8x/plus2010/Aviraantivir_911720MediaPlayer.swf?file=http://nct.anhsaokhuya.net/xml.php?id=EsOoyyTVK4-_&displayheight=50&backcolor=0x000000&frontcolor=0xFFFFFF&lightcolor=0x00FF7F&showdigits=true&showeq=true&showfsbutton=true&autostart=false&shuffle=true&repeat=true;volume=100&height=250" width="100%" height="250"/>Chú giải: - ID= ... : Địa chỉ ID của list nhạc, 12 chữ cuối trên thanh địa chỉ (sau chữ L=... ), chú ý là bài hát đơn chỉ có 10 chữ thôi. - Displayheight : chiều cao EQ List nhạc. - Backcolor + Frontcolor + lightcolor : màu nền trước, sau, các nút bấm, select của list nhạc. - Autostart : ho phép tự động chơi nhạc hay không, có 2 giá trị: true/ false > cho phép/ không cho phép. - Shuffle : chơi ngẫu nhiên, không theo thứ tự với list có nhiều bài hát, cũng có 02 giá trị như phần autostart. - Width : độ rộng của list nhạc - Height (cuối cùng trong đoạn code ): chiều cao của list nhạc tính luôn cả khung EQ phía trên và các button điều khiển. Code dạng 02: height="250" type=application/x-shockwave-flash width="100%" src=https://i702.photobucket.com/albums/ww28/hatim86uyennhi/Flashplayer/HaTimBlog_MediaPlayer.swf AllowScriptAccess="never" wmode="transparent" flashvars="file=http://kipno1.info/nct3/?link=http://v6.nhaccuatui.com/GetMusic.ashx?list=00000022001d0030003b0004003c003600070027001b0012 &config=http://kipno1.info/nct3/config.php?backcolor=0x000000 %26frontcolor=0xFFFFFF %26lightcolor=0x00FF7F %26autostart=false %26shuffle=true%26repeat=true"> Chú giải: - List=... ID của list nhạc. Khi vào trang nhạc của tui, view source > nhấn Ctrl + F > gõ list2 > sẽ được cái ID này! - Mấy chỗ color như code trên. - Chỉnh lại các quyền autoplay, shuffle.. theo cá nhân. Sau đó là F lash trang trí : Code chèn: type="application/x-shockwave-flash" AllowScriptAccess='never' src="https://i173.photobucket.com/albums/w49/chiplove9xpro/Flash/Share/chiploveFlashloader.swf?file=[You must be registered and logged in to see this link.] "width="140" height="200" wmode="transparent"> Rồi đồng hồ : Code: type="application/x-shockwave-flash" AllowScriptAccess='never' src="https://i173.photobucket.com/albums/w49/chiplove9xpro/Flash/Share/chiploveFlashloader.swf?file=[You must be registered and logged in to see this link.] "width="140" height="200" wmode="transparent"> Tặng 02 cái đồng hồ xinh xinh lun: [You must be registered and logged in to see this link.] [You must be registered and logged in to see this link.] Bộ đếm Flash số người Online và số người truy cập :Code sau dành cho bộ đếm của trang [You must be registered and logged in to see this link.] , sau khi đăng kí tài khoản và tạo 1 bộ đếm, trang này cung cấp 1 đoạn code HTML chèn vào module tự tạo, chú ý tìm trong đó cái ID rồi thay vào code dưới hen! type="application/x-shockwave-flash" AllowScriptAccess="never" src="https://i173.photobucket.com/albums/w49/chiplove9xpro/Flash/Share/chiploveFlashloader.swf?file=http://www.99counters.com/counters.swf?id=256163 " width="120" height="160" wmode="transparent"> Còn cái này là code cho bộ đếm Flag, đăng kí miễn phí tại trang chủ rồi lấy code như sau, nếu lỡ tắt đi thì đăng kí lại pageviews chạy về 0, chỉ cần hỉnh lại thông số như code sau là được: [You must be registered and logged in to see this link.] /more/73un"> bg=000000/
txt=FFFFFF /
border=000000 /
columns=2 /
maxflags=50 /
viewers=3 /
labels=1 /" alt="
free counters " border="0">
- bg : Màu nền.- txt : Màu chữ. - Border : Màu viền hình. - Columns : số cột hiển thị. - Maxflag : Số lượng flag tối đa hiển thị trong hình. - Viewers : ẩn hiện số pageviews trên hình. - Label : ẩn hiện nhãn tên hình (Visitor). - Alt : Chú thích (không cần quan tâm). Tùy trình duyệt hỗ trợ! Code thời tiết : src="http://weathersticker.wunderground.com/weathersticker/infoboxtr_metric/language/www/global/stations/48887.gif" alt="Click for Phan Thiết, Việt Nam Forecast" border="0" height="108" width="100%" /> Truy cập vào trang Web: [You must be registered and logged in to see this link.] , ngay phần trên cùng có phần Search địa điểm, gõ vào, nếu có thì kéo xuống dưới cùng tìm nút lệnh: Get your weather sticker như hình sau: Sau đó chọn loại sticker mình thích (ví dụ như): Nhấn vô loại sticker mình thích bằng cách Click chuột vô cái hình ưng í, ra bảng code HTML để chèn và javacript với những hệ thống hỗ trợ, copy dòng code HTML dạng mình thích (thường có 03 dạng: chỉ hiển thị độ C, chỉ hiển thị độ F, và cả 02 loại trên): Đăng nhập blog, blog của tui > sửa trang > bùm > OK > xong! Link cho hình: [You must be registered and logged in to see this link.] Chèn link có hình icon phía trước :left
">
(Link_hình)" border="0">[You must be registered and logged in to see this link.] Tiếp theo là
chèn Slide :
Code chèn Slide ảnh từ trang [You must be registered and logged in to see this link.] : [You must be registered and logged in to see this link.] 2954361355588609271 " width="600" height="450" wmode="transparent"/> Sau khi đăng kí + up ảnh > tạo slide, trang Web sẽ cho code HTMl chèn vô, copy ra Word hay Notepad, chú ý lấy đoạn code xanh xanh có dãy ID slide (màu nâu nhạt) mình như trong đoạn code hướng dẫn, thay ID của mình vào, bỏ vô module tự tạo là ok! Code trên là code người iu và em gái tui đấy, cấm phá! Code chèn Slide ảnh từ nguồn ảnh bất kỳ : width=600src=http://img692.imageshack.us/img692/7662/beautifuldreamblog.swf?https://i465.photobucket.com/support/http://vn.myblog.yahoo.com/beautiful-dream flashvars="pics=link_của_bức_ảnh_thứ_1 |link_của_bức_ảnh_thứ_2 |link_của_bức_ảnh_thứ_3 &links=link_chèn_vào_bức_ảnh_thứ_1 |link_chèn_vào_bức_ảnh_thứ_2 |link_chèn_vào_bức_ảnh_thứ_3 &pic_width=600&pic_height=350&s top_time=7000 " wmode="transparent">Chú giải: Những chỗ code màu xanh xanh cách nhau bằng dấu gạch đứng ( | ), số link hình phải bằng số link liên kết (link chèn vào bức ảnh), còn cái Widht - height là độ rộng với độ cao của slide hen, stop_time là thời gian chuyển ảnh, thế thôi! Làm Flash menu 3D xoay vòng: Cái này làm bằng chương trình Aleo 3D menu: [You must be registered and logged in to see this link.] Download về, cài vô, đăng kí với Key có sẵn, tìm vài cái hình trong suốt rồi add hình, chèn link liên kết cho những cái hình, chọn loại menu xoay hay nằm ngang ... nói chung cũng khá dễ, tìm hiểu tí là làm được. Khi xuất ra flash, có thể chọn lựa xuất theo 02 cách: Gắn liên kết trực tiếp vài hình trong Flash luôn, hoặc Flash riêng - kèm file XML chứa dữ liệu link liên kết có thể thay đổi cho dễ nhưng đa số là gắn link vô luôn! Up Flash lên host như [You must be registered and logged in to see this link.] hay [You must be registered and logged in to see this link.] rồi dùng code chèn flash chèn vô! Có gì không hiểu ping tui hướng dẫn thêm cho. Một cái nữa là đôi khi các bạn sẽ gặp những Flash có ảnh nền , và tự hỏi họ làm thế nào? Thì họ làm thế này đây:
style="border-collapse:collapse;font-size:inherit;width:100%;margin-left:auto;"> style="margin-left:0px;vertical-align:top;list-style-type:none;font-weight:normal;font-size:13px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-color:rgb(180, 4, 4);border-right-color:rgb(180, 4, 4);border-bottom-color:rgb(180, 4, 4);border-left-color:rgb(180, 4, 4);background-image:url(Link_hình );background-attachment:scroll;background-color:transparent;width:100%;background-repeat:repeat repeat;"> type="application/x-shockwave-flash" AllowScriptAccess='never' src="https://i1019.photobucket.com/albums/af317/max4downloadcom/photobutket.swf?link=Link_flash " wmode="transparent" height="765" width="1024">
Có cái font lạ lạ thì kệ nó! Cuối cùng trong bài viết này là làm Quick menu : Hiện có vài dạng Quick menu nhưng chung quy vẫn từ 1 cách duy nhất: tạo bằng table, sau đó định ID trên module tự tạo, rồi viết CSS tùy biến cho vùng div ID đó!Dạng 01: Quick menu không hiệu ứng hover (chứa những liên kết hay nào đó!): face="arial" color="white">----------------------------------------------------------------------------------------------------------- Lời_giới_thiệu color="white"> ----------------------------------------------------------------------------------------------------------- (Link_Icon)
" border="0">[You must be registered and logged in to see this link.] .... Muốn nhiều dòng liên kết thì copy dòng
và thay đổi những mục trong dấu ngoặc. Muốn có nhièu cột thì copy đoạn ... ra, đối với module 600 thì thường 3 cột, còn module 920 thì là 04 cột. Sau đó kết thúc bằng đoạn code:
Dạng 02: Quick menu có hiệu ứng Thường là đặt đầu blog, nên độ rộng giới thiệu là 920. Code về cơ bản giống dạng , nhưng khác tí xíu là định ID cho vùng dữ liệu trong table và có kèm CSS code. Các cột link liên kết: Muốn nhiều liên kết thì copy đoạn như trên, nhiều cột thì cũng copy đoạn ... , và kết thúc bằng đoạn code:
Và chèn đoạn code sau vào CSS của blog: #blog_quote {font-family:Arial;font-size:0px;font-weight:bold;color:#FEBF80;background:transparent;} #blog_quote:hover {font-family:Arial;font-size:12px;font-weight:bold;font-style:normal;color:#ffffff;background:transparent;} Chỉnh font chữ (font-family), cỡ chữ(font-size), kiểu chữ(font-weight), màu chữ (color)... lại cho phù hợp theo blog mình!Trên đây chỉ là 1 số thành phần trang trí mà tui thấy hay hay, còn những dạng khác nhưng thấy không tiện ích nên không nghiên cứu và giới thiệu, mọi người có thể tìm trên internet hen! Đôi điều nhắn gửi: Nếu như là bạn bè của vinhquanga3 thì chắc ai cũng từng thấy trên giao diện trang chính của blog vinhquanga3 lúc trước rất nhiều những thành phần trang trí, nhưng giờ thì hầu như không còn nhiều. Khi trang trí, ai cũng mong muốn cho blog xinh nhưng c àng nhiều trang trí nhất là Flash thì khi load và chuyển dữ liệu trang blog sẽ nặng nề hơn, nên khuyên các bạn nên trang trí những thành phần hữu ích thật sự thôi, để blog về đúng bản chất và mục đích của nó: Gửi nhận, chia sẻ tâm tư tình cảm, giao lưu, học hỏi, kết bạn và giải trí sau những căng thẳng đời thường của mỗi người ! Vài bữa tới sẽ hướng dẫn vài code CSS trang trí blog, ai có thắc mắc để lại comment rảnh rỗi tui giải đáp hen! Không quan trọng bản quyền, chia sẻ để biết được nhiều hơn, ai thích lấy đăng lại thì ping tui cái là được rùi!>> Lưu ý: Những đoạn Code trên hiệu lực trong thời điểm viết bài (15.09.2010), sau này còn giá trị không thì còn tùy ở nhà phát triển sản phẩm Yahoo! 360plus! Xem thêm: