작성일자
카테고리 워드프레스/워드프레스 완벽입문 워밍업

오늘부터 워드프레스 무료 테마를 사용해서 모바일 홈페이지를 만드는 전과정을 진행하겠습니다. 이 과정의 목적은 워드프레스로 하나의 홈페이지를 만드는 전 과정을 파악하므로서 워드프레스로 홈페이지를 만드는 것이 쉽다는 것을 알려드리는데 있습니다. 또한 무료 테마를 사용할 것이며 모든 소스는 무료입니다. 하루에 하나씩 글이 올라올 것이며 끝날 때까지는 몇개의 글이 올라올지는 모르겠으나 1일 1포스팅 원칙을 지킨다면 약 3주면 완성될 것 같습니다.


제가 만든 워드프레스 완벽입문 책은 상세하게 설명하느라고 설명도 많고 사진도 많아서 부담이 갈겁니다. 책 후반에는 무슨 컴퓨터 프로그램 만드는 책인지 착각을 일으킬 정도로 코드도 엄청 많습니다. 책의 기획 의도는 웹디자인 초보를 위한 것이라서 테마 만들기가 중점적으로 다뤄졌죠. 그래서 이번 워밍업 과정에서는 누구라도 따라할 수 있을 정도로 설명도 가능한한 짧게 하는 대신 이미지를 많이 넣어서 이해하기 쉽도록 하겠습니다. 대상 사이트는 제가 만든 책의 홈페이지입니다. 새로 만들기에는 시간이 걸리고 하니 이 홈페이지를 완성할 때까지의 과정만을 담을 것입니다. 이러한 과정을 그냥 따라하는 식으로 한번이라도 거치면 책을 읽는데 도움이 될 것이며 책을 안보시는 분들도 워드프레스를 익히는데 도움이 되리라 생각합니다. 또한 완료가 되면 출판사에서 전자책(pdf나 epub)으로 만들어 무료로 공개한다고 하니 굳이 블로그에 접속하지 않아도 되겠습니다. 


그럼 시작하겠습니다. 


1. WAMP 서버 설치하기


