적용가능 버전:mark1,2,3,4,5


    material T스킨에 원하는 사이드바 요소를 추가하는 방법입니다.


    아래는 리스트 형식의 사용자 모듈 예제입니다.

    <!-- 사용자 모듈 Mark1,2용 -->

    <div class="card">

    <div class="card-header ripplelink lessed">

    <i class="ic-more_vert"></i>

    <h3><i class="ic-info"></i> 사용자 모듈</h3>

    </div>

    <div class="card-listed-content">

    <ul>

    <li class="ripplelink" onclick="window.open('url')">내용</li>

    </ul>

    </div>

    </div>


    <!-- 사용자 모듈 (Mark 3 이후버전용)  -->

    <div class="card">

    <div class="card-header ripplelink lessed">

    <i class="ic-more_vert"></i>

    <h3><i class="ic-info"></i> 사용자 모듈</h3>

    </div>

    <div class="card-listed-content">

    <ul>

    <li class="getThumb">

    <a class="buttonAnchor ripplelink" href="url">내용

    </a>

    </li>

    </ul>

    </div>

    </div>

    첫줄부터 빨간색 글자에 대한 설명입니다.

    -사용자 모듈 : 모듈의 이름을 정해서 입력합니다.

    -lessed : 그대로 쓰면, 사이드바가 기본으로 접힘상태로 나타나며, 클릭했을 때 펼쳐지게됩니다. 기본을 펼침으로 쓰려면 지우세요.

    -ic-info : 사이드바 제목 왼쪽에 나오는 아이콘입니다. 사용할 수 있는 아이콘 목록은 여기서 확인하세요.

    -사용자 모듈: 사이드바의 제목입니다.

    -card-listed-content : 리스트형식의 사이드바일경우 사용합니다. 리스트형식이 아닌 경우 "card-content ripplelink"로 바꿔 쓰시면 됩니다.
     ※리스트 형식이 아닌 경우 <ul>~</ul>을 삭제하고 넣고싶은 html코드를 넣으면 됩니다.

    -url:리스트를 클릭했을 때 이동할 url을 입력합니다.

    -내용:리스트 내용을 입력합니다.


    리스트를 추가하려면 <li class=~~ 내용 </li>을 </ul>위로 한줄씩 추가하면 됩니다.



    수정을 마친 후에 전체를 복사해서

    관리화면에서 HTML배너 사이드바를 하나 추가합니다.


    편집창을 열어서 수정한 코드를 붙여넣습니다.



    위치를 조정하고 저장을 누르면 끝입니다.



    추가된 사이드바의 예시입니다.


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

    문제가 있나요?(?)

    내용상 오류가 있음 업데이트 필요 화면이 깨짐 기타 수정이 필요함
    • BlogIcon PlayGlobal
      2015.03.26 21:54 신고

      터무니 없는 질문일 수 있습니다. 잘 몰라라서요 ㅎ... 친절한 설명대로 따라하니 카드는 추가가 되었는데 javascript 코드는 그 내용 표현이 원래 안나타나는 건가요? 제겐 필요한 거라 별도의 카운트 소스 코드를 가져와 넣었는데 표현이 안 되는군요...

      • BlogIcon 뭐하라
        2015.03.26 22:12 신고

        자바스크립트에 따로 표현함수가 있다면 표시되는게 정상입니다~

    • BlogIcon PlayGlobal
      2015.03.26 22:27 신고

      참고로 여쭤보려고 소스코드를 넣으니 댓글이 달리지가 않는군요 금칙어가 있다면서... 표현함수가 뭔지 모르는데... 자꾸 깊이 빠져들면 곤란한데... 머리 아파서요 ㅎ 따로 찾아봐야겠군요. 암튼 감사요

      • BlogIcon 뭐하라
        2015.03.26 22:38 신고

        네..^^ 해당 스크립트 사용법을 잘 알아보세요~

    • BlogIcon PlayGlobal
      2015.03.28 16:01 신고

      생성된 카드에서 컨텐츠가 들어가는 부분의 카드 높이를 수동으로 지정해 줄 수 있는 방법이 있습니까?자바스크립트 소스가 들어갔는데 처음 디폴트는 높이가 작지만 누군가 방문을 하면서 늘어나거든요. 그런데 카드가 거기 맞춰서 늘어나질 않아서 그럽니다. 도움 말씀 부탁드릴게요...

      • BlogIcon 뭐하라
        2015.03.28 23:28 신고

        높이를 제한하고 있진 않습니다..
        컨텐츠가 늘어나면 카드도 늘어나는게 정상인데요.
        지금은 스킨을 바꾸셨는지 확인해드릴수가없네요

    • BlogIcon PlayGlobal
      2015.03.28 23:53 신고

      하단에 'Live Traffic feed'입니다. 수고스럽겠지만 언제 시간 나시면 뭐가 문제인지 도움될 만한 게 있으면 알려주십시오. 감사합니다 항상...ㅎ

      • BlogIcon 뭐하라
        2015.03.29 00:38 신고

        카드들은 로딩되면서 컨테이너 2개에 나눠 이동하게되는데, 그과정중에 스크립트가 실행되면서 자신의 위치를 찾지못해서 그랬던것 같네요.

        <div id="sidebar-col1" class="sidebar-col"></div>
        의 사이에 (</div>앞에)
        모듈을 삽입해놓으면 됩니다.

        예를들면
        <div id="sidebar-col1" class="sidebar-col">

        <s_sidebar_element>
        <!-- 사용자 모듈 -->
        <div class="card">
        <div class="card-header ripplelink">
        <i class="ic-more_vert"></i>
        <h3><i class="ic-info"></i> 사용자 모듈</h3>
        </div>
        <div class="card-content ripplelink">
        <script type="text/javascript" src="http://feedjit.com/serve/?vv=1515&tft=3&dd=0&wid=&pid=0&proid=0&bc=FFFFFF&tc=545454&brd1=CCCCCC&lnk=6AA5C4&hc=878787&hfc=FFFFFF&btn=62BBDE&ww=300&wne=10&srefs=1"></script><noscript><a href="http://feedjit.com/">Live Traffic Stats</a></noscript>
        </div>
        </div>
        </s_sidebar_element>

        </div>

        이런식으로 삽입하면 될겁니다. 하지만 이 경우 이 카드의 순서를 바꾸기는 어렵습니다

    • BlogIcon PlayGlobal
      2015.03.29 09:32 신고

      말씀하신대로 코드 수정을 해놨는데 변화가 없는 것 같습니다

    • BlogIcon 제도샤프
      2015.05.04 07:33 신고

      안녕하세요 뭐하라님.
      사이드바에 카테고리를 삽입해보려고 하는데, 티스토리 치환자는 해당 코드 안에서 작동하지 않네요. 혹시 카테고리를 우른쪽 사이드바에서 카드 형태로 불러올 수 있는 방법이 있을까요?

      • BlogIcon 뭐하라
        2015.05.05 11:52 신고

        늦어서 죄송합니다 본문에 내용추가했습니다^^

    • BlogIcon 얀손
      2015.06.12 12:55 신고

      뭐하라님 항상 수고 많으십니다! 올려주신 코드로 카테고리 모듈을 만들었는데 제목만 뜨고 카테고리 리스트가 뜨지 않네요 ㅜㅜ 치환자를 인식 못 하는 것 같은데 다른 분들은 잘 되시는건가요? 도움 부탁드립니다!

      • BlogIcon 뭐하라
        2015.06.13 00:12 신고

        아 그렇네요..
        카테고리 치환자는 html에서 한번만 불러올수있게 되어있네요
        간단히 추가할 수 있는 부분이 아니었군요.
        다음버전에서 개선해보는 수 밖에 없겠습니다..

      • BlogIcon 얀손
        2015.06.13 00:14 신고

        html에서 한 번만 불러올 수 있다는 것은
        Drawer에서 이미 썼기 때문에 못 쓴다는 건가요?

        일단은 당장 급한 것은 아닙니다^^
        빠른 답변 감사합니다!!

      • BlogIcon 뭐하라
        2015.06.13 00:35 신고

        네 그렇습니다..

      • BlogIcon 얀손
        2015.06.13 00:37 신고

        그렇군요 ㅜㅜ
        여러가지 여쭙고 싶은 것이 많지만
        인내심을 갖고 다음 업데이트 기다려보겠습니다!

        덕분에 Material Design에 대해서도 굉장히 흥미를 갖게 되었습니다.
        다시 한 번, 좋은 스킨 공유해주셔서 정말 감사합니다~

    • BlogIcon 태풍 님
      2015.07.10 17:14 신고

      ##

    • BlogIcon SSOAdel
      2015.07.15 23:56 신고

      글약간 내렸을때 오른쪽 하단에서 이건어때요? 뜨는건 어떻게하나요?

    • BlogIcon 쇼다님
      2016.05.23 22:30 신고

      HTML 배너출력이 없는데 어떻게 추가하나요??

      • BlogIcon 뭐하라
        2016.05.25 02:01 신고

        사이드바메뉴에서 추가하시면됩니다

    • BlogIcon 쇼다님
      2016.05.25 08:58 신고

      사이드바메뉴에서도 HTML 배너출력이 없습니다..보관함에도 없고 기본모듈에도 없습니다 ㅠ ㅠ

      • BlogIcon 뭐하라
        2016.05.25 09:01 신고

        플러그인에서 활성화되어있는지 확인해보세요~

    • BlogIcon 쇼다님
      2016.05.27 17:39 신고

      감사합니다!!

    • BlogIcon 데사루
      2017.01.19 11:43 신고

      Material T Skin Mark5를 잘 사용하고있는데요~ 혹시 http://whos.amung.us/ 이 사이트의 동시접속자 표시 위젯을 적용할 순 없을까요?

      • BlogIcon 뭐하라
        2017.01.19 15:16 신고

        내용부분에 위젯을 넣으시면될것같습니다

    • BlogIcon 악연
      2017.01.20 11:44 신고

      Material T Skin Mark5 를 사용하려고 하는데 사이드바가 오른쪽에 있습니다 아래로 어떻게 옮기죠... 4시간 동안 헤메네요

      • BlogIcon 뭐하라
        2017.01.20 15:07 신고

        5.2말고 5 사용하시는것맞나요? 5사용중이시라면 스킨설치를 처음부터 다시해보시길 바랍니다

티스토리 툴바