转到主要内容
  • 申請訂閱首爾新聞 刊物
  • visiting seoul?
  • 首頁>
  • 컨텐츠 가이드 페이지
T T

컨텐츠 가이드 페이지

컨텐츠 수정시 주의사항 
아래 가이드를 보면 c_img_box, c_base_txt 처럼 
단순히 이미지나 텍스트만 들어가는 경우에는 html 변환을 하지 않아도 쉽게 에디터에서 바로
수정이 가능하지만 그 외 class 들은 수정하다가 태그가 빠지면 레이아웃이 틀어지는 경우가 있으므로
수정시에 html 코드로 변환하고 내용을 메모장에 복사 해둔 다음에 작업하시면 레이아웃이 틀어져도
복원이 가능하며 수정하면서 어디가 잘못 되었는지 쉽게 찾을 수 있습니다.

대 타이틀<h2>

중 타이틀<h3>

중-소 타이틀<h4>

소 타이틀<h5>
소-소 타이틀<h6>

서울시는 서울시민만큼이나 서울을 사랑하는 외국인들을 서울시 명예시민으로 선정해, 매년 10월28일 명예시민의 날에 명예시민증을 수여하고 있습니다.

AI DownloadJPG Download

텍스트 클래스명: c_top_txt 
파란색상을 넣고 싶을때:
html에서 파란글씨 넣고 싶은 영역에 아래 예시처럼 하시면 됩니다.
<p>설명글~ <span class="blue">서울시 명예시민</span> ~설명글</p>



버튼영역:
<p>
<a class="btn_down_32" href="#">AI Download</a>
<a class="btn_down_32" href="#">JPG Download</a>
</p>

sample

현재 총 666명의 외국인이 명예시민으로 선정 되었으며, 이들은 서울시가 주관하는 각종 행사 초청은 물론 서울시정에 적극적으로 참여 할 수 있는 기회를 제공받고, 서울시립미술관 서울역사박물관 등을 무료로 입장할 수 있습니다.

명예시민으로 선정되면 시가 주관하는 각종 행사에 초청되는 등 시정에 적극적으로 참여할 수 있는 기회가 확대되며, 서울 시립미술관·서울역사박물관·서울대공원 등에 무료입장이 가능합니다.

이미지 클래스명: c_img_box 
에디터 메뉴에서 파일첨부(정사각형 그림) 클릭하고 넣고 싶은 사진을 업로드 하여 올리면 됩니다.
<p><img src="이미지경로"></p>
텍스트 클래스명: c_base_txt 
기본 텍스트만 있을 경우 font-size:14px;
<p>텍스트</p>
<p>텍스트</p>

sample

이미지 클래스명: c_img_box 
c_img_box 클래스의 이미지 사이즈는 가로 100% 값을 가지고 있어서 
이미지 사이즈가 작으면 위와 같이 이미지가 깨져 보일 수 있습니다.
<p><img src="이미지경로"></p>

청룽1999

한국사람이 남다른 영화배우청룽

청룽1999

한국사람이 남다른 영화배우청룽

청룽1999

2002 FIFA월드컵에서 한국을 4강으로 이끈 감독거스 히딩크

클래스명: c_honor_list 
커뮤니티-명예시민 리스트 영역입니다.
사진업로드 방식은 동일합니다. 텍스트 부분을 보면 폰트굵기가 다릅니다. 

보통굵기에 텍스트는 설명글이고 굵은폰트(<b>태그)가 이름에 해당됩니다.
html로 코드를 봤을때 아래와 같이 나와야 레이아웃이 깨지지 않기 때문에 수정 시 주의 바랍니다.
<p><img src="이미지경로" ></p>
<p>2002 FIFA월드컵에서 한국을 4강으로 이끈 감독<b>청룽</b></p>
수여대상(c_jum_list 클래스 안에 h5 넣음)
  • 수여인원 : 총 92개국 666명
  • 수여내역 : 시 방문 외빈 109, 시정공로자 370, 국제대회 참석 163, 기타 7시 방문 외빈 109, 시정공로자 370, 국제대회 참석 163, 기타 7시 방문 외빈 109, 시정공로자 370, 국제대회 참석 163, 기타 7시 방문 외빈 109, 시정공로자 370, 국제대회 참석 163, 기타 7
  • 타이틀 설명글 구분없이 그냥 내용만 있는경우 타이틀 설명글 구분없이 그냥 내용만 있는경우타이틀 설명글 구분없이 그냥 내용만 있는경우타이틀 설명글 구분없이 그냥 내용만 있는경우
