오늘은 워드프레스로 오픈마켓 쇼핑몰을 구현하는 방법에 대해서 안내드리도록 하겠습니다. 일반적인 쇼핑몰과 틀리게 오픈마켓 시스템을 구축하는 것은 그렇게 간단하지는 않습니다.

Wordpress를 사용해서 기본적인 쇼핑몰을 운영하기 위해서는 우커머스 플러그인은 필수이지만 한국상황에서는 여러가지 커스터마이징해야하는 부분이 있는 것이 사실입니다. 더구나 멀티벤터를 지닌 오픈마켓을 구현하는 것은 더욱 간단하지 않습니다.

그렇지만 오늘 소개드릴 워프토비를 활용하면 큰 어려움없이 무료로 오픈마켓 구현이 가능합니다. 그럼 시작해보겠습니다.

먼저 워프토비를 사용하기 위해서 필요한 플러그인과 테마가 필요합니다. 필수 프로그램은 다음과 같이 4가지 입니다.

  1. 우커머스 플러그인 2.5.5 버전
  2. 워프토비 멀티벤더
  3. 워프토비 멤버쉽
  4. 워프토미 테마


워프토비의 편리한 장점


일단 워프토비를 사용하게되면 가장 큰 장점중 하나는 위젯을 사용해서 쇼핑몰 메인디자인을 구성하는 부분입니다. 

일반적으로 워드프레스는 테마를 변경해야지만 화면의 전체적인 UI를 일괄적으로 변경할 수 있지만 워프토비는 플러그인으로 이런 기능을 구현해서 위젯을 조정만으로도 훌륭한게 웹페이지를 구성할 수 있습니다.


위의 4가지 필수 프로그램 외에도 몇가지 플러그인들을 추가적으로 구성하면 되는데요. 필요 프로그램들의 목록은 다음과 같습니다. 

  1. wptobe-shop-001 : 쇼핑몰 메인 홈페이지
  2. wptobe-selling-0001 : 판매자 페이지
  3. wptobe-buying-0001: 구매자 페이지
  4. wptobe-menu-0001: 페이지 상단 메뉴
  5. wptobe-1-0018 : 헤더
  6. wptobe-1-0010: 푸터

그럼 쇼핑몰 화면을 보겠습니다. 아래는 wptobe-shop-001 위젯 플러그인을 사용해서 구현한 오픈마켓 모습입니다. 

화면 상단에는 메뉴가 보이고 왼쪽의 1번 영역에는 상품카테고리와 가격, 브랜드를 선택할 수 있고 오른쪽 2번 영역은 상품의 리스트 화면이 나타납니다. 

위젯의 드래그앤 드롭으로 간단하게 화면을 구성할 수 있습니다. 또한 언제든지 다른 위젯으로 교체가 가능합니다.


또한 이 페이지는 우커머스의 Shop 페이지와 동일한데요. 일반적인 경우에는 테마를 변경하기 전에는 Shop 페이지를 변경할 수 없습니다. 

그 이유는 테마에 우커머스 템플릿파일이 포함되어있기 때문입니다. 이런 단점을 보완하기 위해서 워프토비는 이것을 위젯 플러그인으로 돌려서 언제든지 드래그앤드롭으로 쉽게 메인페이지를 바꿀수 있게 구성하였습니다. 

그럼 3번 상품을 클릭해보도록 하겠습니다.


3번 상품을 클릭하면 상품 상세페이지로 들어오게 되는데요. 여러가지 이미지를 등록하면 자동으로 상품 슬라이드로 전환되어 이미지가 보여지게 됩니다. 아래는 첫번째 상품이미지이고


두번째 상품이미지 


그리고 세번째 상품이미지가 보여지는 것을 확인할 수 있습니다. 아래 1번 영엑에는상품 설명과 댓글란이 있고 오른쪽 2번 영역에는 상품 주문버튼이 있고, 상품 주문버튼과 판매자에게 메세지를 보낼 수 있는 기능, 관심상품 등록기능, 판매자 상점페이지로 이동할 수 있는 링크가 제공됩니다.

그럼 판매자로 로그인을 해보도록 하겠습니다. 3번 [Sign in] 을 선택합니다.


판매자 화면


판매자의 로그인 계정을 입력해서 로그인 합니다.


판매자로 로그인하면 오른쪽 상단에 Selling 메뉴를 확인하실 수 있는데요. Selling은 판매자의 설정 및 운용 페이지 입니다. [Selling]을 선택합니다.


Selling에는 다섯개의 메뉴가 있는 것을 확인할 수 있습니다. 먼저 Order는 구매자가 주문했을 때 보여지는 판매 주문페이지입니다.


Your Listing은 새로운 상품을 등록하거나 등록한 상품을 수정하는 페이지입니다.


Vendor는 상점의 정보를 등록하는 화면입니다.


Shipping은 우커머스가 제공하는 배송비 계산시스템을 설정하는 곳입니다.


Report는 간단한 통계를 보여주는 화면입니다. 그럼, 상단의 [Buying] 메뉴를 선택하겠습니다.


Buying은 구매자를 위한 프로파일 메뉴입니다. 먼저 첫번째 Order를 클릭하면 구매자의 주문리스트를 보여줍니다.
Shipping Address는 배송지의 주소를 등록하는 곳입니다. Order-Tracking은 주문조회를 할 수 있고 My Wishlist는 관심상품 등록된 상품리스트를 보여줍니다. 

Profile, Inbox, Levels, Points, Settings은 워프토비 멤버스 관련 메뉴입니다.


워프토비 오픈마켓 기본 구매 프로세스


그럼, 새로운 판매자가 회원가입을 하고 상품을 등록하고 구매자가 구매하는 것을 확인해보도록 하겠습니다.

새로운 사용자로 회원가입을 하고 그 사용자로 로그인합니다.


판매자는 로그인해서 Selling 메뉴의 Your Lisiting 화면에 들어가서 [ADD A LISTING] 버튼을 클릭해서 새로운 상품을 등록합니다.


'DROP IMAGES HERE TO UPLOAD' 부분을 마우스로 선택해서 상품이미지를 등록하겠습니다.


열기 팝업이 뜨면 등록하기 원하는 상품이미지를 선택합니다.


선택한 상품이미지가 PHOTOS 부분에 등록된 것을 확인합니다. 상품명과 가격은 필수 항목입니다. 


상품 카데고리와 상세설명, 브랜드를 선택한 뒤에 [Submit] 버튼을 클릭해서 상품을 등록 절차를 마칩니다.


이제 구매자 ID인 user3로 로그인합니다. 


구매자로 로그인해서 판매자가 등록한 상품을 선택해서 상세페이지로 들어갑니다. 상품 상세페이지에 들어오면 구매하기 'Buy now' 버튼을 클릭합니다.


이제 구매자는 배송정보를 입력하고 결제를 진행합니다.




#266 주문이 완료된 것을 확인할 수 있습니다. 자신의 구매목록을 보려면 Buying 메뉴를 선택합니다.


주문목록에 조금전에 구매한 리스트가 나타나는 것을 확인할 수 있습니다. 이제 판매자 화면으로 이동하겠습니다.


주문을 확인하기 위해서 user1 판매자 계정으로 로그인합니다.


판매자로 로그인하니 Order 화면의 주문리스트에 조금전에 구매자가 주문한 #266 주문이 나타는 것을 확인할 수 있습니다.


판매자는 #266 주문을 클릭해서 주문 상세 내역을 확인하고 상품을 준비하게 됩니다.


지금가지 워프토비를 이용한 워드프레스 오픈마켓 시스템을 Overview 해보았습니다. 좀더 상세한 내용을 원하시는 분들께서는 네이버 워드프레스 사용자모임 카페에 접속하시면 여러가지 도움을 받으실 수 있습니다. 감사합니다.

워드프레스 책이 출간되었습니다. 진심 추천해요!


안녕하세요? 제트슈만입니다. 이번 달에 제가 집필한 워드프레스 책이 출간되었습니다. 바쁘다는 핑계와 게으름으로 거의 2주가 되어서 이제야 제 블로그에 정식으로 알리게 되네요. 


그럼 소개할께요.
 
제가 이번 Wordpress 책을 집필하면서 가장 고민하면서 중점을 둔 부분은,
초보자나 입문자는 빠른 속도로 스킬업(Skill Up)하고, 초보단계는 넘어선 중급 진입자이지만 Wordpress 실무 웹사이트 제작에 어려움을 겪은 독자에게는 실력을 단번에 점프업(Jump Up)하게 하는 것이었습니다.


그래서 책의 페이지 수를 늘리기 위해서 잘 사용하지도 않는 플러그인이나 기능 위주의 나열이 아니라, 웹사이트를 구성하는데 꼭 필요한 플러그인과 기능만 선별해서 구성했습니다. 결국 이것만 알면 다른건 몰라도 웹사이트 제작에 문제없다! 라는 목표로 집필을 한 것이죠.

그리고, 여러가지 책을 볼 필요없이, 이 책 단 한권만 마스터해도 실제 사용할 수 있는 수준의 웹사이트 제작이 가능하도록 하는 집필 포인트도 놓치지 않았습니다.


독특한 구성의 워드프레스 책


실제 다른 Wordpress 책을 보면 초보/입문자용 도서, 중급자용 도서, 실무 웹사이트 제작용 도서등으로 책이 세분화 되어있어서 Wordpress의 기본적인 기능을 익히고 실무 웹사이트를 만들기 위해서는 별도의 책을 또 봐야하는 불편함을 있는 것이 사실인데요. 이것을 한 권으로 해결하게 했습니다.

그럼, 독특한 구성을 가지고 있는 이 책의 세 가지 특장점을 설명 드리겠습니다.


첫째, 단 한권이면 된다!


① 단 한 권으로 기본 설치부터 Wordpress 실무 웹사이트 완성까지 전 과정을 마스터합니다.

Wordpress의 기본 기능은 블로그를 만들고 관리하는 일만큼이나 어렵지 않습니다. 그렇지만 사전 지식 없이는 Wordpress 설치, 도메인과 호스팅 등 Wordpress를 시작하기 전에 해결해야 할 난관이 한두 가지가 아닙니다.

Wordpress를 겨우 설치해서 관리자 화면에 접속해도, 수많은 설정 항목 사이에서 갈팡질팡하기 십상인데요.
이 책은 Wordpress를 처음 접하는 초보자들의 입장에서 웹사이트를 만들고 관리하는 데 필요한 모든 과정을 하나하나 빠짐 없이 설명하며 실습을 진행합니다.

관리자 화면에서도 테마, 플러그인, 글 쓰기, 미디어 라이브러리, 일반 설정 및 사용자 관리 등 Wordpress 관리자가 웹사이트 제작 과정에서 꼭 챙겨야 할 기능들을 설정하는 방법을 알려 줍니다.


