CK에디터에 유튜브 링크를 붙여넣으면 반응형 임베드 영상으로 자동변환해주는 애드온

그건 모듈이 있지 않나요?
이건 그냥 유튜브 전용이에용

에디터 모듈하고 비슷해서 질문 드렸습니당
글 작성 시 바로 유튜브 영상이 떠서 너무 좋습니다ㅎ

유튜브는 사실 따로 링크 파싱 같은 거 안 하고 본문에 바로 삽입을 해도 될 것 같아서요.
다만 관리자가 아니면 db에 입력될 수 없는 몇몇 코드가 있어서 그게 좀 은근 까다롭더라구요.

모듈에 비해 뭔가 더해볼 수 있는 것들이 별로 없어서 소소하긴 해요ㅋ
대신 중구난방이 되기 십상이어서 조심스러워 해야 하는 부분도 많긴 하지만요ㅜ

유튜브 섬네일 처리는 중복 영상의 섬네일 중복 확인도 해야 하고 해서 파일 첨부까지는 잘 모르겠어요.
그냥 소스 안에
<p style="display:none;"><img alt="" src="https://img.youtube.com/vi/_9a0K3PLSHc/default.jpg" /></p>
이런 식으로 외부이미지로 들어가게는 해놨습니다.
아무래도 첨부파일이 아니니까 글쓴이가 직접 커버이미지를 선택한다든가 하기는 어렵겠죠?

display:none 을 스팸으로 간주하는 곳들도 있을거에요.

class 를주고(라이믹스는 화이트리스트 등록) css에 display:none을 하는것도 방법이겠네요.

확실히 그렇겠네요.
그렇다면 임베드 영상이 출력되는 부분에 썸네일을 깔아두고 그 위에 영상을 얹는 방식도 있을 것 같고요.
... 에고 어떻게 하든 손이 많이 가겠어요ㅜ

리스트 스타일에서 웹진형식으로 썸네일을 보여주려고 하다보니 이미지 파일로 첨부가 되지 않으면 안되서, 수동으로 하거나 아니면 목록에서 스킨을 수정해야 하는 상황이라서요.

혹시 유튜브 자동생성 썸네일을 첨부파일로 저장하는 부분이 포함될 수 있을까 해서 말씀드려봤어요 ^^
오늘도 하루가 시작됐네요~ 행복한 하루되세요~

자동첨부 애드온을 병행하시면 됩니다.

 

 

참고:라이믹스는 외부이미지도 섬네일로 만들어줍니다. XE시라면 안될거에요.

아 그런가요? 좋은 정보 감사드립니다. 후딱 정리하고 해봐야겠네요^^

어.. 근데 라이믹스 쓰시는거 같던데요....

섬네일 설정이 외부이미지 제외로 하신거 아닌지..

웹지기님 자동첨부 애드온을 설치하면 웹진에서도 섬네일이 자동으로 생성된다는 말씀이신가요? 유튜브 문제로 별도로 전용 게시판을 쓰고 있었는데 윤삼님과 두분 덕분에 또 하나 문제가 해결되는 것 같습니다.

시스템 설정 > 고급 설정 > 썸네일 생성 대상
에서 외부 이미지도 썸네일 대상으로 포함시켜주면 될 거예요.

궁금한게 생겼는데 그럼 작성 시점에 유튜브 주소만 입력하면 자동으로

<p style="display:none;"><img alt="" src="https://img.youtube.com/vi/_9a0K3PLSHc/default.jpg" /></p>
이 부분이 입력되게 처리하신건가요?

그 사이에 조금 바꿨어요ㅎ
https://dev.aporia.blog/board_fKje44/
여기서 직접 시도해보시고 소스도 확인해보세용

class로 제어하는게 아마 제일 좋은 선택 같습니다. 혹시라도 나중에 이 자료를 쓰지 못할 일이 생겨도 게시판 스킨 등에서 해당 class에 display:none; 으로 간단히 해결할 수 있으니까요.

