2014-09-17 2 views
3

게시 된 라벨을 기반으로 각 블로그 게시물을 디자인하는 방법을 보여주는 라벨 기반 게시물 맞춤 설정을 접했습니다. 즉, 동일한 레이블을 가진 모든 게시물이 자동으로 동일한 디자인을 갖게됩니다.Blogger의 라벨을 기반으로 각 게시물 페이지를 맞춤 설정합니다.

하지만 'label'이 게시물 콘텐츠 영역으로 만 정의되었으므로 게시물 콘텐츠 (기본 래퍼) 외부에서 사용자 정의 할 수 없습니다. 헤더의 다른 색상과 내 레이블의 다른 외부 래퍼를 좋아합니다.

I는 템플릿의 스타일 부에이어서이

<b:if cond='data:post.labels'> 
<b:loop values='data:post.labels' var='label'> 
<b:if cond='data:label.isLast == "true"'> 
<!-- Only using the last label --> 
<div expr:class='"label" + data:label.name'> 
<p> <data:post.body/> </p> 
</div> 
</b:if> 
</b:loop> 
<b:else/> 
<div class='labelNone'> <p><data:post.body/></p> </div> 
</b:if> 

와 I는 SPAN (속성 사이) <data:post.body/> 번째 항목을 바꾸

를 사용하는 코드를 제공

는 지정하여 스타일을 적용 div 클래스. 여기에 레이블이 "기술"모든 게시물에 대한 배경 이미지를 넣어 것입니다 예입니다 : 만 학생입니다 때문에 스택 오버 플로우의 지식 회원이 나에게 도움이 될 경우

<style type='text/css'> 
div.labeltech { 
background-image: url(&quot;http://yoursite.com/Wallpaper-Widescreen.jpg&quot;); 
background-repeat: no-repeat; 
background-position: bottom right; 
display: block; 
} 
</style> 

아주 좋은 것입니다.

+0

하나의 div 클래스를 복제 한 다음 jQuery를 사용하여 다른 div에 추가 할 수 있습니다. 이렇게하면 범위 밖으로 클래스를 적용 할 수 있습니다. 내가 사용하는 경우 – Vector

+0

@vector는 그것을 다음, $ (함수() { VAR $ sharetitle = $ (' .sharetitle ') .clone(); $ (' .labeldummy ') .html 중에서 ($의 sharetitle); sharetitle은 내가 "dummy"라는 레이블 안에있는 div입니다.하지만 dummy라는 레이블의 sharetitle에 다른 색 (내 메인 페이지와 관련하여)을 주어야합니다. 따라서 div id = sharetitle을 복제하면 내 메인 페이지와 동일한 공유 제목을 얻으십시오 - 어느 부분이 달라야합니까? – Amal

+1

b : skin의 모든 CSS를 제거하고 모든 CSS를 라벨 조건 태그에 넣으십시오 ... 아마도 작동 할 것입니다 – Michel

답변

0

나는 '부모'ie의 자바 스크립트 (예 : jquery) 구현을 고수해야 할까봐 걱정됩니다. http://api.jquery.com/parent/

CSS 사양의 경우 CSS2 및 CSS3 사양에 상위 요소 선택기가 없습니다. '부모가 Y 인 X 요소 선택 (Y> X)'을 사용하여 놀 수도 있지만 그게 전부입니다.

이 가능한 선택기 목록 http://www.w3.org/TR/css3-selectors/#selectors에서 봐 주시기 바랍니다 어쩌면 당신은 밝은면에

유용한 무언가를 발견 할 것이다, 지금까지 그

!div p{} 

하지만 뭔가를 만들 계획이, 아직 초안이고 어떤 브라우저도 지원하지 않습니다. http://www.w3.org/TR/selectors4/#subject

관련 문제