mungsang
C,C#,JAVA,JSP,SPRING,PYTHON,IOT
≡
Home
Features
Multi DropDown
DropDown 1
DropDown 2
DropDown 3
Shortcodes
SiteMap
Error Page
Learn Blogging
Video Documentation
Download This Template
2014/05/21
blogger
구글 블로거 글 목록 깔끔하게 표시하기
jieun
오후 2:13:00
0
comments
블로거 글 목록에서 텍스트 부분은 충분히 표시된 후 "..." 나오고,
이미지가 있을 때는 섬네일이 나오고, 이미지가 없을 때는 섬네일이 안 나옵니다.
<head>안에 아래의 스크립트를 넣습니다.
<script type='text/javascript'> //<![CDATA[ function stripTags(s,n){return s.replace(/<.*?>/ig,'').split(/\s+/).slice(0,n - 1).join(' ');}function readmore(id){ var p = document.getElementById(id),imgtag = '',img = p.getElementsByTagName('img'); if(img.length >= 1){ imgtag = '<img class="thumb" src="' + img[0].src + '" />'; }else{ imgtag = '<img class="no-thumb" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9S4cZ0DSm5kW4p9iFFYsDt3Qa92YGeNrE5ycrgDooBpLgnUM4DZt5PWw0RoEeEmHCv__VVfhKO3eQYGuq-wntSvmF0-1dFO2DPpLeL2xCR_esO4rKvbW5WKuxQqaETW8Toc1eQrNlFow/" />';}p.innerHTML = '<div class="heading_post"><h3><a href="'+y+'">'+x+'</a></h3></div><div class="thumbnail border_textured"><a class="read_more" href="'+y+'">'+imgtag+'</a></div>' + '<div class="article-short">'+'<div class="intro">'+stripTags(p.innerHTML,60)+'...<a class="arrow_link" href="'+y+'"></a></div></div>'; } //]]> </script>
<div class='post-body'>를 찾아 적당한 곳에 아래 소스를 넣습니다.
<div class='post-body'> <b:if cond='data:blog.pageType == "index"'> <span class='title-date'><data:post.date/></span> <b:if cond='data:blog.pageType != "static_page"'> <b:if cond='data:blog.pageType == "index"'> <span expr:id='"p" + data:post.id'><data:post.body/></span> <script type='text/javascript'>var x="<data:post.title/>",y="<data:post.url/>";readmore("p<data:post.id/>")</script> <b:else/> <data:post.body/> </b:if> </b:if> </div> <b:else/> <data:post.body/> </b:if> </div>
제가 찾은 건 여기까지 입니다.
유투브 동영상을 등록 했을 때에도 글 목록에서 보여지게 하려면 어떻게 하는지 아시면 좀 알려주세요 ^^
Share This:
Facebook
Twitter
Google+
Pinterest
Linkedin
whatsapp
댓글 없음:
댓글 쓰기
최근 게시물
이전 게시물
홈
피드 구독하기:
댓글 (Atom)
Popular Posts
JAVA 버튼 눌러서 이미지 바꾸기
mingw c 언어 설치
spring tomcat 원격 배포
JAVA IMAGE SOCKET 자바 이미지 전송 소켓 통신
Recent-post
Your browser does not support JavaScript!
Labels
Android
blogger
CSS
Eclipse
html
JAVA
JavaScript
jQuery
PHP
Softwere
Spring
sql
Blog Archive
Blog Archive
9월 (1)
8월 (1)
1월 (2)
4월 (1)
5월 (1)
7월 (1)
6월 (3)
5월 (5)
8월 (1)
7월 (4)
6월 (4)
5월 (21)
7월 (8)
6월 (3)
