Tạo code nhanh cho NCT và Zing

by carolinejudith Mon Oct 03, 2011 9:21 am

Hôm nay tôi đưa tool của DeLight vào diễn đàn để rút ngắn thời gian cho các bạn tạo code nhúng nhạc NCT và Zing vào 360Plus và mọi webpage với nhiều giao diện khác nhau. Bạn có thể tạo code nhúng trực tiếp các file nhạc MP3, MP4 và FLV.

Giao diện có 3 trang. Bạn đang ở trang "Tạo playlist nhạc"

Bài 1: Tạo Playlist nhạc

A- Các dạng link mà bạn có thể dùng:

I- NCT
1- Dạng nhạc đơn (audio và video) http://www.nhaccuatui.com/nghe?M=bYXdbOZGC_ : Bấm nút "Chia sẻ" bên dưới player > Copy dòng "Link nhạc". Với video, bạn chỉ có thể khai thác giao diện Default mặc định.
2- Dạng playlist (audio và video) http://www.nhaccuatui.com/nghe?L=q_epm8ao6jCv : Bấm nút "Chia sẻ" bên dưới player > Copy dòng "Link nhạc". Với video, bạn chỉ có thể khai thác giao diện Default mặc định.
3- Dạng nhạc đơn (audio và video) http://www.nhaccuatui.com/m/bYXdbOZGC_ : Bấm nút "Chia sẻ" bên dưới player > Copy dòng "Copy vào diễn đàn" xong xóa bỏ cặp thẻ [ FLASH] [ /FLASH] ở đầu và cuối. Với video, bạn chỉ có thể khai thác giao diện Default mặc định.
4- Dạng playlist (audio và video) http://www.nhaccuatui.com/l/q_epm8ao6jCv : Bấm nút "Chia sẻ" bên dưới player > Copy dòng "Copy vào diễn đàn" xong xóa bỏ cặp thẻ [ FLASH] [ /FLASH] ở đầu và cuối. Với video, bạn chỉ có thể khai thác giao diện Default mặc định (list dọc)và Default 2 (list ngang).

II- ZING

1- Dạng audio đơn http://mp3.zing.vn/bai-hat/A-E/IW7IUWU7.html : Copy dòng địa chỉ
2- Dạng audio album http://mp3.zing.vn/playlist/Lil-Shady/IW6IWCB8.html : Copy dòng địa chỉ
3- Dạng nhạc đơn (video) http://mp3.zing.vn/video-clip/Eternal-Flame/ZWZ9B00C.html : Copy dòng địa chỉ. Bạn chỉ có thể khai thác giao diện Default mặc định.

III- Youtube
Dạng nhạc đơn (video): https://www.youtube.com/watch?v=wkvLPKy0oCk : bạn hãy copy dòng địa chỉ.
Bạn chỉ có thể khai thác giao diện Default mặc định.

IV- Đường dẫn trực tiếp

Các đường dẫn MP3, MP4 và FLV. Bạn chỉ có thể khai thác giao diện Default mặc định.

Các bài kế tôi sẽ phân tích các tiện ích của tool

-CAROLINE JUDITH

by carolinejudith Mon Oct 03, 2011 11:35 am

Bài 2: Các loại player của tool

B- Những tham số cần thiết lập ngay

1- Chế độ tự động nghe nhạc: Mặc định để Có. Theo tôi thì nên dùng Không
2- Chế độ nghe lặp lại: Mặc định để Có. Theo tôi thì nên dùng Không
3- Bài hát nhảy ngẫu nhiên: Mặc định để Không. Nếu cần chế độ này bạn bấm Có và nên kết hợp với Chế độ tự động nghe nhạc Có.
4- Các tham số dimension
- Audio đơn: width= 70, height= 300
- Video đơn: width= 300, height= 300
- Audio list: width= 400, height= tùy chiều dài list
- Video list: width= 300, height= tùy chiều dài list nhưng lớn hơn 300
- List ngang: width= 500, height= tùy chiều dài list
5- Ẩn trình chơi nhạc. Mặc định không chọn. Để trình nghe nhạc sẽ thú vị hơn.