둘째, 무료 테마와 플러그인으로 돈 한 푼 들이지 않고 전문적인 실무 웹사이트를 만든다


② 무료 테마와 플러그인으로 전문적인 웹사이트를 구성합니다

Wordpress에서는 가입형 블로그에서 스킨을 바꾸듯 간편하게 테마를 설정해서 수준 높은 웹 디자인을 구현할 수 있습니다. 그리고 글 작성, 게시판, SNS와 웹사이트 연동, 고객 문의, 보안, 백업 플러그인으로 필요한 부가 기능을 자유롭게 추가해서 쓸 수 있습니다.

이 책을 마스터하면 엄선된 무료 테마, 플러그인으로 이용하면 돈 한 푼 들이지 않고도 완성도 높은 웹사이트를 만들수 있습니다.


세째, 실무 웹사이트를 유형별로 네 가지나 제작해본다


③ 실무 웹사이트를 유형별로 제작해 봅니다.

워드프레스 관리자 기능과 플러그인 및 테마 사용법을 어느 정도 익힌 사용자라면 이제 자신에게 필요한 웹사이트를 만들 차례입니다.


 
이 책의 파트4 에서는 회사 웹사이트, 쇼핑몰, 블로그 웹진, 포트폴리오 웹사이트를 직접 만들어 보면서 앞서 배운 Wordpress의 기본 기능을 직접 적용해봅니다. 여기서 실습하는 네 가지 유형의 웹사이트의 형태를 익히고 변용하면 어떤 주제의 웹사이트라도 무리 없이 만들어 낼 수 있는 실력을 갖추게 됩니다.


저는 이 책이 독자분들에게 정말 유익한 책이되었으면 하는 바램입니다. 소중한 시간을 건져올리는 책이 되었으면 하구요.

그럼 좀더 자세한 내용을 알고 싶으신 분들은 아래를 자세히보기를 참고하시기 바랍니다. 감사합니다.



Web site나 홈페이지 만드는법 워드프레스로 해결하자


요즈음에는 전문가가 아니더라도 웹사이트를 멋지게 제작할 수 있는 시대입니다. 가장 대중적인 네이버 블로그를 벗어나서 조금 더 전문적인 홈페이지를 만들려고 할 때 도구로는 전세계적으로 워드프레스가 대세입니다.

Wordpress는 아무것도 모르는 초보자도 손쉽게 회사웹사이트나 블로그, 쇼핑몰등을 구축할 수 있는 편리한 사이트 저작도구입니다. Wordpress만 있다면 홈페이지 만드는법 어렵지 않습니다. 일반인도 전문적인 프로그래머나 디자이너의 도움없이 훌륭한 Web Site를 제작할 수 있는 것이지요.


워드프레스는 CMS라고도 불리우는데 CMS는 Content Management System의 약자로 콘텐츠를 관리할 수 있는 시스템을 말합니다. 우리가 많이 사용하는 네이버 블로그를 생각하면서 비교하면 쉽게 이해할 수 있습니다.

네이버 관리자 화면에 들어가서 우리는 스킨과 메뉴, 여러가지 설정을 합니다. 그리고 글을 쓰고, 이미지를 업로드해서 포스팅을 작성하지요? 이런 일련의 과정들은 콘텐츠를 관리하는 네이버 시스템하에서 진행하게 됩니다. 이제 콘텐츠를 관리하는 시스템이 어떤것인지 이해가 되실 것입니다. 


Wordpress는 개인에게 미래의 기회를 주는 도구다!


국내에서는 네이버 블로그가 아직 많은 사용자를 보유하고 있지만, 전세계에서는 Wordpress가 앞도적으로 시장 점유율을 차지하고 있습니다. 그런데 중요한건 이제 국내에서도 Wordpress의 점유율이 과거보다 상당히 높아져간다는 점입니다. Wordpress의 높은 자유도와 뛰어난 확장성은 웹사이트의 여러 영역을 잠식해가고 있습니다.

단지 홈페이지 만드는법을 떠나서,
워드프레스를 잘 다룰줄 아는 개인은 미래에 뛰어난 생존 무기를 가지는 것입니다.


글로벌(Global) 대세는 Wordpress다


워드프레스는 전세계 CMS(Content Management System) 시장의 59.5% 를 점유하면서 압도적으로 시장을 선도하고 있습니다. 더구나 단순히 CMS 시장의 점유율뿐 아니라 전세계 인터넷 공간을 떠도는 전세계 웹사이트의 26.4%를 점유하고 있습니다.

전 세계 웹사이트의 네 곳 중에서 한 곳은 Wordpress로 제작한 웹사이트라고 할 만큼 이미 영향력은 지대합니다.


또한 한국어로 제작된 CMS의 점유율의 경우에도 큰 변화가 있습니다. 과거에 게시판이나 개인이나 중소형 웹사이트의 대표주자였던 제로보드과 그 후속인 XE(Xpress Engine) 역시 Wordpress에게 시장을 잠식당했습니다.

현재 한국어로 제작된 CMS는 워드프레스가 50.9%를 점유해서 1위를 달리고 있으며, XE의 경우 36%로 1위를 내준 상황입니다. 그만큼 이미 현재 한국어로 제작된 웹사이트의 절반은 Wordpress가 된 것이지요.


국내 레퍼런스의 점진적 확대


국내에서도 개인이나 중소기업뿐 아니라 어느정도 규모가 있는 회사나 관공서에서도 워드프레스를 사용해서 웹사이트를 제작하는 경우가 많아졌습니다.

몇 가지 레퍼런스 사이트를 살펴보겠습니다. 먼저 국내 유명 전자매거진 사이트인 블로터와 서울시 복지분야 홈페이지가 있구요.


언론사인 연합뉴스TV 사이트와 가전업체인 LG전자의 Social LG전자 사이트가 있습니다. 앞으로는 더욱 저변이 확대되고 늘어나겠지요?


테마와 플러그인으로 내가 원하는대로 바꾸자


모바일 시대가 되면서 스마트폰인 애플 앱스토어나 구글 플레이스토어에서 앱을 다운받아서 사용하는 것이 일상화되었습니다. 어느덧 우리가 자연스럽게 앱마켓을 활용하는데 익숙해진 것이지요.

Wordpress 역시 유사한 선순환 마켓 구조를 가지고 있어서 필요한 테마와 플러그인을 공식사이트에서 내려받아서 원하는데로 웹사이트를 꾸미고 기능을 추가할 수 있습니다. 디자인이나 기능을 만들거나 구현할 필요없이 설치해서 사용하면 되는 것입니다.

[아래는 만들면서 배우는 워드프레스 책에서 발췌한 그림입니다.]


반응형 웹디자인이라 모바일에 완벽하게 호환된다


과거에는 Web site를 제작할 때 데스트탑(PC)용과 모바일용 사이트를 따로따로 제작해야 했습니다. 그런데 스마트폰 화면의 사이즈도 이제는 4인치에서 6인치까지 다양하고, 아이패드 역시 9.7인치를 벗어나서 12.9인치까지 디스플레이 화면 사이즈의 아이패드 프로(iPad Pro)를 출시했습니다.



거기에 갤럭시탭등의 기타 태블릿 디바이스들의 화면 사이즈까지 더하면 그 많은 디스플레이 사이즈별로 web site를 개별 제작하는 것은 불가능합니다.


따라서 이럴때 필요한 것이 반응형 웹디자인(Responsive Web Design)입니다. 반응형 웹디자인은 말 그대로 화면사이즈가 어떻하든지 스스로 자동으로 화면 사이즈를 리사이즈(Resizing)해줍니다.

따라서 컴퓨터나 여러 종류의 스마트 디바이스의 화면 사이즈별로 사이트를 제작할 필요가 없는 것이지요. 워드프레스는 반응형 웹디자인으로 만들어졌기 때문에 이런 유익을 모두 누릴 수 있는 것입니다.

아래 그림은 Wordpress로 제작된 웹사이트를 데스크탑 컴퓨터(PC)화면으로 본 것입니다.


그리고, 태블릿과 스마트폰으로 보게되면 아래와 같이 스스로 화면 크기에 맞추어 이미지와 아이콘들이 조정 및 변화해서 화면에 최적화해서 디스플레이 해주게 됩니다.


이렇게 web site를 만들면 여러 종류의 화면크기별로 시스템을 개발하는 시간을 절약할 수 있겠죠? 하나만 만들면 스스로 자동으로 알아서 디스플레이 해주니까요.

검색엔진 최적화(SEO), 상위 노출도 걱정없다


검색엔진 최적화는 구글이나 네이버에서 검색할 때 자신이 만든 포스팅이나 페이자가 검색 상위에 뜨게하는 기술을 말합니다. Wordpress는 기본적으로 웹표준을 준수해서 설계되고 만들어진 훌륭한 도구입니다.

웹표준을 준수한다고 하는 것은 기본적으로 검색 엔진 최적화(SEO, Search Engine Optimization)에 유리합니다. 그리고 더 좋은 것은 최적화를 위한 훌륭한 플러그인들을 무상으로 설치해서 사용할 수 있다는 점입니다.


지금까지 여러가지 설명을 드렸는데요, 좀더 자세한 내용을 알고 싶으시면 제가 집필한 아래 책을 보시면 도움이 되실꺼에요. 감사합니다.



블로그, 작은 것이 큰 것이다


작은 것이 큰 것이다. 큰 것은 장점이 아니다. 세상은 변하고 있다. 오히려 작은 것이 큰 것이다. 크게 되고 싶다면 작게 행동하라. 작은 것이 크다는 것은 수많은 영역에 놀랍게 적용된다.


세스 고딘은 '이제는 작은 것이 큰 것이다'라는 역작에서 이렇게 말한다.
"이제는 작은 것이 큰 것이다. 사물이 만들어지고 회자되는 방식에 일어나고 있는 최근의 변화는 크다는 것이 더 장점이 아니라는 사실을 일깨워 준다. 사실, 그 반대다. 크게 되고 싶다면 작게 행동하라

정보가 다양한 경로로 소통된다는 사실은
거짓되게 사는 것이 거의 불가능하다는 것을 의미한다.
진정한 스토리만 널리 퍼져 나가고 살아남는다."

우리는 필요한 물건이 있을 때 인터넷을 검색한다. 네이버 검색 창에 원하는 상품명을 입력하고 검색버튼을 클릭한다. 그렇지만 인터넷을 떠도는 수많은 블로그들은 이제는 신뢰하지 않는다. 그 이유는 많은 블로그들이 상품이나 금전을 받고 제품을 홍보하는 데에 사용되고 있기 때문이다. 해당 블로그들은 돈을 받는 댓가로 무조건적인 상품의 칭찬에 열을 올린다.


네이버 파워블로그 제도의 명암


