늘 이시간에는 구글뮤직을 촘 더 베리 간지나고 보기좋게 사용하는 방법을 알려 드립니다


여러분들, 구글뮤직을 사용하고 있습니콰? 초대장을 받아야지만 사용이 가능 했는데, 이제는 베타 딱지를 떼고서 정식 서비스를 하고 있는 모양이더쿤요.

구글뮤직은 클라우드 기반의 웹브라우저 음악감상 플레이어로써 사용자의 컴퓨에 있는 음악들을 감상할 수 있고, 구글뮤직에서 제공하는 무료 음악들도 감상할 수가 있으며 다운로드도 받을수가 있지요. 이 구글뮤직은 미쿡에서만 서비스 되며 국내에서 사용을 할려면 프록시를 이용해서 사용이 가능 합니다. 구체적인 구글뮤직 사용방법은 검색 고고씽~~~



자~!! 오늘 필자가 여러 구글뮤직 사용자에게 알려 드리고자 하는 팁에 대한 토크를 시작 할테니 단~디 보시길 바랍니당!

사실, 이 구글뮤직 인터페이스 변경 방법에 관한 글은 작년(2011년)에 쓸려고 했던 것인데 촘 베리베리 늦은감이 없잖아 있쿤요. ^ ^;;

이 그림이 css를 수정한 원래의 구글뮤직의 인터페이스(사파리용)입니다. 그런데, 사파리가 업데이트를 거듭 하면서 css 코드도 초큼 바뀌었는지 그림과 같은 인터페이스에서 약간의 변화가 생기더쿤요,,,인터페이스가 무참히 깨지는,,,;;;

그래서, 불가피하게 위 그림에서와는 약간 다르게 수정을 해야만 했습니다.






* 모든 그림 클릭 & 좌측상단 클릭 = 베리 확대.

현재 사용중인 구글뮤직의 베리 쌈빡한 인터페이스


간지 납니콰?

기본적으로 모든 앨범커버는 글래시 효과 처리가 되어 있어서 비쥬얼적인 만족감은 물론, 한층 더 음악감상의 맛을 살려 줍니다.






아티스트 메뉴






앨범 메뉴






장르별 음악


베리베리 나이스 하게도 마우스 포인터를 가려진 앨범커버 쪽으로 가져가면 자동적으로 앨범들이 커버플로우처럼 움직이면서 

무슨 앨범인지 확인을 할 수가 있습니다.






노래를 클릭하면 이처럼 베리 산뜻한 블루~ 컬러로 강조가 됩니다.

무료음악이 베리 한 가득 들어와 있쿤요. 들어보고 땡기는 노래들은 다운로드도 된다는 말씀~!!









CSS 수정하는 방법


지금부터는 css 수정하는 방법을 알려 드릴텐데, 우선 사파리부터 봅세당!

이 css는 원래 사파리용으로 만들어진 것입니다.



1. 여기 로 가서 사파리용 확장 프로그램인 "User CSS" 를 설치 합니다.


2. 설치된 User CSS를 클릭한 후에 URLs 란에 반드시 한 글자도 틀리지 말고 위 그림과 똑같이 주소를 적습니다.


3. 아래 첨부파일 "구글뮤직CSS 수정본.txt" 의 CSS 코드 전체를 복사해서 Styles 란에 붙여넣기 합니다.


4. save 클릭




첨부파일 받기






이와 같던 구글뮤직이,,,


요렇게 깔쌈하게 정리된 모습으로 다시 태어 났쿤요!!







CSS 수정하기 전 모습

이 그림은 위에서도 언급 했던 사파리가 업데이트 됨에 따라 CSS가 제대로 적용이 안되는 모습


CSS 수정 하느라 애 좀 묵었다는,,, ^ ^;;












이번에는 구글 크롬의 구글뮤직을 수정 해 볼콰요~~

암후래도, 크롬을 사용하는 유저들이 월등히 많을테지요!


1. 여기 에서 크롬 확장 프로그램, Stylebot을 설치 합니다.






2. 구글뮤직을 열고 주소줄의 CSS를 클릭해서 Stylebot 실행후, 순서대로 버튼을 클릭 합니다.






3. 첨부파일 "구글뮤직CSS 수정본.txt" 의 CSS 코드 전체를 복사해서 edit CSS 란에 붙여넣기 합니다.


4. save 클릭






노래 진행 슬라이드바 시작 부분을 클릭하면 그림처럼 해당 노래에 대한 메뉴가 나타 납니다.(사파리도 동일함)

크롬에서는 좌측의 사이드바가 전체적으로 위로 밀리는 현상이 있더쿤요,,, 저 부분을 클릭하면 홈 화면으로 바뀌는;;;







크롬에서 홈 메뉴 안보이는 문제 해결



자, 지금부터 크롬에서 구글뮤직을 실행하면 좌측 사이드바가 위로 밀리는 증상을 개선할 해결책을 제시 할테니 

두 눈에 불을 키고 단~디 보시길!

1. 주소줄의 CSS를 클릭해서 Stylebot 실행 시킨 후, 좌측 사이드바 전체를 수정할 지역으로 설정 및 클릭 합니다.







2. 레이아웃 설정에서 margin 부분에 5 를 기입하면 그림처럼 사이드바가 제대로 자리를 잡습니다.

이때, 숫자를 높일수록 사이드바 상하좌우 라인이 굵어집니다!






3. padding 부분에 20 을 적으면 사이드바 하단의 라인이 거의 사라집니다.

숫자를 이용해서 사용자 입맛대로 조절할 수 있겠죠이~~






4. padding에서 센터부분에 1 을 적으면 사이드바 메뉴에 보이던 좌, 우의 공백들이 사라집니다.


이런식으로 Stylebot을 이용해서 다른 부분들도 사용자의취향에 맞게 변경이 가능할겝니다~!!







이제부터 구글뮤직을 더 깔끔하고 세련된 인터페이스로 즐겨 보시길 바랍니다~!!







신고
Art & Soft Space ★를 구독 하시면 자다가도 떡이 생길겁니다~!! ^ ^ =>

Posted by 백마탄 초인™

댓글을 달아 주세요

  1. FirstLover

    최근에 스타일시트가 2.1로 업데이트 되었는데 본 포스트엔 1.0 버전으로 되어 있어서 알려드립니다. http://www.ryancollins.me/?p=314 에서 본 포스트의 최신 스타일시트가 업로드 되니 확인하시고 포스트에도 새 버전으로 올리면 좋을 것 같습니다.

    2012.11.13 16:12 신고 [ ADDR : EDIT/ DEL : REPLY ]


티스토리 툴바