블로그하트링(Blog Heart Ring) 구현 방법

블로그하트링(Blog Heart Ring) 구현 방법

최근들어 블로그하트링(Blog Heart Ring)에 관심을 가져주시는 블로거분들이 많아지고, 블로그에서 구현하는 방법을 알려달라는 요청이 많아 아래와 같이 설명을 드립니다.

아래의 예는 티스토리나 태터툴즈 블로그를 중심으로 설명을 하였습니다만, 블로그 스킨에 Html을 구현할 수 있는 블로그라면 모두 가능합니다.

참고로 이 블로그하트링 점프메뉴 구현은 임프레스 매거진을 운영하고 계신 정호씨 님이 많은 도움을 주셨습니다. 정호씨께 이번 기회를 통해 다시금 감사를 드립니다.

그럼 블로그하트링(Blog Heart Ring) 점프메뉴의 구현방법을 설명하도록 하겠습니다.

1. 티스토리 계정으로 접속 후 [스킨 탭]을 클릭하면 아래와 같은 화면이 나옵니다. [스킨 탭]에서 사이드 바를 클릭 하십시요.

2. 사이드 바를 클릭하면 기본모드로 열리는데, 여기서 안전모드를 클릭하시고 기본 사이드바에 들어있는 [링크모듈]을 제거합니다. 그리고 보시는 바와같이 [배너출력::CodeBanner] 모듈을 블로그하트링이 구현될 위치에 배치합니다.

3. 배치한 코드배너출력 모듈의 편집을 누르면 다음과 같이 HTML 코드를 입력할 수 있는 창이 팝업이 되는데 이곳에 첨부한 BlogHeartRing_Code.html 파일을 에디터로 열어서 자신의 블로그하트링 링크를 대입한 다음 복사(Ctrl+C)해서 붙여넣기(Ctrl+V)를 하시고 전송을 하시면 됩니다.

4. 추가로 블로그하트링(Blog Heart Ring) 점프메뉴 모듈의 각 항목앞에 있는 이미지를 자신의 블로그 계정에 업로드 하는 방법 입니다.
다시 [스킨 탭]을 누르시면 하단에 [직접올리기]링크가 보이고 이곳을 클릭하시면 됩니다.

5. 아래와 같이 이미지 파일을 계정에 올릴 수 있는 공간이 나오면 [파일 올리기] 버튼을 클릭하셔서 첨부한 압축파일에 포함된 이미지만를 선택하고 업로드 하시면 됩니다.

이렇게 하시면 블로그 사이드바에 좌측과 같이 예쁜 블로그하트링(Blog Heart Ring) 점프메뉴가 보여지게 됩니다.

그리고, 티스토리나 태터툴즈 블로그가 아닌 경우에는 첨부한 블로그하트링(Blog Heart Ring) 점프메뉴 압축파일을 다운 받아서 에디터나 편집기로 열어서 자신만의 블로그하트링 링크를 대입하신 다음 적당한 공간에 배치를 하시면 됩니다.

앞으로 블로그하트링(Blog Heart Ring) 캠페인의 활성화를 위해서 나름대로 예쁜 디자인의 엠블렘을 구상 디자인 작업에 들어가 있으며 완성이 되는대로 선별과정을 거쳐 다양한 사이즈로 배포할 계획이니 블로그하트링(Blog Heart Ring)에 참여하시는 블로거 여러분들의 많은 관심과 호응을 부탁 드리겠습니다.

참고로 부탁을 드립니다. 블로그하트링을 적용하신 블로거 께서는 적용 후 트랙백이나 이 글에 댓글을 달아주시면 디자인로그와 뉴스페이퍼2.0 블로그의 블로그하트링에 연결해 드리고 차후에 있을 전체연결프로젝트에 기본링크로 확대할 방침입니다.^^

여러분들의 많은 관심과 격려를 부탁 드립니다. 블로그하트링의 발전을 위해서 ..^^

P.S
12/18일자 25개의 블로그하트링을 정리한 다음 업데이트 되었습니다.

기존의 30개의 하트링에서 블로그하트링 스타일을 유지하고 있는 블로그 25개의 블로그하트링만 유지하고 정상적인 게재를 하지않고 있는 기존의 블로그는 T-Blog링크로 조정하였습니다.
참고로 사이즈는 스타일 부분의 넓이를 조정하시길 바랍니다. 차후, 블로그하트링 스타일을 유지하고 참여하실 때 업데이트 해드리도록 하겠습니다. 블로그하트링에 참여하시는 분은 아래 업데이트 된 블로그하트링을 그대로 유지해 주시길  바랍니다.

invalid-file

2007/12/18일자 블로그하트링 점프메뉴소스