과거에는 인터넷에 글들을 맹신하는 경향이 있었다. 몇 년간 일부 파워블로거들이 허위정보 및 금품수수 사건으로 신문지상을 오르내렸다. 급기야 네이버는 작년에 사회적인 폐단을 낳았던 파워블로그 제도를 폐지했다. 물론 '이달의 블로그'란 다른 형식으로 돌아오기는 했지만 네이버가 파워블로그 제도를 폐지한 것은 몇 가지 이유가 있었다. 그 중 제품 홍보용도만 전락한 네이버 블로그의 신뢰성 저하에 대한 우려도 한 몫을 하였다.

앞으로는 현실이나 가상의 공간에서 거짓된 스토리는 살아남지 않을 것이다. 급속도록 발전하는 인공지능(AI) 엔진은 진정성 없는 블로그를 걸러내는 필터로의 역할을 제대로 해낼 것이다. 블로그를 운영하는 사람들은 언제나 상위노출에 대한 유혹을 받는다. 블로그 상위 노출을 유도하는 기법은 여러 가지 있다.


블로그, 욕망의 기차를 타다


그렇지만, 그런 검색 상위노출 기법에 재미를 들이는 것은 일종의 마약을 투여하는 것과 같다. 블로그를 포함한 각종 SNS의 방문자수는 운영자의 욕망에 기름을 붓고 불을 붙인다. 매일 아침에 일어나서 전날 방문자 수에 운영자의 하루 희비가 엇갈린다. 갑자기 방문자 숫자가 떨어졌다면 운영자는 떨어진 방문자수를 회복하기 위해서 블로그 상위 노출 기법을 가동한다.

본인 역시 그리고 그런 기법을 사용해서 파워블로그 근처에도 가본 적이 있다. 조금만 더 가면 파워블로그의 고지가 보였다. 그렇지만 내 욕망의 의지와 상관없이 갑작스럽게 멈추어섰다.
'나는 왜 글을 쓰는가? 나는 왜 블로그를 하는가?'에 대한 깊은 회의와 자괴감이 그 이유였다.

그래서 블로그를 멈추고 정지시켰다. 생각이 정리될 때까지 무작정 거의 10여개 월을 들어가보지도 않았다. 매일 매일 소통했던 수많은 블로그 인연들과 연락을 멈추었다.


함께 파워블로그를 향해서 달려가던 동지들은 걱정의 안부를 물어왔다. 블로그를 멈춘 지 한 달정도 지나고 함께 뛰었던 동지중 한명이 하루 4만명이 방문했다고 연락이 왔다. 그러면서 안부를 물었다.

무슨 일이 생긴 것이 아닌지? 건강에 이상이 생긴 것인지? 수많은 안부에 나는 적절한 답변을 해주기가 어려웠다. 제대로된 답을 해줄 수는 없었지만 고민하고 있는 것을 모두 털어놓을 수 없음에 미안한 마음뿐이었다.

평생의 친구, 블로그


오랜 기간 멈추어있던 시간동안 깨닭은 것은 '방문자수에 연연하지 않고 오로지 진정성 있는 글만을 써야겠다'라는 것이다. 이건 아무도 알아주지 않는 혼자만의 결단이자 결의였다.
새로운 블로그를 만들어야 했다. 이 블로그는 그렇게 탄생했다.

방문자수에 집착하게 되면 진정성 있는 글을 쓰기보다 사람들을 모으는 글을 쓰게 된다. 사람을 많이 모으는 글과 기법에는 속임이 있기 마련이다.


네이버나 구글 검색엔진은 인터넷을 돌아다니면서 크롤링(crawling) 작업을 한다. 검색에 필요한 것은 색인 작업하는 것이다. 그리고 모아진 데이터를 분석해서 사용자가 검색 창에서 검색할 때 검색의 우선순위를 지정한다. 검색 우선순위를 지정하는 것은 검색엔진의 두뇌에 해당하는 모듈에서 진행한다. 앞으로 검색엔진 두뇌에 인공지능(AI) 기술을 활용하지 않을 이유는 없다.

인공지능(AI) 기술의 발달로 사람과 같이 진정성 있는 글을 잡아내는 능력이 더욱 높아진다. 시간이 지날수록 진정성 있는 블로그가 살아남을 수 있는 이유이다. 블로그의 종류가 네이버 블로그이든, 티스토리든지 자체 운영하는 워드프레스나 별도의 웹사이트든 동일하게 적용된다.

블로그의 플랫폼에 해당하는 CMS(Content Management System)종류와 상관없이 진정성 있는 글을 써야한다. 블로그를 평생이나 오랫동안 가져가려면 그렇게 하면 된다. 방문자수에 연연하지 않기는 쉽지 않지만, 그래도 끊어라! 그래야 블로그를 평생의 친구로 함께 갈 수 있다.

벤치마킹도 필요 없다. 다른 사람과 비교하지 말아라


세스 고딘은 벤치마킹은 우리에게 스트레스를 유발하고 큰 도움을 주지 않는다고 경고한다.
"이 세계를 벤치마킹하는 것은 스트레스를 불러일으킬 뿐 아니라, 우리를 평범하고 평균적이며 그저 누구나 하는 일을 똑같이 하는 사람이 되도록 만든다. 자동차 미니(Mini)나 허머(Hummer)를 발명한 사람들은 벤치마킹을 해서 최고에 이른 게 아니다. 만일 남과 비교하는 것을 일삼았다면 이 멋지고 독특한 자동차들은 태어나지 못했을 것이다."



미니나 허머는 독특한 크기와 디자인의 자동차로 인기가 높다. BMW의 미니는 독특함 때문에 작은 크기의 차체에 비해서 비싼 가격을 유지하고 있음에도 베스트셀링카가 되었다. 독특함은 벤치마킹에서 나오지 않는다. 비교하지 않을 때 나올 수 있었다. 비교하는 것은 나를 죽인다.

우리는 서로 똑같은 사람으로 만들어지지 않았다. 우리는 서로 다른 모습으로 창조되었다.
우린 틀린 것이 아니라 다른 것이다.

블로그 방문객 수에 연연하지 말고, 블로그 벤치마킹도 멈추라!
독특함은 남의 것을 보지 않고 자신의 길을 갈 때 만들어진다. 다른 사람의 비판도 신경쓰지마라.

세상에 어느 누구도 비판 받지 않은 사람은 없다. 당시에는 예수님도 링컨도 이순신 장군도 비판을 받았다. 비판 받을 수 있는 것을 오히려 기뻐하라. 용기를 가지고 당신만의 그 길을 가라. 미래는 그런 당신에게 승자의 면류관을 씌워줄 것이다.





워드프레스에 구글 애드센스 광고 넣는 방법


이번 시간에는 구글 애드센스 광고를 워드프레스 사이트에 넣는 방법에 대해서 공부하는 시간을 가지도록 하겠습니다.
구글 애드센스 가입 및 광고를 만드는 방법에 대해서는 아래 포스팅을 참고바랍니다.


구글 애드센스를 사용하는 사용자라면 자신이 운영하고 있는 여러가지 시스템 및 채널에 애드센스 광고를 달기를 희망합니다.
과거에 비해서 요즈음에는 광고를 게재하는 방법이 시스템별로 여러가지 형태의 플러그인으로 제공되고 있어서 편리하게 사용할 수 있습니다.

워드프레스에 구글 애드센스 광고를 넣는 방법은 크게 두 가지 정도의 방법이 있습니다. 
첫째는 구글 애드센스 코드 자체를 복사해서 자신이 운영하는 워드프레스 사이트의 HTML 소스 안에 직접 편집해서 넣고 광고를 게재하는 방법,
둘째는 구글 애드센스 플러그인을 사용해서 광고를 게재하는 방법입니다.

여기에서는 두번째 방법인 플러그인을 활용해서 손쉽게 광고를 게재하는 법을 알아보도록 하겠습니다.


워드프레스용 구글 애드센스 플러그인 설치하기


구글 애드센스 플러그인을 설치하기 위해서는 플러그인 화면에 들어가야 합니다. 워드프레스 관리자화면(알림판) 메뉴에서 플러그인 > 플러그인 추가하기 메뉴를 클릭합니다.



플러그인을 검색하고 추가하는 화면이 나타납니다. 플러그인 검색창에 easy adsense 라고 입력하고 검색을 하면 맨 첫번째 검색되는 Easy Plugin for AdSense가 여기에서 사용할 플러그인입니다.

4만명 이상이 설치해서 사용하고 있고, 플러그인에 대한 최근 업데이트도 1개월 전에 있기 때문에 어느 정도 신뢰성있는 플러그인라 생각할 수 있습니다. 지금 설치하기 버튼을 클릭해서 플러그인 설치를 진행합니다.



플러그인 설치가 완료되었습니다. 플러그인을 활성화를 클릭합니다.




구글 애드센스 플러그인 사용하기


플러그인의 활성화가 완료되면 관리자화면의 설정 메뉴에 Easy AdSense 라는 메뉴가 생성된 것을 확인할 수 있습니다. 구글 애드센스 광고를 설정하기 위해서 Easy AdSense 메뉴를 클릭합니다.




Easy AdSense 메뉴를 클릭하면 아래와 같은 초기 화면이 나타납니다. 스크롤을 내려서 아래쪽으로 내려가면 구글 애드센스를 설정하는 화면이 나타납니다.



Easy AdSense는 구글 애드센스 광고를 글 본문에도 사용할 수 있도록 하였고 사이드바에도 사용할 수 있게 제공하고 있습니다.
아래 화면에서 왼쪽 부분이 글본문에 애드센스 광고를 게재하는 것이고, 화면의 오른쪽은 사이드바 위젯에 광고를 게재하는 공간입니다.



Easy AdSense 플러그인의 광고코드를 입력하는 란에 코드를 입력하려면 구글 애드센스에서 광고코드를 가져와야합니다.

구글 애드센스에 로그인해서 자신이 생성한 광고코드를 가져오면 옵니다. 광고코드는 특정 규격화된 사이즈의 광고를 사용해도 좋고, 자동크기 반응형 광고를 사용해도 좋습니다.

글 본문에 애드센스 광고 게재하기


하나의 글 본문안에 세 개의 광고를 게재하고 싶다면 아래 화면과 같이 도입 애드센스 텍스트, 중간 애드센스 텍스트, 끝 애드센스 텍스트 입력 박스에 구글 광고코드를 붙여넣습니다.



그리고 광고에 대한 옵션을 아래와 같이 설정합니다. 구글 정책에 대한 옵션으로 광고를 3개 허용하는 것으로 설정한 뒤에 저장하면, 글 본문에 광고가 게재될 것입니다.





사이드바 위젯에 구글 애드센스 광고 게재하기


