게시판 리스트 확장변수 항목에 css 입히기

[lis****님의 질문 ]

안녕하세요?

화창한 봄날 입니다~

 

sketchbook5 게시판 "설정 >> 사용자정의" 에서 확장변수를 아래와 같이 입력하였습니다.

• 사용자정의이름 : extra_var1
• 기본값: 대기중, 완료

 

게시판 리스트에 다음과 같이 출력하려고 합니다.

extra_var1 값이 "대기중"이면 css의 class="red"

                          "완   료"이면 css의 class="blue"  

 

 

스케치북 스킨 _list_normal.html 파일의 끝부분에서 아래 부분이 확장변수 출력부분이더군요.

<!--@else-->{$document->getExtraValueHTML($val->idx)}<!--@end-->

 

[ 윤삼님의 답글 ]

<span<!--@if($document->getExtraValueHTML($val->idx)=='대기중')--> class="red"<!--@elseif($document->getExtraValueHTML($val->idx)=='완료')--> class="blue"<!--@end-->>{$document->getExtraValueHTML($val->idx)}</span>

 

[ 팔공산의 적용 ]

_list_normal.html 의 확장변수 부분을 아래와 같이 수정

 

<!--@else--><span<!--@if($document->getExtraValueHTML($val->idx)=='사과주문')--> class="blue"<!--@elseif($document->getExtraValueHTML($val->idx)=='주문확인함')--> class="red"<!--@elseif($document->getExtraValueHTML($val->idx)=='주문취소됨')--> class="gray"<!--@end-->>{$document->getExtraValueHTML($val->idx)}</span><!--@end-->

 

board.css 파일에 아래 부분 추가

 

/* 확장변수 기본값 색상출력*/

.blue { font-size:10px; background-color:#0099ff; color:#fff; padding:3px; -webkit-border-radius:3px;-moz-border-radius:3px; border-radius:3px; }

.red { font-size:10px; background-color:#ff9900; color:#fff; padding:3px; padding:3px; -webkit-border-radius:3px;-moz-border-radius:3px; border-radius:3px; }

.gray { font-size:10px; background-color:#888888; color:#fff; padding:3px; padding:3px; -webkit-border-radius:3px;-moz-border-radius:3px; border-radius:3px; }

 

p.s 게시판확장변수를 이미지로 나타내게 게시판스킨 수정법 도 있습니다.