포스트 혹은 페이지의 개념

가) 워드프레스 게시물 작성 – 포스트 혹은 페이지

1. Post

워드프레스의 포스트도 일반적인 네이버, 티스토리에서 작성하는 포스트와 동일합니다. 글을 입력하고, 사진을 첨부하고, 동영상을 링크하거나, 예약 발행하는 등의 기능을 수행합니다. 또한 방문자가 RSS를 구독하면 이 포스트들에 대한 최신 소식을 구독할 수 있습니다.

2. Page

페이지 역시 포스트와 기능은 별반 다를바 없습니다. 단, 이것은 일종의 ‘이벤트 페이지’라 보시면 됩니다. 즉 RSS Feed에서 새글로 인식하지 않습니다. 일종의 회사소개나, 공지사항, 이용안내 등을 페이지로 등록하면 RSS에도 노출되지 않으며, 웹과 모바일웹에서도 새글로 인식하지 않습니다.
이점은 RSS 새글을 기반으로하는 워드프레스 및 블로그 모바일웹에서 특히 좋습니다.

* 포스트/페이지 작성에 대한건, 다음 포스트때 상세히 살펴보겠습니다.

나) 조금 유별난 카테고리

– 글쓰기시,  카테고리를 여러개 선택할 수 있다.-

모든 블로그가 그렇듯, 자신이 블로그에 작성하는 글의 분류를 미리 만들어 놓을 수 있습니다. 하지만 워드프레스는, 하나의 포스트를 다중 카테고리로 지정할 수 있습니다. 이 대목은 워드프레스가 블로그보다는 CMS라는 것을 증명하는 듯 합니다.

만약 영화 블로거가 카테고리를 장르, 국가, 개봉일로 만들었다면.. A라는 영화 리뷰를 적었을때 장르, 국가, 개봉일 등을 카테고리로 지정할 수 있습니다. 또한 스마트폰 리뷰 블로그라고 가정하면 제조사, OS, 해상도 등으로 카테고리를 나눌 수도 있습니다.

방문객은 위의 카테고리를 활용해, 해당 워드프레스에 있는 컨텐츠들을 잘 소팅해서 볼 수 있습니다.

다) 타 블로그와의 메뉴 구조 차이

1. 네이버

네이버 블로그는 프롤로그, 블로그, 포토로그 등과 자신이 글을 쓰면서 작성한 태그를 메뉴로 지정할 수 있습니다.또한 블로그 카테고리의 일부를 메뉴로 뽑아서 사용 가능합니다. (블로그 내부용)

프롤로그 | 블로그 | 포토로그 | 이벤트모음 | 맛집모음

2. 티스토리

티스토리도 네이버랑 비슷합니다. 하지만 메뉴를 지원하는 스킨을 이용할 경우, 여기에 외부사이트 링크를 추가할 수 있습니다.

홈 | 태그 | 미디어로그 | 주인장 트위터 | 주인장 페북

3. 워드프레스

– 관리자 >> 메뉴 설정 페이지. 메뉴가 2개의 종류인 테마의 경우 좌측 상단에 Primary Menu와 Second Menu가 노출 –

– 이를 대응하기 위해 우측에서 다수의 메뉴트리를 만든 후, 좌측에서 선택만 하면 됨.-

– 메뉴는 페이지, 포스트, 카테고리, 외부 링크등이 가능함.  대메뉴에, 대메뉴별 서브메뉴도 둘 수 있음-

– 메뉴가 최상단과 그 하단 2개로 배치. 대메뉴에는 서브메뉴 배치 가능 –

워드프레스는 기존의 블로그들과 전혀 다르게, 유저 본인의 입맛에  따라  진행이 가능합니다.

사용하려는 테마가 2개의 메뉴를 지원한다면, 위에는 자신의 프로필이나 포트폴리오, 연락처 등을 메뉴로 지정하고 (페이지 링크) 하단에는 자신의 포스트 카테고리를 메뉴로 지정해 둘 수 있습니다.

티스토리나 네이버처럼 카테고리르 사이드바에 두지 않아도, 상단 대메뉴에 서브메뉴를 둘 수 있어, 메뉴 활용처가 아주 높을 듯 합니다. ^^

다음 포스팅에서는 글쓰기, 글쓰기 관련 필수 플러그인에 대해서 살펴보겠습니다. ^^

EDITOR BY
기범롤링베베
11 .05 .2012
2 Comment
1395 Hit

카테고리 생성, 수정, 삭제

카테고리 생성, 수정, 삭제는 Posts > Categories에서 합니다.

카테고리 생성

카테고리를 새로 만들 때 입력해야 하는 것은 Name, Slug, Parent, Description 네가지입니다.

Name은 사이트에 나타나는 카테고리 이름입니다. 필수항목으로, Name만 입력하고 Add New Category를 클릭해도 카테고리는 생성됩니다.

