“Cyworld shuts down US cyworld” 에고 이럴수가..

  • sns.jsiku.com(폐쇄)에서 옮김
전혀 사용하지 않았던 US Cyworld.가 문을 닫는다고 합니다. 우리나라의 대표적 SNS가 미국에서 약 11만명의 유저를 보유한 싸이월드가 결국 포기하는 군요. 아래는 shut down에 대한 공지메일입니다.

 

Thank you to all members with Cyworld.

Due to Cyworld shuts down US service, US Cyworld will no longer be able to service.

We sincerely apologize for shutting down the service with unavoidable reason.

Before US cyworld close the service, you will continue to access to US cyworld contents but not

purchase items. Also, you will not use your acorns.

If you have unused acorns, you will be given a full refund for paid acorns only.

Refunds and data backup service is in progress, using the acorn will no longer be able to purchase for miniroom items, skins, etc.

@ Schedule for closing US Cyworld service

Due to Data Back-up and closing service issues, the service will be unavailable.

* Shop service will be unavailable since Nov 03, 2009

o Club service, Profile photo/data upload serivce will be unavailable since Nov 23, 2009

 

한때는 SNS의 선두주자로 해외에서 열심히 벤치마킹하던 싸이월드가 이제는 퇴락의 길을 걷고 있습니다. 한국시장에서는 여전히 강세지만, 지역성을 벗어나지는 못하고 있죠.

 

원래 SNS가 지역성을 벗어나기 힘들지만 (우리나라에서 마이스페이스나 페이스북을 얼마나 쓰고 있을까요?, 동남아나 남미의 경우도 페이스북을 잘 사용하지 않는다고 하더군요.), 싸이월드 자체가 미국서비스를 따로 만들었기에 이를 사용한 11만의 US싸이월드 이용자의 원성을 어떻게 처리할지 궁금하군요.

 

한달전 어떤 교육에서 싸이월드 공동창업자 이동형씨(현 runpipe 대표)의 강의에서
“한국은 인터넷에서 리더십을 완전히 잃었다.”, “US cyworld는 실패” 라는 말을 들었는데, 씁슬하군요.

 

한국의 SNS업체가 보다 시장을 키우기 위해서는 현재의 고객을 계속 잡아두어야 할텐데, 주위의 사용자들을 보면 조금씩 눈을 다른 곳(트위터, 페이스북 등등, 그러나 여전히 우리나라에서 고전하고 있죠)으로 돌리는 것 같습니다.

 

앞으로 아이폰이 들어오면 관련서비스들을 한국 소비자들이 접할 기회가 급증할 텐데… 빨리 대비를 해야겠죠.

 

 OpenID와 같은 ID를 공유하는 식의 서비스가 한국의 인터넷 관련 법규하고 맞지 않는 것 같습니다. 자세한 것은 좀 더 찾아봐야 하는데.. 미투데이가 네이버로 가면서 오픈아이디 가입을 안받는 것을 보면, 네이버의 개발방향이 문제가 아니라, 관련법규가 문제인 것 같습니다. (10만이상이면 실명정보를 받아야 한다 그런 법이 있다고 하더군요.) 네이버가 일본에서 개시한 트위터를 이용한 서비스를 보면 알 수 있죠.

 

모바일 시장이 앞으로 크게 성장할 텐데.. 우리나라의 서비스 업체들은 어떻게 될까요?

—-

그리고 이 포스트는 posterous를 이용하여 email로 올린 것인데.. 괞찮은 서비스인 것 같습니다.

다수의 컴퓨터를 하나의 컴퓨터로… Synergy+

Aion을 하고 싶어서 노트북에 설치했더니..
사양의 한계로 설치하지 못하였습니다.

(이런…)

그래서 집에서 사용하는 데스크탑을 연구실로 가지고 왔습니다.
아이온은 약 한달만 사용하고. 그 다음부터는 흥미가 떨어져 하지 않았는데.

맨 아래의 사진에서 보는 것 처럼 은폐된 위치에서 동영상 및 각종 컨텐츠만을 소비하는 행위만 하고 오른쪽의 노트북에서 실제 연구와 관련된 작업은 전혀 이루어지지 못하게 되었습니다.  데탑이 독이 되었죠.

게다가 데탑에 우분투까지 설치하였는데.. 영 활용이 되지 않았고 데탑의 XP만을 거의 하루종일 사용하게 되었습니다.

그래서 본래의 연구(?)에 치중하고 간간히 우분투도 활용하는 작업환경을 조성하기 위해 고민한 결과
paperinz님의 포스트
를 발견하게 되었죠. 저런 프로그램이 있다니.. 그래서 여기저기 살핀 결과. 몇 가지 유용한 포스트들을 발견하였습니다.

http://code.google.com/p/synergy-plus/(개발자 페이지, 다운로드)
http://blog.daum.net/hopark/11953230
(맥용 설치 설명)
http://supaflow.tistory.com/87
(리눅용 설치 설명, 제 설치법과는 많이 다릅니다.)

1
synergy 실행창
2
synergy 실행창

설치과정은 아주 간단합니다. 먼저 윈도우에서 설명하자면 (1.3.4 버전)
서버에서 설치할 컴퓨터에서

Share this computer’s keyboard and mouse(sever)을 클릭하고

Configure을 클릭> Screens에서 서버와 클라이언트의 컴퓨터 이름을 추가해줍니다. 컴퓨터 이름(내컴퓨터>속성)과 스크린 이름이 틀리다면 따로 설정을 해야됩니다. 이런 과정을 건너뛰기 위해서 스크린 이름은 컴퓨터 이름으로 설정하였습니다.

다음으로 링크를 설정해주어야 하는데 링크는 컴퓨터간의 마우스 위치를 의미합니다. 여기서 주의할 것이 A 컴의 오른쪽에 B있다라고 설정하면 반대로 B컴 왼쪽에 A컴이 있다라고 추가적으로 설정을 해주어야 합니다.
한 쪽만 설정하면 마우스 커서가 하나의 모니터에 갇히게 된다고 합니다.

클라이언트는 어떻게 설정하는지.
클라이언트는 아주 간단합니다. 프로그램을 실행하고 서버컴퓨터의 이름을 적어주면 됩니다.

여기서 주의할 것이(어디에 명시된 것은 아닙니다.)  작업그룹이 서로 같아야 합니다. 저는 WORKGROUP으로 통일했습니다.
우분투에서도 설정을 했는데. 이도 역시 아주 간단합니다.
커맨드 창에서

synergyc –f (서버컴 이름 혹은 아이피) 를 입력하면됩니다.
synergyc –f 111.111.111.11 이런식이죠. (이름으로 하면 잘되지 않는데 해결방법을 잘모르겠네요. samba도 깔고 그렇게 했는데..)

그 결과 제 작업환경이 아래와 같이 바꼈습니다.  왼쪽의 모니터 2대가 노트북, 오른쪽이 데탑이죠.  차이가 확연히 보이죠. (위 설치전, 아래 설치후)
DSCN3507

큰 모니터 뒤의 후배자리가 보이는데. 그 후매한테 은폐한 상태로 많은 좋은 것들을 봐왔죠.

DSCN3508

(오른쪽은 비스타, 왼쪽은 우분투입니다.)

이거 보신분들 유용히 쓰세요

