การใส่ YouTube ลงในบลอค

posted on 13 Feb 2007 00:26 by jennessa  in Design

ตอนเริ่มทำบลอคแรก ๆ ไม่มีความรู้เกี่ยวกับการแต่งบลอคเลยค่ะ หลังจากสมัครสมาชิกที่ Exteen และเริ่มอยากจะมี blog header เป็นของตัวเอง เป็นแรงบันดาลใจทำให้หันมาศึกษา CSS แล้วลองผิดลองถูก จนเขียนมาได้หลายหัวข้อ ^ ^" ทั้งหมดที่เขียนมา ดูได้ที่นี่นะคะ Click

วันนี้มาดูการใส่ YouTube ลงในบลอคกันค่ะ เชื่อว่าทุกคนก็คงอยากจะเอาวีดีโอที่เราเห็นว่าสุดจะเจ๋ง มาลงในบลอคเพื่อให้คนอื่นได้ดูกันบ้างแน่ ๆ มีวิธีทำดังต่อไปนี้ค่ะ

1. ไปที่ YouTube ก่อนค่ะ แล้วคลิกเลือกวีดีโอที่เราต้องการ

2. จากนั้นให้ดูทางขวาของวีดีโอ ในส่วนที่เป็นข้อมูลเกี่ยวกับวีดีโอ ให้ copy โค้ดตรง Embed เก็บไว้ก่อนค่ะ ดังรูป

Copy Embed Code

ตัวอย่างโค้ดตรง Embed:

<object width="425" height="350"><param name="movie" value="http://www.youtube.com/v/6gmP4nk0EOE"></param><param name="wmode" value="transparent"></param><embed src="http://www.youtube.com/v/6gmP4nk0EOE" type="application/x-shockwave-flash" wmode="transparent" width="425" height="350"></embed></object>

เราสามารถกำหนดความกว้างยาวของวีดีโอได้ โดยใส่ค่าใหม่ตรง width คือค่าความกว้างของวีดีโอ และ height คือค่าความสูงของวีดีโอ ตรงที่ hilight ไว้นะคะ

3.จากนั้น ตอนเขียนบลอคใหม่ เมื่อพิมพ์ไปถึงตำแหน่งที่เราจะใส่ youtubeให้กดที่ปุ่มเพื่อเข้าสู่ HTML Mode ดังรูป

Toggle HTML Source

4. วางโค้ดที่ copy มาจากเวบ youtube (จากข้อ 2) จากนั้นกดปุ่มเดิม เพื่อกลับสู่ Mode เดิม

5. เสร็จแล้วค่ะ แค่นี้เราก็มีวีดีโอจาก YouTube ในบลอคเราแล้วค่ะ (^ ^)V

บลอคหน้าจะเอาวีดีโอเกี่ยวกับ web 2.0 มาให้ดูค่ะ เราว่ามันเจ๋งมาก ๆ >_<

Comment



smilebig smileopen-mounthed smileconfused smilesad smileangry smiletonguequestionembarrassedsurprised smilewinkdouble winkcry

Tweet

มาอ่าน .. เก็บความรู้
อืม ... วีดีโอ youtube
พยาม ปรับ จะให้เป็น wide screen
มันไม่ยอม ..ออกมาตามใจ

อ่อ .. อีกอันครับ เรื่อง การดูด
you tube มาลง ipod vdo
รู้สึก หาตัว work ๆ ไม่ได้
ถ้าเกิด มีอะไร เด็ดๆ มาลงด้วยนะครับ

#1 By (¯`•¸®·neo590·) °´¯)* on 2007-02-13 06:17

ถ้าผมไม่ได้ใช้adsl จะช้ามั้ยครับตอนเปิดหน้าที่มีyourtube อยากทำครับ

#2 By นายบวก on 2007-02-13 09:41

that's kool

#3 By karaveak on 2007-02-13 11:53

แง่ว
ลงตัดหน้าซะแล้ว
กะว่าจะลงให้คนที่ไปอ่านบลอกพอดีเลย เฮ่อ
นี่ละน้า ผลของการไม่ขยันอัพบลอก
ถ้าลงซ้ำอีก เจนจะโกดเรามั้ยง้า

#4 By Amilin on 2007-02-13 17:32