C- Chọn lựa player

Có thể sắp xếp các player trong tool này thành 3 loại

I- Loại cổ điển màu solide

1- Các tùy chọn giao diện: Default cho nhạc đơn, cho list dọc (cả video lẫn audio, cho NCT, Zing và Youtube, đồng thời cả đường dẫn trực tiếp) và Default 2 cho list ngang (NCT - audio/video, Zing - audio album)
2- Màn hình nền đen mặc định.
3- Cho phép thêm logo trong code nhúng (bạn có thể khái thác để đưa logo của nghệ sĩ vào khung display).
4- Các tham số dimension : xem mục B

II- Loại Fantasie

1- Các tùy chọn giao diện: Có đến 14 giao diện là những player của 1 tác giả người Hoa.
- Pic 1 - Pic 2 - Pic 3 - Gấu 1- Gấu 2 - Musicnote - Teddy - Halo - Fairy - Thỏ - Hoa - Mouse - Flower - Music.
2- không hỗ trợ video
3- không hỗ trợ đường dẫn trực tiếp
4- width = 150 đến 170 ; height= 260 đến 300.

III- Loại nền trong suốt

1- Các tùy chọn giao diện: gồm 18 flash nền + 1 hình tự chọn
- hình nền Anh và Em
- hình nền Hoa Hồng
- hình nền Hòm Thư Tình Yêu
- hình nền NonStop
- hình nền Hôn Nhau
- hình nền Góc yên tĩnh
- hình nền Mưa rơi
- hình nền Trắng Bạc
- hình nền Cây xanh
- hình nền Trái tim
- hình nền Bướm bay
- hình nền Cỏ xanh
- hình nền Xuyến Chi
- hình nền Hoa và bướm
- hình nền Hoàng Hôn Tím
- hình nền Trúc Xanh
- hình nền Hướng Dương
- hình nền Đèn màu
- hình nền tự chọn (dạng jpg, gif, png và swf)
2- không hỗ trợ viddeo
3- không hỗ trợ đường dẫn trực tiếp
4- Các tham số dimension : xem mục B. Nếu chọn hình nền tự chọn, phải tham khảo dimension của hình.

Sau khi chọn và nhập tham biến đầy đủ, bạn bấm nút "Lấy Code" rồi chờ code xuất hiện cùng với khung preview. Vừa ý thì bấm vào ô text rồi copy vào trang bài viết.

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

-CAROLINE JUDITH-

by carolinejudith Mon Oct 03, 2011 3:36 pm

Một ví dụ

Giả thiết bạn muốn player lồng hình của bạn hát bài Oh Carol tại địa chỉ Zing là: http://mp3.zing.vn/bai-hat/Oh-Carol-Smokie/IWZAFE9E.html

Bạn thực hiện như sau:
1- Nhập địa chỉ trang nhạc vào dòng "Link nhạc"
2- Bấm "Không" vào các dòng "Chế độ tự động nghe nhạc" (bởi vì người nghe chưa chắc chịu nghe bài hát bạn thích) và "Chế độ nghe lặp lại" (bởi vì người nghe thường thì chỉ chịu nghe 1 lần).
3- Bấm vào nút radio "Tự chọn". Một ô text xuất hiện. Nhập địa chỉ hình vào ô đó.
4- Nhập số cho Rộng và Cao bằng với hình (330x500)
5- Bấm dấu kiểm "Ẩn trình nghe nhạc" (vì nó che khuất phần trên của chân dung)
6- Bấm nút "Lấy Code" rồi chờ code xuất hiện cùng với khung preview. Vừa ý thì bấm vào ô text rồi copy vào trang bài viết.

Code nhúng thu được là

Player hiển thị như thế này

Chúc bạn thành công
-CAROLINE JUDITH-

by carolinejudith Mon Oct 03, 2011 5:32 pm

Bài 4: Logo trong player

