11 07

Drenched 워드프레스 테마

워드프레스 테마 Add comments

Drenched는 지난 4월과 10월에 각각 소개했던 Centric과 LeanMagazine 테마를 제작한 ChicQ의 또 다른 작품으로 단순하며 깔끔한 매거진 스타일의 테마입니다. 기능적인 면에서는 눈에 띄는 점이 없습니다. 위젯을 쉽게 사용할 수 있도록 해두지 않아 불편함 점도 있습니다.

테마가 워드프레스 2.7판 이전에 나온 것이다보니 댓글에 댓글 달기(계단형 댓글, Threaded comments)와 댓글 쪽 나눔(Paged comments) 기능을 사용할 수 있도록 준비되어 있지도 않습니다. 하지만 깔끔하면서도 무게감 있는 디자인은 매력적입니다. 아래에서는 간략히 테마 사용법에 대해 설명합니다.

Drenched 테마 스크린샷

필요 확장기능

Drenched 테마는 페이지 이동을 쉽게하기 위해 WP Page Numbers 플러그인을 사용합니다. 관리자 화면에서 확장기능 추가로 검색해 설치하신 다음 설정 > Page Numbers로 이동해 마음에 드시는 테마만 선택해주시면 됩니다.

블로그 이름과 설명

블로그 이름과 설명을 블로그의 일반 설정(Settings > General)에서 설정해둔 값을 끌어와 사용할 수 있도록 정의되어 있지 않기 때문에 header.php 파일을 열어 집적 입력해줘야 됩니다.

<div id="header">
  <h1><a href="<?php bloginfo("url"); ?>">Drenched Theme</a></h1>
  <h2>Premium Theme Live Preview!</h2>
</div>

header.php 파일을 열어 위 코드를 찾은 뒤 Dreanched Theme에 블로그 이름을, Premium Theme Live Preview!에 블로그에 대한 짧은 설명을 입력해줍니다. 또는 앞으로 블로그에서 설정한 내용이 곧 바로 반영될 수 있도록 아래 코드로 각각 대체해주셔도 됩니다.

<h1><a href="<?php bloginfo("url"); ?>"><?php bloginfo('name'); ?></a></h1>
<h2><?php bloginfo('description'); ?></h2>

섬네일

이 테마에서 사용하는 섬네일의 크기는 두 가지인데요. 첫째는 일반 글의 요약 옆에 나타나는 것이고, 다른 한 가지는 특집 글(featured posts)에 사용되는 조금 더 큰 크기의 섬네일입니다. 섬네일은 사용자정의필드(Custom Fields)를 이용해 섬네일로 사용할 그림 파일의 경로를 지정합니다.

두 가지 섬네일 모두 필드의 이름은 img, 값은 그림 파일의 전체 경로를 입력해주시면 됩니다. 단, 일반 글 용 섬네일의 크기는 210×180, 특집 글 용은 400×250 픽셀입니다.

미디어 설정(Settings > Media)에서 섬네일과 중간 크기 그림의 크기를 이 두 크기에 맞추어 두고 사용하시면 조금 더 편리합니다. CSS로 지정된 크기로 맞춰 주기 때문에 섬네일로 사용할 그림 파일의 크기를 꼭 정확히 맞출 필요는 없습니다.

특집 글

Drenched 테마는 특정 분류(category)의 글이 눈에 잘 띄는 화면 상단에 300×250 픽셀 크기의 광고와 함께 둘 수 있도록 준비되어 있습니다. 반드시 사용해야 되는 것은 아니며, 사용을 원할 경우 functions.php에서 아래 코드를 찾아 ‘featured’를 삭제하고 특집 글을 담아 둘 분류의 주소(slug)를 입력해줍니다. 예컨대, 워드프레스 테마라는 분류가 있으며, 이 분류의 주소(slug)가 wp-theme이라면 wp-theme을 입력해주시면 됩니다.

$featured_catname = "featured";

특집 글로 사용할 글은 사용자정의필드에 이름은 img, 값은 400×250 픽셀 크기의 섬네일로 사용할 그림 파일의 경로로 입력해 주셔야 됩니다.

