그누보드 공지면 스타일 추가 - 게시판에서 공지사항 부분만 css 클래스 추가하기
페이지 정보
조회 1,308회 작성일 22-05-27 11:53
본문
공지면 스타일 추가
게시판에서 공지사항 부분만 css 클래스 추가하기
그누보드 게시판에서 공지사항 부분만 css 클래스를 추가해서 스타일을 변경하는 방법에 대해 설명한다.
공지면 스타일 추가 - 게시판에서 공지사항 부분만 css 클래스 추가하기
그누보드 게시판 리스트 스킨의 이해
그누보드의 게시판은 $list[$i]['옵션']을 이용해서 한꺼번에 게시물을 뿌려준다.
그러므로 이 $list[$i] 중에서 공지사항 부분만 모양을 변경하려면 css 클래스를 추가해줘야 한다.
(참고로 "옵션"부분에 subject, name, wr_datetime등을 넣으면 제목, 작성자. 작성일 등을 보여주게 됨)
일반적으로 표를 이용해서 작성되어 있으므로, 그누보드 게시판 스킨을 열어보면 아래와 같은 코드를 볼 수 있다.
[code]
<tbody>
<?php for ($i=0; $i<count($list); $i++) { ?>
<tr>
<td>
<?php echo $list[$i]['subject'] ?>
</td>
</tr>
<tbody>
[/code]
이것은 스킨 폴더 중 board에 들어 있는 게시판스킨의 list.skin.php 코드의 일부인데, 실제로 에디터로 불러와 보면 약간 다르긴 할 것이다.
여기서 <?php echo $list[$i]['subject'] ?> 부분이 제목을 뿌려주는 PHP문이다. 예를 들어, 제목의 스타일을 변경하려면 여기다가 아래의 예제를 응용하면 된다.
또한 그 바로 위에 <tr>이 있는데, 게시물 한 칸 전체에 스타일을 주고 싶으면 여기에 예제를 응용하면 된다.
공지사항이면 클래스 추가하기 예제
아래 예제는 일괄적으로 내용을 뿌려주다가 "공지사항" 부분을 만나면 스타일 클래스를 추가하라는 예문이 되겠다.
우선 이렇게 글자를 Span 태그로 감싸 준 후, class를 넣을 준비를 한다. 위의 코드와 비교하면 이해가 쉬울 것이다.
[code]
<span class=""><?php echo $list[$i]['subject'] ?></span>
[/code]
그 후 class 부분에 아래처럼 코드를 작성한다.
[code]
<span class="<?php if ($list[$i]['is_notice']) echo "bo_notice"; ?>"><?php echo $list[$i]['subject'] ?></span>
[/code]
if ($list[$i]['is_notice'])는 "공지사항이라면..."의 뜻이다.
여기서 중요한 것은 class="" 안에 echo "bo_notice"처럼 에코문을 넣는 것이다.
즉, 원래는 class=""처럼 내용이 비어 있다가, 공지사항이면 class="bo_notice"로 변하는 것이다. [저작권법 표시] 원본 출처 : 키스세븐(www.kiss7.kr)
그 후 css파일에서 bo_notice에 대한 스타일을 아래처럼 주면, 공지사항 부분만 글자 클래스를 추가로 적용할 수 있게 된다.
[code]
.bo_notice { font-size:bold; }
[/code]
만약, 공지 게시물 배경 전체에 css class를 추가하고 싶다면 아래처럼 변경하면 된다.
[code]
<tr class="<?php if ($list[$i]['is_notice']) echo "bo_notice"; ?>">
<td>
<?php echo $list[$i]['subject'] ?>
</td>
<td>
[/code]
응용해서, 게시판뿐 아니라 여러 곳에서 "어떤 조건에 해당"한다면, if문을 쓰고 특정 "class(클래스) 추가"를 통해서 다양한 효과를 낼 수 있을 것이다.