유튜브 영상 자동 삽입 기능 이상해요

이상한 잉여태그가 붙어요

https://ibb.co/p3wk2Wx

 

댓글에선 안 그래요

https://ibb.co/ZVvFvWY

어디럴 손봐야할까요?

스킨은 twentysicteen 입니다.

 

아, 그리고 유튜브의 <선택한 시간부터 동영상 재생 주소> 는 일반적인 유튜브 영상 주소 watch?v= 등으로 시작하는 주소와 달라서 "자동삽입"으로 인식이 안 되는 듯해요. 어떻게 방법이 있을까요?

https://ibb.co/2NWv7LT

그림 참조해 주세요

좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
  • 안녕하세요~^^

    KBoard 게시판 플러그인에서 본문 내용에 유튜브 주소가 포함되어 있다면

    자동으로 유튜브 영상을 아이프레임으로 표시하고 있습니다.

    실제 입력하신 유튜브 영상 주소가 어떻게 되시는지요?

    youtube.com/watch?v=유튜브ID 이런 식으로 적용해보시겠어요?

    고맙습니다.

  • 되긴 되는데.. 뭐라 설명할 수가 없네요^^ 일단 영상 봐주세요..

    https://youtu.be/hyCMfdONZdA

    1. 동영상 자동삽입할 때 태그 노출되는 현상은 완전히 고쳐짐!

    2. 근데.. 지금 이리저리 상황을 바꿔볼 여력이 없어서 있는 그대로 말씀드리면,

    2.1. 글쓰기 창에서 본문에 어떤 '링크'를 삽입하고

    2.2. 그 아래에 유튜브 영상 주소를 입력한 다음 저장하면,

    2.3. 결과 화면에서는 본문의 '링크' 전후로 글이 씹히고 iframe 속에 유튜브 영상은 멀쩡하게 잘 나옴.

    3. 위에 링크한 영상에서 잘 보시면 글쓰기 화면에서 유튜브 iframe 위쪽에 글이 조금 있는데,

    3.1. '김상용~~ ' '가서보기~~' '바로보기~' 에 특별한 링크 없이 그냥 텍스트인 경우에는 문제가 없어요.

    3.2. 근데 '김상용~~ ' '가서보기~~' '바로보기~' 중 '가서보기~~'에 링크를 하나 걸고 저장하면,,

    3.3. 결과화면에서 '가서보기~' 이후의 "링크" 부분부터 유튜브 iframe 바로 앞까지의 모든 내용이 씹혀서 노출되지 않아요.

    3.4. "수정하기" 눌러 보면 DB에는 이상이 없이 잘 저장되어 있어요.

    4. 지금 이게 더 문제라서.. 일단 알려주신 추가 펑션은 지우고 쓰고 있습니다. 글쓸 때 유튜브에 걸린 자동링크 지우고 저장하는 것만 잘 챙기면 현재 상태에서도 큰 문제는 없으니까요.

     

    5. 테스트는 http://koredu.new21.net/site/?page_id=67 여기서 자유롭게 해 보시면 됩니다.

  • 안녕하세요.

    <a> 태그 내부에 target=”_blank” 즉, 새창으로 열기로 적용이 되어 있을 때

    아이프레임 관련 코드가 깨지는 듯합니다.

    우선은 임시방편으로

    워드프레스 관리자 -> 외모 -> 테마 편집기 페이지에서 functions.php 파일 하단에

    아래의 코드를 추가해보시겠어요?

    add_filter('kboard_content', 'kboard_content_2020_02_07', 10, 1);
    function kboard_content_2020_02_07($content){
    	// 유튜브
    	$content = preg_replace('/<a(.*)href=\"[a-zA-Z\/\/:\.]*youtube.com\/watch\?v=([a-zA-Z0-9\-_]+)([a-zA-Z0-9\/\*\-\_\?\&\;\%\=\.]*)"(.*)>(.*)<\/a>/i', 'https://youtube.com/watch?v=$2', $content);
    	$content = preg_replace("/\s*[a-zA-Z\/\/:\.]*youtube.com\/watch\?v=([a-zA-Z0-9\-_]+)([a-zA-Z0-9\/\*\-\_\?\&\;\%\=\.]*)/i", '<iframe src="https://www.youtube.com/embed/$1" width="560" height="315" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>', $content);
    	
    	// 비메오
    	$content = preg_replace('/<a(.*)href=\"[a-zA-Z\/\/:\.]*vimeo.com\/(\d+)"(.*)>(.*)<\/a>/i', 'https://vimeo.com/$2', $content);
    	$content = preg_replace("/\s*[a-zA-Z\/\/:\.]*vimeo.com\/(\d+)/i", '<iframe src="https://player.vimeo.com/video/$1" width="560" height="315" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>', $content);
    	return $content;
    }

     

    해당 문제는 내부적으로 좀 더 테스트한 후 플러그인을 개선하도록 하겠습니다.

    고맙습니다.

  • 친절한 응대 감사합니다. 저는 충돌할 플러그인을 깐 게 아무것도 없어요. 몇 가지 테스트를 해 보았습니다.

    https://youtu.be/F3heOcavxkA

    일단 영상 봐주세요.

    1. 유튜브 주소를 붙여 넣고 즉시 저장: 아무 문제 없음

    2. 유튜브 주소를 붙여 넣고 엔터 치고 다른 글을 쓴 다음 저장: 잉여태그 생성

    3. 수정하기 눌러서 유튜브 주소에 걸린 링크를 제거하고 다시 저장: 아무 문제 없음

    4. kboard 설정에서 자동링크 '비활성화' 설정해도 상황은 같음.

     

    테스트 해 보시려면 http://koredu.new21.net/site/?page_id=67 이 게시판에서 하시면 됩니다.

  • 안녕하세요.

    저희 쪽 테스트 서버에서는 올려주신 유튜브 주소로 본문에 입력해서 확인해보니

    정상적으로 표시되는 것을 확인했습니다.

    테마나 다른 플러그인과 충돌은 없는지도 확인해보셔야 할 듯합니다.

    비회원으로도 테스트해볼 수 있는 페이지 주소 알려주시겠어요?

    고맙습니다.

  • textarea 로 바꿔서 자동링크를 비활성화했는데도 증상이 똑같습니다.

    댓글에선 깔끔하게 잘 되니.. 좀 이상하네요 ㅎㅎ

    예전에 제로보드 같은 거 꾸밀 때오 이런 증상 많이 봤는데 유튜브영상 자동링크 함수가 뭔지 안다면 본문용과 댓글용을 비교해 보고 싶네요.

    어디선가 " 같은게 한 번 열리고 안 닫혀서 그런 듯하고

    <a 태그 안에 target 을 요즘 안 쓰는 추세던데 자동링크 변환에 target 들어가면서 " 가 많아지는 것도 원인 거 같기도 하고요..

  • 안녕하세요.

    KBoard 플러그인 게시글 본문 자동링크 기능을 사용 중이신지요?

    비활성화한 후에도 확인해보시겠어요?

    워드프레스 관리자 -> KBoard -> 게시판 목록 -> 게시판 선택 -> 기본설정 페이지에서 비활성화하실 수 있습니다.

    해당 설정은 글 작성 에디터가 textarea 사용으로 설정되어 있을 때 표시됩니다.

    플러그인 개선이 가능할지 연구해보겠습니다.

    고맙습니다.

  • 입력

    https://ibb.co/yPCQMYM

     

    결과

    https://ibb.co/kmz6LLB

     

    ㅠㅠ

  • https://www.youtube.com/watch?v=COD36vucmqo

    이렇게 했어요
  • 안녕하세요.

    해당 코드는 임시 코드이기 때문에 또 다른 문제가 있을 수도 있습니다.

    KBoard 유튜브, 비메오 링크 관련해서는

    올려주신 영상들을 참고해서 저희 내부적으로 테스트해본 후

    플러그인을 개선하여 업데이트하도록 하겠습니다.

    고맙습니다.

좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기