태터데스크 관리자

도움말
닫기
적용하기   첫페이지 만들기

태터데스크 메시지

저장하였습니다.

티스토리 블로그에 배너 광고 만들기

728x90

요즘 저희 지역의 시민단체들 중에 홈페이지를 없애고 블로그를 만드는 단체들이 늘어나고 있습니다. 외부업체에 웹호스팅을 맡겨놓은 홈페이지를 관리하는 것도 어렵고, 크고 작은 수정작업을 할 때마다 번거롭게 관리업체의 도움을 받아야 하기 때문입니다.

아울러 홈페이지를 유지하는데도 시민단체 입장에서는 적지 않은 비용이 들어가 것도 중요한 이유입니다. 최근 티스토리 블로그의 <메뉴 설정> 기능을 활용하면 홈페이지 못지 않게 화려한(?) 첫 화면을 구성할 수 있습니다. 

아울러 뉴스 기능을 활용하는 것은 기존 홈페이지 보다 훨씬 뛰어나고 원래 홈페이지에 사용하던 독립도메인을 그대로 사용할 수 있을 뿐만 아니라 사진이나 문서화일을 정리하여 보관하는 것도 그다지 불편하지 않습니다.

티스토리 블로그로 홈페이지 대신할 때, 배너 광고 만드는 법

블로그로 홈페이지를 만들면서 배너광고 다는 법을 쉽게 할 수 있는 방법을 알려달라는 부탁을 받아 오늘은 블로그에 베너광고 다는법을 알려드립니다. 시민단체 블로그는 이런 저런 이슈가 발생할 때마다 베너광고를 통해 회원들이나 시민들에게 홍보를 하기도 하고, 어떤 때는 온라인 서명운동을 받는다던지 하는 적극적인 활동을 할 때가 있습니다.


잘 아시는 분들은 이미 아시겠지만, 티스토리 블로그에는 배너광고를 쉽게 할 수 있도록 되어 있습니다. 잘 아시는 분들은 읽으실 필요가 없구요. 자 그럼 지금부터 티스토리 블로그에 배너광고 만드는 법을 알려드립니다.




현재 제 블로그에는 '활동가, 시민교육을 디자인하다'라는 배너 광고가 달려있습니다. 민주화운동 기념사업회에서 진행하는 시민교육활동가 아카데미 교육과정을 홍보하는 광고입니다. 이건 돈을 받고 하는 광고는 아니구요. 일종의 공익광고 차원에서 제가 임의로 홍보를 해주고 있습니다.


그럼, 이런 공익광고를 만드는 법을 지금부터 알려드리겠습니다. 위의 사진을 보시면 '마산YMCA' 홈페이지로 연결되는 배너광고가 있습니다. 지금부터 저 배너광고를 티스토리에 만드는 법을 안내합니다.


먼저 티스토리에서 배너를 만들려고 하면 관리자 메뉴에서 '배너출력'이라는 플러그인을 활성화시켜야 합니다. 관리자메뉴 - 플러그인으로 들어가셔서 '배너출력'이라는 플러그인을 더블 클릭 하시면 위 사진과 같은 화면이 열립니다. 그럼 사용을 클릭하시고 저장하시면 배너기능을 사용할 수 있게 됩니다.

이미지 배너출력 만들기


'배너출력' 플러그인을 활성화시킨 후에 관리자 모드에서 스킨 - 사이드바 설정으로 들어가시면 <이미지 배너출력> <HTML 배너출력>이라는 메뉴가 새로 만들어진 것을 확인하실 수 있습니다.

오른쪽에 보이는 <민주화운동기념사헙회>라고 되어 있는 것은 제가 이미 만들어 놓은 배너 광고입니다. 우선 상대적으로 좀 더 쉬운 이미지 배너광고를 만들어 보겠습니다.

배너광고를 만들려면 왼쪽의 <이미지 배너출력>이라는 메뉴 위에 마우스를 올려놓고 드래그하여 오른쪽으로 옮겨오면 <이미지 배너출력 [편집]>이라는 메뉴가 만들어집니다.


편집을 누르면 위의 사진과 같은 팝업창이 하나 더 열립니다. 여기에 이름과 이미지 URL, 연결할URL을 알맞게 입력해주시면 됩니다.