글 본문에 광고를 게재하는 것도 좋지만 광고가 너무 많은 것도 시각적 공해일 수 있기 때문에 여기에서는 사이드바에만 광고를 한 개 게재하도록 하겠습니다.

먼저 사이드바에 광고를 게재하려면 광고의 크기를 계산해야 합니다. 그렇지만 워드프레스의 경우 반응형 웹을 지원하기 때문에 여기에서는 아래와 같이 자동크기 반응형 광고를 만들어서 해당 코드를 복사해서 사용하겠습니다. 자동크기 반응형 광고코드를 복사합니다.



복사한 자동크기 반응형 광고코드를 아래 화면과 같이 애드센스 위젯 텍스트 입력란에 붙여넣고 제목 숨기기 체크박스에 체크합니다.



그리고 광고 옵션 항목에 아래와 같이 광고 1개 허용에 체크를 한 뒤에 변경 저장 버튼을 클릭합니다.




위젯에 Easy AdSense 구글 애드센스 광고 배치하기


Easy AdSense 플러그인으로 광고를 생성하였고, 이제는 웹사이트의 사이드바 위젯에 구글 애드센스 광고를 배치할 차례입니다.
위젯 화면에 들어가서 광고를 배치해야 하므로, 워드프레스 관리자 화면에서 외모 > 위젯 메뉴를 클릭합니다.



위젯 화면에 들어오면 왼쪽에는 사용할 수 있는 위젯 항목 나타납니다. 왼쪽 아래에 있는 'Easy AdSense:Google Ads' 를 드래그해서 기본 사이드바 위젯 영역으로 드래그 해서 배치 합니다.




워드프레스 사이트에 구글 애드센스 광고 적용 확인하기


기본 사이드바에 애드센스 위젯을 배치하였으므로 자신의 워드프레스 사이트에 들어와서 구글 애드센스 광고가 제대로 게재되는지 확인해야합니다.
플러그인을 통한 광고 생성이 제대로 되었다면 아래 화면과 같이 오른쪽 사이드바 부분에 광고가 정상적으로 나타날 것입니다.


워드프레스 강의 70% 할인, 청년지원 프로젝트-힘내라 청춘!


안녕하세요? 슈만입니다. 오랫동안 생각했던 일을 이제야 시작하게 됩니다. 게으름 때문에 미루고 미루던 일이기도 합니다.
그 일은 바로 제가 어떻게 조금이라도 사람들에게 도움이 될까하는 고민에 대한 것입니다.
결국은 제가 하는 일을 통해서 그 일을 할 수 있을 것 같아서 시작을 하게 됩니다.

지금 현재 워드프레스에 대한 오프라인 강의는 아래 화면과 같이 여기와 다른 공간인 워드프레스엑스(WordpressX) 사이트에서 운영하고 있습니다.
오프라인 강의는 예전에는 평일에도 하기는 했지만, 근래 들어서 평일에는 제가 여러 업무로 바쁜 관계로 특별한 경우가 아니면 토요일에 진행하고 있습니다.





첫번째 슈만의 청년지원 프로젝트


먼저 드는 생각은 청년에 대한 생각이었습니다. 제가 대학을 다니던 시절과는 틀리게 요즈음 청년들을 보면 마음이 어려울 때가 많습니다. 그 이유는 바늘 구멍과 같은 취업문과 대학에 입학하자마자 취업 공부를 하고 있는 모습때문입니다. 그래도 제가 대학을 다니던 시절은 여유가 있었던 것이 사실입니다. 그 때도 취업이 어렵다고 하기는 했지만, 지금과는 비교가 되지는 않습니다.




그 시절에는 대학생들의 관심이 모두 취업에 있지 않았습니다. 친구들 중에는 프랑스 문학에 심취했던 친구도 있었고, 낭만을 논하던 시대였습니다. 그렇게 문학에 심취해도 대학 4학년때는 많은이들이 자신이 원하는 회사에 취직하는데 큰 문제는 없었습니다.



청년에 대한 생각때문에 제가 큰 도움은 되지 못할지언정 조금이라도 도움이 되는 일을 하자고 생각한 것이, 바로 이번에 하고 있는 힘내라 청춘!-청년지원 프로젝트입니다.

이번에 진행하는 힘내라 청춘!-청년지원 프로젝트는 수강료를 70% 할인 하는 것으로, 대한민국 국적의 만20세 ~ 만35세 청년이면 모두 지원이 가능합니다. 그리고 자리가 많지 않은 관계로 선착순으로 지원을 받습니다. 기간은 3월25일부터 ~ 4월23일까지 진행합니다.

워드프레스 강의 신청방법


오프라인 강의를 신청하는 방법은 두가지가 있습니다. 먼저 아래 화면과 같이 워드프레스엑스 사이트에 접속해서 배너에서 더보기 버튼을 클릭해서 강의 신청화면으로 이동하는 방법입니다.



두번째 방법은 바로 아래 워드프레스 강의 안내와 신청화면으로 바로 접속하는 것입니다.


강의 안내 및 신청화면에 접속한 뒤에는 워드프레스 강의 일정을 확인하고 안내에 따라서 강의를 신청하면 됩니다.


만남의 시간


"내가 분명한 목표를 추구하지 않으면
나는 쉴 새 없이 세상에 추격당합니다.
일단 추격당하면
일생 속도전에 휘말립니다."



"코이라는 물고기는 어항에서 5센티, 연못에서 20센티, 강물에서는 1미터까지 자랍니다. 코이는 어떤 물에서 살지 선택할 수 없지만, 사람은 선택할 수 있습니다. 꿈은 사람이 선택하는 환경입니다."



"꿈은 미래를 보는 것이고, 미래가 보여야 갈 수 있습니다.
꿈은 미래를 가리키는 나침판입니다."  - 길을 찾는 사람 中 에서 -

그럼 청년 여러분 오프라인 강의에서 반갑게 만나뵙겠습니다. 감사합니다. 슈만 올림


네이버 웹마스터 도구에 워드프레스 사이트 등록하기


네이버는 전 국민이 사용하는 생활 필수품이 된지 이미 오래 되었습니다. 시간과 노력을 들여서 워드프레스 사이트를 만들고, 도메인과 웹호스팅 업체를 선정하여 워드프레스 개발 소스를 모두 웹호스팅 서버로 올렸다면 이미 인터넷 URL을 통해서 자신의 워드프레스 웹사이트에 접속할 수 있을 것입니다.

그렇지만, 문제가 하나있습니다. 이제 막 제작을 완료한 워드프레스 사이트라면 그렇게 쉽게 네이버에서 검색되지는 않는다는 것입니다.
자신이 만든 사이트가 유명한 대형 사이트라든지 아니면 콘텐츠가 무척 풍부하지 않는 이상 네이버 검색엔진은 자신이 만든 사이트의 존재를 알 방법이 없습니다.


검색엔진은 주기적으로 크롤링 과정을 거쳐서 자신의 웹사이트와 웹페이지를 분석하고 검색 우선순위를 매깁니다. 그렇지만 콘텐츠도 부족하고 이제 막 제작을 완료한 사이트라면 네이버에게 내 사이트의 존재를 알려주는 것이 필요합니다.
이 과정은 워드프레스로 제작한 사이트 뿐아니라 모든 웹사이트에 동일하게 적용이 되는 부분입니다.

그렇다면 어떻게 해야 네이버 검색엔진에서 내 사이트가 검색되게 할까요? 답은 바로 네이버 웹마스터 도구에 있습니다.


네이버 웹마스터 도구 사용하기


네이버 웹마스터 도구는 내 사이트의 존재를 네이버 검색엔진에게 알려주는 역할을 합니다. 즉, "내 사이트의 URL 주소가 이러하니 네이버 검색할 때 꼭 찾아줘"라고 이야기 하는 것과 같은 것입니다.

그럼 네이버 웹마스토 도구를 활용해서 내 사이트 정보를 네이버 검색엔진에게 제출하는 방법을 학습하도록 하겠습니다.

먼저 네이버 웹마스터 도구 사이트에 접속합니다. 네이버 웹마스터 도구 사이트는 로그인을 해서 사용할 수 있습니다. 오른쪽 상단의 로그인 버튼을 클릭해서 로그인을 진행합니다.


로그인을 하면 기존에 등록해놓은 티스토리 사이트 정보가 나타납니다. 예전에는 티스토리 사이트를 등록했지만 이제는 워드프레스로 만든 웹사이트를 등록하도록 하겠습니다. 아래 사이트 추가 버튼을 클릭합니다.



사이트 정보 입력하기


사이트 추가버튼을 클릭하면 사이트 정보를 입력하는 화면이 나타납니다. 아래 화면과 같이 자신이 만든 워드프레스 사이트나 웹사이트의 URL을 입력한 뒤에 확인 버튼을 클릭합니다.(당연히 웹호스팅을 받지 않고 자신의 로컬컴퓨터에 설치된 워드프레스 사이트는 적용되지 않습니다.)




사이트 소유 확인하기


두번째는 사이트의 소유를 확인해야 합니다. 사이트 소유를 확인하는 방법은 아래 화면과 같이 두 가지 방법이 있습니다.
1) HTML 태그 : HTML 태그를 자신의 HTML 소스안에 붙여넣는 방법
2) HTML 파일 업로드 : 네이버 웹마스터 도구에서 제공하는 인증용 HTML 화일을 자신의 웹호스팅 서버의 루트디렉토리로 올리고 인증하는 방법

여기에서는 2)번 방법인 HTML 파일 업로드를 사용하겠습니다. HTML 파일 업로드 항목에 라디오 버튼을 클릭합니다.




HTML 파일 업로드를 선택하면, HTML 파일을 통한 인증 방법이 나타납니다.
순서는 먼저 인증용 HTML 파일을 다운로드하고, 다운로드 한 HTML 파일을 자신의 웹호스팅 서버로 업로드 한 뒤에, 해당 URL로 접속해서 정상적으로 HTML 인증 파일이 업로드 되었는지 확인하면 됩니다.

그럼 먼저 아래 HTML 확인 파일 부분을 클릭해서 네이버 웹마스터 도구 인증용 파일을 다운로드 받습니다. 



HTML 확인 파일 부분을 클릭하면 아래와 같이 네이버 웹마스터 도구 인증용 HTML 화일이 다운로드 됩니다.




이렇게 다운로드한 인증용 HTML을 파일을 자신의 웹호스팅 서버의 루트디렉토리에 업로드 하면 됩니다. 루트디렉토리에 대한 설정은 서버마다 틀리지만, public_html로 되어있는 곳도 있고 www 로 되어있는 곳도 있습니다. 

아래 화면처럼 HTML 인증파일을 FTP 프로그램을 통해서 서버에 업로드합니다.




서버에 업로드를 하였다면 이제는 파일을 업로드한 URL로 접속해서 정상적으로 접속이 되는 지 확인해야 합니다. 해당 URL로 접속합니다.