มาบลอกนี้แล้วได้ความรู้เยอะเลย
จะติดตามไปตลอดเลยนะ

#5 By cha_o_chan on 2007-02-13 18:02

เวบสวยจัง แถมมีให้ความรู้ด้วย ไว้จะแวะมาบ่อยๆ
ปล. อยากดู vdo web 2.0 จัง

#6 By จ๊ะเอ๋ on 2007-02-13 22:15

ตอบคุณ neo590 --> อันนี้ไม่ทราบเหมือนกันค่ะ iPod ยังไม่มีเลยค่ะ ขอเก็บตังค์ก่อน

ตอบคุณ นายบวก --> ตอนเปิดไม่น่าจะช้ามากนะคะ แต่จะช้าตอนกด play แล้วอะค่ะ จะโหลดนานหน่อย

ตอบคุณ Texa689flyfollium --> พอดีเห็นวีดีโอ web2.0 ที่อยากให้คนอื่นได้ดูบ้าง เลยเอาวิธีลงมาลงไว้ก่อนค่ะ เขียนอีกได้เลยค่า

#7 By เจนเนสซ่า on 2007-02-13 23:18

ipod สูบจาก youtube ได้เลยเหรอ ไม่เห็นเคยได้ยินเลยค่ะ
.
บลอคนี้ความรู้เน้นๆนะเนี่ย.. ขอบคุณที่มาเม้นท์นะคะ ไว้จะแวะมาบ่อยๆ

#8 By SweetPuff on 2007-02-14 01:00

เจ๋งครับ ขอบคุณที่เข้ามาให้ฟามรู้

#9 By Cyber-world (124.121.190.34) on 2007-02-16 16:48

เจ๋งครับ
ขออนุญาต add นะครับ

#10 By apple666 (Nopphasul) on 2007-02-18 23:50

โอ้ ขอบคุณนะคะที่สอน กำลังแย่อยู่เลยคะว่าจะอัพ youtube ได้ยังไง แฮะๆ ดีใจจัง >_<"

#11 By \•Milo Studio•/ on 2007-02-25 03:22

โิืิอ ขอบคุณมากครับ

#12 By boro on 2007-06-12 20:25

ขอคุงมากเน้อ

#13 By เจ้ย (222.123.130.18) on 2007-09-02 20:18

ระเอียดกว่านี้ได้มะครับ งง อ่า

#14 By +++BadHoriZon+++ on 2007-09-17 18:48

วันนี้จะลองทำดูค่ะsurprised smile

#15 By warmness on 2007-11-12 15:45

ขอบคุณมากค่ะได้ความรู้ไปละ อิอิconfused smile

#16 By raccoon on 2008-01-08 03:28

ว้าวๆๆๆๆๆๆๆว้าว!open-mounthed smile

#17 By !@!MaGGi_MaX!@! on 2008-03-13 22:45

ขอบคุณมากๆๆๆๆๆค่ะ

#18 By +>!PoOh Pai on 2008-03-26 10:55

. . ลงได้แต่ดูไม่ได้อ่าฮะ - -^

. . ขอบคุณน๊าค้าบ
ของผมไม่เห็นมี <> เลยน่ะ แฮะๆ งงไป
มีแต่ edit html source แต่วางแล้ว view ไม่ขึ้นอยู่ ผิดพลาดตรงไหน แนะนำด้วยครับ

#20 By LuK on 2008-11-28 10:37

ได้แว๊ววว THX na~

#21 By LuK on 2008-11-28 10:48

หา <> ไม่เจอเช่นกันค่ะ ลองใส่ใน edit htme code แบบคุณ luk ก็ไม่ประสบผลเหมือนกันค่ะ
รบกวนช่วยแนะนำด้วยค่ะ
ถามเพิ่มค่ะ หากว่าไม่ใช่ลิงค์จาก youtube แต่เป็นจากเว็บอื่น เช่นพวก Tudou สามารถใช้ Code เดียวกันได้หรือป่าวคะ ? แล้วเปลียนแค่ URL ของลิงค์ค่ะ

ลองทำของเว็บอื่น มันไม่ขึ้นน่ะค่ะ เห็นเป็นสีขาว ๆ แต่ของ youtube ทำได้แล้วค่ะ

#23 By virusring on 2008-12-12 11:30


ขอบคุณมากครับ