*  우분투에서 호스트로는 실험하지 않았습니다.
* 데탑의 이름은 우분투나 XP나 모두 동일한 컴퓨터 이름을 사용하였는데 다른 설정을 테스트하지는 않았습니다. 왠지 오류가 나고 시간이 많이 걸릴 것 같아서…
* 한글이 되지 않는 이유는 클라이언트 쪽의 문제라는데… 비스타-xp에서는 기존의 한글패치 없이도 잘되지만 비스타(호스트)-우분투(클라이언트)에서는 이쪽으로 작업한 분들이 없으신 것 같습니다. nabi에서 shift+space는 잘 적용이 안되고 shift+alt를 추가하니까 되기는 하더군요.

새로운 템플릿

  • sns.jsiku.com(폐쇄)에서 옮김

템플릿에 시간투자하는 것이 얼마나 무의미한 것인가를 어제 알았습니다.

그렇다고 나만의 개성을 무시할 수 없고..
지금의 템플릿은 본 블로그 최하단의 곳에서 받았습니다. (템플릿 다운)
이미지가 없어 깔끔하고 고칠 곳도 별로 없고 정말 마음에 듭니다.
템플릿을 변경할 때마다 사이드바의 설정을 다시 고치는 것이 고생스러웠는데
그런데 오늘 처음 알게 된 것이 blogger에는 파일 첨부가 되지를 않네요. 당황스럽습니다. 그래서
파일을 링크로 연결하였습니다. 저와 같은 식의 사이드바를 구성하고 싶으면 여기서 받으세요

새로운 disqus 사용기

sns.jsiku.com(폐쇄)에서 옮김

“댓글은 이미 죽었다” (라이프해커님 글)

 
여러 포스트에 붙는 사용자간의 피드백 댓글…. 한개의 컨텐츠에 수십 혹은 수백의 댓글이 붙는 것을 볼 수가 있습니다. 때로는 전혀 무의미한 그러나 때로는 아주 중요한 댓글들
글에 대한 생각들을 공유하게 해주는 댓글들. 그러나 정작 잘 관리가 되지는 않았습니다. 아실 분들은 다 아시겠지만 JS-KIT, Disqus등의 툴들은 댓글들을 통합적으로 관리하여 줍니다.
위의 문구는 JS-KIT의 운영자가 한 말로 지금의 댓글이 아니라 컨텐츠에 대한 피드백을 중요시하는 트위터, 페이스북등을 염두하연 쓴 말인 것 같습니다.
이런 댓글들을 통합관리해주는 Disqus가 최근에 완전히 새얼굴로 바꾸었는데 잠깐 사용해본 결과의 특징들을 간단히 요약하겠습니다. (Disqus 블로그의 글들을 정리할려고 했는데 .. 귀찮아서. 제가 써보고 느낀 것만..)
  • 얼굴이 바꼈습니다. 회색 빛에서 약간은 화려하게
    사실 처음에는 적응이 어려웠습니다.
DISQUS Comments - Powering Discussion on the Web
<새로운 디스커스>
Disqus error on Mashable
<이전 디스커스: 비교할 만한 그림은 아닌데.. 그냥 색이 이렇게 변했습니다. 사진찾기가 힘들어서요.>
  • 기존의 페이스북, 등등 연결을 보다 쉽게 강화시켰습니다.
    이는 사실 페이스북의 app 활용의 개선에 따른 disqus의 변화라 생각됩니다.
    예전처럼 페이스북에서 app키를 일일히 등록할 필요가 없이 Disqus내에서 알아서 쉽게 app키를 등록 할 수 있습니다. 이부분이 가장 마음에 드는군요
  • 원래 있었던 것인지 잘 모르겠지만, IntenseDbase(철자가 맞나??)와 JS-KIT 등 여러 시스템의 댓글을 쉽게 추출할 수 있게 되었습니다. 예전 기억으로는 원래 있던 것 같은데, 몇몇의 다른 서비스업체들이 추가된 것 같기도 하고, 아니면 눈에 잘 띄게 정리한 것 같기도 하고..
  • 댓글을 달때 로그인 방식이 개선되었고, 각자 다른 아이디 제공업체간의 서비스들을 보다 유기적으로 연결하였습니다. 혹은 이러한 부분을 눈에 잘 띄게 하였습니다.
    트위터 아이디로 댓글을 달아도 페이스북 뉴스에 업데이트 할 수 있게 하는 등, 그리고 예전에는 야후는 없었던 것 같은데… 원래 있었던 것인지 혹은 기능강화인지는 잘몰라도 UI개선에 따른 효과는 분명 있는 것 같습니다.

문제점

  • 설치된 위젯에서 삭제된 댓글들이 여전히 남아있습니다. 시간지연이 조금 되는지 문제점인지 잘은 모르겠습니다.
  • 디스커스 로그인이 오픈아이디 하나로 줄었습니다. 댓글을 달때는 분명 여러 아이디 제공업체들을 고려하였는데, 디스커스에 직접들어갈 때 살펴보면 오픈아이디만 있군요. 불편한 지는 잘 모르겠는데….
쭉 써보니 몇가지 특징적 인 것들이 있군요. UI개선, sns간 연계의 강화, 보다 쉬운 기능구현.좋기는 한데 제 블로그는 아직도 유령??

저장

저장

Blogger template

  • sns.jsiku.com(폐쇄)에서 옮김

내용측면에서 질과 양 모두가 풍부해져야 하는데, 제 블로그들을 보면 템플릿에 거의 모든 노력을 부은 것 같아 아쉽습니다.

여기에 Blogger.Jsiku의 템플릿을 올렸습니다. 사실 이는 대쉬보드와 거의 비슷한데, 옆에 사이드바와 포스트 내의 양식은 변경하지 않았습니다.

* Blogger에서 템플릿 바꾸기

  • 레이아웃>HTML편집>도구확장 선택
  • 아래의 코드를 복사하여 대체하기

<?xml version=”1.0″ encoding=”UTF-8″ ?>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html expr:dir=’data:blog.languageDirection’ xmlns=’http://www.w3.org/1999/xhtml’ xmlns:b=’http://www.google.com/2005/gml/b’ xmlns:data=’http://www.google.com/2005/gml/data’ xmlns:expr=’http://www.google.com/2005/gml/expr’>