Bạn có thể lồng logo vào player cổ điển
1- Logo của bạn: Thường thì bạn dùng trong giao diện nhạc đơn
- Logo chữ. Ví dụ: http://www.fileden.com/files/2011/8/4/3177804//CJlogos.gif (43x15)
- Logo hình: Ví dụ: http://seablogs.zenfs.com/u/Eq40CCmdGxKH0P5pvnydOAg-/profile/2.jpg (103x135)
2- Logo hình của nghệ sĩ. Thường thì bạn dùng trong giao diện list ngang. Ví dụ: http://s2.gonct.info/playlist/2011/09/08/f8uZ0BOp4aRb.jpg (190 x 184 )
Cách làm:
Lấy code từ giao diện Default hoặc Default 2 xong, bạn xem trong code, thấy sau logo= không có link nào làm value . Bạn hãy chèn link của hình vào rồi chỉnh sửa displayheight , height và width.

I- Logo chữ của bạn

Bài "Tình Yêu Trả Lại Trăng Sao - Quốc Đại" (Lê Dinh)
Địa chỉ: http://mp3.zing.vn/bai-hat/Tinh-Yeu-Tra-Lai-Trang-Sao-Quoc-Dai/ZWZAOE8B.html
Logo: http://www.fileden.com/files/2009/8/26/2555918//CJ-logo.gif
Thiết kế: bạn cứ cho displayheight= 50 | height= 90 | width=300 là được.

Code nhúng của ví dụ là:

Player hiển thị:

II- Logo hình của bạn

Ví dụ, Bài "Đêm Trăng Thu" - Thùy Chi & M4U
Địa chỉ: http://www.nhaccuatui.com/nghe?M=nju5wyZZpX
Logo: http://seablogs.zenfs.com/u/Eq40CCmdGxKH0P5pvnydOAg-/profile/2.jpg (103x135)
Cần làm sao cho nút play không đè lên mặt.
Tham số quan trọng nhất là displayheight.
Displayheight = height của hình +40 . Cụ thể
Height của player = height của hình + 60 (NCT) hoặc + 40 (Zing)
Width của player= width của hình + 40

Thực tế để làm player này tôi đã cho width="300" height="160" và displayheight=140 (20 dành cho Control bar)

Code nhúng là:

Player:

III- Logo hình của nghệ sĩ

Playlist: Lê Tấn Quốc - Im Lặng
Địa chỉ: http://www.nhaccuatui.com/nghe?L=f8uZ0BOp4aRb
Logo: http://s2.gonct.info/playlist/2011/09/08/f8uZ0BOp4aRb.jpg (190 x 184 )
Thiết kế: displaywidth= width của hình = 190 | height= height của hình + 10 = 194

Code nhúng của ví dụ là:

Player hiển thị:

Chúc bạn thành công
-CAROLINE JUDITH-

by carolinejudith Mon Oct 03, 2011 7:09 pm

Bài 5: Nhúng bằng Đường dẫn trực tiếp

Chỉ giao diện cổ điển mới cho phép dùng đường dẫn trực tiếp. Thực tế không cần đến tool và cũng không cần xml + cấu hình. Bạn chỉ cần 1 bộ code mẫu nhúng nhạc đơn audio/video đơn giản mà thôi.

Đây là code mẫu

Cách dùng:
1- Ghi chồng đường dẫn file nhạc lên chuỗi Mp3Mp4FlvUrl trong code mẫu
2- Ghi chồng đường dẫn file hình lên chuỗi LogoUrl trong code mẫu
3- Chỉnh tham số height cho video = 300

Ví dụ, bài hát Tàn Nhịp Liên Hoan - Trúc Mai - đường dẫn http://www.fileden.com/files/2009/8/26/2555918/TanNhipLienHoan-ToHuyenVi-TrucMai.mp3
Logo: http://www.fileden.com/files/2011/8/4/3177804//CJlogos.gif

Code nhúng là

Player hiển thị như thế này:

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

-CAROLINE JUDITH-

by carolinejudith Tue Oct 04, 2011 8:41 am

Bài 6: Video Youtube với giao diện khác

Code nhúng màYoutube cung cấp thì hiệu lực trên mọi website và rất dễ sử dụng. Nhưng, một khi bạn đã quyết định dùng tool này là do muốn thay đổi hình thức player.
Bạn hãy vào Tool.

