html Audio/Video tag

공통사항

─ 23.01.15 추가

글쓰기 ➡ 파일 업로드 ➡ html모드에서 업로드한 파일을 숨김 처리 할 것. <!--  ~blahblah~  -->
// 비공개 글로 따로 업로드하지 않아도 되고 숨김처리를 하니 온전한 링크 주소가 생성됨.

글쓰기 ➡ 기본모드 '더보기' ➡ "< >HTML 블럭"에 태그를 기재할 것.
// html 모드에 기재시 수정할 때마다 삭제 처리되었던 (playsinline 등의 몇몇 태그) 요소들이 삭제되지 않음.

html Audio tag

<audio controls controlslist="nodownload">
  <source src="링크주소" type="audio/mp3" />
  Your browser does not support the audio element.
</audio>

야마시타 타츠로山下達郎 - 거리 이야기街物語

참고 :: https://www.w3schools.com/html/html5_audio.asp

html Video tag

<video controls controlslist="nodownload" playsinline width="100%" height="auto">
  <source src="링크주소#t=0.5" type="video/mp4" />
  Your browser does not support HTML video.
</video>

25.11.10 추가)
이유도 모르겠고 언제부터인지도 모르겠는데 둘째 줄의 링크주소#t=0.5가 먹히지 않는다. 0.5초 후에 영상을 시작하는 꼼수로 썸네일의 효과를 얻었는데 아예 영상 자체가 먹통이 되어 버리니 어쩔 도리 없이 #t=0.5를 삭제하는 것으로 마무리. 썸네일을 poster 속성으로 넣을 수 있으나 캡쳐하고 업로드하기 귀찮다.

"신세기 에반게리온"의 엔딩(곡이었던) 곡 - Fly me to the moon

참고 :: https://www.w3schools.com/html/html5_video.asp

Autoplay tag

<video autoplay loop muted playsinline width="100%" height="auto">
  <source src="링크주소" type="video/mp4" />
  Your browser does not support HTML video.
</video>

참고 :: IOS Safari에서 Video tag autoplay가 되지 않을 때

etc,

+ 블로그 글에 오디오 파일 재생 기능 넣기 <<구글 드라이브 링크 활용
25.11.10 추가) 재생 불가.