สงสัยอยู่นานแล้ว ได้ความกระจ่างซะทีนึง confused smile

#24 By Puttiano i2ossi on 2009-01-20 16:24

ขอบคุณครับ หาวิธีทำอยู่เลย
ถ้าไม่เห็น <> จะทำไงน้อ

#25 By jumper on 2009-01-25 16:11

ของผมเองก็ไม่มี <> เหมือนกันครับ ไม่ทราบว่าต้องทำอย่างงัยให้มีเพิ่มขึ้นอ่ะ

#26 By Rirera on 2009-02-11 13:39

กดปุ่ม HTML ค่ะ รู้สึกจะเป็นปุ่มสุดท้าย มันจะขึ้นหน้าต่างมีโค้ดมาให้ เราก็ใส่โค้ดในนั้นได้ค่ะ

#27 By เจนเนสซ่า on 2009-02-11 18:04

ขอบคุณมากๆเลยค่ะ ^^

#28 By ariko on 2009-03-14 20:00

ขอบคุณมากค่ะ
จะลองเอาไปทำนะค่ะ

#29 By pla on 2009-03-18 15:46

ขอบคุณคร๊าบ!

#30 By mumu on 2009-04-11 00:44

ขอบคุณมากกกกกกกเลยคะ อิอิ
ใส่ได้แล้วดีใจมากมายbig smile big smile big smile big smile

#31 By coolkiss on 2009-05-06 17:31

ขอบคุณมากๆเลยค่ะ ><

คราวหน้าจะได้ทำเป็นซะที sad smile

#32 By Berzentyle~* on 2009-05-14 20:31

ขอบคุณนะค่ะ

#33 By saiiz❤h HSJ on 2009-05-16 10:06

แวะมาเก็บความรู้ครับ

ขอบคุณมากมาย

#34 By Yamamoto_kinG on 2009-05-24 21:45

ขอบคุณมากครับ

เจ๋งๆ confused smile

#35 By [ HOoliGan ] on 2009-05-31 13:20

ขอบคุณสำหรับความรู้คร้าบ
รักคุณจัง....จุฟ จุฟ จุฟ จุฟ

#37 By on 2009-06-24 13:46

ขอบคุณครับbig smile

#38 By tomatong on 2009-07-26 21:24

ขอบคุณมากๆครับ เป็นพระคุณอย่างสูง
อยากลองมีblogของตัวเองบ้าง แต่หาแรงบันดาลใจไม่ได้เลยแฮะ ว่าจะเขียนเรื่องไรดี ตอนสมัครสมาชิก ชะงักตรงชื่อblog เนี่ย เลยหยุดแค่นั้นไม่ต่อล่ะ...

#40 By maemodnoy (58.137.10.21) on 2009-07-28 14:06

อ้าย ยยยยยยยยยยยยยยย ใส่ได้แล้ว

ขอบคุณมากค่ะ ^^

#41 By ~ nara ~ on 2009-08-14 22:38

<object width=\"425\" height=\"344\"><param name=\"movie\" value=\"http://www.youtube.com/v/3rjMPXN5jrE&hl=en&fs=1&\"></param><param name=\"allowFullScreen\" value=\"true\"></param><param name=\"allowscriptaccess\" value=\"always\"></param><embed src=\"http://www.youtube.com/v/3rjMPXN5jrE&hl=en&fs=1&\" type=\"application/x-shockwave-flash\" allowscriptaccess=\"always\" allowfullscreen=\"true\" width=\"425\" height=\"344\"></embed></object>

#42 By dgdfgdgd (125.24.150.198) on 2009-08-22 11:41

ขอบคุณ สำหรับทริก

#43 By เอ็ด (125.27.214.2) on 2009-08-24 10:43

ขอบคุณมากๆคร้า~ ^^Hot!

#44 By PIAM . on 2009-10-18 19:29

ขอบคุณสิ่งดี ๆ ที่เขียนไว้ มีประโยชน์มากมายคับbig smile

#45 By Pe@ & KeE on 2009-10-28 08:36

ของผมก็ไม่มี <> เหมือนกัน

ต้องทำไงอ่า..

#46 By modernpostman on 2009-10-31 18:55

ขอบคุณมากครับ big smile

#47 By Pathetique on 2009-11-07 14:10