생활 웹디자인

코스 전체목록

닫기

퍼머링크 페이지

해당영역과 html구조

퍼머링크 페이지에 방문했을때 출력할 요소들을 지정합니다.
댓글이나 노트등을 기타 부가정보등을 추가할 수 있습니다.

{block:PermalinkPage}
<div class="permalinkpage">
    {block:PostNotes}
        <div class="note_wrap">
            <h3>Note</h3>
            {PostNotes-16}
        </div>
    {/block:PostNotes}
    {block:IfDisqusShortname}
    <div id="disqus_thread" class="disqus_wrap"></div>
    <script type="text/javascript">
      (function() {
       var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
       dsq.src = 'http://{text:Disqus Shortname}.disqus.com/embed.js';
       (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
      })();
    </script>
    <noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript={text:Disqus Shortname}">comments powered by Disqus.</a></noscript>
    <a href="http://disqus.com" class="dsq-brlink">blog comments powered by <span class="logo-disqus">Disqus</span></a>
</section>                    
    {/block:IfDisqusShortname}
</div>    
{/block:PermalinkPage}

위 코드에서는 댓글과 노트를 추가해 보았습니다.
참고로 텀블러에서는 자체 댓글 시스템을 제공하지 않기 때문에 Disqus서비스를 연동하여 사용하도록 하고 있습니다.

변수 설명

{block:PermalinkPage} ... {/block:PermalinkPage}
개별 포스트 페이지를 출력합니다.

{block:PostNotes} {/block:PostNotes}
해당 포스트가 notes를 가지고 있다면 퍼머링크 페이지에 출력합니다.

{PostNotes-16}
해당 포스트의 notes를 16X16사이즈의 아바타와 함께 출력합니다. 단 퍼머링크 페이지에서만 출력합니다.
좀 더 큰 이미지를 원한다면 64X64사이즈의 아바타 이미지를 사용할 수 있는 {PostNotes-64}변수를 사용할 수도 있습니다.

{IfDisqusShortname} ... {/IfDisqusShortname}
Disqus서비스를 연동합니다.
"텀블러>블로그 꾸미기" 페이지에서 Disqus 연결시켜야 댓글을 사용할 수 있습니다.

 

 

댓글

댓글 본문
버전 관리
리체
현재 버전
선택 버전
graphittie 자세히 보기