워드프레스 블로그 suffusion 테마의 강력한 기능들

 

이 글은 Sinsakim 님이 방명록에 해 주신 질문에 대한 답변 글입니다. 이 블로그에 적용된 워드프레스 테마인 suffusion 테마와 관련한 질문인데, 방명록에 간단하게 답을 올렸지만, 정리와 내용을 추가해서 별도 포스팅으로 올립니다. 현재 사용중인 워드프레스 3.0, suffusion 테마 3.5.3 버전을 기준으로 합니다.

 

워드프레스 suffusion 테마의 강력한 기능들

 

제 블로그 상단에는 홈 버튼과 두 개의 페이지 버튼, 세 개의 카테고리 버튼이 있습니다. 이런 메뉴 기능은 워드프레스 3.0 버전에서 정식으로 지원한 기능(‘워드프레스 3.0 업그레이드 완료’ – 5. 워드프레스 3.0 달라진 점 참조)입니다. 하지만 suffusion 테마에서는 오래 전부터 지원해오던 기능이었고, 최신 버전에서는 독자적인 메뉴 기능과 워드프레스에서 지원하는 메뉴 기능을 함께 적용할 수 있게 되었습니다.

 

1. 홈 버튼 아이콘 설정

안녕하세요.
워드프레스를 사용하다가 궁금한것이 있어서 이렇게 들려서 글을 남깁니다.
저도 뗏목지기 님과 같은 스킨을 사용하고 있는데요.
설정에서 조금 막히는 부분이 있네요.

첫째는 위에 메뉴에서 ‘홈’ 모양의 아이콘을 넣는 방법이고요.

suffusion1

메뉴 기능은 suffusion 테마에서는 Navigation Bar라고 일컬어 집니다. 해당 기능은 위 그림과 같이, suffution 테마의 설정 페이지에 있는 [Blog Features 탭 – Main Navigation Bar Setup 메뉴]에서 설정합니다. 그림에서 보면 Top Navigation Bar Setup이라는 메뉴도 있는데, 두 기능은 모두 동일하며 보이는 위치만 차이가 납니다. Main은 제 블로그에서 보이는 것처럼 제목 부분과 본문 사이에 위치하게 되며, Top은 제목 위, 즉 블로그 페이지의 최상단에 위치하게 됩니다.

홈 버튼 아이콘은 해당 메뉴에서, 위 그림에 보이는 [Main Navigation Bar Look and Feel] 섹션에서 설정합니다. (일단 질문에 해당하는 부분만 설명하고 다른 설정 부분은 생략합니다.)

suffusion2

해당 섹션을 살펴보면, 위 그림과 같이 [Show “Home” page?]라는 메뉴를 볼 수 있습니다. 여기서 “Show an icon”을 선택하면 제 블로그와 같이 아이콘으로 된 홈 버튼을 볼 수 있습니다.

 

2. 카테고리 메뉴 관련

두번째는 링크 메뉴를 만드는 방법 입니다.
‘만화’ 같은 메뉴는 만들줄 알게는데 ‘사회’ 같은 메뉴는 만드는 법을 모르겠습니다.

suffusion 테마에서 말하는 링크 메뉴(Links in Navigation Bar)는 제 블로그에는 없고, 카테고리 메뉴(Categories in Navigation Bar)가 있습니다.

suffusion3

카테고리 메뉴는 [Categories in Navigation Bar] 섹션에서 설정합니다. 위 그림에서 왼쪽 항목을 선택하면 제 블로그처럼 최상단 카테고리 목록이 나열되고, 커서를 올리면 하위 카테고리가 노출되는 식으로 보여집니다. 오른쪽 항목을 선택하면 ‘My Categories(항목명 변경 가능)’ 항목 하단에 계단식으로 카테고리가 보여지게 됩니다.

기본적으로 위 선택사항으로 해 두기만 하면 제 블로그에서 보이는 것처럼 카테고리 메뉴가 동작을 합니다. 질문에서 하위 카테고리가 없는 카테고리 메뉴가 안 만들어진다고 했는데, 해당 카테고리에 해당하는 포스팅이 하나도 없는 경우에는 메뉴에 표시가 되지 않습니다.

 

3. suffusion 테마의 강력한 커스터마이징 기능