이름 : 자신이 구분할 수 있도록 적당한 명침을 적어줍니다. 여기서는 일단 TEST라고 정했습니다.
이미지 URL : 사용하고자 하는 이미지가 인터넷상의 어떤 곳에 올라가 있어야 합니다. 흔히 서버가 있으면 서버에 이미지 파일을 올려놓으면 됩니다. 서버가 없는 경우에는 공짜로 사용할 수 있는 웹하드들이 있는데, 여기서는 유크라우드<Ucloud> 사용하는 것으로 설명하겠습니다. 아이폰에 가입하면 KT에서 공짜로 서비스를 해주는 인터넷상의 저장공간입니다.
연결할 URL : 연결할 URL은 이미지 파일을 클릭하였을 때 열리도록 하고 싶은 웹사이트 주소입니다. 여기서는 마산 YMCA 홈페이지가 열리도록 연결해보겠습니다.



지금 사용하려고 하는 이미지 파일은 바로 위에 있는 마산YMCA 배너 이미지 파일입니다. 원래 만들어져 있는 마산YMCA 홈페이지의 일부를 캡처하여 '포토스케이프'를 활용하여 편집하였습니다. 포토스케이프를 사용하면 어렵지 않게 이 정도 이미지 파일은 만들 수 있을 것입니다.

4대강 반대운동 등 시민단체가 이슈를 홍보하는 배너광고들의 경우는 홍보를 시작하는 단체에서 이미지 파일을 만들어 배포하는 경우가 많기 때문에 그런 경우에는 만들어진 이미지 파일을 그냥 활용하면 됩니다.

여기까지 따라해보시면 어려울 것이 하나도 없습니다. 다만, 배너광고를 만들어 달아보지 않은 분들에게는 [이미지 URL] 주소를 받아오는 것이 조금 어려운 일일수도 있습니다. 저도 전에는 저희 단체 홈페이지를 호스팅 해주는 회사 서버에 알ftp 프로그램을 이용해서 그림파일을 올리고 <이미지URL> 주소를 만드는  복잡한 작업을 하였답니다.

오늘은 공짜로 쓸 수 있는 웹 저장 공간인 <Ucloud>를 활용하여 쉽게 해보겠습니다. 우선, '다음' 검색창에서 <Ucloud>를 검색하여 해당 서비스 웹사이트로 가서 윈도우용 프로그램을 다운 받아 컴퓨터에 설치합니다. (아이폰이 있으면 아이폰 '어플'도 다운 받아서 설치하시면 아이폰에서 찍은 사진을 웹상에 간편하게 저장할 수 있습니다.)


위 화면에서 보시는 것 처럼 <마산YMCA> 배너 광고의 이미지 파일 이름은 msymca.jpg 입니다. <Ucloud>프로그램을 설치하신 후에 <모파일 포토>라는 폴더 안에 msymca.jpg라는 파일을 바탕화면에서 드래그하여 집어넣으시면 됩니다.

그러면, 컴퓨터 바탕화면에 있던 msymca.jpg라는 배너광고 그림 파일이 <Ucloud>의 <모바일 포토>라는 웹 상의 저장 공간으로 복사가 됩니다. 이제 <Ucloud>의 <모바일 포토>라는 폴더 안에 있는 msymca.jpg 파일을 찾아서 <파일링크만들기>를 클릭하면, 위의 4번째 사진의 팝업창에 <이미지URL>에 붙여 넣을 수 있는 주소가 복사됩니다. 복사된 이미지 URL 주소를 4번째 사진처럼 붙여넣기를 하시기만 하면됩니다.


그럼 최종적으로 위의 사진과 같은 배너광고가 만들어집니다.

이번에는 보너스로 HTML 배너광고 만드는 '편법'(?)을 하나 추가로 알려드리겠습니다. 대체로 연대활동이나 전국적인 시민운동 캠페인의 경우에는 MTML 코드를 만들어서 E-MAIL로 보내주고 홈페이나 블로그에 붙여넣을 수 있도록 만들어줍니다.

HTML 배너출력

그럼, 우리단체가 HTML 배너광고를 만들어서 다른 단체의 홈페이지나 블로그를 통해 홍보하고 싶을 때는 어떻게 하면 좋을까요? 제가 직접해보니 티스토리에서는 어렵지 않게 HTML 배너광고를 만들 수 있었습니다.

먼저 위 사진에서 보시는 것처럼 <이미지 배너광고>를 마우스로 드래그한 후에 '음영'이 생기면 오른쪽 마우스를 눌러 복사하기(Ctrl+C)를 합니다.


