Tumblr 용 음악 재생 목록 크기를 조정하는 방법

Tumblr 대시 보드에서 오디오 플레이어의 모양을 변경할 수는 없지만 Tumblr의 테마 및 사용자 지정 옵션을 사용하여 자신의 블로그에서 오디오 플레이어의 모양을 변경할 수 있습니다. 오디오 플레이어의 크기를 변경하려면 Tumblr 테마를 수정해야하므로 HTML 및 CSS에 대한 경험이 있어야합니다. 모든 개발자가 Tumblr 테마를 다르게 작성하기 때문에 오디오 플레이어가 정확히 어떻게 수정되는지는 테마마다 다소 다릅니다. 그러나 오디오 게시물에 대한 Tumblr 변수는 항상 동일하므로 수정해야하는 CSS를 찾는 프로세스가 간소화됩니다.

Tumblr 테마에 대한 사용자 지정 페이지를 엽니 다. "HTML 편집"링크를 클릭하십시오. Tumblr 테마 썸네일 오른쪽, 테마 이름 바로 아래에 있습니다.

검색을 시작하려면 "Ctrl-F"를 누르고 "{block : audio}"를 입력하십시오. 제작자가 오디오 게시물 설정을 입력 한 테마 부분으로 이동합니다. 개발자가 오디오 플레이어의 크기를 조정하는 데 사용한 CSS 클래스를 결정합니다. 예를 들어 게시물이 div 요소 내에있는 경우 'class = "audio-player"'속성이 표시됩니다. 여기서 "audio-player"는 클래스 이름입니다.

마침표가 앞에있는 수업 이름을 검색합니다 (예 : ".audio-player". 이름 앞의 마침표는 CSS 스타일 시트가 클래스를 식별하는 방법입니다. 이 검색은 편집 할 스타일 시트의 오른쪽 부분으로 이동합니다. CSS로 채워진 괄호와 함께 다음과 같이 보일 것입니다.

.audio-player {}

일부 테마는 편집 할 수없는 외부 링크 스타일 시트를 사용합니다. 다음과 같이 보입니다.

테마에 해당하는 경우 오디오 플레이어를 수정하는 태그에 "style"속성을 추가하십시오. 이를 통해 기존 스타일 시트를 수정하지 않고도 자신 만의 CSS를 추가 할 수 있습니다. 태그는 "class"속성과 "style"속성을 모두 가질 수 있습니다. 이것은 다음과 같습니다.

스타일 시트 내의 클래스 또는 포함하는 태그의 스타일 속성에 "width :"속성을 입력합니다. 스타일 시트에 이미 "width"속성이있는 경우이를 수정합니다. 두 번째 것을 추가하지 마십시오. "height"속성으로 높이를 결정할 수도 있습니다. 스타일 시트를 수정하는 경우 CSS는 다음과 같습니다.

.audio-player {width : 100px; 높이 : 25px; }

태그에 "style"속성에 대한 변경 사항을 추가 한 경우 구문은 다음과 같습니다.

"미리보기 업데이트"를 클릭하여 변경 사항이 테마에 어떤 영향을 미치는지 확인하십시오. 테마는 복잡 할 수 있으며 변경 사항이 예상 한대로 나타나지 않을 수 있습니다. 오디오 플레이어를 원하는 방식으로 정확하게 얻으려면 여러 번 시도해야 할 수 있습니다.

블로그에 테마 변경 사항을 적용 할 준비가되면 "저장"을 클릭하십시오.

Soundcloud 재생 목록과 같은 다른 소스에서 음악을 게시 할 때 해당 코드에서 오디오 플레이어의 크기를 변경할 수 있습니다. Tumblr 설정에 의해 수정되지 않습니다.

경고

이 기사는 2014 년 1 월에 사용 가능한 테마 옵션을 참조합니다. 옵션은 Tumblr 웹 사이트의 향후 업데이트로 변경 될 수 있습니다.