Vimeo, Youtube 자동 썸네일 생성법(TED 추���)
Shortcut
PrevPrev Article
NextNext Article
Shortcut
PrevPrev Article
NextNext Article
Original source | XE 공식 홈 페이지 > 웹마스터 팁 > 회원 마나풀님��� |
---|---|
Original source URL | https://www.xpressengine.com/tip/19939773 |
제��� 만들고 있는 사이트는 youtube나 vimeo 의 소스퍼오�� (iframe 으로 시작하는..) 을 이용해서 많은 동영상을 올릴려고 하��� 있습니다. (계획���입니다...)��
그래서 어떻게 생성할���... 하��� 인터넷에서 방���을 찾아서 썸네일 생성하��� 만들었습니다.
댓���에는 동영상 썸네일 생성의 필요성을 못느껴서 일단 본문만 적용했습니다.
일단 vimeo 입니다. 아래 함수를 추���해주세요... (저���은 경우 그냥 document.item.php �� 마������에 추���했습니다..)
1 | function getVimeoInfo( $id , $info = 'thumbnail_medium' ) { |
1 | if (!function_exists( 'curl_init' )) die ( 'CURL is not installed!' ); |
1 | $ch = curl_init(); |
1 |
1 | curl_setopt( $ch , CURLOPT_HEADER, 0); |
1 | curl_setopt( $ch , CURLOPT_RETURNTRANSFER, true); |
1 | curl_setopt( $ch , CURLOPT_TIMEOUT, 10); |
1 | $output = unserialize(curl_exec( $ch )); |
1 | $output = $output [0][ $info ]; |
1 | curl_close( $ch ); |
1 | return $output ; |
1 | } |
이 함수는 vimeo video id로 이미���를 가������ 오는 함수입니다...(퍼왔습니다...) 참������ curl을 필요��� 합니다.. 없으시면.. 다�� 방���으로 대체 해주세요...
다음에 document.item.php 에 getThumnail() 함수에서
1 | if ( $source_file ){ |
1 | $output = FileHandler::createImageFile( $source_file , $thumbnail_file , $width , $height , 'jpg' , $thumbnail_type ); |
1 | } |
를 찾아서 바��� 위에 "}" 앞에 아래 코드를 추���합니다
1 | preg_match( '/http:\/\/player.vimeo.com\/video\/(\d+)/' , $content , $matches ); |
그러�� 썸네일 생성을 해줍니다...
마찬가������ Youtube는 조��� 더 쉽습니다..
위에 마������에 언급했던 곳에 ��
��}��
와 같이 추���해주시면 됩니다....
제 파일을 첨���합니다..
사실 네이버도 해보���싶은데 아��� 필요성을 못느껴서-_-;;
더 좋��� 수정 가능하거나 방��� 있으��.. (최적화?) 덧글 달아주세요... 감사합니다.
document.item.php��
추���..
최근에 vimeo와 youtube에 이어서 TED동영상들도 지원하��� 되었습니다.
하������.. 생길지 모르는 문제는... object사이에 있는 .jpg�� 가��� 링크들의 썸네일을 생성한다.. 입니다..--; 제��� 아��� 정��� 표현에 좀 약해서.. --;; 파일 첨��� 합니다..document.item.php (vimeo/youtube/ted 모두 포함..)
사용하실때 덧글 남겨주시면 매우 감사하���습니다..
문제점 발견하시면..(위에 제��� 언급 했던 문제라도..) 말씀해주세요...
[ 댓��� 스크랩 ]
댓��� 47
마나풀
2011.08.12 11:17
레알���네
2011.08.16 16:12
Youtube 썸네일 생성의 경우 document.item.php 에 '마찬가������ 언급했던 곳에'... 이하의 소스부������ 붙이�� 되나요?마나풀
2011.08.17 13:54
네.. 그렇습니다... 만.. 가끔 안되는 ID들이 있더군요...12345678910111213141516171819202122232425262728293031323334353637383940414243444546/*
* Function to parse the id from all different types of Youtube Embed Codes and Youtube Urls
*
* @author Andreas Grundner
* @date 22.07.2011
* @licence freeware
* @param string youtube url, embed code, share code, channel code ...
* @return string youtube_id
*/
function
getYoutubeId(
$sYoutubeUrl
) {
# set to zero
$youtube_id
=
""
;
$sYoutubeUrl
= trim(
$sYoutubeUrl
);
# the User entered only the eleven chars long id, Case 1
if
(
strlen
(
$sYoutubeUrl
) === 11) {
$youtube_id
=
$sYoutubeUrl
;
return
$sYoutubeUrl
;
}
# the User entered a Url
else
{
#
try
to get all Cases
if
(preg_match(
'~(?:youtube\.com/(?:user/.+/|(?:v|e(?:mbed)?)/|.*[?&]v=)|youtu\.be/)([^"&?/ ]{11})~i'
,
$sYoutubeUrl
,
$match
)) {
$youtube_id
=
$match
[1];
return
$youtube_id
;
}
#
try
to get some other channel codes,
and
fallback extractor
elseif
(preg_match(
'~http://www.youtube.com/v/([A-Za-z0-9\-_]+).+?|embed\/([0-9A-Za-z-_]{11})|watch\?v\=([0-9A-Za-z-_]{11})|#.*/([0-9A-Za-z-_]{11})~si'
,
$sYoutubeUrl
,
$match
)) {
for
(
$i
=1;
$i
<=4;
$i
++) {
if
(
strlen
(
$match
[
$i
])==11) {
$youtube_id
=
$match
[
$i
];
break
;
}
}
return
$youtube_id
;
}
else
{
$youtube_id
=
"No valid YoutubeId extracted"
;
return
$youtube_id
;
}
}
}
위 함수를 추���해주시���..(마������에 ?> 위에 추��� 해주세요...)123456789101112131415161718$youtubeid
= getYoutubeId(
$content
);
//'!http:\/\/w{0,3}\.youtube[^\' \'\n\r"]+!';
//preg_match_all($erg, $content, $mtc, PREG_PATTERN_ORDER);
if
(
$youtubeid
!=
"No valid YoutubeId extracted"
)
{
$tmp_file
= sprintf(
'./files/cache/tmp/%d'
, md5(rand(111111,999999).
$this
->document_srl));
if
(!
is_dir
(
'./files/cache/tmp'
)) FileHandler::makeDir(
'./files/cache/tmp'
);
FileHandler::getRemoteFile(
$target_src
,
$tmp_file
);
if
(
file_exists
(
$tmp_file
))
{
list(
$_w
,
$_h
,
$_t
,
$_a
) = @
getimagesize
(
$tmp_file
);
if
(
$_w
>=
$width
&&
$_h
>=
$height
)
{
$source_file
=
$tmp_file
;
$is_tmp_file
= true;
}
}
}
위 처럼 if ($source_file) { 앞에 추���해주시면 됩니다...
아.. 그리고 빼먹은 것이 있는데요..
// 첨���파일이 없거나 내용중 이미������ 없으�� return false; 라고 되어 있는 다음���을..1if
(!
$this
->get(
'uploaded_count'
) && !preg_match(
"!<img!is"
,
$this
->get(
'content'
)) && !preg_match(
"!<iframe!is"
,
$this
->get(
'content'
)))
return
;
처럼 바꾸셔야 iframe 인식하��� 넘어갑니다.. 저������은.. 지���도 조���씩 수정하��� 있어요.. youtube/vimeo 찾���;;;
��인간a
2011.08.17 17:03
iframe 은 글쓸떄 삽입 못하���안나요?마나풀
2011.08.22 00:47
www.g-reviewz.com/xe/ 에 오시면 위에 소스들을 적용 시���놨습니다.
본문 소스보다 바��� 위에 붙여드린 소스�� 적용 시키는��� 더 좋습니다.
���음���아선 diff patch해서 xe core 에 넣어달라.. 라고 하���싶은데-_- 어떻게 하는���도 모르고.. 신청했다가 안되면 마음 아플꺼 같���ㅠㅠ 그리고 무엇보다 허접한 소스라서-_-;;
혹 해보시��� 안되시면 말씀해주시면 도와드리겠습니다.��곰탱이^^
2011.08.23 02:20
document.item.php 만 적용하면 되나요?
기존에는 게시판내에서 동영상 아이프레임을 적용하면 관리자 모드��� 접근해서 해킹할우려가 다분하다는 말을 들은��� 같습니다.
일단 적용은 했습니다^^
그리고 아이프레임 말��� 일반적인 동영상 화면에서 우클릭하면 유투브에서 오브젝트 코드��� 복사되는데 이코드를 적용하더라도 썸네일이 생성이 되었으�� 합니다.
현재 아이프레임��� 썸네일이 생성이 되네요^^마나풀
2011.08.23 21:57
네.. 제��� 그거까���는 좀 귀찮아서(....)
전 iframe 만 써서 (...)1if
(!
$this
->get(
'uploaded_count'
) && !preg_match(
"!<img!is"
,
$this
->get(
'content'
)) && !preg_match(
"!<iframe!is"
,
$this
->get(
'content'
)) && !preg_match(
"!<embed!is"
,
$this
->get(
'content'
)))
return
;
이렇��� 해주면 되��� 않을��� 생���됩니다--;; 아 물��� 해보��� 않았습니다.. 쿨럭;;곰탱이^^
2011.08.23 22:12
마나풀님 감사합니다.
위소스는 위���에 상���없이 붙혀넣어도 되나요^^
아이프레임과 일반 엠���드 오브젝트 태그까��� 썸네일로 뿌려줄수 있다�� 정��� 멋������ 같습니다^^
그리고 추������문 하나��� 할���요..
이것을 확장변수에도 같이 사용가능할���요
예를 들어 저���은 경우 확장변수��� 여러줄 입력란에 텍스트라에 html이 적용되도��� 해놨는데 이것을 활용하��� 싶습니다.
아무튼 정��� 대단합니다.
네이버와 다음������ 확장할수 있다�� 더할나위없이 좋���군요^^마나풀
2011.08.26 00:46
1if
(!
$this
->get(
'uploaded_count'
) && !preg_match(
"!<img!is"
,
$this
->get(
'content'
)))
위���럼 되어 있는 곳을 찾아서 바���주시면 됩니다.
확장변수는.. 제��� 사실 잘 모���니다 ㅠㅠ
어떤 방식으로든 확장 변수 내용을 알 수 있다��... 가능은 하��������� 그정도������ 제��� 자세히 몰라서 말이죠 ^^;;
그리고 네이버/다음은 썸네일 생성하는��� 뭔��� 어렵군요. 시��� 날때 좀 봐야겠습니다..��고후
2011.08.31 17:05
마나풀
2011.09.01 11:14
생���보다 어렵진 않을꺼 같습니다.<object width="526" height="374"><param name="movie" value="http://video.ted.com/assets/player/swf/EmbedPlayer.swf"></param><param name="allowFullScreen" value="true" /><param name="allowScriptAccess" value="always"/><param name="wmode" value="transparent"></param><param name="bgColor" value="#ffffff"></param><embed src="http://video.ted.com/assets/player/swf/EmbedPlayer.swf"pluginspace="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" wmode="transparent" bgColor="#ffffff" width="526" height="374" allowFullScreen="true" allowScriptAccess="always" flashvars="vu=http://video.ted.com/talk/stream/2009/Blank/MaryRoach_2009-320k.mp4&su=http://images.ted.com/images/ted/tedindex/embed-posters/MaryRoach-2009.embed_thumbnail.jpg&vw=512&vh=288&ap=0&ti=549&lang=&introDuration=15330&adDuration=4000&postAdDuration=830&adKeys=talk=mary_roach_10_things_you_didn_t_know_about_orgasm;year=2009;theme=the_creative_spark;theme=unconventional_explanations;theme=speaking_at_ted2009;theme=whipsmart_comedy;event=TED2009;tag=Culture;tag=Science;tag=book;tag=history;tag=humor;tag=sex;tag=writing;&preAdTag=tconf.ted/embed;tile=1;sz=512x288;"></embed></object>
위 코드에서.. �� embed 사이에 ".mp4&su="와 ".jpg" 사이 주소��� 썸네일 주소입니다.. 음.. 시��� 되면.. 제��� 한��� 살펴 볼���요.. (요���은 좀 바���서;; ㅠㅠ)마나풀
2011.09.01 12:17
일단 아래 파일 받아서.. 기존 가������ 계시던거랑 비���해서.. 수정된 부��� 넣어주시면 됩니다.. 근데.. 너무 급하��� 만든거라.. -_-;; 잘 될���는 모르겠습니다. .쿨럭;;
참������.. 적용된 TED썸네일은 아래 게시판을 참���해주시��� 테스트 해보시면 됩니다.. (youtube/vimeo도 함꼐 됩니다.. 아���도..)
http://www.g-reviewz.net/xe/index.php?mid=mov_test&listStyle=gallery
��
덧글에 파일 첨������ 되��� 않아.. 본문에 첨���합니다...고후
2011.09.02 21:09
답변 감사합니다!
TED.com 동영상의 썸네일은 형성되는데
올�� 동영상의 글을 수정하려 했더니
'+ '수정, '삭제', '쓰��' 등의 버튼이 나타나��� 않습니다! ㅠㅠ
(크롬에서는 아예 안나타나���,
IE에서는 보이기는 하������ 오류���세지��� 뜨고 제일 아래 레이아웃이 깨���네요!)
아래 링크처럼요...
http://www.g-reviewz.net/xe/index.php?mid=mov_test&listStyle=gallery&document_srl=387
��
제��� 초보라 도저히 수정해도나타나���를 않네요!잘 되���를 않습니다!
한��� 더 지도해 주시면 감사하���습니다!
답답합니다! ㅠㅠ마나풀
2011.09.04 19:54
음..
저도원인은 잘 모르겠������..
HTML 모드��� 수정해서 바��� 저장 누르면저렇��� 되는��� 같아요 ㅠㅠ
HTML모드��� 수정 했다가 다시 기본에디터로 수정하니���..되긴 하네요..
이�� 더 고수님이 봐주셔야 할꺼 같아요...고후
2011.09.04 21:14
지���������의 팁���으로도 너무나 유익하��� 사용하��� 잇습니다!
감사합니다! (^^)��나뚜르
2011.09.12 14:49
너무 감사드립니다~ 잘 사용하��� 있습니다고후
2011.09.14 20:43
xe 1.5 버젼에서도 가능할���요?
ㅠㅠ
혹시나 해서 1.5 알파���젼에서 document.item.php �� 수정해 봤는데
안되네요...
바쁘시���������
초보에��� 다시 한 수 지도해주셨으�� 합니다!��마나풀
2011.09.17 23:12
제��� 아��� 1.5�� 받아보지 않았네요--;
아��� svn에 있는건 영 불안해서 말이죠;;
혹 가능하시면 document.item.php�� 올려주시면.. (압���해서 올려주세요...)
살펴 보���습니다.
��바람의매
2011.09.15 10:51
좋은 팁인데 애드온이나 모듈��� 나왔으�� 좋���네요마나풀
2011.09.17 23:09
애드온이나 모듈을 어떻게 만드는��� 몰라서요 OTL트루퍼
2011.09.15 18:55
다음, 네이버 동영상도 가능하면 좋���습니다.마나풀
2011.09.17 23:20
열심히(는 아니��� 틈나는데로...) 찾��� 있������.. naver는 일정��� 않은거 같���.. 다음도 패턴을 못찾겠네요 ㅠㅠ고후
2011.09.28 22:26
드디어 1.5 버젼이 발표되었는데
어떻게 하면 될���요? ㅠㅠ
한 수 지도를 ...
쿨럭이
2011.10.19 17:18
유투브 는 섬네일 잘 나오네요 간혹 안나오는���도 있긴하군용 ^^
비디오 영상 링크한거는 전��� 안나오네요;; 아쉬움 ㅠㅠ
똑디
2011.10.21 10:58
혹시 확장변수에 입력된 URL값을 기���으로 게시판 썸네일을 생성하는 방���은 모르시나요?
예를들어 즐겨찾기 사이트 같은���을 만들어 둘때 일일이 캡���해서 처리 할려니...
향후 사이트가 바뀌어 버리�� 그때���다 캡���하기도 그렇���...
재주꾼
2011.10.22 00:59
마나풀님 이번 업데이트 1.5에 좀 반영해주세요..
�� 이부���이 필요합니다.
그리고 위에 뚝디님이 질문한 확장변수 동영상 주소입력값을 받아 썸네일을 생성해주는 기능이 있었으�� 더 바랄���이 없습니다.
Goos
2011.10.31 21:50
정��� 좋네요. 개������이 1.5에 반영해주었으�� 좋���습니다.
we09
2011.11.02 15:48
동영상 올릴때���다 이미��� 하나씩 올리는��� 귀찮았는데...이런�� 나오�� 정��� 좋���습니다.
위 설명은 초보라 할 엄두는 안나���요. ㅎㅎ
bonik
2012.04.08 03:45
1.5.18 사용하��� 있습니다. 첨���파일 받아��������� 제 원본 파일�� 비���해 보면서 첨���된 부��� 수정했더니
1.5에서도 잘 되네요. 정��� 감사합니다.
김������412
2012.04.13 00:02
올려주신 파일을 덮어쓰�� 했더니 모든 게시판에서 댓���을 볼수��� 없어요..ㅜㅜ
bigblue2010
2012.05.30 18:53
1.5.2.5로 업뎃을 했더니.. 다시 안되네요... 어쩌���? ㅠㅠ
xe너무어렵다
2012.07.09 14:31
ㅠㅠㅋ 성공하셧나요 ?
엘엘
2012.06.04 04:04
마나풀님의 소스�� 요리조리 고������며 수정해봤������.. 1.5.2.5에서는 도무지 방���을 찾을 수��� 없네요. ㅠㅠ
혹시나 마나풀님을 비롯한 고수님들이 봐주실까 싶어 현재코어버젼의 파일.. 첨���합니다!
XE에서 자체적으로 기능을 만들어 주실 수 있으�� 얼마나 좋을���요... 또르��...
xe너무어렵다
2012.07.09 14:32
ㅠㅠㅋ 성공하셧나요 ?
shindn
2012.07.10 00:24
코어 1.5.2.5 입니다. 썸네일은 잘 작동하는데 댓��� 기능이 사라지네요..
xe너무어렵다
2012.07.12 23:31
코어 1.5.2.5 업데이트후 안돼는대~ 누구 해결하신��� 계신���요 ??? ? ㅠㅠㅋ
shyduke
2013.01.08 14:50
1.5.3.3버전인데 vimeo는 스케������갤러리에서 생성되���않네요.
오락실주인
2013.01.19 18:38
1.5.4.2 에서 사용해봤는데 기본게시판으로 ㅠ 아쉽게도 댓���창이 사라지네염 .ㅠ.ㅠ
남자인간
2013.01.23 03:07
XE Core ver. 1.5.4.2 사용자입니다
http://rhiro.com/index.php?document_srl=35450&mid=board37 여기보고 댓���창 문제��� 해결되었네요
참������ 유투브 올리실때 이전소스보기로 올리셔야 댓���창이 뜹니다
BonaSera
2013.01.23 17:46
글 올리���나서
글 본문 밑 목���보기��� 보면 섬네일은 잘 생성이 되는��� 같던데
그냥 목���화면 보기하면 섬네일 안나오지 않으시나요? 저는 그런 현상이 있는데
해당 글��� 섬네일을 보여주더라고요
남자인간
2013.01.25 00:39
저는 제대��� 작동하네요
원래 일반목록은 안나오고 image+text 에서��� 나오는거 아니에요?
BonaSera
2013.01.25 02:59
음... 일반목록 아니��� 스케������ 웹진형으로 보면
목���에는 섬네일이 하나도 안나오고 글 하나를 눌러서 들어가면
본문 나오고 밑으로 스크�� 내리면 목���을 또 �� 수 있��� 해놨는데
�� 목���에서는 섬네일이 보이네요 단 현재 열람���인 게시물의 섬네일만
어째뜬.. 전 왜 안 될���요~ 포기했어요 ㅠ.ㅠ
sound4u
2013.01.24 07:28
1.5.4.2 에 스케������ 게시판, 크��, 파이어폭스 사용자인데, 이 팁을 적용하면 댓���을 등록하면 "서���에 요청중입니다" 나오고 나서 브라우져가 리후레쉬가 안되���, 입력화면 그대��� 이네요. 그래서 수동으로 브라우저를 리���드하면 그때서야 댓���이 등록된 화면이 뜹니다.
왜 그럴까요?
시니시���
2013.01.26 12:35
모듈이나 애드온 만드는거 생���보다 싶습니다^^
https://www.xpressengine.com/manual
여기서 개���자 매뉴얼 다운 받으시면 안에 샘플이 있습니다.
�� 모듈이나 애드온으로 만드셔서 정식으로 출시하셨으�� 좋���네요 ㅎㅎ
코어는 왠���하면 건드리지 않는��� 좋아요 ㅎㅎ
sdkfj24
2013.08.20 09:16
마나풀님 께서 올려놓은 document.item.php 자���를 수정을 하���않��� 바��� 덮어쓰�� 했더니.. 유튜��� 썸네일이나
플레이는 잘되기는 한데요... 댓���이 되��� 않더라고요 댓���을 사용을 하���자하는데 어딜 어떻게 수정을 해야할���
몰라서 댓���을 올려요... 댓��� 사용을 하려�� 어느������을 수정을 해야하는������ 알려주세요??? ㅡㅡ;
라��
2013.09.09 06:13
마나풀님 혹시 확장변수에 유튜��� 주소 http://www.youtube.com/watch?v=vvQBHo-q3gM
전체가 아닌 끝의 vvQBHo-q3gM 만 넣으�� 나오는 게시판 [XE자���실] 을 사용하��� 있습니다.
이 경우 어디를 수정해야 유튜��� 썸네일이 나올까요?
귀염귀염나무
2014.03.25 21:38
감사합니다.
이�� 때문에 며��� 골머�� 썩고 있는 중이었어요..
Who's XEJapan
No. | Category | Subject | Author | Date | Views |
---|---|---|---|---|---|
» | Tip | Vimeo, Youtube 자동 썸네일 생성법(TED 추���) | XEJapan | 2015.11.12 | 5803 |
2 | Tip | XE에서 보유 도���인을 한���의 사이트로 연결하기. | XEJapan | 2015.12.05 | 1093 |
1 | Lecture | XpressEngine 강��� 제1편 설치편. | XEJapan | 2015.11.12 | 1038 |
첨���파일 받아서 diff해서 사용해주세요 ㅠㅠ