저의 경우는 이렇게 복사한 이미지 파일을 <아웃룩 익스프레스>에 붙여넣어스 HTML 코드를 만듭니다. <아웃룩 익스프레스>는 윈도우 XP가 설치된 컴퓨터에는 기본으로 다 깔려있는 메일 프로그램입니다. 시작 - 프로그램-아웃룩 익스프레스를 차례대로 클릭하시면 위의 사진과 같은 창이 열립니다.

여기서 새메일을 클릭하시면 메일을 작성하는 새로운 창이 열립니다. 이 곳에 복사한 그림파일을 붙여넣으면 위의 사진처럼 그림파일이 만들어집니다.


<아웃룩 익스프레스>에서 HTML 코드를 확인하려면 <원본 편집>메뉴를 활성화시켜야 하는데, 메뉴에서 보기 - 원본편집을 차례로 클릭하시면 됩니다. 그러면, 화면 맨 아래쪽에 [편집], [원본], [미리보기]라는 메뉴가 활성화됩니다. 

편집을 클릭하시면 아까 붙여 넣은 그림 파일이 나오구요. 원본을 클릭하시면 HTML 코드 파일이 보입니다. 이곳에서 HTML 코드를 복사하시면 되는데요. 제가 복사해서 붙여넣어보니 HEAD 아랫 부분의 내용만 복사해 넣어도 <HTML 배너광고>가 완벽하게 만들어지더군요.(참고로 저는 HTML 코드를 다룰줄 모릅니다. 그래서 이런 편법을 사용하는 거지요.)


자 이제 다시 티스토리로 가보겠습니다. 이번에는 왼쪽 맨 아래에 있는 <HTML 배너출력>을 드래그 하여 오른쪽으로 옮기겠습니다. 그리고 제목은 [TEST2]라고 하겠습니다.  여기서 [편집]을 클릭하면 아래와 같은 팝업창이 열립니다.


이 팝업창에 <아웃룩 익스프레스>에서 복사해 온 HTML 코드를 붙여넣습니다. 그리고 확인을 클릭하면 <HTML 배너출력>이 완성됩니다.

저장하기를 누르시거나 '미리보기'를 해보시면 아래 사진처럼 <마산YMCA> 홈페이지로 연결되는 2개의 배너광고가 만들어진 것을 확인하실 수 있습니다.

하나는 먼저 만들었던 <이미지 배너출력>으로 만든 광고이고, 다른 하나는 나중에 만든 <HTML 배너출력>으로 만든 광고입니다.



생각보다 어렵지 않지요? 인터넷을 잘 활용하고 HTML 코드에 익숙한 사람들에게는 우스운 작업이겠지만, 저 같은 사람들에게는 꽤 유익한 설명이 될 수 있으리라고 생각합니다.

티스토리 블로그 하시는 분들 <배너출력> 기능을 활용해서 원하는 사이트와 링크도 만드시고, 이미지 배너나 HTML 배너를 활용하여 필요한 캠페인이나 온라인 시민운동에도 활용하시기 바랍니다.
728x90






Trackback 0 Comment 9
  1. 일반인의시선 2010.11.06 18:26 address edit & del reply

    아 이런 방법이 있었군요. 좋은 정보네요 ^^

    • 이윤기 2010.11.07 08:38 address edit & del

      유익하셨다니 저도 기분이 좋습니다.

  2. 여강여호 2010.11.06 18:56 address edit & del reply

    유용한 정보네요....늘 궁금했었는데.....즐거운 주말 저녁 보내세요..

    • 이윤기 2010.11.07 08:39 address edit & del

      사실, 이런 포스팅하려면...시간이 꽤 걸리거든요.

      도움되시는 분들이 있다니 저도 기분이 좋습니다.

  3. 일류 2010.11.07 11:33 address edit & del reply

    잘보고갑니다.. 필요로하시는 분들에게는 유용하게 쓰이겠네요^^

  4. 백일홍 2010.12.01 22:52 address edit & del reply

    상황에 따라 여러가지 방법이 있죠.^^
    복잡하게 웹하드에 이미지를 올려놓지 않아도 되는 방법?
    해당 이미지 속성의 URL을 복사(해당 이미지에 링크가 걸려있으면 자동으로 해당 사이트로 이동됨),아니면 이미지를 복사하거나, 캡쳐해서 티스토리 글쓰기나, 서식에 사용할 이미지를 올려놓고 사용(저장하여 역시 이미지 속성의 URL을 복사해 사용 이 경우 이동할 사이트 URL을 지정해 주어야 함)

    '이미지 배너 출력'창에 입력된 내용이 HTML 코드로 변환되면
    <DIV><A herf="이동하려는 사이트 URL"><IMG src="이미지가 올려져 있는 경로"></A></DIV>가 됩니다.
    이미지 경로가 들어가는 곳에 그냥 문자를 쓰면 문자가 나타나며 문자를 클릭하면 역시 이동하고자 하는 사이트로 이동할 수 있습니다. 사이트 창을 새창으로 열 것인지 아니면 현재 창으로 열 것인지 등 옵션도 있습니다만 여기서 설명하기는 길어서 패스하고~
    딴지는 아니니 불쾌하게 생각하지는 마시길...
    오늘도 즐거운 하루되세요.^^

  5. 작토 2012.02.01 22:07 address edit & del reply

    와~ 완전 상세하게 잘 써주셨네요.. 저는 블로그는 완전 초보지만 한번 차근차근 따라 해 봐야겠어요^^

  6. 승짱희짱 2014.06.26 00:50 신고 address edit & del reply

    저도 블러그 초보때 고생했던 기억이 나네요..
    처음 블러그 활용하시는분들에게 아주 좋은 정보가 될것 같아요...
    혹시 포털에 배너를 게시하려면 웹두레 배너를 이용해 보세요. 단돈 1만원으로도 시작할 수 있습니다.
    웹두레 배너는 배너가 게시되거나 클릭된 위치를 확인할 수 있어 관리도 편하고
    효과도 좋아요..

