ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • [Tistory] 티스토리 반응형 스킨을 적용하기 !!
    Tistory 2015. 7. 13. 11:54



    자 여러분의 블로그는 


    어떠신지요??



    개인이 만든 스킨을 사용하거나..


    혹은 TISTORY에서 제공하는 기본 스킨을 사용하거나..




    초보 블로거 들은 아무래도 이 두가지 선택안 중에서 후자를 선택하시겠죠!






    그.래.서.




    제가 적용하고 있는 프라치노 님의 







    스킨 적용을 해보도록 하겠습니다!!




    먼저 프라치노 님의 블로그 주소입니다!!


    http://kaniwarispace.tistory.com/



    제가 정리한 것보다 프라치노 님이 정리한 게 더 일목요연하게 보일 수도 있으므로...












    그럼 천천히 진행하도록 하겠습니다..!








    1. 자신의 허무맹랑한 스킨을 가진 블로그를 열어줍니다.



    아 가진 것이 없어라~








    2. 한탄을 한 후, 아래 주소에서 스킨을 다운 받습니다.


    http://kaniwarispace.tistory.com/entry/download-beta-6


    위 주소로 들어가셔서 구입 및 다운로드 눌러주세요!













    3. 다운로드한 스킨을 압축 해제합니다.



    폴더 안에 보시면, skin.html이라는 파일이 있습니다!


    notepad++(강추!!) 를 통해 열어줍니다!!

    or 

    html 편집 툴로 열어줍니다!!




    열어서 보시면



    /* 기본 설정: 설치하기 전 '프라치노 공간'에서 '설치하기'를 꼭 확인하세요 */

    /* 자신의 블로그 URL을 입력하세요 */

    var myAddress = "http://(username).tistory.com";



    이런 부분이 있습니다!



    저기 빨간 username 부분과 ()를 제거하시고, 자신의 블로그 url로 교체해줍니다!!



    예시:


    var myAddress = "http://jochul.tistory.com";




    그런 다음 저장한 뒤, 닫습니다!!





    4. 블로그의 관리 화면에서 꾸미기에 있는 스킨을 클릭합니다.


    스킨 등록이라 보이는 저 버튼을 클릭!









    5. 아래 화면에서 하단의 추가버튼을 클릭합니다.


     










    그럼 아래와 같이 파일 열기 화면이 뜨는데, 압축푼 경로로 이동하여 아래와 같이 선택해주세요~


    다음 열기!







    같은 방법으로 images, raw 폴더 내에 있는 파일들을 추가해주세요~


    추가하고나면 아래 화면처럼 나와야합니다!!


    거의 한 3.02MB 정도의 스킨입니다!


    스킨 저장명은 알아서 저장명 지정하세요!


    지정하시고 저장!












    6. 다시 스킨 메뉴를 누른 뒤, 보관함을 눌러서 적용합니다.


    보시면 아래 방금 생성한 스킨이 있습니다!!




    적용!!









    7. 여기서 적용했다고 끝이 아닙니다!! 


    원활한 환경 구성을 위한 설정을 하도록 해야합니다!!!


    화면 설정 -> 화면출력 메뉴로 진입합니다!!



    아래와 같이 설정해주시면 됩니다!!













    8. 다음으로 플러그인 설정으로 진입합니다.


    블로그 아이콘 표시, 카테고리 글 더보기 설정!!






    아래 항목들은 해지!!


    홈페이지 아이콘 표시


     무지개 링크


    소셜댓글 LiveRe


    SNS 글보내기







    9. 마지막으로 모바일웹 스킨으로 진입!!


    우측 상단에 보이는 모바일웹 스킨 ON/OFF에서 OFF!!


    And 저장!!








    10. 블로그 확인!!


    처음과는 몰라보게 달라진 블로그!!








    반응형 스킨이기에 화면을 줄이거나 늘이면


    자동적으로 블로그가 변합니다!!!











    이렇게 해서 간단하게 반응형 스킨 설정을 완료했습니다!!!




    그 외에도 프라치노 님의 블로그에서 여러


    유용한 설정을 통해서 


    블로그를 더욱 꾸밀 수 있습니다!!





    댓글

Designed by Tistory.