suffusion 테마는 무료 테마임에도 불구하고 강력한 커스터마이징 기능과 몇 가지의 기본 테마 스킨을 선택할 수 있는 기능을 가지고 있습니다. 설정 화면의 [Visual Effect] 탭에서 테마 선택 후에도 각 구성요소(헤더, 본문, 사이드바, 풋터등)의 크기, 마진, 색상, 위치, 개수(사이드바의 경우) 등을 별도로 조정할 수 있습니다.

suffusion4

[Blog Features] 탭에서는 더 세부적인 설정이 가능합니다. 위에서 말씀드린 Navigation Bar의 설정 외에도, 포스트와 페이지의 세부적인 설정(카테고리명이나 필자명, 태그의 노출 여부)을 할 수 있습니다. 별도 플러그인 없이 SEO/Meta의 설정, 페이지 네비게이션, 구글 Analytics와의 연동, OpenID 연동 설정 등도 가능합니다.

suffusion5

suffusion 테마는 한글화되어 있지 않다 보니, 폰트 설정에서 한글 폰트를 선택할 수가 없습니다. 그러나 굳이 테마의 style 파일을 건드리지 않아도 [Custom Includes] 메뉴에서 사용자 정의 스타일을 추가할 수 있습니다. 물론 그러기 위해서 테마의 style 파일을 어느 정도 분석할 필요는 있습니다.

제 경우에는 나눔고딕을 기본 글자체로 하기 위해서 해당 항목(body, .blogtitle, .posttitle 등)에 대해 “font-family: NanumGothic, 나눔고딕, “Malgun Gothic”, “맑은 고딕”, Trebuchet, “Trebuchet MS”, sans-serif;” 부분을 추가해 넣었습니다. (직접 입력도 가능하고 별도 파일로 작성하여 파일 링크를 입력할 수도 있습니다.)

그 외에도 [Custom PHP], [Got JavaScript], [Additional Auto-discovery RSS / Atom feeds] 설정을 통해 사용자가 정의한 PHP, 자바스크립트, 피드 기능을 추가할 수 있습니다. 그 외에 다양한 기본 템플릿을 제공하는데, 이 기능은 제가 사용하지 않아서 자세히 알지 못하기 때문에 생략하도록 하겠습니다.

 

제 글이 유용하셨다면 아래 손가락 모양을 꾸욱~ 눌러주세요.

뗏목지기

만화를 좋아하고 세상 돌아가는 일에 관심이 많은 평범한 직장인입니다.

You may also like...