캐논 복합기, IP주소 수동으로 설정하기

약 한 달전부터 제가 일하는 단체 인터넷이 자주 말썽을 부리고 있습니다. KT외부망과 내부 공유기 사이에 문제가 생겨서 인터넷 전화가 멈추기도 하고, 인터넷이 안될 때도 있습니다. 어찌어찌 겨우겨우(제가 기술자가 아니라서) 전..

신용카드 포인트 현금으로 찾으세요

창원 KBS1 라디오 <시사경남>에서 매주 월요일 이윤기의 세상읽기 코너를 진행하고 있습니다 . 방송 내용과 조금 다른 초고이기는 하지만 기록을 남기기 위해 포스팅 합니다.( 7월 5일 방송분) 경제활동인구 1인당 평균 4장의..

엉터리 교통수요 예측은 왜 반복되는가?

창원 KBS1 라디오 <시사경남>에서 매주 월요일 이윤기의 세상읽기 코너를 진행하고 있습니다 . 방송 내용과 조금 다른 초고이기는 하지만 기록을 남기기 위해 포스팅 합니다.( 6월 21일 방송분) 전국에서 가장 비싼 유료 도로..

신용카드 캐시백 포인트 나는 반댈세

창원 KBS1 라디오 <시사경남>에서 매주 월요일 이윤기의 세상읽기 코너를 진행하고 있습니다 . 방송 내용과 조금 다른 초고이기는 하지만 기록을 남기기 위해 포스팅 합니다.( 6월 28일 방송분) 코로나-19 재난 상황이 1년..

전기차 좋은데...폐 배터리는 어쩌나?

창원 KBS1 라디오 <시사경남>에서 매주 월요일 이윤기의 세상읽기 코너를 진행하고 있습니다 . 방송 내용과 조금 다른 초고이기는 하지만 기록을 남기기 위해 포스팅 합니다.( 6월 14일 방송분) 황사와 미세먼지가 심각한 사회..

해외직구 4조원...소비자 피해예방은?

창원 KBS1 라디오 <시사경남>에서 매주 월요일 이윤기의 세상읽기 코너를 진행하고 있습니다 . 방송 내용과 조금 다른 초고이기는 하지만 기록을 남기기 위해 포스팅 합니다.( 6월 7일 방송분) 인터넷과 IT기술의 발전으로 꾸..

수제향초 선물 7년 징역도 과잉처벌

창원 KBS1 라디오 <시사경남>에서 매주 월요일 이윤기의 세상읽기 코너를 진행하고 있습니다 . 방송 내용과 조금 다른 초고이기는 하지만 기록을 남기기 위해 포스팅 합니다.( 5월 31일 방송분) 지난 방송에서 수제비누를 만들..

수제비누 선물이 불법? 참 납득안되네

창원 KBS1 라디오 <시사경남>에서 매주 월요일 이윤기의 세상읽기 코너를 진행하고 있습니다 . 방송 내용과 조금 다른 초고이기는 하지만 기록을 남기기 위해 포스팅 합니다.( 5월 24일 방송분) 기후위기와 환경 오염이 심각해..

'하얗고 큰 꽃' 좋아하는 아들 생각에 심은 나무