예전에 사용하던 멀티미디어섬네일 애드온을 사용 중지하게 되었는데 비슷한 상황을 애드온에서 유튜브이미지 주소 소스에 넣을때 class를 같이 넣어줘서 해당 class를 css에서 처리해줬네요~

네, 안 그래도 조언 듣고 바로 class로 처리했지요~☆

해봤는데 첨부파일로는 저장은 안되는데 썸네일을 생성이 됐네요?
소스를 보고 이렇게 만들 수 있는건가요? ㅎㅎㅎㅎㅎㅎ;;;;;;;;;

라이믹스 썸네일 생성 함수가 고급설정의 썸네일 생성 옵션에 따라 본문의 img 태그를 다 조회할 수도 있거든요ㅎㅎ
순전히 라이믹스의 힘입니다ㅋ

라이믹스는 외부 이미지라도 본문에 이미지 소스가 있으면 해당 이미지로 섬네일을 만드는 기능이 생겼습니다.

유튜브 사용이 좀 더 자유로운 라이믹스를 꿈꿔봅니다ㅋㅋ

제 기억이 맞다면 파싱 모듈의 js에서 유튜브를 인식하는 방식이 p 태그 안에 있는 링크 텍스트였던 것 같아요.
근데 지금 애드온은 붙여넣기 동작과 함께 div 태그와 그 안의 iframe 태그로 들어가게 되니까...
잘하면 병행도 가능할 것 같습니다.

그러니까

• 기존 문서는 그냥 파싱 모듈 동작으로 열람
• (만약 이 애드온을 사용하게 된다면) 신규 문서 작성은 이 애드온을 통해 링크 그냥 붙여넣기 -> 바로 변환 -> 소스에 삽입

이렇게요ㅎ

그러고 보니ㅋ 지금 이 애드온을 만들 동기부여를 주신 분이.. 스쿄님...

아...아....... 그랬군요... T.T

그나저나 절충안 멋집니다.^^

 

p.s 아...제목 보고 지금 알았는데 ho...ho...hoxy.....프로알라 에디터도 안되진 않겠죠? 

아악! 프로알라는 별도의 세계인지라...ㅠㅠㅠㅠㅠㅠㅠ

추가로 연구를 해봐야겠네요ㅠㅠㅠ
근데 프로알라로의 성공 가능성은 진짜 전혀 모르겠어요ㅠㅠ

프로알라 에디터 사용 하셨던걸로 알고 있어서 말씀 드렸습니다 ^^
부담이 되시지 않는 다면 부탁 드립니다. 안되면 기존 파싱 모듈 사용 해도 됩니다~

프로알라는 요즘 안 쓰게 돼서요.
사실 프로알라 자체보다는 패키지로 같이 있던 블로그와 인라인 에디터 때문에 사용을 시도했던 건데 여의치 않더라구요.
한번 연구해보겠습니다~!

프로알라 에디터 테스트 부탁드려요~
https://xetown.com/tips/1552106

대강 이런 식으로 작동하게 하려 하고 있습니다ㅎ
https://dev.aporia.blog/board_fKje44/

 

유튜브 썸네일 이미지로 자리를 먼저 잡아놓고 아이프레임이 얹어지는 방식으로요.

유튜브 때문이라면 아마 대체 가능할 겁니다.
다른 에디터와 호환을 시도해보고 곧 공개하도록 할게요~

애드온 영향일 수 있을 것 같습니다. 적당한 곳에
.media_embed {padding-bottom: 0;}
.media_embed > img {display: none}
으로 처리하면 될 것 같네요.

감사 합니다. 일단 css 파일 디폴트와 커스텀 둘다 넣어봤는데 썸네일이 아직 출력 됩니다. 혹시 이파일이 아닐까요?

앗, 뭔가 성공하신 것 같은데요?

CSS문제가 아니라 스킨에서 팝업 옵션을 설정할때만 나타나는 현상이였습니다. 해당 옵션을 끄니 정상작동 합니다. 결론은 애드온 문제가 아닌것 같습니다. 번거롭게 해드려서 죄송 합니다.

그렇군요. 확인 감사합니다!