17 Responses

  1. 핀코인 댓글:

    저도 워드프레스 테마로 suffusion을 사용 중입니다.

    기존의 다른 블로그에서도 사용해오면서 suffusion 테마의 가장 큰 장점은 개발자의 지속적인 업데이트가 아닐까 싶습니다.

    • 뗏목지기™ 댓글:

      꾸준하게 업데이트되는 게 무엇보다 장점이죠. 요즘은 업데이트 적용만 하고 새로운 기능을 들여다보는 데 좀 게을러졌긴 하지만요. ^^;;;

  2. 저도 같은 테마를 사용하고있는데 활용도에서 차이가 많이 나네요. 두고두고 읽어 공부해봐야겠어요. 고맙습니다 .^^

  3. 정성인 댓글:

    안녕하세요. 님의 블로그 포스팅 몇개 제 블로그로 스크랩 좀 했습니다. 다음에 설정 바꾸거나 할 때 유용하게 쓰일 것 같아서 스크랩 했습니다만, 외부에 공개는 하지 않겠습니다. 만약 그렇게 스크랩도 하지 말라고 하신다면 지우겠습니다. 고맙습니다.

    • 뗏목지기™ 댓글:

      사실 스크랩을 하셨지만 외부에 공개하지 않으신다면 제가 알 수 있는 방법도 없죠. ^^
      완벽하게 개인적인 용도로 사용하신다면야 상관없습니다.
      그리고, 멘션 주신 것 답변 드렸는데 도움이 되셨나 모르겠네요. ㅎㅎ

    • 정성인 댓글:

      고맙습니다. 멘션도 봤구요. 더 고맙습니다. 두가지만 여쭤 볼께요. 제 블로그 사이드바에 보면 사이드바 ‘블로그 인기글’ 위젯에 백그라운드에 도트가 깔려 있습니다. 이걸 없앨 방법을 모르겠습니다.
      두번째는 http://digilog4u.com/?p=2884 포스트 맨 하단에 보면 트위터 followe me 참새가 그려져 있는데요, [p style=”text-align: right;”][a href=”http://twitter.com/jgija” target=”_blank”][img src=”http://digilog4u.com//wp-content/uploads/ic_twitter.png” alt=”FOLLOW ME” /][/a][/p] (삼각 괄호를 꺽쇠 괄호로 바꿨습니다) 소스를 매번 포스팅 할 때마다 넣고 있습니다. 포스트 맨 아래쪽에 자동으로 이게 들어가게 하고 싶은데, 그러니까 푸터를 호출하기 전이 아니고, 본문 입력하고 저장하고나면 자동으로 본문 맨 아래에 포함되게 하고싶은데, 어디를 건드려야할지 모르겠습니다. 도와주십시오^^

    • 뗏목지기™ 댓글:

      1. WordPress Popular Posts 플러그인 쓰셨나요? 설정에서 ‘사용자정의 HTML 마크업 사용’을 체크하신건지… 그 경우 테마의 style 설정과 충돌하는 경우가 있습니다.
      2. 그런 경우시라면 적당한 플러그인을 찾아보시는 게 좋을 듯 하네요. 플러그인 검색에서 Twitter를 넣고 살펴보시면 찾으실 수 있을 듯 합니다.

  4. 기봉이 댓글:

    안녕하세요. 좋은 글 잘 봤습니다. 워드프레스에 관해 질문하고 싶은 것이 있어서 댓글을 남깁니다.
    워드프레스로 옮긴지 얼마 안되는 초짜인데 혹시 워드프레스의 폰트와 글씨 크기를 변경하는 방법을 알고 계시면 알려주셨으면 합니다.

    분명 어딘가에 수정하는 곳이 있을 것 같은데 워드프레스를 다루는게 익숙하지가 않아서 잘 못찾겠네요..

    • 뗏목지기™ 댓글:

      해당 기능은 테마별로 지원 여부가 결정됩니다.
      suffusion의 경우는 글꼴 크기 변경 기능은 없고, 글꼴은 변경 가능한데 목록에 한글 글꼴이 없죠. ㅎㅎ
      그래서 본문에 나오는 custom includes 기능으로 사용자 정의 css를 넣어서 글꼴과 크기를 변경했습니다.
      suffusion 외의 테마라면 테마에 해당 기능이 있는지 찾아보시고, 없다면 테마 디렉토리의 style.css 파일을 직접 수정하셔야 합니다.
      참고가 되시길 바랍니다.

  5. Sinsakim 댓글:

    뗏목지기™ 님 답변 정말 감사했습니다 🙂
    폰트 수정하는건 저도 도전해 봐야 겠네요~

    • 뗏목지기™ 댓글:

      네~ 도움이 되셨다니 저도 기쁘네요. ^^
      폰트 수정하는 것도 한 번 해 보시면 좋을 거에요.
      저는 CSS를 잘 몰라서 공부하면서 하느라 첨에 시간이 좀 걸리긴 했지만요.
      앞으로도 자주 찾아주셔요~

  6. 아이엠피터 댓글:

    요새 심각하게 워드프레스로 이전하는 것을 고민하고 있습니다.다양한 기능에 저만의
    독립공간이라는 점이 참 매력적인데…..
    신중하게 더 많이 생각하고 결정해야 겠습니다.결정하면 아마 뗏목지기님의
    엄청난 도움(?)이 필요할 듯 ㅎㅎㅎ

    • 뗏목지기™ 댓글:

      더헛~ 엄청난 도움을 제가 드릴 수 있을런지… ^^;
      사용해 보지는 않았지만 유료 테마들 중에는 더 좋은 기능과 디자인을 갖춘 것도 많이 있다고 들었습니다.
      다양한 테마와 플러그인을 사용할 수 있다는 게 워드프레스의 진정한 매력이라고 봅니다.
      많이 고민해 보시고 얼릉 워드프레스의 세계로 오셔요. ㅎㅎ

  1. 2010-07-09

    <블로그새글> 워드프레스 블로그 suffusion 테마의 강력한 기능들 http://raftwood.net/blog/1553

  2. 2010-07-09

    #wordpress RT @raftwood: <블로그새글> 워드프레스 블로그 suffusion 테마의 강력한 기능들 http://raftwood.net/blog/1553

  3. 2010-07-09

    RT @raftwood: <블로그새글> 워드프레스 블로그 suffusion 테마의 강력한 기능들 http://raftwood.net/blog/1553