지난봄에 세상을 살면서 처음으로 나무 세 그루를 심었습니다. 오십 년을 훨씬 넘게 사는 동안 나무를 베어 만든 종이를 얼마나 썼을까요? 공부방을 가득 채운 책들만 해도 나무 수백 그루는 베어내지 않았을까 싶은데... 무심하게..

통풍, 3년간 발병 안하면 완치 판정?

[통풍일기 ⑧] 통풍, 봉침, 한약, 환약...한방치료 후 재발 안 해 [연재기사] 2018/04/30 - [숨 고르기] - 채식에 운동까지 하는데, 왜 내게 이런 병이... 2018/05/04 - [숨 고르기] - "통풍은 ..

경남 청년 정책...시군은 더 노력해야

창원 KBS1 라디오 <시사경남>에서 매주 월요일 이윤기의 세상읽기 코너를 진행하고 있습니다 . 방송 내용과 조금 다른 초고이기는 하지만 기록을 남기기 위해 포스팅 합니다.( 5월 17일 방송분) 지난 3월 전국청년정책네트워크..

백신, 아이들 위해 어른은 다 맞아야 한다

창원 KBS1 라디오 <시사경남>에서 매주 월요일 이윤기의 세상읽기 코너를 진행하고 있습니다 . 방송 내용과 조금 다른 초고이기는 하지만 기록을 남기기 위해 포스팅 합니다.( 5월 10일 방송분) 지난 2월 26일 첫 코로나 ..

우후죽순 지자체 배달앱, 성공할까?

창원 KBS1 라디오 <시사경남>에서 매주 월요일 이윤기의 세상읽기 코너를 진행하고 있습니다 . 방송 내용과 조금 다른 초고이기는 하지만 기록을 남기기 위해 포스팅 합니다.( 5월 3일 방송분) 지난해 4월 민간 플랫폼 사업자..

전기차 배터리, 3분만에 교체가 답이다

창원 KBS1 라디오 <시사경남>에서 매주 월요일 이윤기의 세상읽기 코너를 진행하고 있습니다 . 방송 내용과 조금 다른 초고이기는 하지만 기록을 남기기 위해 포스팅 합니다.( 4월 26일 방송분) 기후변화 시대, 전기자동차와 ..

1사람이 주택 1880채? 이게 말이 되나?

창원 KBS1 라디오 <시사경남>에서 매주 월요일 이윤기의 세상읽기 코너를 진행하고 있습니다 . 방송 내용과 조금 다른 초고이기는 하지만 기록을 남기기 위해 포스팅 합니다.( 4월 12일 방송분) 한국토지주택공사 직원들의 3기..

지역주택조합 10개중 2개 성공

창원 KBS1 라디오 <시사경남>에서 매주 월요일 이윤기의 세상읽기 코너를 진행하고 있습니다 . 방송 내용과 조금 다른 초고이기는 하지만 기록을 남기기 위해 포스팅 합니다.( 4월 5일 방송분) 지난 연말 부동산 투기과열지구로..

마산해양신도시 난 개발 막으려면?

창원 KBS1 라디오 <시사경남>에서 매주 월요일 이윤기의 세상읽기 코너를 진행하고 있습니다 . 방송 내용과 조금 다른 초고이기는 하지만 기록을 남기기 위해 포스팅 합니다.( 4월 19일 방송분) 지난 4월 15일 창원시가 마..

LH 쪼개도 좋은데 경남에 있어야 한다

창원 KBS1 라디오 <시사경남>에서 매주 월요일 이윤기의 세상읽기 코너를 진행하고 있습니다 . 방송 내용과 조금 다른 초고이기는 하지만 기록을 남기기 위해 포스팅 합니다.( 3월 29일 방송분) 지난 3월 2일 참여연대와 민..

1000억 낭비 재보궐선거... 없앨 묘수?

창원 KBS1 라디오 <시사경남>에서 매주 월요일 이윤기의 세상읽기 코너를 진행하고 있습니다 . 방송 내용과 조금 다른 초고이기는 하지만 기록을 남기기 위해 포스팅 합니다. 이 포스팅은 4.7 재보궐 선거 이전에 작성되었습니다..

코로나 결혼식 취소, 변경 소비자만 손해보나?

코로나19 시대, 달라진 예식장 계약 코로나-19와 함께 보내는 시간이 1년을 넘어가면서 우리 생활의 많은 부분이 달라졌습니다만, 그중에도 특히 많이 달라진 풍속도가 바로 결혼식이 아닌가 싶습니다. 오늘은 코로나-19 시대에 ..