다음뷰 추천 위젯 배경 꾸미기 하이 퀄리티 테마 블로그팁

다음뷰 배경 꾸미기 그 시작

다음뷰 추천 위젯이 있습니다. 다음뷰에 추천을 할 수 있는 위젯이죠. 이 추천 위젯에 배경을 주어서 더 부곽을 시키고 스킨과 어울리게 하는데 그 첫번째 의도가 있습니다. 제가 배경을 만들어서 배포를 했었고 알게 모르게 많은 분들이 잘 쓰고 계시네요.

어떻게 사용하는지에 대해서는 아래 링크를 자세히 참조해 주세요. 여기에서는 코드만 공개하도록 하겠습니다. 넉두리지만 혼자서만 쓰려고 만들었던 코드도 하나 있는데 결국 공개해버렸네요.

다음뷰 배경 꾸미기 방법 (꼭 읽어보세요)

다음뷰 배경 꾸미는 방법 설명 및 다음뷰 배경 꾸미기 공개 코드 링크 : http://cdmanii.com/1046

다음뷰 배경 꾸미기 흰색 배경 전용

div.blogger-news-widget  {
background:url("https://t1.daumcdn.net/cfile/tistory/130BF5154BDD21D602") no-repeat scroll 85px -36px transparent; clear:both; display:inline; float:right; height:175px; margin-top:40px; overflow:hidden !important; padding-top:35px;
}

div.blogger-news-widget  {
background:url("https://t1.daumcdn.net/cfile/tistory/112597154BDD21D7B3") no-repeat scroll 85px -36px transparent; clear:both; display:inline; float:right; height:290px; margin-top:40px; overflow:hidden !important; padding-top:16px;
}

div.blogger-news-widget  {
background:url("https://t1.daumcdn.net/cfile/tistory/130DE4154BDD21D701") no-repeat scroll 85px -36px transparent; clear:both; display:inline; float:right; height:140px; margin-top:40px; overflow:hidden !important; padding-top:49px;
}

다음뷰 배경 꾸미기 검은색 배경 전용

div.blogger-news-widget {
background:url("https://t1.daumcdn.net/cfile/tistory/1508F8274BEAB5962C") no-repeat scroll 162px 0 transparent; clear:both; display:inline; float:right; height:140px; margin-top:10px; overflow:hidden !important; padding-top:54px;
}

다음뷰 꾸미기 간략 설명

흰색 배경으로 3가지 테마를 적용해서 꾸며보았습니다. 발랄한 분위기의 케릭터도 이용했고, 권총모양의 특이한 디자인의 스킨에도 어울릴만한 것을 만들어보았습니다. 검은색에 어울리는 다음뷰 배경도 만들어보았습니다. 많이 활용해주세요.

해당 코드를 style.css 의 맨하단에 넣어줍니다. 적용된 부분을 확인합니다. 끝

블로그 팁 모음 링크 : 티스토리 블로그 팁 모음