블로그스팟 글쓰기 모드에서 멀티미디어(영상, 오디오)를 효율적으로 삽입하기

가나톡ganaTOK
가나톡ganaTOK
Update:

블로그스팟 글쓰기 모드에서 멀티미디어(영상, 오디오)를 효율적으로 삽입하는 방법은 여러가지입니다. 오늘은 그한가지를 알아보겠습니다. 미디어는 메세지다. 멀티미디어..

멀티미디어, 영상과 음향넣기

블로그스팟 글쓰기 모드에서 멀티미디어(영상, 오디오)를 효율적으로 삽입하기

블로그스팟에서 멀티미디어(영상과 오디오)를 삽입하려면 다음과 같은 방법들을 사용할 수 있습니다.

1. 비디오(영상) 삽입하기

a. YouTube 동영상 삽입

  • 블로그 작성 화면에서 툴바에 있는 "비디오 아이콘" 을 클릭합니다.
  • YouTube 탭을 선택합니다.
  • 원하는 동영상 URL 또는 키워드를 입력해 동영상을 검색하고 삽입합니다.

b. 컴퓨터에서 직접 업로드

  • 비디오 아이콘을 클릭하고 "업로드" 옵션을 선택합니다.
  • 컴퓨터에서 비디오 파일을 선택하면 업로드가 진행됩니다.
  • 이 방식은 비디오가 블로그스팟에 직접 호스팅되므로 용량 제한에 유의해야 합니다.

2. 오디오 삽입하기

블로그스팟은 기본적으로 오디오 파일 업로드를 직접 지원하지 않습니다. 하지만 다음 방법을 사용하면 효율적으로 삽입할 수 있습니다.

a. 오디오 호스팅 서비스 활용

  • SoundCloud, Google Drive, 또는 Dropbox와 같은 외부 서비스를 사용합니다.
  • 오디오 파일을 업로드한 후 공유 링크 또는 **임베드 코드(embed code)**를 가져옵니다.

단계:

  • 블로그 작성 모드에서 HTML 모드로 전환합니다.
  • 제공된 오디오 임베드 코드를 삽입합니다.
    html
    <iframe width="100%" height="166" scrolling="no" frameborder="no" allow="autoplay" 
src="https://w.soundcloud.com/player/?url=YOUR_AUDIO_URL"></iframe>

b. Google Drive 링크 삽입

  • Google Drive에 오디오 파일을 업로드한 후 공유 가능한 링크를 생성합니다.
  • 블로그 에디터에 링크를 추가하여 사용자들이 오디오 파일을 재생할 수 있도록 합니다.

3. 멀티미디어를 효과적으로 배치하는 팁

  • 텍스트와 멀티미디어의 균형: 멀티미디어 주변에 설명 텍스트를 넣어 독자가 콘텐츠를 이해하기 쉽도록 합니다.
  • 반응형 디자인: 비디오와 오디오가 모바일에서도 잘 보이도록 반응형 코드를 사용합니다.
  • 속도 최적화: 외부 호스팅을 사용하여 페이지 로딩 속도를 줄입니다.

추천 코드 예시

블로그에 동영상과 오디오를 함께 삽입하는 코드 예시입니다:

html
<h3>설명과 함께 멀티미디어 콘텐츠</h3>
<p>아래는 관련 오디오와 동영상입니다.</p>

<!-- SoundCloud 오디오 삽입 -->
<iframe width="100%" height="166" scrolling="no" frameborder="no" allow="autoplay" 
src="https://w.soundcloud.com/player/?url=YOUR_AUDIO_URL"></iframe>

<!-- YouTube 동영상 삽입 -->
<iframe width="560" height="315" src="https://www.youtube.com/embed/YOUR_VIDEO_ID" 
title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

요약

  1. YouTube 동영상과 SoundCloud 오디오를 활용하면 블로그스팟에서 멀티미디어를 쉽게 삽입할 수 있습니다.
  2. Google Drive나 Dropbox 링크를 통해 파일을 공유하는 것도 효과적입니다.
  3. 콘텐츠 배치와 속도 최적화를 고려하여 사용자 경험을 개선합니다.

Related Posts

로드 중…

댓글 쓰기