정상적으로 인증 파일이 서버에 업로드 되었다면 웹브라우저를 통해서 접속하면 아래와 같은 문구가 나타날 것입니다



정상적으로 인증용 HTML 파일의 접속이 완료되었기 때문에 아래 확인 버튼을 클릭합니다.



네이버 웹마스터 도구 사이트 정보 확인하기


확인 버튼을 클릭하면 아래와 같이 새로 연동된 워드프레스 사이트가 등록된 것을 확인할 수 있습니다. 그럼 새로 추가된 사이트의 정보를 보기 위해서 적색부분의 사이트를 클릭합니다.





이제 막 네이버 웹마스터 도구에 추가했지만 아래 최근 수집 상태 정보에서 DNS 상태가 정상이고, robots.txt 화일이 정상적으로 수집된 것을 확인할 수 있습니다.




이클립스 디버깅 도구로 개발 생산성 높이기


초창기 국내에서 자바 진영을 시작으로 각광받았던 이클립스는 이제는 소스코드 IDE 개발도구로 여러 개발언어에서 가장 유명한 개발 도구가 되었습니다.

디자이너나 퍼블리셔가 담당하는 부분을 넘어서는 부분인 웹프로그래밍이나 서버쪽에서는 일명 프로그래머라하는 웹개발자나 서버개발자들이 있습니다.
퍼블리셔와는 틀리게 웹개발자들은 DB와 서버쪽인 연동된 소스 코딩을 많이 하게됩니다. 현재 국내 웹개발 분야에서는 자바 프로그래머나 PHP 프로그래머, C# 닷넷 ASP 프로그래머들이 주로 포진해있습니다.


웹개발자는 프로그램 코딩을 위해서 에디터 프로그램이나 IDE 개발도구를 이용합니다. 국내에서 많이 사용하는 에디터 프로그램는 에디트플러서(EditPlus), 울트라에디터(UltraEdit), 아크로에디터, 서브라임텍스트(주로 퍼블리셔나 디자이너가 선호) 등 여러가지가 있습니다.

에디터 프로그램이 가볍고 간단히 사용이 가능해서 많이 사용하지만 코드 어시스트나 디버깅 때문에 IDE 개발도구인 이클립스를 사용하는 것이 개발 생산성 향상에 좋습니다.

프로그램 코딩에 있어서 개발자를 괴롭히는 것 중의 하나는 디버그 작업입니다. 이클립스와 같은 자동화된 디버깅 도구가 없다면 개발자들은 언제나 System.out.println()과 같은 일종의 문자출력 프린트 명령어로 에러나는 부분은 소스상에 적어놓고 테스트를 해야는 번거로움이 있을 것입니다.

※ 이어지는 내용입니다. 아래 포스팅을 참고바랍니다.



이클립스 디버깅 도구 Xdebug


디버깅 도구로는 Xdebug나 Zend Debugger가 있습니다. 일반적으로 APM나 오토셋을 설치하면 기본적으로 Zend Debugger 가 내장되어 있습니다.
여기에서는 Xdebug와 Zend Debugger 중에서 Xdebug를 사용해서 이클립스에 연결하겠습니다.


먼저 Xdebug를 사용하기 위해서는 Xdebug 에서 제공하는 DLL 파일을 설치해야만 합니다.
현재 DLL의 종류는 현재 vc6에서 v14까지 있습니다.


Xdebug를 자신의 서버에 올바르게 설치하기 위해서는 먼저 아래의 세 가지 사항은 확인해야만 합니다.

※ Xdebug 설치전 확인 사항

첫째, VC 버전
둘째, PHP 버전
세째, TS라 부르는 Thread Safe Bulid 값

자신의 서버의 사양을 확인하는 작업은 phpinfo() 함수를 통해서 간단하게 확인을 할 수 있습니다.


phpinfo() 함수로 나의 서버에 설치할 Xdebug 사양 확인하기


먼저 이클립스를 구동합니다. 왼쪽 PHP Explorer 윈도우에서 wordpress-eclipse 폴더에서 마우스 오른쪽을 클릭해서 New > PHP File 메뉴를 클릭합니다.

 

새로운 PHP 파일을 생성할 수 있는 윈도우가 나타납니다.
서버의 정보를 확인할 phpinfo.php란 더미 파일을 하나 만들 것입니다.

파일 이름란에 phpinfo.php 를 입력하고 Finish 버튼을 클릭합니다.



phpinfo.php란 새 파일이 열립니다.



아래와 같이 PHP 소스코드를 입력하고 Ctrl+S로 해당 내용을 저장합니다.



이제 왼쪽 PHP Explorer 윈도우에서 phpinfo.php에서 마우스 오른쪽 버튼을 클릭해서 Run As > 2 PHP Web Application 메뉴를 클릭해서 웹어플리케이션을 실행합니다.




PHP 웹어플리케이션을 실행할 Launch URL이 나타납니다. OK 버튼 클릭합니다.



이클립스 화면에 phpinfo.php 화면이 열립니다. phpinfo() 함수를 사용해서 자신의 로컬서버에 대한 정보가 아래 화면과 같이 나타납니다.



화면상에서 마우스 오른쪽 버튼을 클릭해서 소스보기 메뉴를 클릭합니다.



소스보기한 HTML 소스가 나타나면 해당 소스를 Ctrl+C로 복사해둡니다. 이렇게 복사한 소스는 Xdebug 사이트 정보확인 입력창에 입력해서 적합한 Xdebug 버전을 찾는데 사용하게 됩니다.



Xdebug 사이트에서 내 서버의 플러그인 DLL 사양 확인하기


Xdebug 사이트로 이동해서 사용할 DLL 사양을 확인해야 합니다. Xdebug 사이트에 접속합니다.
Xdebug 사이트에 접속하면 아래와 같이 HTML 소스를 입력하는 창이 나타납니다. 이 창에 조금전에 복사한 phpinfo HTML 코드를 붙여넣으면 됩니다.



아래 화면과 같이 붙여넣은 다음에 output 버튼을 클릭합니다.     




아래와 같이 서버에 대한 정보가 나타납니다. 오렌지 박스로 표시한 세 부분이 중요합니다. 
현재 사양은 VC11 이고 PHP 버전은 5.6, TS는 Yes입니다.





이제 Xdebug 사이트에서 아래 download 메뉴를 클릭해서 dll 파일을 다운받는 웹페이지로 이동합니다.



저의 경우 VC11, PHP 5.6.0 이고 TS yes이고 64 bit이기 때문에 다운받는 페이지에서 PHP 5.6 VC11 TS(64 bit)를 내려받으면 됩니다.
조금전에 조사한 방법으로 자신의 서버 사양에 맞는 dll을 다운로드 하면 됩니다.



다운로드 링크를 클릭하니 아래와 같이 파일이 로컬에 다운로드되었습니다.


이 파일을 서버가 있는 오토셋의 dll 관리 폴더에 복사해야 합니다.
php_xdebug-2.4.0-5.6-vc11-x86_64.dll 파일을 AutoSet9 > server > bin > ext 로 이동해서 아래 화면과 같이 붙여넣기를 합니다.








php.ini 파일에서 XDebug 정보 세팅


이제는 서버의 php.ini 파일을 열어서 설정을 해야합니다.
AutoSet9 > server > conf 폴더로 이동해서 php.ini 파일을 오픈합니다.




php.ini 파일을 열어서 맨 마지막 라인에 추가합니다. 포트는 기존에 사용하지 않는 포트인 9001번을 넣었습니다.







이클립스에서 디버그 환경 설정하기


이클립스를 열어서 Window > Preference 메뉴를 클릭합니다.




Preferences 화면에서 PHP >  Executables 메뉴를 선택한 뒤에 Add 버튼을 클릭합니다.




새로운 PHP Executable 작성할 수 있는 화면이 나타납니다.



이름 란에 아래와 같이 Xdebug라 입력하고 Browse 버튼을 클릭해서 아래와 같이 php 실행 파일과 환경 파일을 선택합니다. 선택이 완료되면 Finish 버튼을 클릭합니다.



Finish 버튼을 클릭하면 아래와 같이 Xdebug가 만들어진 것을 확인할 수 있습니다. Xdebug를 선택합니다.



Xdebug 이름 선택하면 Edit 버튼이 활성화 됩니다. Edit 버튼을 클릭합니다.



두번째 Debugger 탭을 클릭합니다.



Connection Setteings 항목에서 Port 부분을 9001로 바꾸고 OK 버튼을 클릭합니다.



이제는 PHP > debug 메뉴를 클릭합니다. PHP Debug 화면에서 오른쪽에 오렌지 동그라미 부분의 PHP Servers... 링크를 클릭해서 Debuger 설정합니다.



설정이 완료되면 아래와 같이 Debugger에 XDebug가 나타납니다. 




Break at First Line 체크를 해제하고 서버와 excutable 항목을 아래와 같이 선택한 뒤에 Apply 버튼을 클릭하고 OK 버튼을 클릭합니다.




디버그 환경설정 - Debug Configuration


아래 화면에서 벌레 모양을 클릭하면 나타나는 Debug Configuration 메뉴를 클릭합니다.



디버그 환경설정 화면에서 아래와 같이 이름을 Xdebug로 바꿉니다.



Xdebug로 바꾼고 Browse 버튼을 클릭해서 index.php 파일을 선택하고 apply 버튼을 클릭합니다.
index.php 파일을 선택하는 것은 디버깅을 시작할 때 이 파일로 시작한다는 의미입니다.



Apply 버튼을 클릭하니 왼쪽 메뉴에서 Xdeubg가 생성됩니다. Close 버튼으로 화면을 닫습니다.



벌레모양 아이콘을 클릭한 뒤에 Xdebug 메뉴를 클릭해서 디버깅을 시작합니다. 



디버그가 시작되고 아래와 같이 화면이 나타나는 것을 확인할 수 있습니다. 아직 Break point는 설정하지 않았지만 디버그 수행시 소스코드에 설정하면 편리하게 디버깅 작업을 할 수 있습니다.





이클립스에서 워드프레스 설치하기


이클립스에서 워드프레스 개발환경을 만드는 것을 연재하고 있습니다. 이어지는 내용이므로 이전 포스팅은 아래 내용을 참고바랍니다.





이제 이클립스에서 워드프레스를 설치할 차례입니다. 지난 시간에 워드프레스를 사용할 데이터베이스를 생성하고 이클립스에 웹서버를 연결하였습니다. 이클립스에서 로컬 index 파일 경로로 접속하니 아래와 같이 이클립스 안에 워드프레스를 설치하는 화면이 나타났습니다.



워드프레스를 설치하는 화면에서 Let's go 버튼 클릭합니다.