Slug는 URL에 사용되는 카테고리의 이름입니다. 입력하지 않으면 카테고리 이름을 따라 자동으로 생성됩니다. 예를 들어 Name에 WordPress를 입력하고 카테고리를 생성하면 Slug는 wordpress로 만들어집니다.

Slug는 카테고리의 URL을 만들 때 사용하는 것으로, 직접 원하는 이름을 입력할 수도 있습니다.

Parent는 카테고리를 계층적으로 만들 때 사용합니다. 예를 들어 Themes라는 카테고리를 만들고 Parent를 WordPress로 하면 다음과 같이 카테고리가 만들어집니다.

Description에는 카테고리에 대한 설명을 입력합니다. 테마에 따라 그 설명을 보여주기도 합니다.

카테고리 수정, 삭제

카테고리를 수정 또는 삭제하려면 카테고리 목록에서 카테고리 이름에 마우스를 올립니다.

구글에서 제공하는 나눔고딕 웹폰트 사용하기

홈페이지 제작시나 워드 프레스 같은 CMS 툴을 사용하다보면 영문에 최적화된 테마를 미리보기로 보고 골랐을때와 실재 적용했을때 한글폰트로 인해 예쁘게 보이지 않아 폰트를 바꿀 수 있는 방법을 찾게 됩니다.

웹에서는 한글이나 MS워드 프로그램처럼 PC에 설치된 폰트를 마음대로 적용할수가 없는데 이때 사용할 수 있는 방법이 두가지가 있습니다.

하나, 폰트를 이미지로 작업해서 올린다.

둘, 원하는 폰트를 웹폰트로 만들어 CSS에서 적용하여 사용한다.

첫번째 방법은 원하는 모든 폰트를 웹에서 사용가능하지만 텍스트 대신 이미지 텍스트로 모두 도배할 수도 없고(성능이나 접근성 측면에서도 권장하지 않습니다) 또한 사용전에 저작권을 미리 확인 하여 사용해야 하는 이슈도 있습니다.

두번째 방법은 웹폰트를 만들거나 이미 만들어진 웹폰트 파일을 (woff / eot 폰트) 파일을 웹서버에 올리고 CSS를 통해 호출해서 사용하는 방법입니다.

웹 폰트란 웹 제작자가 의도한 글꼴을 사용자 브라우저 화면에 그대로 표시하기 위해 사용하는 웹용 글꼴을 말합니다. 로컬 PC에 미려한 글꼴이 없는 경우 브라우저는 웹 서버에서 즉시 제작자가 올려둔 글꼴을 내려받아 사용자에게 표시하게 됩니다. 예쁘지만 사용자도 모르는 사이에 웹 서버에 있는 글꼴을 내려받아야 하기 때문에 성능과 타협해야 합니다. 느린 웹 사이트에는 권장하지 않습니다.

예를 들어 나눔고딕 웹 폰트를 사용하려면 일단 나눔고딕 글꼴이 웹 서버에 올라가 있어야 합니다.
아래 파일 중에 최소 woff 포멧과 eot 포멧을 내려받아 서버에 올려놓으세요.

NanumGothic.woff(982KB)
NanumGothic.eot(745KB)
NanumGothic.ttf(2.23MB)   < ttf형태의 트루타입 폰트도 사용가능하지만 용량을 보시면 2메가가 넘는 크기죠 따라서 웹용으로 사용하기는 권장하진 않습니다.

woff(Web Open Font Format) 포멧은 W3C 권고 표준이고 파이어폭스, 사파리, 오페라, 크롬, IE 9 브라우저가 지원하고 있지만 IE 6~8 브라우저가 지원하지 않습니다.

그리고 eot(Embeded Open Type) 포멧은 IE 6~8 브라우저가 지원하지만 다른 브라우저들은 eot 포멧을 지원하지 않습니다. 따라서 모든 브라우저에서 동일한 글꼴을 보이게 하려면 브라우저 호환성을 확보하기위해 woff, eot 포멧의 파일 모두 웹서버에 올려서 사용할 필요성이 있습니다.

그럼 1) 저작권 문제가 없는 2) 웹폰트로 사용가능한 공개된 폰트 중에서 3) 구글에서 웹폰트로 사용할 수 있게 제공하고 있는 네이버 나눔폰트를 WP 워드 프래스에 적용하는 방법을 알아 보겠습니다.

2013-06-04_192449

보통은 방문자의 PC에 나눔고딕 폰트가 설치되어 있어야 웹페이지에도 해당 글꼴이 제대로 표시가 되는데 이런 문제점을 해결하기 위해서 웹폰트를 서버에 올려서 폰트가 없는 사용자의 브라우저가 자동으로 폰트를 받아 이용하게 하지만 여기서는 웹서버에 폰트를 올리는 것보다 더 유연한 방법으로 구글에서 더 빠른 속도의 서버에 올려놓은 웹폰트를 사용할 수 있는 방법을 안내하려고 합니다.