클래스명: c_jum_list 
앞에 점이 있는 리스트 형식입니다. 
수정시에  html 전환해서 리스트에서 수여인원과 같이 타이틀 해당되는 영역에는 class="jum_title"
추가해주고 설명글에는 class="jum_ex"를 추가해 주어야 합니다.
이때 파란색으로 글씨를 넣고 싶은 영역에는 class="blue"라는 클래스를 추가 할 수 있습니다. 
<h5>타이틀</h5>
<ul>
<li><span class="jum_title">타이틀 : </span>
<span class="jum_ex">설명글 <span class="blue">파란색</span></span></li>
<li>타이틀 설명글 구분없이 그냥 내용만 있는경우</li>
</ul>

택배홈페이지http://global.seoul.go.kr/ 

사이트바로가기중영일

클래스명: c_link_txt
바로가기, 새창. 
타이틀영역에는 class="blank" 클래스 추가, 타이틀 앞에 이미지를 없애고 싶을때는 class="blank" 
없애주시면 됩니다.
텍스트 영역에 링크 넣을때:
해당영역을 선택하고 에디터 메뉴에서 클립모양의 링크버튼을 선택한 후 Insert Link를 선택하면
레이어가 뜹니다. 거기에 주소를 입력하고 확인을 누르면 새창으로 연결됩니다.   
<p><b class="blank">타이틀</b>
<a class="blue" target="_blank" href="주소">http://global.seoul.go.kr/</a></p>
<p><a class="btn_white_22" target="_blank" href="주소">사이트바로가기</a>
<a class="n_trans" target="_blank" href="주소">중</a>
<a class="n_trans" target="_blank" href="주소">영</a>
<a class="n_trans" target="_blank" href="주소">일</a></p>
  • 서울시, 33개국 80개 주요도시에서 해외통신원 145명 운영 중
  • 서울시, 33개국 80개 주요도시에서 해외통신원 145명 운영 중