데이터베이스 연결정보를 입력하는 화면이 나타납니다.





데이터베이스 연결 정보를 입력하는 화면에서 조금 전에 생성한 MySQL 데이터베이스 이름과 사용자 이름, 비밀번호를 입력합니다.
데이터베이스 호스트 항목과 테이블 접두어 항목은 디폴트 상태로 그대로 둔 뒤에 전송버튼을 클릭합니다.



설치를 실행하는 화면이 나타납니다. 설치 실행하기 버튼을 클릭합니다.



설치화면에서 워드프레스의 환영 문구가 눈에 띕니다.
'세계에서 가장 확장성 높고 강력한 개인 출판 플랫폼을 사용하는 길로 들어서게 됩니다.'

이제 자신이 만들 사이트 제목과 사용자명을 입력하면 됩니다. 여기에서 간단하게 입력해도 상관없습니다. 추후에 워드프레스 관리자 화면에서 얼마든지 수정이 가능하기 때문입니다.



다음과 자신이 만들 워드프레스 웹사이트 정보를 입력하고 설치하기 버튼을 클릭합니다.



설치가 완료되었습니다. 설치는 정말 간단하게 끝납니다. 로그인 버튼을 클릭합니다.



워드프레스 로그인 화면이 아래와 같이 나타납니다.



자신이 만들었던 사용자명과 비밀번호를 입력하고 로그인 버튼을 클릭합니다.



로그인이 완료되면 다음과 같이 이클립스안에 워드프레스가 구동된 것을 확인할 수 있습니다.



이클립스 안에서 구동된 워드프레스 관리자 화면에서 사이트보기를 하면 다음이 사이트가 나타납니다.



워드프레스 개발환경, 이클립스에 아파치 서버 연결하기


지난 시간에는 PHP용 이클립스를 설치하고 이클립스에서 워드프레스 소스를 모두 가져왔습니다.
이번 시간에는 이클립스에 웹서버인 아파치 서버를 연결하고 워드프레스가 사용할 MySQL 데이터베이스를 생성하도록 하겠습니다.



이어지는 내용이므로 아래 이전 포스팅을 학습하면 더 효과적입니다.



그럼 이제, 이클립스에서 웹서버인 아파치 서버의 연결작업을 진행하겠습니다.
먼저 PHP용 이클립스를 구동하고 상단에서 Window > Preferences 메뉴를 클릭합니다.



Preferences 윈도우창이 나타납니다.



왼쪽 메뉴에서 PHP > Servers 를 선택하면 오른쪽 화면에 Default PHP Web Server 항목이 나타납니다.
Default PHP Web Server 항목을 선택한 뒤에 Edit 버튼을 클릭합니다.



Edit 버튼을 클릭하면 PHP Server 환경 설정을 하는 화면이 나타납니다.
아래 Server Porperties 항목에서 웹서버의 다큐먼트루트(Document Root)를 설정해야합니다.



Browse 버튼을 클릭해서 아파치가 설치되어 있는 오토셋 폴더에서 다큐먼트루트인 public_html을 선택한 뒤에 Finish 버튼을 클릭합니다.




OK 클릭을 클릭합니다.



이제 PHP 웹서버를 실행하겠습니다. 왼쪽 PHP Explorer에서 wordpress-eclipse 폴더에 마우스 오른쪽 버튼을 클릭해서 Rus As > 1 PHP Web Application 메뉴를 클릭합니다.



프로젝트를 실행하기 위해서 프로젝트의 index 파일을 찾는 화면입니다. Browse 버튼을 클릭합니다.



index.php 파일을 선택한 뒤에 OK 버튼을 클릭합니다.




인덱스 파일을 설정이 되었습니다. OK 버튼을 클릭합니다.




OK 버튼을 클릭하면 워드프레스를 설치할 수 있는 화면이 나타납니다.
아직 워드프레스에서 사용할 데이터베이스를 만들지는 않았습니다.




워드프레스 데이터베이스 생성하기


데이터베이스를 생성하기 위해서 오토셋을 실행한 뒤에 제어 > phpMyAdmin 접속 메뉴를 클릭합니다.



phpMyAdmin 화면에 사용자명과 암호를 입력하고 로그인합니다.


MySQL에 wordpress-eclipse 라는 데이터베이스를 만들려고 합니다.
아래 화면과 같이 phpMyAdmin 화면에서 데이터베이스 탭을 클릭한 뒤에 새 데이터베이스 만들기 항목에 wordpress-eclipse 라고 입력하고 만들기 버튼을 클릭합니다.



아래와 같이 wordpress-eclipse라는 신규 데이터베이스의 생성이 완료된 것을 확인할 수 있습니다. 이로써 워드프레스가 사용할 MySQL 데이터베이스의 준비가 끝났습니다.


워드프레스 개발환경의 구성

워드프레스 개발자가 개발 환경을 구성할 때 여러가지 방법이 있습니다. 
그렇지만, 워드프레스 개발환경에서 기본적으로 필요한 것은 아래 세 가지입니다.


워드프레스 개발환경 필수 삼요소

1) 데이터베이스(MySQL, MariaDB)
2) 웹서버(아파치)
3) 웹프로그래밍 개발 언어(PHP)

워드프레스를 구동하기 위해서 기본적으로 위의 세 가지는 반드시 필요합니다. 
워드프레스를 처음 접하는 사용자가 MySQL, 아파치, PHP를 개별적으로 세팅하는 것은 쉬운일은 아닙니다. 

그렇다고 걱정할 필요는 없습니다. 오토셋을 이용하면 세 가지 웹개발환경 구성은 간단하게 끝낼 수 있습니다.
오토셋에 대한 설치 및 환경 구성은 아래 포스팅을 참고바랍니다.



오토셋으로 환경 설정이 완료되었다면, 워드프레스를 사용해서 웹사이트 제작에 들어갈 것입니다.
워드프레스의 장점은 코딩작업을 하지 않고 손쉽게 웹사이트나 홈페이지를 제작할 수 있는 것이지만, 실제로 웹사이트의 디테일을 손대게 되면 PHP 프로그래밍은 필수가 되게됩니다.

PHP 프로그래밍을 하다보면 결국 코딩을 편리하게 하기위해서 자신에게 맞는 에디터 프로그램을 찾아 사용하게 됩니다. 요즈음에 에디터 프로그램은 여러가지가 있으나 퍼블리셔나 디자이너가 선호하는 에디터 프로그램은 서브라임 텍스트입니다.

서브라임 텍스트는 정말 훌륭한 에디터 프로그램입니다. 

서브라임 텍스트 외에 한가지 더 추천하고 싶은 개발도구는 바로 이클립스입니다.
이클립스는 자바 진영에서 가장 호평받는 훌륭한 IDE 개발도구입니다. 그렇지만 PHP나 다른 개발환경도 지원합니다.

이클립스를 사용하면 디버깅 도구등 여러 가지 편리한 기능으로 개발 생산성을 향상 시킬 수 있습니다.
이번 시간에는 이클립스로 워드프레스 개발환경을 구성하는 방법을 학습하도록 하겠습니다.


이클립스로 워드프레스 개발환경 구성하기 - 이클립스 PHP Developer 설치하기


워드프레스에서 사용할 이클립스를 다운로드 받기 위해서 이클립스 사이트에 접속합니다.
이클립스 사이트에서 아래 화면에 연두색 화살표가 가르키는 64bit 메뉴를 클릭합니다.




64 bit 메뉴를 클릭하면 아래와 같은 이클립스 인스톨러가 다운로드 됩니다.
(이때 JDK 1.7이나 JRE 1.7 이상이 설치되어 있어야 합니다.)
이클립스 인스톨러를 클릭합니다.




이클립스 인스톨러가 실행되면 아래와 같은 화면이 나타납니다. Eclipse IDE for PHP Developers를 클릭합니다.



PHP용 이클립스를 설치할 폴더를 지정하는 화면입니다. 여기에서는 c:\dev 폴더를 만들고 그안에 eclipse를 설치하겠습니다.
아래와 같이 폴더를 설정하고 INSTALL 버튼을 클릭합니다.




동의에 관한 내용입니다. Accept Now 클릭합니다.



이클립스 IDE for PHP Developers가 설치되고 있습니다.



이클립스 인스톨이 완료되고나면 LAUNCH 버튼이 보입니다. LAUNCH 버튼을 클릭합니다.




이클립스 작업폴더를 지정하는 팝업이 나타납니다. 여기에서는 웹서버의 도큐먼트루트 경로를 설정하면 됩니다. 
Browse 버튼을 클릭해서 오토셋의 Document Root 경로인 public_html 폴더를 선택합니다.
폴더의 선택이 완료되면 OK 버튼을 클릭합니다.



PHP용 이클립스 구동되고 있습니다.



이제 이클립스의 구동이 완료되었습니다. 우측의 Workbench를 클릭합니다.




이클립스 개발환경인 Workbench 화면이 아래와 같이 나타납니다.



이클립스 PHP 프로젝트 만들기


새로운 PHP 프로젝트 만들기 위해서 File > New > PHP Project 클릭합니다.



프로젝트 이름 wordpress-eclipse 입력하겠습니다.
그리고 JavaScript Support 항목에서 Enable Javascript에 체크한 뒤에 Next 버튼을 클릭합니다.



Configuration은 그대로 두고 Next 버튼을 클릭합니다.



소스폴더에 wordpress-eclipse 폴더가 생성된 것을 확인할 수 있습니다. Next 버튼을 클릭합니다.



build path 항목을 확인후 Finish 버튼을 클릭합니다.



이클립스 개발 화면의 왼쪽 PHP Explorer에 wordpress-eclipse 폴더가 생성된 것을 확인할 수 있습니다.



그렇다면 실제 윈도우 탐색기에서는 어떻게 폴더가 구성되었는지 확인합니다.
로컬 컴퓨터의 윈도우 탐색기에서도 이클립스와 동일하게 파일이 생성된 것을 알 수 있습니다.





워드프레스 복사하기



이제 wordpress-eclipse 폴더에 다운받은 워드프레스 4.2.2 버전을 모두 복사해서 아래 화면과 같이 붙여넣습니다.






현재 이클립스에서보니 아직 PHP Explorer 화면에는 복사한 소스가 나타나지 않습니다.



이클립스 화면에서 리프레쉬의 단축키인 F5 키보드를 누릅니다.
F5로 리프레쉬를 하면 이클립스는 Building workspace 를 진행하면서 소스를 가져옵니다.



이클립스가 소스를 모두 가져왔습니다. 이로써 이클립스에 워드프레스 소스를 모두 가져왔습니다. 다음 시간에는 이클립스에서 아파치 서버 연결을 하고 워드프레스를 설치하는 과정을 진행하겠습니다.





워드프레스 원데이 강의