<head>
<b:include data=’blog’ name=’all-head-content’/>
<title><data:blog.pageTitle/></title>
<b:skin><![CDATA[/*
———————————————–
Blogger Template Style
Name: Rounders
Designer: Douglas Bowman
URL: www.stopdesign.com
Date: 27 Feb 2004
Updated by: Blogger Team
———————————————– */

/* Variable definitions
====================
<Variable name=”mainBgColor” description=”Main Background Color”
type=”color” default=”#fff” value=”#ffffff”>
<Variable name=”mainTextColor” description=”Text Color” type=”color”
default=”#333″ value=”#333333″>
<Variable name=”postTitleColor” description=”Post Title Color” type=”color”
default=”#333″ value=”#333333″>
<Variable name=”dateHeaderColor” description=”Date Header Color”
type=”color” default=”#357″ value=”#335577″>
<Variable name=”borderColor” description=”Post Border Color” type=”color”
default=”#bbb” value=”#bbbbbb”>

<Variable name=”mainLinkColor” description=”Link Color” type=”color”
default=”#258″ value=”#225588″>
<Variable name=”mainVisitedLinkColor” description=”Visited Link Color”
type=”color” default=”#666″ value=”#666666″>

<Variable name=”titleBgColor” description=”Page Header Background Color”
type=”color” default=”#002050″ value=”#002050″>
<Variable name=”titleTextColor” description=”Blog Title Color”
type=”color” default=”#fff” value=”#ffffff”>

<Variable name=”topSidebarHeaderColor”
description=”Top Sidebar Title Color”
type=”color” default=”#234″ value=”#223344″>
<Variable name=”topSidebarBgColor”
description=”Top Sidebar Background Color”
type=”color” default=”#cdc” value=”#ccddcc”>
<Variable name=”topSidebarTextColor” description=”Top Sidebar Text Color”
type=”color” default=”#345″ value=”#334455″>
<Variable name=”topSidebarLinkColor” description=”Top Sidebar Link Color”
type=”color” default=”#258″ value=”#225588″>
<Variable name=”topSidebarVisitedLinkColor”
description=”Top Sidebar Visited Link Color”
type=”color” default=”#258″ value=”#225588″>

<Variable name=”bodyFont” description=”Text Font” type=”font”
default=”normal normal 100% ‘Trebuchet MS’,Verdana,Arial,Sans-serif” value=”normal normal 100% ‘Trebuchet MS’,Verdana,Arial,Sans-serif”>
<Variable name=”pageTitleFont” description=”Blog Title Font” type=”font”
default=”normal bold 200% ‘Trebuchet MS’,Verdana,Arial,Sans-serif” value=”normal bold 200% ‘Trebuchet MS’,Verdana,Arial,Sans-serif”>
<Variable name=”descriptionFont” description=”Blog Description Font” type=”font”
default=”normal normal 100% ‘Trebuchet MS’,Verdana,Arial,Sans-serif” value=”normal normal 100% ‘Trebuchet MS’,Verdana,Arial,Sans-serif”>
<Variable name=”headerFont” description=”Sidebar Title Font” type=”font”
default=”normal bold 100% ‘Trebuchet MS’,Verdana,Arial,Sans-serif” value=”normal bold 100% ‘Trebuchet MS’,Verdana,Arial,Sans-serif”>
<Variable name=”postTitleFont” description=”Post Title Font” type=”font”
default=”normal bold 135% ‘Trebuchet MS’,Verdana,Arial,Sans-serif” value=”normal bold 135% ‘Trebuchet MS’,Verdana,Arial,Sans-serif”>
<Variable name=”startSide” description=”Start side in blog language”
type=”automatic” default=”left” value=”left”>
<Variable name=”endSide” description=”End side in blog language”
type=”automatic” default=”right” value=”right”>
*/
#navbar, #navbar-iframe {
height: 0px;
visibility: hidden;
display: none;
}

body {
background:#e1d4c0;
margin:0;
text-align:center;
line-height: 1.5em;
font:x-small Trebuchet MS, Verdana, Arial, Sans-serif;
color:$mainTextColor;
font-size/* */:/**/small;
font-size: /**/small;
}

/* Page Structure
———————————————– */
/* The images which help create rounded corners depend on the
following widths and measurements. If you want to change
these measurements, the images will also need to change.
*/
#outer-wrapper {
width:100%
margin:0 auto;
text-align:$startSide;
font: $bodyFont;
}
#content-wrapper {
background: url(“http://farm4.static.flickr.com/3358/3501192036_f5283d25aa_o.png”) center repeat-y;
}
#content-wrapper1 {
margin: 0 auto;
width:760px;
background:#f5ede3;
border-left: 2px solid #baa68e;
border-right: 2px solid #baa68e;
}
#main-wrap1 {
width:520px;
float:$startSide;
background:$mainBgColor url(“http://farm4.static.flickr.com/3638/3504032360_6c9438fe4d_o.gif”) no-repeat $startSide bottom;
margin:15px 13px 0px 13px;
padding:0 0 20px;
color:$mainTextColor;
font-size:97%;
line-height:1.5em;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#main-wrap2 {
float:$startSide;
width:100%;
background:url(“http://farm4.static.flickr.com/3398/3504036036_ce72d8cbea_o.gif”) no-repeat $startSide top;
padding:20px 0 0;
}
#main {
background:url(“http://farm4.static.flickr.com/3310/3504053896_f70be674a5_o.gif”) repeat-y $startSide;
padding:0;
width:520px;
}
#sidebar-wrap {
width:200px;
float:$endSide;
margin:15px 13px 0 0;
font-size:97%;
line-height:1.5em;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

.main .widget {
margin-top: 4px;
width: 503px;
padding: 0 13px;
}

.main .Blog {
margin: 0;
padding: 0;
width: 519px;
}

/* Links
———————————————– */
a:link {
color: $mainLinkColor;
}
a:visited {
color: $mainVisitedLinkColor;
}
a:hover {
color: $mainVisitedLinkColor;
}
a img {
border-width:0;
}

/* Blog Header
———————————————– */
#header-wrapper {
background:$titleBgColor;
width: 100%;
height:76px;
border-bottom: 4px solid #4477dd;
}
#header-wrapper1 {
background:url(“http://farm4.static.flickr.com/3635/3500375675_0b191a5eed_o.png”) repeat-y center;
}
#header {
width:760px; height: 76px;
margin: 0 auto;
border-bottom: 4px solid #6699ff;
background:url(“http://farm4.static.flickr.com/3385/3500655045_5e2b49cc3e_o.png”) no-repeat $startSide bottom;
color: #ffffff;
}
#header h1 {
margin:0;
padding:10px 30px 5px;
line-height:1.2em;
font: $pageTitleFont;
}
#header a,
#header a:visited {
text-decoration:none;
color: $titleTextColor;
}
#header .description {
margin:0;
padding:5px 30px 10px;
line-height:1.5em;
font: $descriptionFont;
}

/* Posts
———————————————– */
h2.date-header {
margin-top:0;
margin-$endSide:28px;
margin-bottom:0;
margin-$startSide:43px;
font-size:85%;
line-height:2em;
text-transform:uppercase;
letter-spacing:.2em;
color:$dateHeaderColor;
}
.post {
margin:.3em 0 25px;
padding:0 13px;
border:1px dotted $borderColor;
border-width:1px 0;
}
.post h3 {
margin:0;
line-height:1.5em;
background:url(“http://www2.blogblog.com/rounders/icon_arrow.gif”) no-repeat 10px .5em;
display:block;
border:1px dotted $borderColor;
border-width:0 1px 1px;
padding-top:2px;
padding-$endSide:14px;
padding-bottom:2px;
padding-$startSide:29px;
color: $postTitleColor;
font: $postTitleFont;
}
.post h3 a, .post h3 a:visited {
text-decoration:none;
color: $postTitleColor;
}
a.title-link:hover {
background-color: $borderColor;
color: $mainTextColor;
}
.post-body {
border:1px dotted $borderColor;
border-width:0 1px 1px;
border-bottom-color:$mainBgColor;
padding-top:10px;
padding-$endSide:14px;
padding-bottom:1px;
padding-$startSide:29px;
}
html>body .post-body {
border-bottom-width:0;
}
.post-body {
margin:0 0 .75em;
}
.post-body blockquote {
line-height:1.3em;
}
.post-footer {
background: #e1d4c0;
margin:0;
padding-top:2px;
padding-$endSide:14px;
padding-bottom:2px;
padding-$startSide:29px;
border:1px dotted $borderColor;
border-width:1px;
font-size:100%;
line-height:1.5em;
color: #666;
}
/*
The first line of the post footer might only have floated text, so we need to give it a height.
The height comes from the post-footer line-height
*/
.post-footer-line-1 {
min-height:1.5em;
_height:1.5em;
}

.post-footer p {
margin: 0;
}

html>body .post-footer {
border-bottom-color:transparent;
}

.uncustomized-post-template .post-footer {
text-align: $endSide;
}

.uncustomized-post-template .post-author,
.uncustomized-post-template .post-timestamp {
display: block;
float: $startSide;
text-align:$startSide;
margin-$endSide: 4px;
}

.post-footer a {
color: #258;
}
.post-footer a:hover {
color: #666;
}
a.comment-link {
/* IE5.0/Win doesn’t apply padding to inline elements,
so we hide these two declarations from it */
background/* */:/**/url(“http://www.blogblog.com/rounders/icon_comment_$startSide.gif”) no-repeat $startSide 45%;
padding-$startSide:14px;
}
html>body a.comment-link {
/* Respecified, for IE5/Mac’s benefit */
background:url(“http://www.blogblog.com/rounders/icon_comment_$startSide.gif”) no-repeat $startSide 45%;
padding-$startSide:14px;
}
.post img {
margin-top:0;
margin-$endSide:0;
margin-bottom:5px;
margin-$startSide:0;
padding:4px;
border:1px solid $borderColor;
}
blockquote {
margin:.75em 0;
border:1px dotted $borderColor;
border-width:1px 0;
padding:5px 15px;
color: $dateHeaderColor;
}
.post blockquote p {
margin:.5em 0;
}

#blog-pager-newer-link {
float: $startSide;
margin-$startSide: 13px;
}

#blog-pager-older-link {
float: $endSide;
margin-$endSide: 13px;
}

#blog-pager {
text-align: center;
}

