국비IT교육전문 

Facebook Twitter RSS

테마 수정

이번 장은 마지막 장으로서, 블로그뿐 아니라 웹사이트도 제작할 수 있는 워드프레스의 각종 기능을 추가합니다. 특히 그동안 워드프레스와는 별개의 프로그램으로 개발됐다가 플러그인으로 전환된 비비프레스(bbPress)를 이용해 게시판 기능을 추가하는 방법도 알아볼 것입니다. 각종 플러그인을 사용하기 위해 기본 테마를 수정하고 20개가 넘는 위젯을 사용하는 테마가 완성될 것입니다. 앞으로 진행할 내용은 다음과 같습니다.

 

트위터 부트스트랩

테마를 수정할 때 기본적인 레이아웃에 트위터 부트스트랩을 이용하기 위해 간략히 부트스트랩에 관해 알아봅니다.

콘텐츠 입력

테마를 수정하면서 디자인의 통일을 위해 글과 이미지를 같은 내용으로 하는 것이 좋으므로 글과 이미지를붙여넣고 특성 이미지를 만드는 방법을 복습하고 이미 만들어진 글을 가져오는 방법을 알아봅니다.

자식 테마(Child Theme) 폴더 만들기

테마 수정은 기본 테마를 바탕으로 자식 테마를 만들어 수정하는 방법이 일반적입니다. 자식 테마를 만들고?각종 스타일시트와 자바스크립트 파일을 링크하는 방법을 알아봅니다.

부트스트랩으로 레이아웃 만들기

부트스트랩의 레이아웃을 이용하면 반응형 디자인을 동시에 만들 수 있습니다. 테마의 기본 레이아웃을 만드는 방법을 알아봅니다.

테마 스타일시트 시작

전체 레이아웃을 완성한 다음 세부적인 테마 수정 단계입니다. 헤더부터 시작해 푸터까지 전체 파일을 수정하는 단계입니다.

전면 페이지(Front Page) 만들기

글 중심의 블로그에서 전면 페이지에 글이 나타나는 것이 아니라 글을 선택하기 위한 다양한 카테고리에 요약글과 특성 이미지, 애니메이션 배너 등 다른 글로 이동할 수 있는 관문 역할을 하는 전면 페이지를 만드는?방법을 알아봅니다.

구글 애드센스와 구글 애널리틱스 활용

블로그를 운영하면 광고를 배치하게 되는데, 구글 애드센스를 반응형 디자인에 효율적으로 배치하는 방법을 알아봅니다.

워드프레스에 외부 파일 사용하기

워드프레스는 어떤 HTML 파일이라도 템플릿 파일로 사용할 수 있습니다. 별도로 디자인된 외부 파일을 워드프레스 템플릿 파일로 사용하는 방법을 알아봅니다.

부트스트랩 메뉴바 수정

부트스트랩의 메뉴바는 기본적으로 2단의 하위 메뉴만 나타나는데, 이를 여러 단계의 하위 메뉴가 나타나도록 수정하는 방법을 알아봅니다. 또한 드롭다운 형태가 아닌 드롭업(drop-up) 형태의 하위 메뉴로 수정해서 메뉴바의 상단에 나타나게 할 수도 있습니다.

푸터 영역에 메뉴바 추가하기

메뉴는 헤더의 주 메뉴뿐 아니라 푸터에도 나타나게 할 수 있습니다. 메뉴를 등록하고 푸터에도 메뉴가 있는 푸터 메뉴바를 만들어 봅니다.

컨택트 폼의 사용과 기본 페이지 파일(page.php)의 수정

기본 페이지 템플릿을 수정하고 컨택트 폼 플러그인을 사용하는 방법을 알아봅니다.

작성일자 스타일링하기

블로그 글의 작성일자를 사각형의 박스 안에 배치하고 멋지게 디자인하는 방법을 알아봅니다.

다중 헤더와 다중 푸터 사용하기

워드프레스 테마 디자인의 자유로움은 한계가 없습니다. 각 페이지마다 다른 헤더와 푸터를 사용할 수 있어서 초기 화면과 다른 페이지에 서로 다른 헤더와 푸터를 사용하는 방법을 알아봅니다.

비비프레스(bbPress)

워드프레스의 포럼 플러그인을 이용하면 게시판 프로그램으로 포럼을 개설해서 토론할 수 있습니다. 이를?이용해 웹사이트에서 질문 답변이나 자유게시판을 만들 수도 있습니다. 게시판 페이지를 만들고 디자인을?수정하는 방법을 알아봅니다.

 

댓글 남기기

Home 워드프레스 테마 수정
© All right reserved TIS정보기술교육센터 02-2069-1930.