특집 글의 섬네일 오른편에 있는 공간은 광고를 위해 준비해둔 것으로 300×250 픽셀 크기의 애드센스 광고 단위의 코드를 붙여 넣거나, 걸어 둘 그림의 경로를 featured.php 파일을 열어 지정해주시면 됩니다.

<!-- 300x250 ad -->
<div>
  <img src="http://ythv.info/images/300x250_img.jpg" />
</div>

사이드바

사이드바가 워드프레스 관리자 화면에서 쉽게 위젯을 추가하거나 뺄 수 있도록 정의되어 있지 않아 편하지 않습니다. 만약 사이드바에서 인기글과 동영상, 꼬리표 모음 위젯은 그대로 사용하고 나머지 영역은 관리자 화면에서 쉽게 위젯을 추가할 수 있도록(widgetized) 하시려면 아래 코드를 functions.php에 추가 해준 뒤 sidebar.php 파일을 이어지는 설명을 따라 수정하시면 됩니다. 아래 방식대로 하면 사이드바 영역을 세 개로 나누어 sidebar1, sidebar2, sidebar3 으로 등록되어 각각의 영역에 위젯을 쉽게 추가할 수 있게 됩니다.

if ( function_exists('register_sidebar') )
  register_sidebars(3, array(
    'before_widget' => '<div id="%1$s">',
    'after_widget' => '</div>',
    'before_title' => '<h4>',
    'after_title' => '</h4>',
    'name' => 'Sidebar %d'
  )
);

코드는 functions.php 파일에서 <?php 아래에 추가해주시면 됩니다. 다음 sidebar.php 파일을 열어 아래 코드를 <?php wp_tag_cloud();?></ul></div> 아래에 추가해줍니다.

<?php if (!function_exists('dynamic_sidebar') || !dynamic_sidebar(1)) : ?>
<?php endif; ?>

다음 두 번째 사이드바 시작 영역을 지정해주기 위해 <div class="left">태그 다음에 아래 코드를 추가해줍니다.

<?php if (!function_exists('dynamic_sidebar') || !dynamic_sidebar(2)) : ?>

두 번째 사이드바의 끝나는 영역을 지정해주기 위해 <?php endif; ?>를 <?php wp_meta(); ?></ul></div> 다음에 추가해줍니다.

이제 세 번째 사이드바 영역의 시작을 알리기 위해 <div class="right"> 다음에 아래 코드를 추가해줍니다.

<?php if (!function_exists('dynamic_sidebar') || !dynamic_sidebar(3)) : ?>

끝나는 영역은 sidebar.php 파일에서 맨 아래에 있는 </div> 앞에 <;?php endif; ?>를 추가해주면 됩니다.

사이드바에서 사용되지는 않았지만 Drenched 테마의 functions.php 파일을 보면 최근 댓글을 보여주는 u_get_recent_comments 함수를 정의해두고 있습니다.

& 워드프레스 2.9

대부분의 테마에서 글마다 섬네일을 사용하기 위해 사용자정의필드(Custom Fields)를 사용해야 됐는데요. 워드프레스 2.9판에 글 대표그림(Post thumbnail)을 지정할 수 있는 기능과 간단한 그림 편집 기능, 그리고 대표그림(thumbnail)을 테마에서 사용할 수 있도록 몇 가지 함수가 추가되었기 때문에 워드프레스 2.9판이 공개되고 나면 매번 사용자정의필드를 추가해 섬네일을 지정하는 불편함이 조금은 덜하지 않을까 싶습니다.

연관 글

  1. 3단 레이아웃의 깔끔한 워드프레스 테마 FREEmium
  2. 에브리원노즈의 무료 워드프레스 테마, SubtlyMade
  3. 워드프레스 테마 Pop It Now
  4. Michael Hutagalung의 Arthemia 워드프레스 테마
  5. 희색 바탕 2단 구성의 단순한 워드프레스 테마, Snowman

꼬리표

, , , , , , ,

생각을 나눠 주세요.