아주 소소한 관심사로 라이믹스 / PHP 7.4 / 크롬 / CK에디터4에서 그냥그냥 만들어봤습니다.
이름하여, 에디터에 유튜브 링크를 붙여넣으면 임베드 영상(반응형)을 바로 띄워주는 애드온.

 

에디터에서 아이프레임으로 임베드를 바로 시키는 방식입니다.

다만 코어에서 에디터로 입력된 position 속성들을 필터링하기 때문에, 애드온으로 (DB에 저장은 아니고) 디스플레이만 가능하게 살짝살짝 손을 봐봤습니다ㅋ

 

 

 

더 어떻게 해볼까도 했는데, 만들고 보니 별로 쓸데없는 거 같아서ㅜ 오늘은 이만 자야겠습니다 흐~암~

 

덧. 여기서 직접 글쓰기를 통해 유튜브 링크를 붙여넣기 해보세요~~

https://dev.aporia.blog/board_fKje44/

윤삼

profile
아무래도 중급 초반 수준의 코딩 오타쿠인 것 같습니다.
  • profile
    와!! 좋습니다.
    컴퓨터 클립보드로 복사한 사진을 복붙으로 넣게도 되나요?
  • profile profile
    그건 모듈이 있지 않나요?
    이건 그냥 유튜브 전용이에용
  • profile profile
    에디터 모듈하고 비슷해서 질문 드렸습니당
    글 작성 시 바로 유튜브 영상이 떠서 너무 좋습니다ㅎ
  • profile profile
    유튜브는 사실 따로 링크 파싱 같은 거 안 하고 본문에 바로 삽입을 해도 될 것 같아서요.
    다만 관리자가 아니면 db에 입력될 수 없는 몇몇 코드가 있어서 그게 좀 은근 까다롭더라구요.
  • ?
    에디터자동완성모듈 사용중인데 제가 가장 많이 사용하는 기능 중 하나입니다.^^ 애드온으로 나오면 활용도가 아주 좋겠습니다. 소소해 보이지만 이런 기능들이 알차고 유용하다고 생각합니다~
  • ? profile
    모듈에 비해 뭔가 더해볼 수 있는 것들이 별로 없어서 소소하긴 해요ㅋ
    대신 중구난방이 되기 십상이어서 조심스러워 해야 하는 부분도 많긴 하지만요ㅜ
  • profile
    좋은 기능이네요.
    유튜브 게시판을 항상 확장변수 입력해서 처리하곤 했는데...
    혹시 유튜브 썸네일도 첨부파일로 첨부되게 할 수 있는 방법이 있을까요?
  • profile profile
    유튜브 섬네일 처리는 중복 영상의 섬네일 중복 확인도 해야 하고 해서 파일 첨부까지는 잘 모르겠어요.
    그냥 소스 안에
    <p style="display:none;"><img alt="" src="https://img.youtube.com/vi/_9a0K3PLSHc/default.jpg" /></p>
    이런 식으로 외부이미지로 들어가게는 해놨습니다.
    아무래도 첨부파일이 아니니까 글쓴이가 직접 커버이미지를 선택한다든가 하기는 어렵겠죠?
  • profile profile

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

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

  • profile profile
    확실히 그렇겠네요.
    그렇다면 임베드 영상이 출력되는 부분에 썸네일을 깔아두고 그 위에 영상을 얹는 방식도 있을 것 같고요.
    ... 에고 어떻게 하든 손이 많이 가겠어요ㅜ
  • profile profile
    리스트 스타일에서 웹진형식으로 썸네일을 보여주려고 하다보니 이미지 파일로 첨부가 되지 않으면 안되서, 수동으로 하거나 아니면 목록에서 스킨을 수정해야 하는 상황이라서요.

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

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

     

     

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

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

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

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

  • profile profile
    시스템 설정 > 고급 설정 > 썸네일 생성 대상
    에서 외부 이미지도 썸네일 대상으로 포함시켜주면 될 거예요.
  • profile profile
    궁금한게 생겼는데 그럼 작성 시점에 유튜브 주소만 입력하면 자동으로

    <p style="display:none;"><img alt="" src="https://img.youtube.com/vi/_9a0K3PLSHc/default.jpg" /></p>
    이 부분이 입력되게 처리하신건가요?
  • profile profile
    그 사이에 조금 바꿨어요ㅎ
    https://dev.aporia.blog/board_fKje44/
    여기서 직접 시도해보시고 소스도 확인해보세용
  • profile profile
    class로 제어하는게 아마 제일 좋은 선택 같습니다. 혹시라도 나중에 이 자료를 쓰지 못할 일이 생겨도 게시판 스킨 등에서 해당 class에 display:none; 으로 간단히 해결할 수 있으니까요.

    예전에 사용하던 멀티미디어섬네일 애드온을 사용 중지하게 되었는데 비슷한 상황을 애드온에서 유튜브이미지 주소 소스에 넣을때 class를 같이 넣어줘서 해당 class를 css에서 처리해줬네요~
  • profile profile
    네, 안 그래도 조언 듣고 바로 class로 처리했지요~☆
  • profile profile
    해봤는데 첨부파일로는 저장은 안되는데 썸네일을 생성이 됐네요?
    소스를 보고 이렇게 만들 수 있는건가요? ㅎㅎㅎㅎㅎㅎ;;;;;;;;;
  • profile profile
    라이믹스 썸네일 생성 함수가 고급설정의 썸네일 생성 옵션에 따라 본문의 img 태그를 다 조회할 수도 있거든요ㅎㅎ
    순전히 라이믹스의 힘입니다ㅋ
  • profile profile
    라이믹스는 외부 이미지라도 본문에 이미지 소스가 있으면 해당 이미지로 섬네일을 만드는 기능이 생겼습니다.
  • profile profile
    웹지기님 자동첨부 애드온을 설치하면 웹진에서도 섬네일이 자동으로 생성된다는 말씀이신가요? 유튜브 문제로 별도로 전용 게시판을 쓰고 있었는데 윤삼님과 두분 덕분에 또 하나 문제가 해결되는 것 같습니다.
  • profile
    오호 유튜브 시대에 유용한 기능이 되겠어요
  • profile profile
    유튜브 사용이 좀 더 자유로운 라이믹스를 꿈꿔봅니다ㅋㅋ
  • ?
    반대로 파싱 모듈에서 유튜브 파싱 기능은 꺼야 겠지요?

    파싱 모듈에서 이기능을 확장 지원 하면 된다고 생각 했는데..

    그러고 보니 파싱 애드온을 만드신 분이..윤삼님...
  • ? profile

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

    그러니까

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

    이렇게요ㅎ


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

  • ? profile

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

     

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

  • profile ?

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

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

     

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

  • ? profile
    아악! 프로알라는 별도의 세계인지라...ㅠㅠㅠㅠㅠㅠㅠ
  • ? profile
    추가로 연구를 해봐야겠네요ㅠㅠㅠ
    근데 프로알라로의 성공 가능성은 진짜 전혀 모르겠어요ㅠㅠ
  • profile ?
    프로알라 에디터 사용 하셨던걸로 알고 있어서 말씀 드렸습니다 ^^
    부담이 되시지 않는 다면 부탁 드립니다. 안되면 기존 파싱 모듈 사용 해도 됩니다~
  • ? profile
    프로알라는 요즘 안 쓰게 돼서요.
    사실 프로알라 자체보다는 패키지로 같이 있던 블로그와 인라인 에디터 때문에 사용을 시도했던 건데 여의치 않더라구요.
    한번 연구해보겠습니다~!
  • ? profile
    프로알라 에디터 테스트 부탁드려요~
    https://xetown.com/tips/1552106
  • profile
    크,, 역시 능력자시네요..
    라이믹스 초창기에 유튜브때문에 에디터모듈을 구매했었는데.. 물론 한달 1000건제한이지만..
    만들어주신 애드온과 함께라면,, 기능을 꺼도 되겠군요!
  • profile profile
    유튜브 때문이라면 아마 대체 가능할 겁니다.
    다른 에디터와 호환을 시도해보고 곧 공개하도록 할게요~
  • profile

    안녕하세요 윤삼님. 
    이번에 새로운 사이트에 새로운 스킨을 사용해서 만드는 중인데요 본문에 유튜브 썸네일 이미지가 상단에 올라가는 문제가 있어서 혹시 이 부분이 미디어임베드 애드온 영향인지 설정으로 끌수 있는지 궁금해서 문의 드립니다. 스킨 제작자님은 게시판에서 유튜브 애드온 썸네일 추가 옵션을 끄면 된다고 알려주셨지만 실제로 껐는데도 계속 출력되어서 애드온에서 설정이 가능한 부분인지 문의 드립니다. 

    게시판 샘플 글 주소 링크입니다. https://dal-ang.com/test/163

     

     

    스크린샷 2022-02-22 23.49.49.png.jpg

  • profile profile
    애드온 영향일 수 있을 것 같습니다. 적당한 곳에
    .media_embed {padding-bottom: 0;}
    .media_embed > img {display: none}
    으로 처리하면 될 것 같네요.
  • profile profile
    감사 합니다. 일단 css 파일 디폴트와 커스텀 둘다 넣어봤는데 썸네일이 아직 출력 됩니다. 혹시 이파일이 아닐까요?
  • profile profile
    앗, 뭔가 성공하신 것 같은데요?
  • profile profile
    CSS문제가 아니라 스킨에서 팝업 옵션을 설정할때만 나타나는 현상이였습니다. 해당 옵션을 끄니 정상작동 합니다. 결론은 애드온 문제가 아닌것 같습니다. 번거롭게 해드려서 죄송 합니다.
  • profile profile
    그렇군요. 확인 감사합니다!