.feed-links {
clear: both;
line-height: 2.5em;
margin-$startSide: 13px;
}

/* Comments
———————————————– */
#comments {
margin:-25px 13px 0;
border:1px dotted $borderColor;
border-width:0 1px 1px;
padding-top:20px;
padding-$endSide:0;
padding-bottom:15px;
padding-$startSide:0;
}
#comments h4 {
margin:0 0 10px;
padding-top:0;
padding-$endSide:14px;
padding-bottom:2px;
padding-$startSide:29px;
border-bottom:1px dotted $borderColor;
font-size:120%;
line-height:1.4em;
color:$postTitleColor;
}
#comments-block {
margin-top:0;
margin-$endSide:15px;
margin-bottom:0;
margin-$startSide:9px;
}
.comment-author {
background:url(“http://www.blogblog.com/rounders/icon_comment_$startSide.gif”) no-repeat 2px .3em;
margin:.5em 0;
padding-top:0;
padding-$endSide:0;
padding-bottom:0;
padding-$startSide:20px;
font-weight:bold;
}
.comment-body {
margin:0 0 1.25em;
padding-top:0;
padding-$endSide:0;
padding-bottom:0;
padding-$startSide:20px;
}
.comment-body p {
margin:0 0 .5em;
}
.comment-footer {
margin:0 0 .5em;
padding-top:0;
padding-$endSide:0;
padding-bottom:.75em;
padding-$startSide:20px;
}
.comment-footer a:link {
color: #333;
}
.deleted-comment {
font-style:italic;
color:gray;
}
.comment-form {
padding-$startSide:20px;
padding-$endSide:5px;
}
#comments .comment-form h4 {
padding-$startSide:0px;
}

/* Profile
———————————————– */
.profile-img {
float: $startSide;
margin-top: 5px;
margin-$endSide: 5px;
margin-bottom: 5px;
margin-$startSide: 0;
border: 4px solid $topSidebarTextColor;
}

.profile-datablock {
margin-top:0;
margin-$endSide:15px;
margin-bottom:.5em;
margin-$startSide:0;
padding-top:8px;
}

.profile-link {
background:url(“http://www.blogblog.com/rounders/icon_profile_$startSide.gif”) no-repeat $startSide .1em;
padding-$startSide:15px;
font-weight:bold;
}

.profile-textblock {
clear: both;
margin: 0;
}

.sidebar .clear, .main .widget .clear {
clear: both;
}

#sidebartop-wrap {
background:$topSidebarBgColor url(“http://farm4.static.flickr.com/3313/3504077042_293722429b_o.gif”) no-repeat $startSide bottom;
margin:0px 0px 15px;
padding:0px 0px 10px;
color:$topSidebarTextColor;
}

#sidebartop-wrap2 {
background:url(“http://farm4.static.flickr.com/3660/3503268057_1f5241308f_o.gif”) no-repeat $startSide top;
padding: 10px 0 0;
margin:0;
border-width:0;
}

#sidebartop h2 {
line-height:1.5em;
color:$topSidebarHeaderColor;
border-bottom: 1px dotted $topSidebarHeaderColor;
margin-bottom: 0.5em;
font: $headerFont;
}

#sidebartop a {
color: $topSidebarLinkColor;
}

#sidebartop a:hover {
color: $topSidebarVisitedLinkColor;
}
#sidebartop a:visited {
color: $topSidebarVisitedLinkColor;
}
/* Sidebar Boxes
———————————————– */

.sidebar .widget {
margin:.5em 13px 1.25em;
padding:0 0px;
}

.widget-content {
margin-top: 0.5em;
}

#sidebarbottom-wrap1 {
background:$mainBgColor url(“http://farm4.static.flickr.com/3660/3503268057_1f5241308f_o.gif”) no-repeat $startSide top;
margin:0 0 15px;
padding:10px 0 0;
color: $mainTextColor;
}

#sidebarbottom-wrap2 {
background:url(“http://farm4.static.flickr.com/3313/3504077042_293722429b_o.gif”) no-repeat $startSide bottom;
padding:0 0 8px;
}

.sidebar h2 {
margin:0;
padding:0 0 .2em;
line-height:1.5em;
font:$headerFont;
}

.sidebar ul {
list-style:none;
margin:0 0 1.25em;
padding:0;
}

.sidebar ul li {
background:url(“http://www2.blogblog.com/rounders/icon_arrow_sm.gif”) no-repeat 2px .25em;
margin:0;
padding-top:0;
padding-$endSide:0;
padding-bottom:3px;
padding-$startSide:16px;
margin-bottom:3px;
border-bottom:1px dotted $borderColor;
line-height:1.4em;
}
.sidebar p {
margin:0 0 .6em;
}

#sidebar h2 {
color: $postTitleColor;
border-bottom: 1px dotted $postTitleColor;
}

/* Footer
———————————————– */
#footer-wrap1 {
clear:both;
margin:0 0 0px;
padding:15px 0 0;
}
#footer-wrap2 {
width:740px;
margin: 0 auto;
background:#e1d4c0 url(“http://farm4.static.flickr.com/3620/3504102662_448f46d497_o.gif”) no-repeat $startSide top;
color:$titleTextColor;
}
#footer {
background:url(“http://farm4.static.flickr.com/3370/3503290453_61d39ee184_o.gif”) no-repeat $startSide bottom;
padding:8px 15px;
}
#footer hr {display:none;}
#footer p {margin:0;}
#footer a {color:$titleTextColor;}
#footer .widget-content {
margin:0;
}

/** Page structure tweaks for layout editor wireframe */
body#layout #main-wrap1,
body#layout #sidebar-wrap,
body#layout #header-wrapper {
margin-top: 0;
}

body#layout #header, body#layout #header-wrapper,
body#layout #outer-wrapper {
margin-$startSide:0,
margin-$endSide: 0;
padding: 0;
}

body#layout #outer-wrapper {
width: 730px;
}

body#layout #footer-wrap1 {
padding-top: 0;
}
]]></b:skin>
</head>

<body>
<div id=’outer-wrapper’>

<div id=’header-wrapper’><div id=’header-wrapper1′>
<b:section class=’header’ id=’header’ maxwidgets=’1′>
<b:widget id=’Header1′ locked=’true’ title=’Blogger.JSiku(%uD5E4%uB354)’ type=’Header’>
<b:includable id=’main’>