> 구글에서 제공하는 모든 폰트 목록은 구글웹폰트 사이트를 방문하면 확인할 수 있습니다.

Google Web Fonts API에서는 한글 글꼴 (나눔 고딕, 나눔 명조, 나눔 펜스크립트 등)이외에도 수백 종의 라틴/그리스/키릴 문자 글꼴과 수십 종의 크메르 글자 글꼴 이외에도 한글, 라오, 아랍, 버마, 타밀 등 여러 글꼴을 early access를 통해 제공하고있습니다. 웹 폰트이므로 웹 사이트 방문자가 자신의 컴퓨터에 글꼴을 설치했는지 여부와 관계없이 사용가능합니다.

구글 웹폰트 사이트를 방문해 보면 알겠지만 상당히 많은 웹폰트를 무료로 제공하는 것은 물론 사용법 또한 매우 간단합니다. 나눔고딕 폰트를 예를 들면 아래 코드를 자신의 홈페이지에서 사용하는 CSS에 아래와 같이 추가하면 나눔고딕 웹폰트 사용을 위한 준비는 끝입니다.

워드프래스 사용자라면 테마의 style.css 파일을 열어 상단에 아래와 같이 추가해주면 나눔고딕 웹폰트 사용을 위한 준비는 완료 됩니다.

그리고 테마의 폰트를 지정해주는 css 코드를 찾아서 나눔고딕을 추가해주면 됩니다.

1
2
3
4
5
6
7
8
9
10
11
12
body,
button,
input,
select,
textarea {
    color: #666666;
    font-family: 'Open sans','Nanum Gothic','Malgun Gothic',Dotum,sans-serif;
    font-size: 13px;
    font-size: 1.3rem;
    line-height: 1.8;
}

위의 예는 구글에서제공하는 웹폰트들을 추가로 적용한 예이며  이렇게 원하는 곳의 폰트와 크기와 간격등을 수정하면 워드 프래스에서 아주 쉽게 웹폰트를 적용할 수 있습니다.

없는 페이지의 주소를 선택했을 때

일반 사이트 구축시에는 일반적으로 이러한 구성을 많이 사용하지만

안내 메세지

이전페이지로 가기 | 메인페이지로 가기

 

WP에서는 없는 페이지의 링크를 선택했을 때 오류메세지를 보이고 끝내는 것이 아니라

사용자에게 사이트의 다른 게시물로 이동할수 있 는 체널을 보여준다.

안내 메세지

검색 박스

최근글 | 가장 많이 사용된 카테고리 | 보관물

2013-05-27_131230

 

사용자가 기대했던 컨텐츠 페이지가 없을 경우 에도 일반적인 추가 정보를 제공하는 센스가 돋보인다.

Google Webmaster Tools에 자신의 WordPress 인증 등록하기

Google-Webmaster-Tools

특정 검색엔진이나 소셜사이트중에 추가적인 기능을 제공하기위해 유저가 소유한 특정 URL에 대하여 소유자 확인과정을 요청합니다.

이러한 방법으로

1. 검색엔진이나 소셜 사이트에서 해당 유저에게 특정 Meta tag를 발급

2. 해당 URL에 Meta tag를 자신이 보유한 페이지에 등록

3. 인증하기 버튼을 클릭하여 해당 하면 이로서 이 페이지의 관리자임을 인증

구글 웹마스터의 경우 해당 페이지(사이트)의 관리자 임을 증명하기 위하여 <Body> 상단에 <Head></Head>에 특정 코드의 입력을 요청하는데 WordPress의 경우 Theme의 수정을 하는 것보다 어드민 툴을 통하여 해당 과정을 간소화한 편리한 인터페이스를 제공한다.

관리자 페이지의 Tool에 가면 사용가능한 툴이라는 메뉴가 있으며 페이지 아래쪽에 증명 코드를 넣는 입력박스가 보인다.

tools_menu

여기에 예제처럼 볼드처리되어 있는 Content=’     ‘ < 이 안의 내용을 넣고 구글 웹마스터 페이지에서 verify버튼을 누르면 된다.

screen-shot-2013-01-08-at-4-55-59-pm

WP 카테고리를 설정했는데도 나타나지 않을때

워드 프레스는 컨텐츠 베이스의 구조로 page와 post로 이루어진 contents들로 사이트가 이루어진다.

당연히 카테고리를 선택시 해당 카테고리에 page또는 post가 없을 경우 처리방안을 준비해야 하는데

wordpress의 경우에는 카테고리에 글이 없으면 카테고리자체가 노출되지 않는 방식을 택하였다.