클래스명: c_check_list 
에디터메뉴에서 첫번째 리스트 메뉴를 클릭하고 텍스트 입력하시면 됩니다.
파란글씨 부분은 html에서 class="blue" 추가 하시면 됩니다.
<ul>
<li>설명글~<span class="blue">파란색</span>~설명글</li>
</ul>
[content-builder]{“id”:1,”version”:”1.0.4″,”nextId”:174,”block”:”root”,”layout”:”12″,”childs”:[{“id”:”101″,”block”:”rte”,”content”:”\ucee8\ud150\uce20 \uc218\uc815\uc2dc \uc8fc\uc758\uc0ac\ud56d <\/b>\n\n
\uc544\ub798 \uac00\uc774\ub4dc\ub97c \ubcf4\uba74 c_img_box, c_base_txt \ucc98\ub7fc \n\ub2e8\uc21c\ud788 \uc774\ubbf8\uc9c0\ub098 \ud14d\uc2a4\ud2b8\ub9cc \ub4e4\uc5b4\uac00\ub294 \uacbd\uc6b0\uc5d0\ub294 html \ubcc0\ud658\uc744 \ud558\uc9c0 \uc54a\uc544\ub3c4 \uc27d\uac8c \uc5d0\ub514\ud130\uc5d0\uc11c \ubc14\ub85c\n\uc218\uc815\uc774 \uac00\ub2a5\ud558\uc9c0\ub9cc \uadf8 \uc678 class \ub4e4\uc740 \uc218\uc815\ud558\ub2e4\uac00 \ud0dc\uadf8\uac00 \ube60\uc9c0\uba74 \ub808\uc774\uc544\uc6c3\uc774 \ud2c0\uc5b4\uc9c0\ub294 \uacbd\uc6b0\uac00 \uc788\uc73c\ubbc0\ub85c\n\uc218\uc815\uc2dc\uc5d0 html \ucf54\ub4dc\ub85c \ubcc0\ud658\ud558\uace0 \ub0b4\uc6a9\uc744 \uba54\ubaa8\uc7a5\uc5d0 \ubcf5\uc0ac \ud574\ub454 \ub2e4\uc74c\uc5d0 \uc791\uc5c5\ud558\uc2dc\uba74 \ub808\uc774\uc544\uc6c3\uc774 \ud2c0\uc5b4\uc838\ub3c4\n\ubcf5\uc6d0\uc774 \uac00\ub2a5\ud558\uba70 \uc218\uc815\ud558\uba74\uc11c \uc5b4\ub514\uac00 \uc798\ubabb \ub418\uc5c8\ub294\uc9c0 \uc27d\uac8c \ucc3e\uc744 \uc218 \uc788\uc2b5\ub2c8\ub2e4.\n<\/pre>\n","class":"c_nho_txt02"},{"id":"56","block":"heading","heading":"h2","text":"\ub300 \ud0c0\uc774\ud2c0<h2>","link":"","title":"","class":""},{"id":"3","block":"heading","heading":"h3","text":"\uc911 \ud0c0\uc774\ud2c0<h3>","link":"","title":"","class":""},{"id":"4","block":"heading","heading":"h4","text":"\uc911-\uc18c \ud0c0\uc774\ud2c0<h4>","link":"","title":"","class":""},{"id":"5","block":"heading","heading":"h5","text":"\uc18c \ud0c0\uc774\ud2c0<h5>","link":"","title":"","class":""},{"id":"6","block":"heading","heading":"h6","text":"\uc18c-\uc18c \ud0c0\uc774\ud2c0<h6>","link":"","title":"","class":""},{"id":"7","block":"divider"},{"id":20,"block":"layout","layout":"12","childs":[{"id":"21","block":"rte","content":"
\uc11c\uc6b8\uc2dc\ub294 \uc11c\uc6b8\uc2dc\ubbfc\ub9cc\ud07c\uc774\ub098 \uc11c\uc6b8\uc744 \uc0ac\ub791\ud558\ub294 \uc678\uad6d\uc778\ub4e4\uc744 \uc11c\uc6b8\uc2dc \uba85\uc608\uc2dc\ubbfc<\/span>\uc73c\ub85c \uc120\uc815\ud574, \ub9e4\ub144 10\uc6d428\uc77c \uba85\uc608\uc2dc\ubbfc\uc758 \ub0a0<\/span>\uc5d0 \uba85\uc608\uc2dc\ubbfc\uc99d\uc744 \uc218\uc5ec\ud558\uace0 \uc788\uc2b5\ub2c8\ub2e4. <\/p>\n\n
AI Download<\/a>JPG Download<\/a><\/p>","class":"c_top_txt"}]},{"id":119,"block":"layout","layout":"12","childs":[{"id":"125","block":"rte","content":"\ud14d\uc2a4\ud2b8 \ud074\ub798\uc2a4\uba85: c_top_txt <\/b> \n\n
\ud30c\ub780\uc0c9\uc0c1\uc744 \ub123\uace0 \uc2f6\uc744\ub54c:\nhtml\uc5d0\uc11c \ud30c\ub780\uae00\uc528 \ub123\uace0 \uc2f6\uc740 \uc601\uc5ed\uc5d0 \uc544\ub798 \uc608\uc2dc\ucc98\ub7fc \ud558\uc2dc\uba74 \ub429\ub2c8\ub2e4.\n<p>\uc124\uba85\uae00~ <span class=\"blue\">\uc11c\uc6b8\uc2dc \uba85\uc608\uc2dc\ubbfc<\/span> ~\uc124\uba85\uae00<\/p><\/span><\/pre>\n \n\n
\n
\n
\ubc84\ud2bc\uc601\uc5ed:\n<p>\n<a class=\"btn_down_32\" href=\"#\">AI Download<\/a>\n<a class=\"btn_down_32\" href=\"#\">JPG Download<\/a>\n<\/p><\/span><\/pre>\n <\/pre>","class":"c_nho_txt"}]},{"id":"87","block":"divider"},{"id":40,"block":"layout","layout":"6-6","childs":[[{"id":"41","block":"rte","content":"
\"sample\"<\/p>\n","class":"c_img_box"}],[{"id":"46","block":"rte","content":"
\ud604\uc7ac \ucd1d 666\uba85\uc758 \uc678\uad6d\uc778\uc774 \uba85\uc608\uc2dc\ubbfc\uc73c\ub85c \uc120\uc815 \ub418\uc5c8\uc73c\uba70, \uc774\ub4e4\uc740 \uc11c\uc6b8\uc2dc\uac00 \uc8fc\uad00\ud558\ub294 \uac01\uc885 \ud589\uc0ac \ucd08\uccad\uc740 \ubb3c\ub860 \uc11c\uc6b8\uc2dc\uc815\uc5d0 \uc801\uadf9\uc801\uc73c\ub85c \ucc38\uc5ec \ud560 \uc218 \uc788\ub294 \uae30\ud68c\ub97c \uc81c\uacf5\ubc1b\uace0, \uc11c\uc6b8\uc2dc\ub9bd\ubbf8\uc220\uad00 \uc11c\uc6b8\uc5ed\uc0ac\ubc15\ubb3c\uad00 \ub4f1\uc744 \ubb34\ub8cc\ub85c \uc785\uc7a5\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4. 
<\/p>
\uba85\uc608\uc2dc\ubbfc\uc73c\ub85c \uc120\uc815\ub418\uba74 \uc2dc\uac00 \uc8fc\uad00\ud558\ub294 \uac01\uc885 \ud589\uc0ac\uc5d0 \ucd08\uccad\ub418\ub294 \ub4f1 \uc2dc\uc815\uc5d0 \uc801\uadf9\uc801\uc73c\ub85c \ucc38\uc5ec\ud560 \uc218 \uc788\ub294 \uae30\ud68c\uac00 \ud655\ub300\ub418\uba70, \uc11c\uc6b8 \uc2dc\ub9bd\ubbf8\uc220\uad00\u00b7\uc11c\uc6b8\uc5ed\uc0ac\ubc15\ubb3c\uad00\u00b7\uc11c\uc6b8\ub300\uacf5\uc6d0 \ub4f1\uc5d0 \ubb34\ub8cc\uc785\uc7a5\uc774 \uac00\ub2a5\ud569\ub2c8\ub2e4.<\/p>\n","class":"c_base_txt"}]]},{"id":107,"block":"layout","layout":"12","childs":[{"id":"103","block":"rte","content":"\uc774\ubbf8\uc9c0 \ud074\ub798\uc2a4\uba85: c_img_box <\/b>\n\n
\uc5d0\ub514\ud130 \uba54\ub274\uc5d0\uc11c \ud30c\uc77c\ucca8\ubd80(\uc815\uc0ac\uac01\ud615 \uadf8\ub9bc) \ud074\ub9ad\ud558\uace0 \ub123\uace0 \uc2f6\uc740 \uc0ac\uc9c4\uc744 \uc5c5\ub85c\ub4dc \ud558\uc5ec \uc62c\ub9ac\uba74 \ub429\ub2c8\ub2e4.\n<p><img src=\"\uc774\ubbf8\uc9c0\uacbd\ub85c\"><\/p><\/span>\n<\/pre>","class":"c_nho_txt"},{"id":"106","block":"rte","content":"\ud14d\uc2a4\ud2b8 \ud074\ub798\uc2a4\uba85: c_base_txt<\/b>\n\n
\uae30\ubcf8 \ud14d\uc2a4\ud2b8\ub9cc \uc788\uc744 \uacbd\uc6b0 font-size:14px;\n<p>\ud14d\uc2a4\ud2b8<\/p>
<p>\ud14d\uc2a4\ud2b8<\/p>
<\/span><\/pre>\n","class":"c_nho_txt"}]},{"id":"89","block":"divider"},{"id":72,"block":"layout","layout":"12","childs":[{"id":"73","block":"rte","content":"
\"sample\"<\/p>\n","class":"c_img_box"}]},{"id":114,"block":"layout","layout":"12","childs":[{"id":"116","block":"rte","content":"\uc774\ubbf8\uc9c0 \ud074\ub798\uc2a4\uba85: c_img_box <\/b>\n\n
c_img_box \ud074\ub798\uc2a4\uc758 \uc774\ubbf8\uc9c0 \uc0ac\uc774\uc988\ub294 \uac00\ub85c 100% \uac12\uc744 \uac00\uc9c0\uace0 \uc788\uc5b4\uc11c \n\uc774\ubbf8\uc9c0 \uc0ac\uc774\uc988\uac00 \uc791\uc73c\uba74 \uc704\uc640 \uac19\uc774 \uc774\ubbf8\uc9c0\uac00 \uae68\uc838 \ubcf4\uc77c \uc218 \uc788\uc2b5\ub2c8\ub2e4.\n<p><img src=\"\uc774\ubbf8\uc9c0\uacbd\ub85c\"><\/p><\/span><\/pre>","class":"c_nho_txt"}]},{"id":"90","block":"divider"},{"id":83,"block":"layout","layout":"6-6","childs":[[{"id":"93","block":"rte","content":"
\"\uccad\ub8fd1999\"
\n<\/p>\n\n
\ud55c\uad6d\uc0ac\ub78c\uc774 \ub0a8\ub2e4\ub978 \uc601\ud654\ubc30\uc6b0\uccad\ub8fd<\/b>
\n<\/p>","class":"c_honor_list"},{"id":"118","block":"rte","content":"
\"\uccad\ub8fd1999\"
\n<\/p>\n\n
\ud55c\uad6d\uc0ac\ub78c\uc774 \ub0a8\ub2e4\ub978 \uc601\ud654\ubc30\uc6b0\uccad\ub8fd<\/b>
\n<\/p>","class":"c_honor_list"}],[{"id":"94","block":"rte","content":"
\"\uccad\ub8fd1999\"
\n<\/p>\n\n
2002 FIFA\uc6d4\ub4dc\ucef5\uc5d0\uc11c \ud55c\uad6d\uc744 4\uac15\uc73c\ub85c \uc774\ub048 \uac10\ub3c5\uac70\uc2a4 \ud788\ub529\ud06c<\/b>
\n<\/p>\n","class":"c_honor_list"}]]},{"id":"117","block":"rte","content":"\ud074\ub798\uc2a4\uba85: c_honor_list <\/b>\n\n
\ucee4\ubba4\ub2c8\ud2f0-\uba85\uc608\uc2dc\ubbfc \ub9ac\uc2a4\ud2b8 \uc601\uc5ed\uc785\ub2c8\ub2e4.\n\uc0ac\uc9c4\uc5c5\ub85c\ub4dc \ubc29\uc2dd\uc740 \ub3d9\uc77c\ud569\ub2c8\ub2e4. \ud14d\uc2a4\ud2b8 \ubd80\ubd84\uc744 \ubcf4\uba74 \ud3f0\ud2b8\uad75\uae30\uac00 \ub2e4\ub985\ub2c8\ub2e4. 
\n\ubcf4\ud1b5\uad75\uae30\uc5d0 \ud14d\uc2a4\ud2b8\ub294 \uc124\uba85\uae00\uc774\uace0 \uad75\uc740\ud3f0\ud2b8(<b>\ud0dc\uadf8)\uac00 \uc774\ub984\uc5d0 \ud574\ub2f9\ub429\ub2c8\ub2e4.\nhtml\ub85c \ucf54\ub4dc\ub97c \ubd24\uc744\ub54c \uc544\ub798\uc640 \uac19\uc774 \ub098\uc640\uc57c \ub808\uc774\uc544\uc6c3\uc774 \uae68\uc9c0\uc9c0 \uc54a\uae30 \ub54c\ubb38\uc5d0 \uc218\uc815 \uc2dc \uc8fc\uc758 \ubc14\ub78d\ub2c8\ub2e4.\n<p><img src=\"\uc774\ubbf8\uc9c0\uacbd\ub85c\" ><\/p>\n<p>2002 FIFA\uc6d4\ub4dc\ucef5\uc5d0\uc11c \ud55c\uad6d\uc744 4\uac15\uc73c\ub85c \uc774\ub048 \uac10\ub3c5<b>\uccad\ub8fd<\/b><\/p><\/span>  <\/pre>\n","class":"c_nho_txt"},{"id":"88","block":"divider"},{"id":69,"block":"layout","layout":"12","childs":[{"id":"70","block":"rte","content":"
\uc218\uc5ec\ub300\uc0c1(c_jum_list \ud074\ub798\uc2a4 \uc548\uc5d0 h5 \ub123\uc74c)
\n<\/h5>\n\n


分享 剪貼
電子信箱 復制