웹마스터 팁

네이버 검색 결과를 XE로 만든 자기 홈페이지에 뿌리는 방법입니다.

 

미리보기: http://www.layoutskin.com/naverSearch

 

시작하기에 앞서 저는 개발자가 아님을 말씀드립니다. ^^;;

따라서 로직이 아니라 비주얼로 접근하였기 때문에 겉보기에는 멀쩡하지만 내부적인 안정성, 효율성 등은 장담 못하니 참고해주세요.

 

하지만 아주 간단하게 적용이 되는 장점은 있습니다.

 

1. 네이버 회원 가입 후 로그인

 

2. 네이버 개발자 센터> 오픈API (http://dev.naver.com/openapi/) 좌측메뉴에서 키등록

 

3. http://openapi.naver.com/search?key=등록한키값&query=검색어display=검색결과갯수&start=1&target=검색대상

 

위와 같은 형식에 키값을 제외하고 본인이 원하는 대로 값을 넣어 주소를 생성합니다.

 

검색결과갯수는 100가 한계라고 되어있습니다.

검색대상은 http://dev.naver.com/openapi/apis/search/rank을 보시면 다양하게 있습니다.

예: 실시간 급상승은 rank, 블로그는 blog, 웹문서는 webkr 등등

 

생성된 주소가 정상적으로 링크 되는지 꼭 확인하셔야 합니다! 정상이면 정돈된 문서가 나오고 비정상이면 태그들이 나옵니다. 

 

4. 생성된 주소로 외부페이지 만들기

 

5. 전용레이아웃 만들기

레이아웃스킨은 무엇이든 상관없고, 레이아웃 편집을 이용하기 위해 따로 만드는 것이므로 문제가 없다는 확신이 있으면 레이아웃스킨에 다음에 나오는 코드를 넣어도 상관없습니다.

 

6. 코드삽입

 

HTML 편집영역

붉은색 표시부분은 본인레이아웃의 컨텐츠영역을 감싸고 있는 div의 아이디나 클래스 이름을 넣어주세요. 정확해야 합니다!!!

<div id="AAA">이면 #AAA, <div class="AAA">이면 .AAA 입니다.

녹색표시부분은 그냥 텍스트 이므로 선택사항입니다.

 

<script>
jQuery(function($){

var xmlTotal = $('#drawerContentsBox').find('total').text();
var xmlDate = $('#drawerContentsBox').find('lastBuildDate').text();
var linkData = $('#drawerContentsBox').find('rss').find('channel').find('item').find('link').html();

$('#drawerContentsBox').append('<p class="xmlSummary">네이버 웹문서에서 "layoutskin"으로 검색한 결과: '+xmlDate+' 현재 '+xmlTotal+'건이 검색됨</p>');

$('#drawerContentsBox').find('rss').find('channel').find('item').each(function(idx) {
var xmlTitle = $(this).find('title').text();
var itemData = $(this).html();
var itemDataSplit = itemData.split('<link>');
var itemDataSplit2 = itemDataSplit[itemDataSplit.length-1];
var itemDataSplit3 = itemDataSplit2.split('<description>');
var xmlLink = itemDataSplit3[itemDataSplit3.length-2];
var xmlDescription = $(this).find('description').text();
$('#drawerContentsBox').append('<div class="xmlDataRow"><p class="xmlTitle"><a href="'+xmlLink+'" target="_blank">' + xmlTitle+'</a></p><p class="xmlDescription">'+xmlDescription+'</p></div>');
});
$('rss').hide();
$('.xmlDataRow').hover(function () {
$(this).css('background','#f4f4f4');
}, function () {
$(this).css('background','none');
});

var rows = $('.xmlDataRow').length;
var per_page = 5;
var no_pages = Math.ceil(rows / per_page);
 
var pageNumbers = $('<div id="pages"></div>');
for ( var i = 0; i < no_pages; i++) {
$('<span class="page">' + (i+1) + '</span>').appendTo(pageNumbers);
}

$('#drawerContentsBox').append(pageNumbers);

$('.xmlDataRow').hide();
var t = $('.xmlDataRow');
for ( var j = 0; j <= per_page - 1; j++) {
$(t[j]).show();
}

$('.page:eq(0)').addClass('bold');

$('span').click(function() {
    $('.page').removeClass('bold');
    $(this).addClass('bold');
    $('.xmlDataRow').hide();
    for ( var k = ($(this).text() - 1) * per_page;
         k <= $(this).text() * per_page - 1;
         k++) {
     $(t[k]).show();
    }
});

});
</script>

 

CSS 편집 영역

 

.xmlDataRow {border-top: 1px solid #ccc; height: 55px; padding: 15px}
.xmlSummary {padding-bottom: 20px; font-size: 13px; border-bottom: 1px solid #ccc}
.xmlTitle {margin-bottom: 10px; font-weight: bold}
.xmlTitle a {text-decoration: none; color: #000}
.xmlTitle a:hover {text-decoration: underline}
.xmlDescription {width: 100%; color: #999}
#pages {padding-top: 20px; width: 100%; border-top: 2px solid #ccc; text-align: center}
.page{margin: 0 5px;cursor: pointer}
.page.bold{font-weight: bold}

 

끝입니다. 도움이 되셨으면 좋겠습니다. ^^

 

제목 글쓴이 날짜
네이버 검색 API XE하고 연동하기 [3] mindpainter 2013.01.09
[주옥시리즈] [1.7.4] 로그인창 옆에 신규 쪽지 수 보여주기 [3] socialskyo 2013.09.09
[140404] ISPconfig 호스팅 관리 패널 Luatic™ 2012.06.24
갑자기 사이트 세팅을하던도중 DB line 674 에러 대처법 xe공부중44 2014.05.01
장비 침입 탐지 및 자동 ip 차단 프로그램 소개 [4] 고구마군 2014.04.09
글쓰기를 클릭하면 띄워지는 테두리 없는 예쁜 팝업 띄우기 core. 1.7.4 [4] file 마음의빈자리 2014.02.11
VB.NET에서 XE로그인 연동하기.[내용추가] [3] AppSeedKorea 2014.03.26
최신 제로보드 XE 동영상 강의 [25] 하얀마법 2013.08.09
노프레임 홈만들기 (3) - 서브 페이지 만들고 제로보드에 적용하기 [27] file @kihwa 2003.07.26
노프레임 홈만들기 (2) - 로그인, 최근게시물 설치 [31] file @kihwa 2003.07.26
노프레임 홈만들기 (1) - 표로 레이아웃 만들고 그림 삽입하기 [45] file @kihwa 2003.07.11
레이아웃 위젯 권한 넣기 [14] 해피해킹 2011.04.12
스윙브라우저 유저분들 필독. [10] KSG2013 2014.02.08
1.5 -> 1.7 업글중 백지상태 부분!! una_nampyeon 2014.02.03
아이디 계정때도 이메일 변경시 재인증 메일 발송하기 [1] 혼ME 2013.06.19
스케치북 게시판 사용시 "내용을 입력해주세요"라고 뜨면서 댓글 입력이 안될경우 체크해봐야할 사항 [1] socialskyo 2014.01.07
나만의 익명게시판에서 닉네임 확인하는 방법(꼼수라고 밝힙니다.) [5] 착한부산남자 2014.01.03
글쓴이의 정보 추출해서 게시판 출력하기 [9] 야호z 2011.02.24
[공유]로그인 하지 않아도 게시판에서 회원정보 출력 하기 (가입품 확장변수 포함) [6] file rminkim 2012.03.20
소셜 XE 페이스북 로그인 에러 해결 방법 file 신평 2013.11.30