미분류

텍스타일 블로그 메인페이지 만들기

텍스타일 블로그 메인페이지 이쁘게 만들기..!!

 

제목이 너무 거창 한가요^^ 텍스타일 을 이용해 블로그를 만들고 보니 메인 페이지가 티스토리 처럼 자신이 원하는 형식으로 꾸미는 게 너무 힘들더라구요..

 

기능을 잘 모르니 한참을 삽질 했습니다.

 

텍스타일을 이용해 블로그를 만들면 메인 페이지는 기본적으로 가장 최근에 쓴글이 노출 됩니다.

 

하지만 메인 페이지인데 좀 다르게 꾸미는건 안될까 하고 고민을 하다 확장메뉴 라는것을 발견 했습니다.

 

그리고 텍스타일에서 확장 메뉴를 이용해 메인 페이지에 블로그 최근 글을 불러오게 했죠 ^^

 

그렇게 하고 나니 제가 보기 에는 기존에 최근 글이 노출 되는 것 보다는 좀더 깔끔한거 같더라구요. 해서 이부분을 다른 블로거 님들과 공유 하기 위해 이글을 쓰게 되었습니다.

 

1.jpg

 

위에 보이는 이미지는 마이스토리 블로그에 메이니 페이지 입니다 최근 글이 노출 되는게 보이시는 가요^^

 

그럼 지금 부터 텍스타일 블로그 메인 페이지에 최근글을 불러 오는 방법에 대해서 알아보겠습니다.

 

먼저 텍스타일을 이용해 블로그를 완성 했다는 가정 하에서 시작 하도록 하겠습니다.

 

가장 먼저 관리자 페이지에 들어 오시면 좌즉 메뉴중 설정 이란것이 보이실 겁니다. 설정에서 “확장메뉴 설정” 이란 부분 이있습니다.

2.jpg

요부분은 블로그 상단의 탭 부분을 추가 하는 부분입니다. 아래 이미지를 보시면 어디를 수정 하는 것인지 바로 아실 수 있습니다.

 

3.jpg

 

확장메뉴 설정을 클릭해서 들어가시면 아래와 같은 화면이 나오게 되는데요 현재 확장메뉴를 추가 하지 않았기 때문에 아무를 메뉴가 존재 하지 않습니다. 다만 확장메뉴를 설정 하지 않더라도 방명록은 기본적으로 추가 되어 있습니다.^^

 

4.jpg

 

추가를 클릭 해보세요 다음과 같은 화면이 나오셨나요?

 

5.jpg

요기서 추가 하고 자 하는 내용 기입 하면 되는데요.

 

모듈 : 어떤 페이지를 추가 할 것인가를 선택 하는 부분 입니다. 이부분을 설정 하기 위해서는 xe 최종 관리자 페이지에서 설정을 해주셔야 하는데요 만약 모듈 선택을 클릭 했는데 아무것도 없다 하시는 분은

xe 최종 관리자 페이지로 가셔서 상단탭 Textyle 을 클릭 해서 추가메뉴 설정을 클릭 하세요 그럼 게시판, 외부페이지, 페이지, Textyle Hub 라고 있습니다. 요기서 최대 생성 수 라는 부분에 숫자를 넣어 주세요. 저 같은 경우는 Textyle Hub 를 제외 하고 모두 숫자 1로 했습니다.

 

그리고 저장을 누르시고 다시 블로그 관리자 페이지 오셔서 확장메뉴 설정에서 모듈을 선택 하시면 원하는 부분을 선택 할 수 있습니다.

 

게시판 : 블로그에 게시판을 추가 하는 것입니다.

외부페이지 : 아직 해보지 않아서 모름

페이지 : 새로운 페이지

 

우리는 메인 페이지를 만들거니깐 요기서 “페이지” 를 선택 합니다.

 

다음은 URL 기존의 블로그 주소 뒤에 새롭게 생성 될 페이지 주소 입니다. 영문 또는 숫자로 입력 하세요 저는 main 으로 했습니다.

 

다음은 메뉴명 블로그 상단 탭에 출력될 문구 입니다. 저는 HOME 라고 했습니다.

 

이렇게 해서 저장을 누르면 다음과 같은 화면이 나오게 되는데요

 

6.jpg

위의 이미지와 같은 화면이 나왔다면 성공 하신 겁니다. 그럼 새롭게 만들어진 페이지를 확인 해볼까요 자신의 블로그로 이동 합니다.

 

7.jpg

블로그 화면에서 HOME 라는 메뉴가 생성 되었습니다. 그럼 HOME 메뉴를 클릭해서 들어가 보겠습니다.

 

8.jpg

 

페이지는 생성 되었지만 아직 아무런 내용이 들어 있는게 없기 때문이 위와 같은 화면이 나오게 됩니다.

 

제가 한참을 삽질 한 부분이 바로 요기 입니다. ㅜ.ㅜ

 

여러분은 복 받으신 겁니다 ^^

 