<b:if cond=’data:useImage’>
<b:if cond=’data:imagePlacement == &quot;REPLACE&quot;’>
<!–Show just the image, no text–>
<div id=’header-inner’>
<a expr:href=’data:blog.homepageUrl’ style=’display: block’>
<img expr:alt=’data:title’ expr:height=’data:height’ expr:id=’data:widget.instanceId &quot;_headerimg&quot;’ expr:src=’data:sourceUrl’ expr:width=’data:width’ style=’display: block’/>
</a>
</div>
<b:else/>
<!–
Show image as background to text. You can’t really calculate the width
reliably in JS because margins are not taken into account by any of
clientWidth, offsetWidth or scrollWidth, so we don’t force a minimum
width if the user is using shrink to fit.
This results in a margin-width’s worth of pixels being cropped. If the
user is not using shrink to fit then we expand the header.
–>
<div expr:style=’&quot;background-image: url(&quot;&quot; data:sourceUrl &quot;&quot;); &quot; &quot;background-position: &quot; data:backgroundPositionStyleStr &quot;; &quot; data:widthStyleStr &quot;min-height: &quot; data:height &quot;px;&quot; &quot;_height: &quot; data:height &quot;px;&quot; &quot;background-repeat: no-repeat; &quot;’ id=’header-inner’>
<div class=’titlewrapper’ style=’background: transparent’>
<h1 class=’title’ style=’background: transparent; border-width: 0px’>
<b:include name=’title’/>
</h1>
</div>
<b:include name=’description’/>
</div>
</b:if>
<b:else/>
<!–No header image –>
<div id=’header-inner’>
<div class=’titlewrapper’>
<h1 class=’title’>
<b:include name=’title’/>
</h1>
</div>
<b:include name=’description’/>
</div>
</b:if>
</b:includable>
<b:includable id=’title’>
<b:if cond=’data:blog.url == data:blog.homepageUrl’>
<data:title/>
<b:else/>
<a expr:href=’data:blog.homepageUrl’><data:title/></a>
</b:if>
</b:includable>
<b:includable id=’description’>
<div class=’descriptionwrapper’>
<p class=’description’><span><data:description/></span></p>
</div>
</b:includable>
</b:widget>
</b:section>
</div></div>

<div id=’crosscol-wrapper’ style=’text-align:center’>
<b:section class=’crosscol’ id=’crosscol’ showaddelement=’no’/>
</div>
<div id=’content-wrapper’><div id=’content-wrapper1′>
<div id=’main-wrap1′><div id=’main-wrap2′>
<b:section class=’main’ id=’main’ showaddelement=’no’>
<b:widget id=’Blog1′ locked=’true’ title=’%uBE14%uB85C%uADF8 %uAC8C%uC2DC%uBB3C’ type=’Blog’>
<b:includable id=’main’ var=’top’>
<!– posts –>
<div class=’blog-posts hfeed’>

<b:include data=’top’ name=’status-message’/>

<data:adStart/>
<b:loop values=’data:posts’ var=’post’>
<b:if cond=’data:post.dateHeader’>
<h2 class=’date-header’><data:post.dateHeader/></h2>
</b:if>
<b:include data=’post’ name=’post’/>
<b:if cond=’data:blog.pageType == &quot;item&quot;’>
<b:include data=’post’ name=’comments’/>
</b:if>
<b:if cond=’data:post.includeAd’>
<data:adEnd/>
<data:adCode/>
<data:adStart/>
</b:if>
<b:if cond=’data:post.trackLatency’>
<data:post.latencyJs/>
</b:if>
</b:loop>
<data:adEnd/>
</div>

<!– navigation –>
<b:include name=’nextprev’/>

<!– feed links –>
<b:include name=’feedLinks’/>

<b:if cond=’data:top.showStars’>
<script src=’http://www.google.com/jsapi’ type=’text/javascript’/>
<script type=’text/javascript’>
google.load(&quot;annotations&quot;, &quot;1&quot;, {&quot;locale&quot;: &quot;<data:top.languageCode/>&quot;});
function initialize() {
google.annotations.setApplicationId(<data:top.blogspotReviews/>);
google.annotations.createAll();
google.annotations.fetch();
}
google.setOnLoadCallback(initialize);
</script>
</b:if>

</b:includable>
<b:includable id=’nextprev’>
<div class=’blog-pager’ id=’blog-pager’>
<b:if cond=’data:newerPageUrl’>
<span id=’blog-pager-newer-link’>
<a class=’blog-pager-newer-link’ expr:href=’data:newerPageUrl’ expr:id=’data:widget.instanceId &quot;_blog-pager-newer-link&quot;’ expr:title=’data:newerPageTitle’><data:newerPageTitle/></a>
</span>
</b:if>

<b:if cond=’data:olderPageUrl’>
<span id=’blog-pager-older-link’>
<a class=’blog-pager-older-link’ expr:href=’data:olderPageUrl’ expr:id=’data:widget.instanceId &quot;_blog-pager-older-link&quot;’ expr:title=’data:olderPageTitle’><data:olderPageTitle/></a>
</span>
</b:if>

<b:if cond=’data:blog.homepageUrl != data:blog.url’>
<a class=’home-link’ expr:href=’data:blog.homepageUrl’><data:homeMsg/></a>
<b:else/>
<b:if cond=’data:newerPageUrl’>
<a class=’home-link’ expr:href=’data:blog.homepageUrl’><data:homeMsg/></a>
</b:if>
</b:if>

</div>
<div class=’clear’/>
</b:includable>
<b:includable id=’post’ var=’post’>
<div class=’post hentry uncustomized-post-template’>
<a expr:name=’data:post.id’/>
<b:if cond=’data:post.title’>
<h3 class=’post-title entry-title’>
<b:if cond=’data:post.link’>
<a expr:href=’data:post.link’><data:post.title/></a>
<b:else/>
<b:if cond=’data:post.url’>
<a expr:href=’data:post.url’><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>

<div class=’post-header-line-1’/>

<div class=’post-body entry-content’>
<data:post.body/>
<div style=’clear: both;’/> <!– clear for photos floats –>
</div>

<b:if cond=’data:post.hasJumpLink’>
<div class=’jump-link’>
<a expr:href=’data:post.url &quot;#more&quot;’><data:post.jumpText/></a>
</div>
</b:if>

<div class=’post-footer’>
<div class=’post-footer-line post-footer-line-1′>
<span class=’post-author vcard’>
<b:if cond=’data:top.showAuthor’>
<data:top.authorLabel/>
<span class=’fn’><data:post.author/></span>
</b:if>
</span>

<span class=’post-timestamp’>
<b:if cond=’data:top.showTimestamp’>
<data:top.timestampLabel/>
<b:if cond=’data:post.url’>
<a class=’timestamp-link’ expr:href=’data:post.url’ rel=’bookmark’ title=’permanent link’><abbr class=’published’ expr:title=’data:post.timestampISO8601′><data:post.timestamp/></abbr></a>
</b:if>
</b:if>
</span>

<span class=’reaction-buttons’>
<b:if cond=’data:top.showReactions’>
<table border=’0′ cellpadding=’0′ cellspacing=’0′ width=’100%’><tr>
<td class=’reactions-label-cell’ nowrap=’nowrap’ valign=’top’ width=’1%’>
<span class=’reactions-label’>
<data:top.reactionsLabel/></span>&#160;</td>
<td><iframe allowtransparency=’true’ class=’reactions-iframe’ expr:src=’data:post.reactionsUrl’ frameborder=’0′ name=’reactions’ scrolling=’no’/></td>
</tr></table>
</b:if>
</span>

