네이버 홈페이지형 블로그 기초편 05.버튼이미지 위젯 링크걸기(이전 글쓰기 버전)

네이버 블로그 홈페이지형 블로그 만들기 기초 편이 이제 거의 마무리가 되어갑니다. 저번 포스트에서는 홈페이지형 블로그를 만들기 위해서 위젯 직접 등록으로 투명 위젯 버튼을 html로 간단하게 만들어서 넣어봤습니다.

메뉴 버튼을 넣어야 하는 자리 위로 공간을 확보하여 홈페이지의 메인 배너와 같은 효과를 얻을 수 있었습니다. 네이버 블로그 홈페이지형 블로그 만들기는 총 8편으로 글을 마무리하게 될 것 같습니다.

홈페이지형블로그 기초5편 목차

1. 이동할 페이지의 링크 주소(URL)
2. 주소(URL) 복사하기
3. 이동하려는 페이지 주소(URL) 모두 복사
4. 카테고리 비공개로 추가하기
5. 구버전 이전 글쓰기로 이미지 업로드하기 I
6. 구버전 이전 글쓰기로 URL 주소 넣기 II

유튜브 영상을 보고 방문하셨다면 영상으로 놓친 부분을 이곳에서 보충하셨으면 좋겠습니다. 그럼 기초5편 버튼 이미지 위젯 링크 걸기(이전 글쓰기 버전)를 링크 거는 방법을 같이 해보고, 다음 글에서는 스마트 에디터 3.0 버전으로 버튼 이미지 링크 거는 방법을 알아보도록 하겠습니다. 영상의 캡처 화면을 사용하여 이미지의 화질이 다소 좋지 못한 점 양해 부탁드립니다. 아래 관련 글 링크는 네이버 블로그 홈페이지형 만들기 1편, 2편, 3편, 4편 바로가기입니다. 참고 부탁드립니다.

유튜브 강의

홈페이지형 네이버 블로그 만들기

01 / 02 / 03편

1. 이동할 페이지의 링크 주소(URL)

홈페이지형 블로그를 만들기 위해서는 페이지와 버튼 이미지의 웹상의 경로들이 필요합니다. 우선 이동하여는 페이지의 주소부터 정리를 해보겠습니다.

방법 1) 버튼을 눌렀을 때 이동하는 페이지에서 마우스 우버튼을 클릭하여 속성을 클릭합니다. 여기서 이동하는 페이지가 전체목록으로 (썸네일로 전체목록이 보여지는) 이동하는경우는 저와 같은 방법으로 합니다. 

하지만 만약 특정한 1개의 페이지로 이동하려는 것이라면 아래 방법을 참고해주세요.

특정한 1개의 페이지로 이동 방법 1) 스마트 에디터 3.0으로 작성한 경우 포스트의 우측(URL복사) 버튼을 클릭하면 해당 게시물의 복사가 가능합니다.

특정한 1개의 페이지로 이동방법 2) 이전 버전 에디터로 작성한 경우 우측에 게시물 주소가 표시되고 (복사) 버튼을 클릭하여 게시물을 복사할 수 있습니다.

2. 주소(URL) 복사하기

아래 화면처럼 속성에 들어가면 보이는 주소를 복사합니다. 이 주소가 버튼을 클릭 시 이동하려는 해당 페이지의 주소(URL)입니다.

*주소의 속성 값이 긴 편이므로 "http://"로 시작하는 부분부터 끝까지 확실하게 드래그 합니다.

3. 버튼1, 2, 3, 4, 5를 클릭시 이동하려는 페이지 주소(URL) 모두 복사

메모장에 페이지 주소를 붙여 넣기를 할 때는 각 링크를 구분할 수 있도록 링크명을 함께 적어주도록 합니다.

방법 1) 메모장에 버튼 1을 누르면 이동할 페이지 링크 주소 목록을 만들어서 저장합니다.

방법 2) 위와 같은 방법으로 버튼 2, 3, 4, 5도 링크 주소(URL)를 복사하여 메모장에 붙여 넣기 합니다.