안녕하세요? 슈만입니다. 워드프레스 강의에 대한 문의가 있어서 오프라인 강의 관련 안내를 드립니다.
워드프레스 오프라인 강의는 현재 티스토리 블로그와는 별도로 워드프레스엑스(X) 웹사이트에서 진행하고 있습니다.

오프라인 워드프레스 강의는 현재 매주 진행되고 있습니다. 
(자세한 강의 안내 및 신청 방법은 아래 강의 안내 보기로 바로 확인하실 수 있습니다.)





원데이, 단 하루만의 목표


단 3시간 만에 끝내는 속성 강의이지만,
하루 만에 워드프레스에 대한 개념을 잡고, 자신의 웹사이트를 실습하는 것을 목표로 합니다.

3시간의 투자로 워드프레스를 자신의 것으로 만들 수 있습니다.

워드프레스를 처음 접하는 일반인들이 느끼는 공통점은 조금은 어렵다는 것입니다.
전세계에서 우리나라에서 네이버의 영향력은 절대적입니다. 그렇다보니 사람들은 네이버 블로그에만 익숙해져있습니다.
워드프레스가 어렵다기 보다 익숙하지 않아서 오는 문제입니다. 많이 사용하는 네이버 블로그와 차이가 있을 뿐입니다.





프롤로그 - 나의 미래는 보장되는가?


이제는 개인 플랫폼의 시대입니다. 100세의 시대는 도래했습니다.
평생 직장의 개념이 사라진지는 오래입니다. 최선을 다해서 60세까지 정년을 근무했다고 해도 40년을 더 살아야 하는 시대입니다.

이제 회사가 개인을 책임져주던 시대는 이미 지났습니다.

배낭을 꾸려야 합니다. 두 손으로 신발끈을 단단히 조여야 합니다.
두 다리에 힘을 주고 굳건히 일어서야 합니다. 
그리고, 홀로 자신의 길을 떠나야 합니다.




미래는 작은 기업들의 시대가 될 것이다.


작은 것이 큰 것이다. - 세스 고딘 -

워드프레스를 배우는 것은 미래를 준비하는 가장 좋은 방법중의 하나입니다.
워드프레스를 공부하면서 투자한 시간은 결코 헛되지 않습니다.

워드프레스를 제대로 익힌다면 자신만의 일을 꾸밀 수 있습니다. 
워드프레스가 날개가 되어 자신이 하고 있는 온오프라인 일에 큰 도움을 줄 것입니다.





왜 워드프레스인가?


워드프레스는 새로운 일에 대한 생각을 구현하는 도구입니다. 자신이 하는 일에 날개를 달아주는 도구입니다.

요즈음 많은 사람들은 포털형 블로그를 사용합니다. 그렇지만, 포털형 블로그를 운영했던 사람이 워드프레스 등의 전문 CMS 도구로 이동하는 것은 포털형 블로그만으로는 한계를 느끼기 때문입니다.

포털형 블로그인 네이버 블로그나 티스토리 블로그도 괜찮지만 포털에서 제공하는 블로그는 자유도가 워드프레스에 비해서 떨어집니다. 그리고 포털형 블로그는 제공 회사의 정책에 따라서 자신의 블로그가 제한 되는 경우가 많이 있습니다. 




자신만의 일을 꾸리거나 회사의 웹사이트라면 워드프레스와 같은 CMS 도구가 적합합니다.

워드프레스를 통해서 사이트를 구축할 때의 이점은 다음과 같습니다.

첫째, 독립성 - 진정한 자신만의 웹사이트를 꾸릴 수 있다. 블로그나 쇼핑몰, 회사 웹사이트를 쉽게 만들수 있다.
둘째, 디자인 - 자유롭게 퀄리티 높은 디자인을 선택할 수 있다.
세째, 놀라운 확장성과 최신성 - 워드프레스는 플러그인 설치로 새로운 IT 기술을 웹사이트에 바로 적용할 수 있다.
네째, 검색엔진 최적화 
다섯째, 효율적인 콘텐츠 관리 
여섯째, 반응형 디자인




구글트렌드로 본 워드프레스에 대한 국내의 관심도 변화


기이한 현상 중의 하나는 전세계에서 우리나라만 유독 워드프레스가 힘을 못썻던 것입니다. 그 이유에는 사람들이 네이버 블로그를 선호하기 때문이었습니다.
워드프레스는 세계 시장에서 압도적인 블로그나 웹사이트 플랫폼입니다. 이제 워드프레스는 네이버 블로그가 주류인 국내에서도 지난 몇 년동안 급격한 관심도의 증가를 볼 수 있습니다.




전 세계 CMS 시장의 워드프레스 점유율


워드프레스는 전세계 CMS 시장에서 압도적이고 절대적인 점유율을 보이고 있습니다.
워드프레스가 다른 CMS에 비해서 높은 점유율을 보이는 것은 워드프레스가 다른 CMS에 비해서 상대적으로 쉽기 때문입니다.

[ 출처 : W3Tecks.com ]





워드프레스와 새로운 일을 다시 시작하시기 바랍니다.




워드프레스와 구글 애널리틱스 연동시키기


웹사이트의 지속성을 유지하기 위해서는 웹사이트분석의 유용한 도구인 구글 애널리틱스를 사용하는 것이 좋습니다. 구글 애널리틱스는 구글 애널리틱스 사이트에 들어가서 바로 사용할 수 있습니다. 그렇지만 워드프레스를 사용한다면 굳이 구글 사이트에 방문하지 않고 자신의 워드프레스 사이트에 플러그인을 설치해서 웹사이트 현황을 확인할 수 있습니다.

구글 애널리틱스 플러그인 중에서 많이 사용하는 플러그인 중의 하나는 Google Analytics by Yoast 플러그인입니다.





Google Analytics by Yoast 플러그인 설치하기


구글 애널리틱스 플러그인을 설치하기 위해서 관리자 메뉴의 왼쪽 사이드바에서 플러그인 추가하기 메뉴를 클릭합니다.



플러그인 검색화면에서 Google Analytics by Yoast 를 입력하고 검색합니다. 첫번째 플러그인의 치금 설치하기 버튼을 클릭합니다.





Google Analytics by Yoast 플러그인 연결하기


Google Analytics by Yoast  플러그인을 설치하면 관리자 화면에 다음과 같은 메뉴가 생성된 것을 확인할 수 있습니다. Analytics > Settings 메뉴를 클릭합니다.



구글 애널리틱스 by Yoast의 설정화면이 나타납니다. 구글 애널리틱스 계정에 인증하기 위해서 General 메뉴에서 Authenticate with your Google accout 버튼을 클릭합니다.



Authenticate with your Google accout 버튼을 클릭하면 구글 계정 로그인 팝업이 뜹니다.



이곳에 자신의 구글 계정을 입력하고 다음 버튼을 클릭해서 로그인을 진행합니다.



구글의 권한요청 내용의 팝업 화면이 나타납니다. 워드프레스 플러그인인 Google Analytics by Yoast에서 구글 애널리틱스의 데이터를 조회하기 위한 권한 요청 확인 팝업입니다. 하단의 동의 버튼을 클릭합니다.




동의 버튼을 클릭하면 인증코드가 나타납니다. 아래 인증코드를 드래그해서 복사해둡니다.



그리고 워드프레스 관리자 화면으로 와서 아래 입력란에 복사한 구글 인증코드를 붙여넣습니다.




구글 인증코드를 워드프레스에 붙여넣은다음에 Save authentication code 버튼을 클릭합니다.



구글 인증코드가 정상적으로 저장되고 연결되면 아래와 같이 설정화면이 변경되고 기존의 인증버튼이 Re-autenticate with your Google account 버튼으로 변경된 것을 확인할 수 있습니다. 이제는 분석을 위한 프로파일을 선택할 차례입니다.




Analytics profile 항목에서 Select a profile 선택박스를 클릭합니다.




profile 에서 전체 웹사이트 데이터를 선택합니다.



프로파일에서 분석할 웹사이트 데이터 항목이 선택되어진 상태에서 저장버튼을 클릭합니다. 이렇게 하면 구글 애널리틱스와 연결이 된 것입니다.



워드프레스 콘텐츠 작성시 페이지(Page)와 글(Post)을 구분해서 사용하자


워드프레스를 사용해서 글을 작성할 때 워드프레스 콘텐츠 타입을 크게 본다면 두 가지로 생각할 수 있습니다.
두 가지는 하나는 페이지(Page)이고 하나는 글(Post)입니다.
일반적으로 페이지(Page)는 회사 소개등 정적인인 내용을 구성할 때 사용하고, 동적인 블로그성 내용은 글(Post)로 작성하는 것이 좋습니다.




페이징 기능이란?


페이징 처리 기능은 아래 그림을 보면 바로 이해가 갈 것입니다. 페이징 처리 기능은 구글 화면과 같이 클릭을 해서 다음 페이지로 넘어가는 기능을 이야기합니다. 페이징 처리기능이란 용어는 페이지 네비게이션으로 IT 업계에서는 명명하기도 합니다.




요즈음에는 여러 블로그 시스템에서 페이징 기능을 특정 아이콘이나 이미지를 클릭해서 페이징 기능을 두는 대신에 스크롤을 내리면 동적으로 다음 블로그 내용들이 보여지는 방식으로 서비스를 구현하고 있습니다.


워드프레스 페이징 기능 적용의 묘(妙)


워드프레스의 페이징 기능은 여러가지 상황을 고려해 보아야합니다. 워드프레스의 버전과 어떤 테마를 사용하는지에 따라서 페이징 기능을 적용하는 방법이 다르기 때문입니다.

워드프레스의 태생은 작은 블로그 프로그램에서 시작이 되었습니다. 태생이 블로그이기 때문인지 과거 워드프레스 버전에서는 기본적으로 페이징 처리 기능이 페이지번호가 보이는 방식이 아니라 이전, 이후 정도의 페이지 기능 정도만 제공하고 있었습니다.

그래서 숫자가 보이는 페이징 기능을 구현하기 위해서는 페이징 플러그인으로 유명한 WP-PageNavi 플러그인을 설치해서 사용하는 경우가 많았습니다.
전세계적으로 백만건이상 설치된 WP-PageNavi 플러그인은 지금도 워드프레스에서 페이지 네비게이션 기능을 구현할 때 가장 많이 사용하는 플러그인입니다.




그렇지만 아래 화면과 같이 WP-PageNavi 플러그인을 설치한다고 해서 모든 일이 해결되는 것은 아닙니다.
WP-PageNavi 플러그인을 설치한 뒤에 자신의 워드프레스 테마 소스에서 functions.php 나 index.php 등 php 소스를 뒤져서 next_posts_link() 함수를 찾아서 아래 그림과 같이 변경해 주어야 했습니다.