WAMP 서버가 처음 사용자에게는 오류가 발생할 수도 있으니 이글(http://martian36.tistory.com/1256)을 참고해서 오토셋을 설치하고 사용하세요.


워드프레스는 웹서버 환경이 있어야 작동이 가능합니다. 내 컴퓨터에 웹서버 환경을 만들어주는 프로그램이 여러가지 있는데 OS에 따라서 다릅니다. 윈도우 OS를 많이 사용하므로 윈도우용 웹서버 환경을 만들어주는 WAMP를 설치하겠습니다.


http://www.wampserver.com/en/


위의 링크를 클릭하면 WAMP 서버 프로그램을 내려받을 수 있는 사이트로 이동합니다.



페이지 상단에서 DOWNLOAD 메뉴를 클릭하면 여러가지 버전의 프로그램을 받을 수 있는 화면으로 이동합니다. 64비트와 32비트용이 있고 PHP 버전 아파치 버전에 따라서 다르지만 32비트나 64비트 컴퓨터에서 작동이 가능한 32비트용 프로그램으로 클릭합니다.



팝업 창에서 you can download directly링크를 클릭하면 소스포지(Sourceforge) 사이트로 이동하고 5초가 지나면 내려받을 수 있습니다.



내려받은 프로그램을 실행하면 여러가지 설치과정이 진행됩니다. 체크할 곳에 체크하고 무조건 next만 클릭하면 됩니다. 



위 과정도 마찬가지입니다. 마지막 단계에서 Launch Wampserver 2 now에 체크하고 Finish 버튼을 클릭하면 WAMP서버가 실행됩니다.


2. 데이터베이스 만들기



시스템 트레이 아이콘을 클릭하면 아이콘이 녹색으로 돼있어야 정상입니다. 아닌 경우 이곳을 클릭해서 해결합니다. 시스템트레이 아이콘을 클릭하고 WAMP 서버아이콘-phpMyAdmin을 차례대로 클릭하면 아래와 같은 화면이 웹브라우저에 나타납니다.



데이터베이스 탭을 클릭하고 입력란에 wordpress라고 입력한 다음 우측에서 Create 버튼을 클릭합니다. 데이터베이스 비밀번호도 설정하여야하지만 내컴퓨터의 서버환경에서는 비밀번호를 설정하지 않아도 되므로 그대로 진행합니다. 비밀번호 설정 방법은 이곳을 참고하세요.


3. 워드프레스 설치하기


워드프레스 프로그램을 내려받아야하는데 일부 글자가 영어로 나타납니다. 또한 워드프레스 기본테마가 Twenty Twelve(2012)로 업그레이드됐지만 현재 최신판을 받으면 이 테마가 포함돼있지 않아서 언어파일 수정한 것과 기본테마를 포함시켜 다시 압축파일을 만들었습니다. 그리고 환경설정 파일인 wp-config-sample.php를 한글로 번역해서 삽입했습니다. 워드프레스 한글 공식 사이트에서 받으려면 이곳을 클릭하면 됩니다.


wordpress-3.4.2-ko_KR.zip

 

워드프레스 한글 파일을 내려받아서 압축을 풀고 폴더로 들어가면 wordpress 폴더가 있습니다. 이 폴더를 선택하고 Ctrl+C키를 누르면 복사가 됩니다. 설치는 WAMP 서버의 www 폴더에 해야하므로 아래의 경로로 이동해서 Ctrl+V키를 눌러 붙여넣습니다.


C:\wamp\www



wordpress 폴더를 더블클릭해서 들어갑니다.



wp-config-sample.php 파일을 오른쪽 마우스 클릭하고 컨텍스트 메뉴에서 편집을 선택하면 메모장에 파일의 내용이 열립니다.



데이터베이스 이름에는 이전에 만든 데이터베이스 이름(wordpress)을 입력합니다. 사용자명은 WAMP 서버의 데이터베이스는 기본적으로 사용자 이름이 root로 돼 있으니 root를 입력합니다. 비밀번호는 설정이 안돼있으니 비밀번호라는 글자를 제거하고 Ctrl+S키를 눌러 저장합니다.



편집한 파일을 오른쪽 마우스 버튼을 클릭하고 메뉴에서 이름 바꾸기를 선택한 다음 -sample을 지우고 엔터키를 누릅니다.



웹브라우저의 주소창에 localhost/wordpress를 입력하고 엔터키를 치면 위와같은 화면이 나타납니다. 사이트제목과 사용자명을 입력합니다. 사용자명은 사이트의 운영자 아이디이고 데이터베이스 사용자명인 root와 다릅니다. 같은 비밀번호를 두번 입력하고 이메일 주소를 입력, 프라이버시에 체크하고  워드프레스 설치하기 버튼을 클릭합니다.



설치가 완료됐습니다. 로그인 버튼을 클릭합니다.




화면에서 위에서 입력한 아이디와 비밀번호를 입력합니다.



워드프레스 첫화면이 나타납니다.


다음글은 사이트에서 사용할 테마를 설치하고 테마의 사용법을 알아보겠습니다. 이 테마는 유료테마였는지 상당히 고급스럽습니다. 애니메이션 배너도 있고 모바일용 테마라서 화면 크기에 따라서 변화된 사이트가 나옵니다. 


저작자 표시 비영리 변경 금지
신고
tg21

관리자의 승인을 기다리고 있는 댓글입니다

비밀댓글입니다

BlogIcon 베누시안

http://martian36.tistory.com/755#tip1 <--이곳을 참고하세요. WAMP 서버가 가동이 안되는 이유중에 하나가 포트를 다른 프로그램이 사용하고 있어서 그렇습니다.

박준영

위와 같이 wamp설치를 했는데요. phpmyadmin 을 클릭하면 http 403 에러 화면 이 나오는데요.. 어떻게 해결 해야 되는 건가요.. 책보구 만들어 볼려는데.. 처음 부터 막히네요. ㅠㅠ

BlogIcon 베누시안

컴퓨터에 따라서 방화벽 때문에 그런 경우가 발생하는데요. 다음처럼 해보세요.
wamp 아이콘->Apache->httpd.conf를 클릭하면 메모장에 파일 내용이 나타납니다. 스크롤해서 내려가서 다음을 찾아서 Deny를 Allow로 바꿔주서 저장한 다음 wamp 아이콘-Restart All Services를 클릭 해서 재가동하세요.

<Directory />
Options FollowSymLinks
AllowOverride None
Order deny,allow
Deny from all
</Directory>

그래도 안되면 c:/wamp/apps/phpmyadmin3.4.5/로 가서 phpmyadmin.conf를 메모장이나 편집기에 열고 다음을 찾아서 마찬가지로 Allow로 바꾸세요.

<Directory "c:/wamp/apps/phpmyadmin3.4.5/">
Options Indexes FollowSymLinks MultiViews
AllowOverride all
Order Deny,Allow
Deny from all
</Directory>


박준영

번그럽게 해서 죄송합니다.

c:wamp/apps/phpmyadmin3.5.1로 갔는데요. 말씀하신 phpmyadmin.conf 파일을 못찾겠네요.. 컴퓨터 파일 찾기에도 안나오구요.. ㅠㅠ

BlogIcon 베누시안

저도 경험해보지 못한 것이라 구글 검색으로만 알려드린 것인데 경로가 다르네요. C:/wamp/alias에 있습니다.

박준영

감사합니다. 꾸벅 해결 됐습니다.

BlogIcon 베누시안

해결됐다니 다행입니다.

박혜인

녹색으로 정상 설치됐구요~ wordpress 폴더 create 했는데.. 경로를 따라가니까 www 폴더안에 없고
C:\wamp\bin\mysql\mysql5.5.24\data 요기 아래 경로에 wordpress 폴더가 생겨있어요..

어떻게 해야하는지 알려주세요 ㅠ_ㅠ

BlogIcon 베누시안

안녕하세요. 해당 폴더는 데이터베이스가 저장되는 곳입니다. 왜 그곳으로 들어갔는지는 모르겠지만 전혀 들어갈 이유가 없습니다. 위 내용을 보고 천천히 따라하세요. 아래 글도 참고하세요.

http://martian36.tistory.com/755

tsif

제가 현재 워드프레스로 홈페이지를 제작하고 있습니다. 도메인도 구매하였고 서버호스팅도 했는데 설치과정에서 계속 오류거 생기는 데 어떡해 해야 하나요?? filezilla ftp를 사용하고 있고 "죄송합니다. 링키가 깨진것 같습니다"라고 뜹니다ㅜㅜ

BlogIcon 베누시안

현재의 정보만으로는 뭐라고 말씀드리기 어렵습니다. 제가 해드리고 싶지만 시간이 없네요.

tsif

서버호스팅으로 워드프레스를 설치하는 것과 이방법의 차이는 무엇인가요??

BlogIcon 베누시안

내컴퓨터에 설치해서 실험하거나 디자인을 완료해서 한번에 웹사이트에 올리기 위해서입니다. 웹사이트는 속도가 느리죠.

kensiro

먼저, 좋은 정보 상세히 안내해주셔서 너무 고맙습니다.

지금 말씀하신 서버 설치를 한뒤 phpMyAdmin을 클릭하면 "Internet Explorer에서 웹 페이지를 표시할 수 없습니다."라는 문구가 나옵니다.

그리고, 알려주신 수정 내용을 적용해도 동일한데요. 어떻게 이 방법을 해결 할 수 있을까요?

BlogIcon 베누시안

http://martian36.tistory.com/755

위 글을 참고해보세요.

kensiro

제가 문의 드린 오류가 혹시 초기 설치시, 알약에 의해 호스트 변경을 차단했습니다라는 메세지가 나온거랑 관련이 있을까요?

kensiro

아래와 같이 수정하니 잘 되네요. ^^

Listen 80 이라고 적힌 부분을 찾아 Listen 0.0.0.0:80 으로 고친다
C:\Windows\System32\drivers\etc 로 가서
# ::1 localhost

127.0.0.1 localhost

BlogIcon 베누시안

컴퓨터마다 설정이 모두 달라서 수정하는 방법도 다르군요.

비밀댓글입니다

BlogIcon 베누시안

51 페이지에 wp-config-sample.php 파일을 열어서 설정하는 부분이 있습니다. wp-config.php 파일만 만들고 웹페이지에서 주소입력한 다음 엔터키를 치세요.

julia

좋은 정보로 차근히 따라하고 있습니다. 궁금한게 있는데요. 한글판을 다운받아서 설치후 테마설치하였는데 홈페이지를 영어로 꾸미고 싶다면 어떻게 해야하나요. 관리모드는 한글 그리고 사이트는 영문으로요. 설치한걸 다 지우고 영어버전을 다시 받아야 할까요?

BlogIcon 베누시안

wp-content/languages 폴더에서 ko_KR.mo 파일을 다른 이름으로 변경하면 사이트는 한글로 나오지 않습니다.

비밀댓글입니다

BlogIcon 베누시안

http://martian36.tistory.com/1256

위 글을 참고하세요. 내 컴퓨터에서 서버 환경을 만들 수 있습니다.

김소연

좋은 자료 감사합니다!!
죄송한데.. 혹시 맥킨토시는 컴퓨터에 웹서버 환경을 어떻게 만들어야 하나요? ^^;

BlogIcon 베누시안

아래 링크를 참고하세요.
http://martian36.tistory.com/1257

김케빈

정말 상세하게 나와있네요 !! 좋은 자료 감사합니다 !

그런데 윗부분에서 deny을 allow 로 바꾸고
allies 쪽 들어가서 allow 로 바뀌니 403오류 해결되더라구요 !
-sample 지우고 나서 주소에 localhost/wordpress/ 입력하니

다시 403오류가 떠서 어떻게 해야할지 몰라서 이렇게 글남겨요ㅜㅜ




BlogIcon 베누시안

WAMP를 제거하고 아래 글에서 오토셋을 사용하세요.

http://martian36.tistory.com/1256

신권주

안녕하세요~ 책을사서 베누시안 님 블로그와 함께 차근차근 공부해보려 하는 회사원 입니다.
워드프레스 완벽입문 이라는 책과 DIY 워드프레스 두 책은 같은 책인데 DIY 워드프레스가 개정판인건가요?
기본지식이 전무한 초보수준 이라서 베누시안님 블로그도 보면서 책도 같이 공부하려는데 어느 책을 선택해야 할지 조언 부탁드리겠습니다. 4권중에 어느 것 부터 순서대로 공부해야 하는지요?
나중에는 쇼핑몰도 구축하고 싶습니다.

BlogIcon 베누시안

안녕하세요. 네 DIY가 완벽입문의 개정판 중 1권이고 2권은 5월 중 나올 예정입니다. DIY부터 보시면 되고 중복되는 부분이 있으니 완벽입문은 안보셔도 됩니다. 감사합니다.

비밀댓글입니다

BlogIcon 베누시안

위 내용대로 하면 localhost/wordpress에서 열려야 하는데요. 차근차근 해보세요.

비밀댓글입니다

티스토리 툴바