위젯에 사용할 링크의 주소(URL)가 준비되면 간단한 html 코딩을 통해 링크 버튼 위젯으로 사용할 예정입니다. 그렇게 하기 위해서는 버튼 이미지의 웹상 경로가 필요합니다. 이전 포스트에서 버튼을 만들어봤습니다. 그때 만들었던 버튼 이미지를 포스팅으로 업로드하여 네이버 블로그를 주소로 갖는 이미지 경로를 얻는 방법을 알아보도록 하겠습니다.

4. 카테고리 비공개로 추가하기

메뉴 버튼 위젯용으로 사용할 이미지는 비공개 카테고리로 지정한 "게시판" 카테고리에 업로드할 예정입니다. 다른 방문자들에게는 노출이 될 필요 없는 업로드용 게시판이므로 비공개로 추가하도록 하겠습니다.

방법 1) 블로그 프로필 영역 아래 있는 관리를 클릭합니다.

방법 2) 관리 페이지 상단 3번째 탭에 있는 메뉴/글/동영상을 클릭합니다.

방법 3) 아래 화면과 같이 좌측 메뉴관리에서 블로그를 눌러주세요.

방법 4) 비공개 체크-확인

방법 5) 카테고리를 비공개로 추가 완료했다면 하단에 확인 버튼을 클릭해야 합니다. 그래야 블로그에 적용이 됩니다.

방법 6) 위 화면처럼 성공적으로 반영되었다는 메시지가 나오면 확인을 눌러주면 카테고리 추가는 완료됩니다.

방법 7) 블로그 메인화면으로 돌아오면 카테고리에 비공개로 게시판이 추가되어 있는 걸 확인할 수 있습니다.

5. 구버전 이전 글쓰기로 이미지 업로드하기 I 

블로그 글쓰기의 경우 스마트 에디터 3.0 오픈으로 아래 화면같이 이전 버전으로 쓰기가 에디터 상단에서 없어졌습니다. 하지만 블로그 설정에서 이전 버전으로 쓰기가 가능합니다. 방법은 아래와 같습니다.

방법 1) 관리-기본 설정-기본 에디터 설정에서 스마트 에디터 2.0으로 체크 후 확인을 눌러주면 됩니다.

방법 2) 이전 버전 글쓰기로 설정이 되었다면, 비공개로 만들었던 카테고리 "게시판"으로 설정하고 글쓰기를 합니다.

방법 3) 버튼 1로 구별하기 쉬운 제목으로 작성했습니다.

방법 4) 에디터 상단에 글쓰기 도구에 있는 사진을 클릭합니다.

방법 5) 만들어 놓은 메뉴 버튼 이미지 1개(버튼 1.png)를 선택 후 열기를 클릭합니다.

6. 구버전 이전 글쓰기로  URL 주소 넣기 II

방법 1) 메뉴 버튼을 불러왔다면 에디터 창에서 계속 작업을 진행합니다. 불러온 이미지를 드래그 클릭하여 이미지의 영역을 선택합니다.

방법 2) 메뉴 버튼 이미지를 선택한 상태에서 에디터 상단 글쓰기 도구에서 url버튼을 클릭합니다.

방법 3) URL 주소 입력란이 나오면 이 버튼을 누르면 이동하려는 페이지의 주소(URL)를 붙여 넣기 해주면 됩니다. (메모장에 복사해놓은 주소를 입력하면 됩니다.)

방법 4) 주소(URL) 붙여 넣기 한 후, 적용 버튼을 클릭합니다.

버튼 이미지를 업로드하고 링크 주소(URL)까지 입력했습니다. 다음 단계는 아래와 같습니다.

방법 5) 에디터 도구 하단에 HTML탭을 클릭합니다.

방법 6) 탭을 클릭하면 HTML 코드가 보입니다. 코드를 모두 복사합니다.

방법 7) 메모장에 HTML 코딩 소스를 구별할 수 있게 이름을 넣어서 구별하고 아래 화면처럼 붙여 넣기 합니다.

이렇게 구버전 이전 글쓰기로 버튼의 이미지를 업로드하고, 이동할 페이지의 주소(url)를 버튼에 삽입하면 어렵게 코딩할 필요 없이 html 소스를 긁어 올 수 있습니다. 다음 포스트에서는 버튼 이미지 위젯 링크걸기 (스마트 에디터 3.0 버전)으로 찾아뵙겠습니다. 도움이 되셨다면 공감 버튼 부탁드립니다.