<span class=’star-ratings’>
<b:if cond=’data:top.showStars’>
<div expr:g:background-color=’data:backgroundColor’ expr:g:text-color=’data:textColor’ expr:g:url=’data:post.absoluteUrl’ g:height=’42’ g:type=’RatingPanel’ g:width=’280’/>
</b:if>
</span>

<span class=’post-comment-link’>
<b:if cond=’data:blog.pageType != &quot;item&quot;’>
<b:if cond=’data:post.allowComments’>
<a class=’comment-link’ expr:href=’data:post.addCommentUrl’ expr:onclick=’data:post.addCommentOnclick’><b:if cond=’data:post.numComments == 1′>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>
</span>

<!– backlinks –>
<span class=’post-backlinks post-comment-link’>
<b:if cond=’data:blog.pageType != &quot;item&quot;’>
<b:if cond=’data:post.showBacklinks’>
<a class=’comment-link’ expr:href=’data:post.url &quot;#links&quot;’><data:top.backlinkLabel/></a>
</b:if>
</b:if>
</span>

<span class=’post-icons’>
<!– email post links –>
<b:if cond=’data:post.emailPostUrl’>
<span class=’item-action’>
<a expr:href=’data:post.emailPostUrl’ expr:title=’data:top.emailPostMsg’>
<img alt=” class=’icon-action’ height=’13’ src=’http://www.blogger.com/img/icon18_email.gif’ width=’18’/>
</a>
</span>
</b:if>

<!– quickedit pencil –>
<b:include data=’post’ name=’postQuickEdit’/>
</span>
</div>

<div class=’post-footer-line post-footer-line-2′>
<span class=’post-labels’>
<b:if cond=’data:post.labels’>
<data:postLabelsLabel/>
<b:loop values=’data:post.labels’ var=’label’>
<a expr:href=’data:label.url’ rel=’tag’><data:label.name/></a><b:if cond=’data:label.isLast != &quot;true&quot;’>,</b:if>
</b:loop>
</b:if>
</span>
</div>

<div class=’post-footer-line post-footer-line-3′>
<span class=’post-location’>
<b:if cond=’data:top.showLocation’>
<b:if cond=’data:post.location’>
<data:postLocationLabel/>
<a expr:href=’data:post.location.mapsUrl’ target=’_blank’><data:post.location.name/></a>
</b:if>
</b:if>
</span>
</div>
</div>
</div>
</b:includable>
<b:includable id=’postQuickEdit’ var=’post’>
<b:if cond=’data:post.editUrl’>
<span expr:class=’&quot;item-control &quot; data:post.adminClass’>
<a expr:href=’data:post.editUrl’ expr:title=’data:top.editPostMsg’>
<img alt=” class=’icon-action’ height=’18’ src=’http://www.blogger.com/img/icon18_edit_allbkg.gif’ width=’18’/>
</a>
</span>
</b:if>
</b:includable>
<b:includable id=’commentDeleteIcon’ var=’comment’>
<span expr:class=’&quot;item-control &quot; data:comment.adminClass’>
<a expr:href=’data:comment.deleteUrl’ expr:title=’data:top.deleteCommentMsg’>
<img src=’http://www.blogger.com/img/icon_delete13.gif’/>
</a>
</span>
</b:includable>
<b:includable id=’backlinkDeleteIcon’ var=’backlink’>
<span expr:class=’&quot;item-control &quot; data:backlink.adminClass’>
<a expr:href=’data:backlink.deleteUrl’ expr:title=’data:top.deleteBacklinkMsg’>
<img src=’http://www.blogger.com/img/icon_delete13.gif’/>
</a>
</span>
</b:includable>
<b:includable id=’comments’ var=’post’>
<div class=’comments’ id=’comments’>
<a name=’comments’/>
<b:if cond=’data:post.allowComments’>
<h4>
<b:if cond=’data:post.numComments == 1′>
1 <data:commentLabel/>:
<b:else/>
<data:post.numComments/> <data:commentLabelPlural/>:
</b:if>
</h4>

<b:if cond=’data:post.commentPagingRequired’>
<span class=’paging-control-container’>
<a expr:class=’data:post.oldLinkClass’ expr:href=’data:post.oldestLinkUrl’><data:post.oldestLinkText/></a>
&#160;
<a expr:class=’data:post.oldLinkClass’ expr:href=’data:post.olderLinkUrl’><data:post.olderLinkText/></a>
&#160;
<data:post.commentRangeText/>
&#160;
<a expr:class=’data:post.newLinkClass’ expr:href=’data:post.newerLinkUrl’><data:post.newerLinkText/></a>
&#160;
<a expr:class=’data:post.newLinkClass’ expr:href=’data:post.newestLinkUrl’><data:post.newestLinkText/></a>
</span>
</b:if>

<dl id=’comments-block’>
<b:loop values=’data:post.comments’ var=’comment’>
<dt expr:class=’&quot;comment-author &quot; data:comment.authorClass’ expr:id=’data:comment.anchorName’>
<b:if cond=’data:comment.favicon’>
<img expr:src=’data:comment.favicon’ height=’16px’ style=’margin-bottom:-2px;’ width=’16px’/>
</b:if>
<a expr:name=’data:comment.anchorName’/>
<b:if cond=’data:comment.authorUrl’>
<a expr:href=’data:comment.authorUrl’ rel=’nofollow’><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
</dt>
<dd class=’comment-body’>
<b:if cond=’data:comment.isDeleted’>
<span class=’deleted-comment’><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>
<dd class=’comment-footer’>
<span class=’comment-timestamp’>
<a expr:href=’data:comment.url’ title=’comment permalink’>
<data:comment.timestamp/>
</a>
<b:include data=’comment’ name=’commentDeleteIcon’/>
</span>
</dd>
</b:loop>
</dl>

<b:if cond=’data:post.commentPagingRequired’>
<span class=’paging-control-container’>
<a expr:class=’data:post.oldLinkClass’ expr:href=’data:post.oldestLinkUrl’>
<data:post.oldestLinkText/>
</a>
<a expr:class=’data:post.oldLinkClass’ expr:href=’data:post.olderLinkUrl’>
<data:post.olderLinkText/>
</a>
&#160;
<data:post.commentRangeText/>
&#160;
<a expr:class=’data:post.newLinkClass’ expr:href=’data:post.newerLinkUrl’>
<data:post.newerLinkText/>
</a>
<a expr:class=’data:post.newLinkClass’ expr:href=’data:post.newestLinkUrl’>
<data:post.newestLinkText/>
</a>
</span>
</b:if>

<p class=’comment-footer’>
<b:if cond=’data:post.embedCommentForm’>
<b:if cond=’data:post.allowNewComments’>
<b:include data=’post’ name=’comment-form’/>
<b:else/>
<data:post.noNewCommentsText/>
</b:if>
<b:else/>
<b:if cond=’data:post.allowComments’>
<a expr:href=’data:post.addCommentUrl’ expr:onclick=’data:post.addCommentOnclick’><data:postCommentMsg/></a>
</b:if>
</b:if>

</p>
</b:if>