A- Video đơn

Cách thao tác cực kỳ đơn giản
1- Nhập link trang Youtube vào ô "Link nhạc". Ví dụ: https://www.youtube.com/watch?v=wkvLPKy0oCk
2- Có thể thay đổi tùy chọn chế độ tự động play và chế độ lặp lại.
3- Không bấm chọn giao diện nào khác. Phải giữ yên giao diện Default.
4- Tham số Rộng và Cao mặc định là thích hợp, không cần sửa.
5- Bấm nút "Lấy Code".
6- Xem kết quả preview xong thì copy code.

B- Video list

Bạn hãy trở lại đỉnh trang tool rồi bấm "Tạo playlist Youtube"
1- Bên trong form bạn lần lượt nhập các link của video. Mỗi link 1 dòng.
2- Có thể thay đổi tùy chọn chế độ tự động play và màu giao diện.
3- Có thể nhập link của logo
4- Tham số Rộng và Cao mặc định là thích hợp, không cần sửa.
5- Bấm nút "Lấy Code"
6- Xem kết quả peview xong thì copy code.

Tôi thấy không cần minh họa gì cho tiện ích này.

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

-CAROLINE JUDITH-

by carolinejudith Tue Oct 04, 2011 8:58 am

Bài 7: Lập code chèn flash vào 360Plus

Nếu code nhúng flash của bạn không thể vào Plus được thì bạn dùng trang này để lấy code của flash tải.
1- Bạn hãy trở lại đỉnh trang tool rồi bấm "Chèn File Flash".
2- Bạn hãy chuẩn bị link của flash trước khi nhập vào giao diện
- Nếu bạn copy "Code nhúng vào diễn đàn" thì bạn xóa cặp thẻ [ FLASH] và [ /FLASH] ở đầu và cuối mã.
- Nếu bạn có code đã tích hợp biến thì bạn copy toàn thể chuỗi bên trong dấu nháy kép của thành phần src="flashcode" . Bạn có thể nhận dạng được sự tích hợp biến nếu trong src="" bạn thấy có chuỗi .swf?variations
- Nếu trong flash của bạn chưa tích hợp biến thì bạn thực hiện phép ấy. Bạn có thể nhận biết trường hợp này khi bạn thấy có thành phần flashvars="variations" trong code. Cách tích hợp biến như sau:
- Đặt 2 thành phần ấy kề nhau như: src="flashcode" flashvars="variations".
- Ghi chồng dấu hỏi (?) lên chuỗi ~~" flashvars="~~ , kết quả như sau: src="flashcode?variations"
- Đem code nhận được ở 2- paste vào ô có http://
3- Nếu cần thì nhập tham số Chiều Rộng và Chiều Cao
4- Nếu trang của bạn nhận thẻ iframe thì bạn bấm chọn "Chèn flash trong một đối tượng iframe" cho gọn. Nếu dùng 360Plus thì không chọn.
5- Bấm nút "Lấy Code". Mã HTML tự động copy vào clipboard. Bạn chỉ cần paste vào trang bài viết.

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

-CAROLINE JUDITH-

by Thị Hến Tue Oct 04, 2011 4:37 pm

caro giỏi vi tính quá hen anmung

by carolinejudith Tue Oct 04, 2011 6:58 pm

Thị Hến đã viết:caro giỏi vi tính quá hen

Bạn quá khen đấy nhá!
Hi Hi
Cảm ơn lời khen tặng của bạn
CJ

by Sponsored content

Tạo code nhanh cho NCT và Zing

Tạo code nhanh cho NCT và Zing

Bài 2: Các loại player của tool

Bài 3: Ví dụ cách dùng tool

Bài 4: Logo trong player

Bài 5: Nhúng bằng Đường dẫn trực tiếp

Bài 6: Video Youtube với giao diện khác

Bài 7: Lập code chèn flash vào 360Plus

Re: Tạo code nhanh cho NCT và Zing

Re: Tạo code nhanh cho NCT và Zing

Re: Tạo code nhanh cho NCT và Zing