XE로 홈페이지 제작하기_초보를 위한 레이아웃 설치 및 적용하는 팁_simplestrap layout

안녕하세요! 우기블로그입니다.

 

오늘은 XE로 홈페이지를 만드는 방법에 대해서 간단하게 알아보겠습니다. XE는 복잡한 코딩작업이나 이미지 작업 없이도 멋진 홈페이지를 만들 수 있는데요. 이런 장점을 가지고 있어서 쉽고 빠르게 한개의 사이트를 구성할 수 있습니다.

 

 

 

 

 

 

 

 

 

지난 번에도 몇 개의 레이아웃을 소개해 드렸는데요. 레이아웃은 홈페이지의 기본적인 틀을 말하는데, 여러 제작자들이 레이아웃을 만들어 둔 폼을 그대로 가져다가 내 홈페이지에 적용 시킬 수 있는 옷이라고 보시면 됩니다. 어떤 옷을 입느냐에 따라 모습이 달라지지요.

 

 

오늘 제가 소개 드릴 홈페이지는 심플스트랩(simplestrap)입니다. 제가 몇개의 xe 레이아웃을 사용해 본 결과 가장 심플하면서도 있어야 할 기능들이 잘 조화되어 나온 레이아웃이었는데요. 이것을 이용해서 간단하게 홈페이지 사이트를 만들어 볼 수 있습니다. (제가 만든 홈페이지는 http://bsmilal.cafe24.com/ 입니다.)

 

 

 

우선, 지금 제 글을 보고 계신 분들은 대부분 XE를 웹호스팅을 통해서 설치한 분이라는 가정하에 이야기를 진행하도록 하겠습니다. 일단 관리자에 접속합니다. 관리자 접속은 주소 표시줄에서 자기 홈페이지주소.com/admin을 통해서 들어가실 수 있죠?

 

 

 

관리페이지에 들어가셨다면 좌측에 대시보드가 보일 것입니다. 먼저 메뉴들 중에서 쉬운 설치로 들어갑니다. 쉬운설치로 들어가서 레이아웃을 내 계정에 설치해 주면 됩니다.

 

 

 

 

아래 그림 처럼 쉬운 설치에 들어간 후 스킨에서 레이아웃을 선택해 줍니다. 레이아웃이 239가지 종류가 있네요. 239가지 옷이 옷장에 들어 있다고 상상해 보세요. ^^

 

 

 

 

 

 

많은 레이아웃들이 있는데 여기서 하나를 선택해서 설치를 해주시면 됩니다. 저는 심플스트랩을 선택해서 설치를 눌러줬습니다. 아래 보이는 화면에서 설치라는 아이콘을 클릭하면 바로 자신의 계정에 레이아웃이 설치됩니다.

 

 

 

 

 

 

 

 

심플스트랩에 대한 간소한 설명은 아래와 같은데요. 아래에 보시면 몇가지 같이 설치해야 하는 모듈이 있습니다. 쉬운설치 화면으로 가셔서 아래에 있는 커뮤니케이션 모듈, 회원모듈, 사이드바 최신 글 위젯 스킨을 검색해서 다운받아 주셔야 합니다.

 

 

 

 

 

 

 

 

모든 설치가 완료되었다면 내 홈페이지에 옷을 입혀 보겠습니다. 대시보드에서 사이트 디자인 설정에 들어갑니다. 그리고 아래 보이는 화면처럼 레이아웃을 선택해 주시고, SimpleStrap을 선택하시고(동그라미 안에 점이 찍혀있죠?) PC 설정 저장을 눌러줍니다.

 

 

 

 

 

 

자, 이제 절반은 했네요. 다음으로 메뉴를 설정해 줍니다. 제 경우에는 대시보드에서 사이트 메뉴편집에 들어가셔서 메인메뉴를 누르고 메뉴추가를 누른 후 게시판 위주로 모든 메뉴들을 만들어 주었습니다. 사이트메뉴 편집에서 메뉴의 위치는 마우스로 콕 집어서 원하는 곳에 당기고 놓으면 옮겨지니까 잘 설정하시면 됩니다.

 

 

 

 

다음으로 대시보드에서 맨 아래 고급에 보시면 설치된 레이아웃이 있는데 거기에 들어가 줍니다. 아래 화면 처럼 심플 스트랩 레이아웃을 찾을 수 있습니다. 제목을 클릭해 주세요.

 

 

 

 

 

 

이제 아래 화면처럼 설정과 편집이라는 메뉴가 보이실 것입니다. 설정에 들어가 줍니다. 이제 옷에다가 단추를 달거나, 실밥을 뜯거나, 옷의 맵시를 내는 과정이라 생각하시면 됩니다. 어렵지 않고 간단하니 잘 따라해 보시면 됩니다.

 

 

 

 

 

설정에 들어가시면 아래와 같은 화면이 나오는데, 제목은 자신이 원하는 것을 변경해 주세요.

 

 

 

 

위에 보시면 사용자 정의 부분에 보시면 홈페이지 이름과 주소를 적는 곳이 있는데 이곳에도 입력을 해주시면 됩니다.

 

 

아래에 보시면 디자인 메뉴에서 컬러셋을 통해서 홈페이지의 색깔을 변경시켜줄 수 있습니다. 자신이 원하는 색상을 선택하시고, 저장을 눌러, 홈페이지에 가보시면 어떻게 색상이 적용되어 있는지 보실 수 있습니다.  

 

 

 

 

 

또한 사용자 정의 형태에 보시면 사이드바와 컨텐츠 부분을 선택할 수 있습니다. 컨텐츠만 나오게 하던지, 아니면 왼쪽에 사이드바가 나오거나, 아니면 오른쪽에 사이드바가 나오도록 설정해 줄 수 있습니다.

 

 

 

 

 

 

상단바 부분에서 또한 옵션들이 있는데 원하시는 곳을 고쳐주시면 됩니다.

 

 

 

 

 

사용자 정의 사이드바를 고칠 수 있는 화면입니다. 여기에서 컨텐츠의 사이즈를 조금 더 늘릴 수 있는 옵션이 있습니다. 사이드바 너비를 선택해 보세요. 또한 메뉴와 최신글, 최신댓글이 사이드바에 출력할 수 있게 하고, 숫자까지도 지정할 수 있습니다. 또 애드센스를 달거나 다른 위젯 역시 설치 할 수 있습니다. 저도 사용자지정위젯 부분에 애드센스 코드를 가져와서 붙여넣기 했습니다.

 

 

 

 

 

점보트론 역시 없애거나 계속 있게 만들 수 있습니다. 점보트론은 이 레이아웃만의 특징인데 커다란 제목이 나오는 박스라고 생각하시면 되겠습니다. 거기에 몇개의 바로가기 아이콘이 있어서 편리하게 이용할 수 있도록 만들 것입니다.

 

 

 

 

 

푸터 설정 역시 해줄 수 있습니다. 푸터 하단에는 방문자수를 볼 수 있는 위젯을 붙여넣기 해주었습니다.

 

 

 

 

 

 

 

 

 

이렇게 여러가지 옵션을 선택하고 저장을 눌러주면 멋진 홈페이지가 나오게 됩니다. 위젯이나 기타 다른 것들에 대한 약간의 설명이 더 필요하겠지만 제 목적은 레이아웃을 적용시키는 간단한 과정을 보여드리는 것이기 때문에 여기서 그만 줄이도록 하겠습니다.

 

 

그럼 즐거운 XE 이용 되시고요. 저는 이만 물러가겠습니다. 좋은 하루되세요!