티스토리가 개편되면서 '페이지'기능이 추가되어 기능을 이용할 수 있도록 오랜만에 material T 스킨도 업데이트를 진행했습니다.


    Material T Mark 5+는 기존 버전(mark5와 mark5.2)에 티스토리 메뉴 업데이트 내용과 함께 강좌를 통해 올렸던 수정사항 중 일부를 적용한 버전입니다.


    앞으로도 material T스킨은 티스토리의 변화에맞춰 새로운 기능을 이용할 수 있을 정도로는 업데이트를 계속 할 예정입니다.


    Material T 스킨이 처음이라면 기존버전 소개글 먼저보기

    Material T Mark 5 티스토리 스킨 무료 배포 - material T의 마지막 버전!


    달라진 점

    Mark5와 Mark 5.2를 통합, 즉 1단형과 2단형 스킨 버전 구분 없이 간단한 설정만으로 이용가능합니다. - (기본값은 1단형, Material T mark 5+ 1단형 2단형 스킨 전환하기)

    티스토리의 페이지 기능을 사용할 수 있습니다.

    메뉴를 등록하면 드로워(사이드메뉴)와 푸터(맨밑)에 표시됩니다.

    기존 버전에 페이지기능만 이용하려면 - 티스토리 신규기능 '페이지' 이용을 위한 메뉴 적용하기

    기본 로딩마크 제거 - 불필요하게 본문을 움직이는 요소라 제거했습니다.

    ToBottom기능 기본값으로 적용 - material T 강좌 - toBottom 맨 아래로 가는 버튼 만들기

    댓글 자동 링크기능 활성화를 기본값으로 적용 - material T mark5 댓글 자동링크 활성화 하기

    드로워(사이드메뉴)에 링크추가가 사라졌습니다.

    다시 추가하는 방법 - Material T skin mark5+ 사라진 링크추가기능 되살리기


    ..끝


    .

    다운로드

    materialTM5+.zip


    설치방법

    티스토리 커스텀 스킨 적용하기 - 새로워진 티스토리 관리자

    한줄 설명: 스킨등록 - 모든 파일 업로드 - 스킨적용 끝


    필수 설정

    티스토리 개편이후 다음과 같이 설정해야 정상 작동합니다.

    글목록 - 목록+내용으로 설정해야 글 목록이 정상적으로 나타납니다.

    댓글을 펼쳐야 댓글을 볼 수 있습니다.

    블로그 메뉴바를 표시해야 드로워의 로그인/로그아웃이 정상 작동합니다 (실제 메뉴바가 표시되진 않음)

    플러그인에서는 "블로그 아이콘 표시"를 꼭 사용하시고 

    "카테고리 글 더 보기"는 해제해도 됩니다.


    후원 안내

    material T 는 무료스킨입니다.

    스킨이 유용하다고 생각하신다면 후원으로 마음을 표시해주세요!

    후원하러가기


    라이센스 및 도움주신 분들.

    크리에이티브 커먼즈 라이선스 
    이 저작물은 크리에이티브 커먼즈 저작자표시-비영리-동일조건변경허락 4.0 국제 라이선스에 따라 이용할 수 있습니다. 

    Bootstrap - Code licensed under MIT

    Google material-design-icons : https://github.com/google/material-design-icons#license 

    Readiz님 - 이전스킨인 Fastboot제작자이시고, 각종 기술에대한 힌트를 얻었습니다. http://blog.readiz.com/

    est0que님 - Modern Basic스킨의 뼈대를 많이 이용했습니다. http://est0que.tistory.com/2125

    해커C님 - 트랙백 스팸차단 스크립트 http://hackerc.tistory.com/700

    Kong님 - 디자인 도움주셨습니다. http://kong-story.tistory.com/


    수정 강좌


    material T mark3 이후버전 티에디션 적용 방법


    Material T 커스텀 강좌 - 사이드바 추가하기


    MaterialT 커스텀 강좌 - 색상 변경 방법(mark3 이후)


    Material T home카드 수정하기


    Material T 글자 크기 조절하기


    Material T mark 5+ 1단형 2단형 스킨 전환하기


    Material T skin mark5+ 사라진 링크추가기능 되살리기





    저작자 표시 비영리 동일 조건 변경 허락
    신고
    Posted by 뭐하라

    문제가 있나요?(?)

    내용상 오류가 있음 업데이트 필요 화면이 깨짐 기타 수정이 필요함
    • BlogIcon 9월의토끼
      2017.09.02 01:11 신고

      "티스토리가 업데이트되어 '페이지'기능과 '메뉴'기능이 추가가되었네요.
      사실 '페이지' 작성 후에 '메뉴'에 등록하는거라 사실상 하나의 기능이라 생각하시면 편합니다."

      라고 말씀하셨는데, 메뉴 기능은 아래 글에서도 알 수 있듯이 7년 전에 추가된 기능입니다.
      http://nextgoal.tistory.com/821

      새로운 기능이 아닌 점 알려드립니다.

      • BlogIcon 뭐하라
        2017.09.02 06:06 신고

        앗 이번에추가된 기능이아니군요 정정하겠습니다 ^^

    • BlogIcon 전자사향
      2017.09.02 22:09 신고

      집에가서 바로 적용해봐야겠네요!!

      • BlogIcon 뭐하라
        2017.09.02 22:49 신고

        크게 바뀐점은 없으니 페이지기능만 활성화시키셔도될것같습니다. 해당 강좌 링크해뒀습니다 ^^

    • BlogIcon 옹봉이
      2017.09.05 20:33 신고

      티스토리 업데이트에 맞춰 스킨도 업데이트 해주셨네요. 감사합니다!!
      저는 5버전에 워낙 이것저것 추가를 많이 해놔서 섣불리 5+로 바꾸기가 힘드네요.
      업데이트 전에는 동영상도 반응형이였는데 이번 업데이트를 통해서 티스토리 자체에 업로드 한 동영상(유튜브아님)의 플레이어가 변경 되서 화면 사이즈에 맞춰 반응하지 않네요. 질문하러 들어왔다가 혼자 해결했는데 혹시 다른분들도 필요하실가봐 댓글 남겨요.

      티스토리 자체 동영상 플레이어가 videofarm.daum.net에서 tv.kakao.com으로 변경 됐습니다.
      HTML스킨 수정에 들어가서 //유튜브 비디오컨테이너 감싸기 를 검색 하신후
      $("iframe[src*='youtube.com'],iframe[src*='videofarm.daum.net'],iframe[src*='youtube.com'],iframe[src*='tv.kakao.com']")
      이렇게 iframe[src*='tv.kakao.com'] 를 추가하시거나 videofarm.daum.net을 tv.kakao.com으로 변경 해주시면 반응형 동영상으로 작동합니다.

      • BlogIcon 뭐하라
        2017.09.05 20:36 신고

        강좌통해올린 메뉴기능활성화만 하셔도 똑같을겁니다^^
        티스토리 플레이어 업데이트도 있었군요 감사합니다

    • BlogIcon Nexus Prime
      2017.10.02 22:11 신고

      Marerial T mark 3 에서 Material T mark 5 로 업데이트 하였는데 티에디션 쓸때 글자가 가운데로 오네요.
      티에디션 쓸 때 글자가 왼쪽으로 가게 하려면 어떻게 해야 하나요?

      • BlogIcon 뭐하라
        2017.10.02 22:17 신고

        T에디션 html 입력할때
        <div class="teditionItem card flatbutton">
        이부분을
        <div class="teditionItem card">
        이렇게 flatbutton을 지워주세요.

      • BlogIcon Nexus Prime
        2017.10.03 10:28 신고

        뭐하라님 정말로 감사합니다.
        글자를 왼쪽으로 하기 위해 별의 별 방법을 찾아보려고 했거든요.

    • BlogIcon Muramasa
      2017.10.07 11:35 신고

      안녕하세요. 혹시 포스팅 영역 배경 색과 글자 색을 변경할 수 있을까요?

      • BlogIcon 뭐하라
        2017.10.07 11:50 신고

        배경색 변경은 어렵지않으나 글자색변경은 일일히 지정해줘야해서 쉽지않습니다.

        .card {background:#000;color:#fff}
        p,h1,h2,h3,h4,h5,div,span,a{color:#fff}

        이 2줄을 CSS맨위에 넣어보세요. 글자색이 빠지는 부분이 있을수 있습니다

      • BlogIcon Muramasa
        2017.10.07 15:14 신고

        적용해봤는데 잘 됩니다. 감사합니다. 다만 왼쪽 메뉴 카테고리 글자 색과 최근 카드 윗 쪽 부분은 색 변경이 안되는데 이 부분에 대해서도 알 수 있을까요? 귀찮게해서 죄송합니다. 메뉴 배경 색 변경이나 변경 안된 글자 색 변경과 같은 다른 부분은 다 찾았는데 저 둘만은 도저히 안나오네요.

      • BlogIcon 뭐하라
        2017.10.15 21:10 신고

        .card, .drawerContainer, .tabs{background:#000;color:#fff}
        p,h1,h2,h3,h4,h5,div,span,a{color:#fff!important}
        이렇게 넣어보세요

    • BlogIcon Last_Answer
      2017.11.09 20:26 신고

      안녕하세요 뭐하라님의 스킨을 받아서 제 블로그에 스킨을 취향대로 바꾸고 있는데 검색창에 검색어를 입력하고 거기서 나오는 두 버튼들의 글자색을 바꾸는 방법을 모르겠습니다.
      검색결과 전체보기와 닫기 이 두버튼의 글자색만 바꾸면 되거든요. 이것만 고치면 거의 완성인데 마지막에서 걸리네요.

      • BlogIcon 뭐하라
        2017.11.09 22:09 신고

        색상변경강좌 참고해보시고 안되면
        #searchResultWrap .flatbutton:hover, #searchResultWrap .flatbutton:visited, #searchResultWrap .flatbutton:active {
        text-decoration: none;
        color: #4285f4;
        }
        #searchResultWrap .flatbutton {
        background: #fff;
        float: right;
        color: #4285f4;
        margin-left: 8px;
        }
        이렇게 두개 css에 추가하고 수정하세요

      • BlogIcon Last_Answer
        2017.11.09 22:26 신고

        가르쳐주신대로 해보니 해결이 되었네요!감사합니다.

    • BlogIcon uncle0330
      2017.11.18 18:27 신고

      안녕하세요! 뭐하라님의 스킨 잘 쓰고 있습니다!
      근데 약간의 아쉬운 점이 있어서 도움을 요청하려고 합니다 :(

      글 하단에 있는 관련 글이 굉장히 불편해 보여서 없애려고 하는데 어느 부분을 건들여야 할지 모르겠습니다!
      혹시, '관련 글' 부분을 없애는 방법이 있다면 알려주세요 :)

      • BlogIcon 뭐하라
        2017.11.18 19:09 신고

        <s_article_related>

        ~
        </s_article_related>
        부분 지우면됩니다

    • BlogIcon uncle0330
      2017.11.18 19:30 신고

      관련글 부분이 사라졌네요! 정말 감사합니다 :)

티스토리 툴바