테마가 변경될 때마다 페이징 소스를 수정해야하는 번거로움


워드프레스 설치시 기본적으로 제공되는 TwentyThiteen, TwentyFourteen 테마가 있습니다.
TwentyThiteen 테마까지는 그래도 아래 화면과 같이 next_posts_link 로 검색해서 찾으면 function.php 화일에 동일한 함수명으로 존재를 하였으나
TwentyFourteen 테마에서는 함수 이름마저 변경되었을 뿐아니라 작동 방식이 변경되었습니다.

[ TwentyThiteen 테마 fuctions 소스 ]





TwentyFourteen 테마에서는 functions.php 안에 페이징 기능의 소스가 있는 것이 아니라 template-tags.php 라는 별도의 파일로 inc 폴더안에 존재하게 됩니다. 



소스코드나 함수명도 변경되었습니다.



페이징 기능은 워드프레스 4.2.2와 TwentyFourteen 테마 조합으로


워드프레스 버전을 4.2.2이상 사용하고 기본 테마인 TwentyFourteen 테마를 사용한다면 WP-PageNavi나 별도의 페이징 플러그인을 설치하거나 PHP 소스코드를 수정하지 않아도 간단하게 설정이 가능합니다.


페이징 처리 실습하기


페이징 기능 실습환경은 워드프레스 버전은 4.2.2이상이고 테마는 TwentyForteen 로 구성하였습니다.
페이징 기능 사용을 위해서 관리자 화면의 왼쪽 사이트바 메뉴에서 설정 > 읽기 메뉴를 클릭합니다.



읽기 메뉴를 클릭하면 읽기 설정 화면이 나타납니다. 전면 페이지 표시 항목은 전면 페이지를 표시할 때 최근 글의 리스트를 보여주거나 정적인 페이지를 선택하는 기능입니다. 일단 테스트를 위해서 최근 글 항목에 체크합니다.

페이지당 보여줄 글의 수 항목은 기본적으로 10으로 세팅되어 있습니다. 한 페이지에서 몇 개의 블로그 글(POST)를 보여줄 것인지 설정하는 것입니다. 여기에 입력하는 숫자에 따라서 해당 숫자만큼의 글(POST)를 보여주고 나머지는 자동으로 페이징 표시가 화면에 디스플레이됩니다.




전면 페이지 표시 항목은 최근 글로 선택한 상태에서 페이지당 보여줄 글의 수 항목을 1로 변경하고 저장버튼을 클릭합니다.



저장버튼을 클릭한 뒤에 슈만의 웹사이트로 접속하면 아래와 같이 페이징 처리 기능이 나타나는 것을 확인할 수 있습니다.





가입형 워드프레스에서는?


현재 기준으로 확인하였을 때에 가입형 워드프레스 서비스인 워드프레스닷컴에서는 TwentyFourteen 테마에서 아래와 같이 동일하게 설정하지만 나타나는 페이징 결과는 다르게 나타납니다.

아래 화면은 설치형 워드프레스와 동일하게 페이지당 보여줄 글의 수를 1로 설정한 상태입니다. 페이지당 보여줄 글의 수를 1로 설정했기 때문에 페이지당 한 개의 블로그만 나타날 것입니다.



아래 화면을 보면 가입형에서는 설치형 워드프레스에서 나타난 것과 같이 페이지 번호는 나타나지 않고 이전글 버튼이 나타나는 것을 알 수 있습니다. 머지않아 가입형 워드프레스인 워드프레스 닷컴의 경우에도 버전업이 된다면 페이징 기능이 구현될 것입니다.






설치형 워드프레스 4.2.2 버전과 기본테마 TwentyThirteen의 조합은?


워드프레스 4.2.2 버전과 TwentyThirteen 테마의 조합으로는 페이징 기능이 다음과 같이 나타납니다.
여기에서는 페이지당 보여줄 글의 수를 2개로 설정하였습니다.



기본테마인 TwentyThirteen 테마 역시 페이징 기능이 페이지 번호로 출력되지 않고 이전 글로만 나타납니다. 이렇게 페이징 기능은 워드프레스 버전과 테마와 관계가 있습니다.





마지막으로 쓰는 비장의 방법은?


요즈음 개발되는 테마는 페이지 기능이 내장되어 있는 것도 있습니다.
그렇지만 자신의 워드프레스 버전과 테마가 지원을 하지 않는다면 플러그인을 설치하거나 소스코드를 수정해야 합니다.
플러그인 설치가 필요하다면 아래 플러그인을 설치해서 사용합니다.

WP-PageNavi과 WP PageNavi Style 플러그인


플러그인을 설치하기 위해서 워드프레스 관리자 화면의 왼쪽 사이드바에서 플러그인 추가하기 메뉴를 클릭합니다.


플러그인 검색화면에서 wp pagenavi를 입력하고 플러그인을 검색합니다. 검색된 플러그인에서 두 개를 설치할 것입니다.
첫번째 플러그인인 WP-PageNavi는 페이징 네비게이션 기능에 대한 플러그인이고, 두번째 WP PageNavi Style은 페이지 네이게이션의 모양 즉, 스타일을 바꾸는 플러그인입니다. 두 개를 모두 지금 설치하기 버튼을 클릭해서 설치해서 사용하면 됩니다.


WP-PageNavi 플러그인은 설정 > 페이지네비 메뉴에서 설정할 수 있습니다. 페이지네비 메뉴를 클릭합니다.




페이지 네비게이션 옵션에서 한 페이지에 보여줄 글(포스트)의 갯수를 정할 수 있습니다. 물론 이곳에서 설정을 저장한다고 WP-PageNavi 플러그인의 페이지 기능이 동작하지는 않습니다. 추가적으로 테마 소스를 수정해야 합니다. 테마 소스 수정은 아래 워드프레스 공식사이트 플러그인 설명 내용을 참고하여 수정바랍니다.





스타일은 WP PageNavi Style 플러그인에서


페이지네비의 스타일을 변경하려면 WP PageNavi Style 플러그인을 활성화해야 합니다.
플러그인을 활성화하면 왼쪽 사이드바에 PageNavi Style 메뉴가 생성됩니다. PageNavi Style을 클릭합니다.



이곳은 페이지 네이게이션의 스타일을 설정하는 화면입니다. 어떻게 사용자에게 보여지도록 하는지 디자인하는 곳이라 생각하면 됩니다.




스타일을 아래와 같이 변경해 보겠습니다. CSS3 PURPLE 항목을 선택했습니다.



아래 화면과 같이 변경된 것을 확인할 수 있습니다.




워드프레스의 금기사항


워드프레스를 사용할 때에 주의해야 하는 것이 있습니다.
워드프레스 시스템을 개발할 때 금기사항 두 가지는 바로 워드프레스 코어 수정과 PHP 날코딩입니다.

워드프레스는 코어와 테마, 플러그인으로 구성됩니다. 코어는 워드프레스 시스템 자체를 움직이게하는 근간이되는 소프트웨어입니다.
날코딩이란 사용하는 시스템의 프레임웍 규약이나 규정을 준수하지 않고 개인이 자신의 취향대로 프로그램 코딩하는 것을 이야기합니다.
그럼 이 두가지를 왜 사용하면 않되는지 알아보겠습니다.




워드프레스 코어는 금단(禁斷)의 열매


IT 프로젝트를 진행할 때에 개발 환경이 자바기반든 닷넷기반이든 아니면 워드프레스 프로젝트이든지 간에 고객의 특별한 요구사항은 있게 마련입니다.
고객의 특별한 요구사항이 개발 허용량을 벗어나거나 아니면 개발 비용과 기간에 중대한 영향을 미치는 것이라면 고객과의 적절한 협의는 반드시 필요합니다.




워드프레스로 시스템 구축 프로젝트를 진행할 때 간혹 고객의 요구사항에 대해서 분석을 해본경우 해당 기능을 구현한 적절한 플러그인을 찾지 못했다고 해서 워드프레스 코어 소스를 수정해서는 않됩니다. 

워드프레스 코어는 PHP 프로그램입니다. 아무리 PHP 프로그래밍을 잘 한다고 해서 코어를 수정해서 고객에게 제품을 납품하는 일은 워드프레스 프레임웍을 제대로 이해하지 못한 상황에서 취하는 임시변통의 방법입니다. 이런 임시변통의 방법은 조금 시간이 지난뒤에 고객의 큰 불만을 일으키는 요소가 됩니다.


워드프레스 코어는 보안이나 기능 이슈로 최신기능을 추가해서 자주 업데이트가 되고 있습니다. 코어를 수정한 시스템은 업데이트 시점에 치명적인 영향을 미칩니다. 또한 코어를 손댄다는 것은 코어와 연결된 각종 플러그인과 테마등에 영향을 줍니다. 잘 동작하던 시스템의 기능들이 마비될 수 있습니다.

워드프레스 업데이트로 웹사이트가 문제를 일으켰다고 해서 고객에게 워드프레스 절대 최신버전 업데이트 하면 않됩니다. 라는 말을 할 수 는 없습니다.

따라서 이럴 때는 코어를 수정하는 것이 아니라 고객이 요청한 내역에 대해서 신규 플러그인 개발을 해야하고 고객에게 그런 사실을 이야기하고 협의해 나가는 것이 좋은 방법이라 할 수 있습니다.



무엇보다 워드프레스 코어를 개발하거나 수정하는일은 워드프레스 개발사인 오토매틱(automattic)사에서 하는 일이지 우리가 하는 일이 아니라는 명확한 인식이 있어야 워드프레스의 금단의 열매에 손을 대지 않을 것입니다.





PHP 날코딩을 하지 말라


PHP 날코딩은 규정된 프레임웍과 상관없이 개발한 PHP 소스코드를 이야기합니다.
그런 코드는 워드프레스와 무관한 나홀로 코드가 됩니다. 워드프레스로 시스템을 개발할 때는 무엇보다 워드프레스 프레임웍 안에서 프로그래밍을 해야합니다. 예를 들어서 워드프레스 프레임웍 구조를 이해하였다면 PHP 나홀로 코딩이 아니라 커스텀 포스트 타입으로 PHP 프로그래밍을 하거나 해당기능을 하는 플러그인으로 구현해야 할 것입니다.


나홀로 PHP 코드는 워드프레스의 다른 기능들과 서로 연동되지 않기 때문에 역시 워드프레스 업데이트 시점마다 시스템을 추가적으로 유지 보수해야하는 비용이 들게 됩니다.

시스템 개발에 있어서 무엇보다 중요한 것은 고객과의 끈끈한 신뢰와 이해입니다. 그리고 고객이 전산시스템에 대한 이해도가 낮다고 해서 고객을 특정 이슈에 대해서 속이거나 감추고 개발하는 일은 결국 자신의 회사를 망하게 하는 지름길일 것입니다.



+ Recent posts