'PHP와 태터와 스킨, 그리고 업데이트'에서 언급했던 포스트에 입히는 하이라이트 구현방법을 공개한다. 이것은 태그 구름이 표시되는 것을 보고 아이디어를 얻어 태터툴즈의 글 목록에 적용한 것이다. 결과는 이 블로그의 'Archive'에서 보이는 것과 같다.
태터툴즈는 포스트 별로 조회수를 기록하지 않는다. 따라서 인기도의 기준은 댓글수와 트랙백수를 근거로 하여 점수를 매기고 해당하는 점수범위 안에서 지정된 하이라이트를 적용하는 방법이다. 조금 더 재미있는 하이라이트를 구현하고 싶다면 synec!님의 '글 조회수 패치'를 적용하는 것도 좋은 방법이다.
수정할 파일은 /skin 폴더에 블로그에 적용하여 사용하고 있는 skin.html 파일과 style.css 그리고, index.php 파일 3개이다. utf-8 인코딩을 지원하는 전문 편집프로그램을 사용해야 한다.
index.php - 하이라이트 레벨 설정부분을 담고있다.
수정전 - 316열 부근에서 아래의 코드를 찾는다.
$sql = "select no, category1, category2, title, user_id, image_file_path1, image_file_path2, regdate, rp_cnt from t3_".$dbid." where $is_public $add_query order by regdate desc";
// print $sql;
$result = @mysql_query($sql);
$list_count = mysql_num_rows($result);
while(list($no, $category1, $category2, $title, $user_id, $image_file_path1, $image_file_path2, $regdate, $rp_cnt) = @mysql_fetch_array($result)) {
if ($rp_cnt) $rp_cnt = "($rp_cnt)"; else $rp_cnt = "";
$p2_rp = $skin->s_list_rep;
$p2_rp = str_replace("[##_list_rep_title_##]", $title, $p2_rp);
$p2_rp = str_replace("[##_list_rep_link_##]", "index.php?pl=$no".$add_val, $p2_rp);
수정후 - 아래에 색상이 들어간 부분을 추가한다.
$sql = "select no, category1, category2, title, user_id, image_file_path1, image_file_path2, regdate, rp_cnt, tb_cnt from t3_".$dbid." where $is_public $add_query order by regdate desc";
// print $sql;
$result = @mysql_query($sql);
$list_count = mysql_num_rows($result);
while(list($no, $category1, $category2, $title, $user_id, $image_file_path1, $image_file_path2, $regdate, $rp_cnt, $tb_cnt) = @mysql_fetch_array($result)) {
// 인기도 컬러로 표시
$point = $rp_cnt*10 + $tb_cnt*20;
if($point>800) $font='highlight1';
elseif($point>400) $font='highlight2';
elseif($point>200) $font='highlight3';
elseif($point>100) $font='highlight4';
else $font='highlight5';
if ($rp_cnt) $rp_cnt = "($rp_cnt)"; else $rp_cnt = "";
$p2_rp = $skin->s_list_rep;
$p2_rp = str_replace("[##_list_rep_font_##]", $font, $p2_rp); // 인기도 컬러 표시
$p2_rp = str_replace("[##_list_rep_title_##]", $title, $p2_rp);
점수 계산 및 하이라이트 스타일 레벨을 설정한 것이다. 빨간색으로 표시된 부분은 댓글 한개당 10점, 트랙백 한개당 20점을 뜻하며 이것을 합산한 것이 점수이다. 관리자 댓글수나 트랙백수도 포함된다. 녹색으로 표시된 부분 100 ~ 800은 100점을 얻었을 때 스타일 'highlight4'를 표시하라는 함수이다. 예를 들어 댓글 7개와 트랙백 2개를 얻었다면 10x7 + 20x2 = 110이되므로 highlight4에 해당하는 하이라이트를 표시하게 되는 것이다. 이곳을 조율하여 자신의 블로그에 잘(?) 작용하면 되겠다.
skin.html - quan 기본스킨을 기준으로 설명한다.
수정전 - 70열 부근의 <s_list_rep>태그에서 아래의 코드를 찾는다.
<s_list_rep>
<tr>
<td class="h4">[##_list_rep_regdate_##]</td>
<td> <a href="[##_list_rep_link_##]">[##_list_rep_title_##] <font class="h4">[##_list_rep_rp_cnt_##]</font></a>
</tr>
</s_list_rep>
수정후 - 아래처럼 고친다.
<s_list_rep>
<tr>
<td class="h4">[##_list_rep_regdate_##]</td>
<td> <a href="[##_list_rep_link_##]"><font class="[##_list_rep_font_##]">[##_list_rep_title_##]</font> <font class="h4">[##_list_rep_rp_cnt_##]</font></a>
</tr>
</s_list_rep>
style.css - 적절한 곳에 아래의 스타일을 추가한다.(위치 관계없음)
/* 하이라이트 스타일 */
.highlight1 {font-size: 14px; color: #cc3300; font-family: "돋움"; letter-spacing:-1px; font-weight:bold;}
.highlight2 {font-size: 14px; color: #EA6A15; font-family: "돋움"; letter-spacing:-1px;}
.highlight3 {color: #669900;}
.highlight4 {color: #0099CC;}
.highlight5 {color: #666666;}
※ 오류, 버그, 개선 등과 관련된 피드백은 이곳에 댓글 및 트랙백으로 남겨주기 바란다. Good Luck! 
Comments