<div id=’backlinks-container’>
<div expr:id=’data:widget.instanceId &quot;_backlinks-container&quot;’>
<b:if cond=’data:post.showBacklinks’>
<b:include data=’post’ name=’backlinks’/>
</b:if>
</div>
</div>
</div>
</b:includable>
<b:includable id=’comment-form’ var=’post’>
<div class=’comment-form’>
<a name=’comment-form’/>
<h4 id=’comment-post-message’><data:postCommentMsg/></h4>
<p><data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
<a expr:href=’data:post.commentFormIframeSrc’ id=’comment-editor-src’/>
<iframe allowtransparency=’true’ class=’blogger-iframe-colorize blogger-comment-from-post’ frameborder=’0′ height=’275′ id=’comment-editor’ name=’comment-editor’ scrolling=’no’ src=” width=’100%’/>
<data:post.friendConnectJs/>
<data:post.cmtfpIframe/>
<script type=’text/javascript’>
BLOG_CMT_createIframe(&#39;<data:post.appRpcRelayPath/>&#39;, &#39;<data:post.communityId/>&#39;);
</script>
</div>
</b:includable>
<b:includable id=’backlinks’ var=’post’>
<a name=’links’/><h4><data:post.backlinksLabel/></h4>
<b:if cond=’data:post.numBacklinks != 0′>
<dl class=’comments-block’ id=’comments-block’>
<b:loop values=’data:post.backlinks’ var=’backlink’>
<div class=’collapsed-backlink backlink-control’>
<dt class=’comment-title’>
<span class=’backlink-toggle-zippy’>&#160;</span>
<a expr:href=’data:backlink.url’ rel=’nofollow’><data:backlink.title/></a>
<b:include data=’backlink’ name=’backlinkDeleteIcon’/>
</dt>
<dd class=’comment-body collapseable’>
<data:backlink.snippet/>
</dd>
<dd class=’comment-footer collapseable’>
<span class=’comment-author’><data:post.authorLabel/> <data:backlink.author/></span>
<span class=’comment-timestamp’><data:post.timestampLabel/> <data:backlink.timestamp/></span>
</dd>
</div>
</b:loop>
</dl>
</b:if>
<p class=’comment-footer’>
<a class=’comment-link’ expr:href=’data:post.createLinkUrl’ expr:id=’data:widget.instanceId &quot;_backlinks-create-link&quot;’ target=’_blank’><data:post.createLinkLabel/></a>
</p>
</b:includable>
<b:includable id=’feedLinks’>
<b:if cond=’data:blog.pageType != &quot;item&quot;’> <!– Blog feed links –>
<b:if cond=’data:feedLinks’>
<div class=’blog-feeds’>
<b:include data=’feedLinks’ name=’feedLinksBody’/>
</div>
</b:if>

<b:else/> <!–Post feed links –>
<div class=’post-feeds’>
<b:loop values=’data:posts’ var=’post’>
<b:if cond=’data:post.allowComments’>
<b:if cond=’data:post.feedLinks’>
<b:include data=’post.feedLinks’ name=’feedLinksBody’/>
</b:if>
</b:if>
</b:loop>
</div>
</b:if>
</b:includable>
<b:includable id=’feedLinksBody’ var=’links’>
<div class=’feed-links’>
<data:feedLinksMsg/>
<b:loop values=’data:links’ var=’f’>
<a class=’feed-link’ expr:href=’data:f.url’ expr:type=’data:f.mimeType’ target=’_blank’><data:f.name/> (<data:f.feedType/>)</a>
</b:loop>
</div>
</b:includable>
<b:includable id=’status-message’>
<b:if cond=’data:navMessage’>
<div class=’status-msg-wrap’>
<div class=’status-msg-body’>
<data:navMessage/>
</div>
<div class=’status-msg-border’>
<div class=’status-msg-bg’>
<div class=’status-msg-hidden’><data:navMessage/></div>
</div>
</div>
</div>
<div style=’clear: both;’/>
</b:if>
</b:includable>
</b:widget>
</b:section>
</div></div>

<div id=’sidebar-wrap’>

<div id=’sidebartop-wrap’><div id=’sidebartop-wrap2′>
<b:section class=’sidebar’ id=’sidebartop’>
<b:widget id=’HTML1′ locked=’false’ title=” type=’HTML’>
<b:includable id=’main’>
<!– only display title if it’s non-empty –>
<b:if cond=’data:title != &quot;&quot;’>
<h2 class=’title’><data:title/></h2>
</b:if>
<div class=’widget-content’>
<data:content/>
</div>

<b:include name=’quickedit’/>
</b:includable>
</b:widget>
</b:section>
</div></div>

<div id=’sidebarbottom-wrap1′><div id=’sidebarbottom-wrap2′>
<b:section class=’sidebar’ id=’sidebar’ preferred=’yes’>
<b:widget id=’Subscribe1′ locked=’false’ title=’%uAD6C%uB3C5′ type=’Subscribe’>
<b:includable id=’main’>
<b:if cond=’data:isPublic’>
<div style=’white-space:nowrap’>

<b:if cond=’data:title != &quot;&quot;’>
<h2 class=’title’><data:title/></h2>
</b:if>
<div class=’widget-content’>
<b:loop values=’data:feeds’ var=’feed’>
<div expr:class=’&quot;subscribe-wrapper subscribe-type-&quot; data:feed.type’>

<div expr:class=’&quot;subscribe expanded subscribe-type-&quot; data:feed.type’ expr:id=’&quot;SW_READER_LIST_&quot; data:widgetId data:feed.type’ style=’display:none;’>

<div class=’top’>
<span class=’inner’ expr:onclick=’&quot;return(_SW_toggleReaderList(event, &quot;&quot; data:widgetId data:feed.type &quot;&quot;));&quot;’>
<img class=’subscribe-dropdown-arrow’ expr:src=’data:arrowDropdownImg’/>
<img align=’absmiddle’ alt=” border=’0′ class=’feed-icon’ expr:src=’data:feedIconImg’/>
<data:feed.title/>
</span>

<ul class=’feed-reader-links’>
<a class=’feed-reader-link’ expr:href=’&quot;http://www.google.com/ig/add?source=bstp&amp;feedurl=&quot; data:feed.encodedUrl’ target=’_blank’>
<img expr:src=’data:imagePathBase &quot;subscribe-google.png&quot;’/>
</a>
<a class=’feed-reader-link’ expr:href=’&quot;http://www.bloglines.com/sub/&quot; data:feed.url’ target=’_blank’>
<img expr:src=’data:imagePathBase &quot;subscribe-bloglines.png&quot;’/>
</a>
<a class=’feed-reader-link’ expr:href=’&quot;http://www.netvibes.com/subscribe.php?url=&quot; data:feed.encodedUrl’ target=’_blank’>
<img expr:src=’data:imagePathBase &quot;subscribe-netvibes.png&quot;’/>
</a>
<a class=’feed-reader-link’ expr:href=’&quot;http://www.newsgator.com/ngs/subscriber/subext.aspx?url=&quot; data:feed.encodedUrl’ target=’_blank’>
<img expr:src=’data:imagePathBase &quot;subscribe-newsgator.png&quot;’/>
</a>
<a class=’feed-reader-link’ expr:href=’&quot;http://add.my.yahoo.com/content?url=&quot; data:feed.encodedUrl’ target=’_blank’>
<img expr:src=’data:imagePathBase &quot;subscribe-yahoo.png&quot;’/>
</a>
<a class=’feed-reader-link’ expr:href=’data:feed.url’ target=’_blank’>
<img align=’absmiddle’ class=’feed-icon’ expr:src=’data:feedIconImg’/>
Atom
</a>
</ul>

</div>
<div class=’bottom’/>
</div>

<div class=’subscribe’ expr:id=’&quot;SW_READER_LIST_CLOSED_&quot; data:widgetId data:feed.type’ expr:onclick=’&quot;return(_SW_toggleReaderList(event, &quot;&quot; data:widgetId data:feed.type &quot;&quot;));&quot;’>
<div class=’top’>
<span class=’inner’>
<img class=’subscribe-dropdown-arrow’ expr:src=’data:arrowDropdownImg’/>
<span expr:onclick=’&quot;return(_SW_toggleReaderList(event, &quot;&quot; data:widgetId data:feed.type &quot;&quot;));&quot;’>
<img align=’absmiddle’ alt=” border=’0′ class=’feed-icon’ expr:src=’data:feedIconImg’/>
<data:feed.title/>
</span>
</span>
</div>
<div class=’bottom’/>
</div>

</div>
</b:loop>

<div style=’clear:both’/>

</div>
</div>

<b:include name=’quickedit’/>

</b:if>
</b:includable>
</b:widget>
<b:widget id=’Followers1′ locked=’false’ title=’%uAD00%uC2EC%uC788%uB294 %uC0AC%uC6A9%uC790′ type=’Followers’>
<b:includable id=’main’>
<b:if cond=’data:title != &quot;&quot;’>
<b:if cond=’data:codeSnippet != &quot;&quot;’>
<h2 class=’title’><data:title/></h2>
<b:else/>
<b:if cond=’data:totalFollowerCount != &quot;&quot;’>
<h2 class=’title’><data:title/> (<data:totalFollowerCount/>)</h2>
</b:if>
</b:if>
</b:if>

<div expr:id=’data:widget.instanceId &quot;-wrapper&quot;’>
<b:if cond=’data:codeSnippet != &quot;&quot;’>
<div style=’margin-right:2px;’>
<data:codeSnippet/>
</div>
<b:else/>
<b:if cond=’data:totalFollowerCount == &quot;&quot;’>
<span class=’item-control following-not-admin’>
<b><data:failureSnippet/></b>
</span>
<span class=’item-control blog-admin’>
<b><data:adminFailureSnippet/></b>
</span>
<b:else/>
<b:if cond=’data:followingLinkPresent’>
<div class=’follow-this profile-link item-control following-follow-this’>
<a expr:href=’&quot;javascript:_FollowersView._openPopup(&quot;&quot; data:followUri &quot;&quot;);&quot;’>
<data:followThisMessage/>
</a>
</div>
<div class=’follow-this profile-link item-control following-stop-following-this’>
<a expr:href=’&quot;javascript:_FollowersView._openPopup(&quot;&quot; data:followUri &quot;&quot;);&quot;’>
<data:stopFollowingMessage/>
</a>
</div>
</b:if>

<div class=’followers-grid’>
<b:if cond=’data:totalFollowerCount == 0′>
<div class=’profile-link item-control following-follow-this’>
<data:emptyFollowersMessage/>
</div>
</b:if>
<!–
Relies on the js written out in navbar.gxp
–>
<b:loop values=’data:followers’ var=’follower’>
<div class=’follower’>
<a expr:href=’data:follower.profileUrl’ expr:title=’data:follower.displayName’ rel=’nofollow’>
<img class=’follower-img’ expr:alt=’data:follower.displayName’ expr:height=’data:follower.imageHeight’ expr:onerror=’&quot;this.onerror=null;this.src=&quot;&quot; data:anonFollowerImageUrl &quot;&quot;;&quot;’ expr:onload=’&quot;setAttributeOnload(this, &quot;src&quot;, &quot;&quot; data:follower.imageUrl &quot;&quot;)&quot;’ expr:width=’data:follower.imageWidth’ src=’http://img1.blogblog.com/img/blank.gif’/>
</a>
</div>
</b:loop>
<div class=’clear’/>
</div>

<div class=’followers-canvas profile-link’>
<data:followersFooterMessage/>
<span class=’item-control following-not-admin’>
<a expr:href=’data:followersUri’>
<data:viewAllMessage/>
</a>
</span>
<span class=’item-control blog-admin’>
<a expr:href=’data:manageFollowersUri’>
<data:manageFollowersMessage/>
</a>
</span>
</div>
</b:if>
</b:if>
<b:include name=’quickedit’/>
</div>
</b:includable>
</b:widget>
<b:widget id=’BlogArchive1′ locked=’false’ title=’%uBE14%uB85C%uADF8 %uC544%uCE74%uC774%uBE0C’ type=’BlogArchive’>
<b:includable id=’main’>
<b:if cond=’data:title’>
<h2><data:title/></h2>
</b:if>
<div class=’widget-content’>
<div id=’ArchiveList’>
<div expr:id=’data:widget.instanceId &quot;_ArchiveList&quot;’>
<b:if cond=’data:style == &quot;HIERARCHY&quot;’>
<b:include data=’data’ name=’interval’/>
</b:if>
<b:if cond=’data:style == &quot;FLAT&quot;’>
<b:include data=’data’ name=’flat’/>
</b:if>
<b:if cond=’data:style == &quot;MENU&quot;’>
<b:include data=’data’ name=’menu’/>
</b:if>
</div>
</div>
<b:include name=’quickedit’/>
</div>
</b:includable>
<b:includable id=’flat’ var=’data’>
<ul>
<b:loop values=’data:data’ var=’i’>
<li class=’archivedate’>
<a expr:href=’data:i.url’><data:i.name/></a> (<data:i.post-count/>)
</li>
</b:loop>
</ul>
</b:includable>
<b:includable id=’menu’ var=’data’>
<select expr:id=’data:widget.instanceId &quot;_ArchiveMenu&quot;’>
<option value=”><data:title/></option>
<b:loop values=’data:data’ var=’i’>
<option expr:value=’data:i.url’><data:i.name/> (<data:i.post-count/>)</option>
</b:loop>
</select>
</b:includable>
<b:includable id=’interval’ var=’intervalData’>
<b:loop values=’data:intervalData’ var=’i’>
<ul>
<li expr:class=’&quot;archivedate &quot; data:i.expclass’>
<b:include data=’i’ name=’toggle’/>
<a class=’post-count-link’ expr:href=’data:i.url’><data:i.name/></a>
<span class=’post-count’ dir=’ltr’>(<data:i.post-count/>)</span>
<b:if cond=’data:i.data’>
<b:include data=’i.data’ name=’interval’/>
</b:if>
<b:if cond=’data:i.posts’>
<b:include data=’i.posts’ name=’posts’/>
</b:if>
</li>
</ul>
</b:loop>
</b:includable>
<b:includable id=’toggle’ var=’interval’>
<b:if cond=’data:interval.toggleId’>
<b:if cond=’data:interval.expclass == &quot;expanded&quot;’>
<a class=’toggle’ expr:href=’data:widget.actionUrl &quot;&amp;action=toggle&quot; &quot;&amp;dir=close&amp;toggle=&quot; data:interval.toggleId &quot;&amp;toggleopen=&quot; data:toggleopen’>
<span class=’zippy toggle-open’>&#9660; </span>
</a>
<b:else/>
<a class=’toggle’ expr:href=’data:widget.actionUrl &quot;&amp;action=toggle&quot; &quot;&amp;dir=open&amp;toggle=&quot; data:interval.toggleId &quot;&amp;toggleopen=&quot; data:toggleopen’>
<span class=’zippy’>
<b:if cond=’data:blog.languageDirection == &quot;rtl&quot;’>
&#9668;
<b:else/>
&#9658;
</b:if>
</span>
</a>
</b:if>
</b:if>
</b:includable>
<b:includable id=’posts’ var=’posts’>
<ul class=’posts’>
<b:loop values=’data:posts’ var=’i’>
<li><a expr:href=’data:i.url’><data:i.title/></a></li>
</b:loop>
</ul>
</b:includable>
</b:widget>
</b:section>
</div></div>

</div>

<div id=’footer-wrap1′><div id=’footer-wrap2′>
<b:section class=’footer’ id=’footer’/>
</div></div>
</div></div>

</div>
</body>
</html>