요기서 페이지 수정을 클릭 해보세요. 그럼 다음과 같은 화면이 나오게 됩니다.

 

 

9.jpg

 

위와 같은 화면이 나오셨다면 요기서 추가를 눌러 주세요 다만 content 위젯으로 되어 있어야 합니다.

 

10.jpg

스킨에서 버튼을 눌러 다음과 같이 스킨을 찾으시구요 바로 옆에 있는 선택을 꾹 눌러주세요 그럼 다음과 같은 화면으로 변경 됩니다.

 

12.jpg

 

그리고 설정을 하나 하나 잡아주시면 되는데요.

 

추출대상 : 게시물

대상모듈 : 추가 > 가상사이트 검색에서 블로그 주소를 입력 후 검색 클릭

 

13.jpg

 

요기서 Textyle 선택 후 검색을 클릭

 

14.jpg

 

모듈이름 과 브라우저 제목 이 제대로 나왔다면 추가를 클릭

 

 

15.jpg

대상모듈에 보시면 어디에 글을 불러온건지 선택이 되었습니다. ㅉㅉㅉ

 

다음은 내용형태 내용형태는 화면에 어떻게 보여 줄 건가 하는 건데요 요기는 “이미지+제목+내용” 으로 선택 하시면 됩니다.

 

그리고 스크롤을 내리시면

 

16.jpg

 

목록수 : 화면에 몇개의 목록을 출력 할 것인지 설정 하는 부분 저는 15개로 했습니다. ^^

 

가로 이미지수 : 이미지를 몇개를 출력 할 것인지 설정 하는 부분 저는 1개로 했습니다.

 

페이지수 : 홈페이지 게시판 목록에 보시면 하단에 네비게이션 나오는 거 아시죠 123456 머 일케요 요거랑 같은 개념인데요 요기는 3개 까지 만 되더라구요. 알아서 선택하시구요 저는 3으로 했습니다.

 

제목 글자수 : 화면에 출력될 제목의 글자수를 지정하는 곳 블로그 화면에 맞게 글자수를 지정해주세요.

 

내용 글자수 : 화면에 출력될 내용의 글자수 인데요 요기도 블로그 화면에 맞게 지정 해주세요.

 

17.jpg

 

 

다음은 화면에 표시할 내용을 지정 하는 것입니다 content 를 추가 해주세요

 

그리고 아래는 출력될 내용에 표시 할 부분을 선택 하는 건데요

 

게시판 이름표시, 댓글수표시, 엮인글수 표시, 분류표시, 아이콘 표시, nwe 표시 시간 등이 있습니다. 저는 엮인글수 표시만 출력하지 않음 했구요 new 표시시간은 12 로 했습니다.

 

18.jpg

스크롤을 아래로 내리시면 썸네일 설정 하는 부분 있습니다. 요기는 화면에 표시될 이미지의 사이즈를 지정 하는 곳인데요 저는 가로 120, 세로 100 으로 했습니다.

 

이렇게 하셨으면 코드 생성을 추가 합니다.

19.jpg

 

 

짜잔 이제 최근글을 불러온 것이 보이시나요 ㅉㅉㅉㅉㅉㅉ

그런데 화면 사이즈를 조정 하는 방법은

 

20.jpg

최근글에 마우스를 올리시면 좌측상단에 메뉴가 표기 되는 데요 화면에 표기된 부분을 클릭 하시면 다음과 같은 화면이 나옵니다.

 

21.jpg

 

팝업창이 뜨셨나요 요기서 화면 설정을 잡아 주시면 됩니다.^^ 설정을 잡아 주셨다면 저장을 누르시면 팝업 창이 사라집니다.

 

22.jpg

이제 저장을 꾹 눌러주세요..^^

 

그럼 이제 블로그 탭 메뉴에서 home 를 마이스토리 블로그 메인 페이지 처럼 되실 겁니다.

 

그런데 요기서 마이스토리 라는 블로그 제목을 클릭 하면 메인으로 가야 하는데 가장 최근에 포스팅 한 글로 가더라구요 그래서 한가지 더 수정을 했습니다.

 

블로그 관리자 페이지에서 디자인 > html.css 설정 에서 <h1><a href=”{$home_url}”>{$textyle_title}</a></h1> 요부분을 찾아주세요 그리고 {$home_url} 요녀석을 원하는 url 로 변경 합니다.

 

처음에 우리가 main 으로 확장메뉴를 만들었으니까 주소는 http://도메/main 으로 변경 하시면 되겠네요 <h1><a href=”http://도메/main“>{$textyle_title}</a></h1> 요렇게 변경 하시면 되는 거죠 ^^

 

이렇게 하시면 블로그에 제목을 클릭 했을때 최근글 포스팅 페이지가 아닌 새롭게 만든 메인 페이지로 이동 하게 됩니다.^^

 

지금 까지 텍스타일 블로그 메인 페이지 만들기 였습니다..^^

 

 

Show More

Leave a Reply

avatar
  Subscribe  
Notify of
Close