구글블로그 사용법: 구글 드라이브의 스프레드시트를 블로그에 삽입하기
1. 삽입할 스프레드시트의 삽입코드 얻기 (아래 그림 참조)
=> 구글 드라이브에서 삽입할 시트를 작성하거나 이미 작성된 시트를 연다
=> 오른쪽 맨 위의 메뉴바에서 파일(File) > 웹발행(Publish to the web...)
=> 열린 창에서 아래와 같이 설정한다
① 삽입할 시트 선택: 작은 화살표를 누르면 모든시트와 특정이름의 시트를 선택하는 창이 뜬다. 이 페이지의 예제에서는 "삽입예제"라고 이름 붙인 시트만 삽입되도록 "삽입예제"시트를 선택하였다.
② 자동업데이트 선택: 시트가 갱신되면 자동으로 재발행(업데이트 : Automatically republish when changes are made)할지를 선택한다. 체크를 하면 시트가 갱신되면 자동으로 블로그에도 업데이트 된다. 체크를 풀면(없애면) 시트가 갱신되어도 블로그에서는 갱신되지 않고 그대로 있다.
③ 발행형식 선택: 두 번째의 "페이지에 삽입할 HTML(HTML to embed in a page)"을 선택한다
④ 코드복사: 삽입코드를 마우스로 드래그하여 선택한 다음, [컨트롤+C]키를 쳐서 복사를 한다
=> 복사한 코드를 블로그에 삽입한다(자세한 방법은 아래 2.에서 설명)
2. 구글 블로그에 코드 삽입하기
블로그 글쓰기(Post)에서 [HTML]을 눌러 HTML편집창을 열고 아래 그림처름 코드를 붙여 넣는다.
1) 아래는 복사한 코드와 실제로 적용한 모습이다.
시트에서 얻은 코드에는 가로/세로의 길이가 조정되지 않아서 시트가 페이지에 잘 어울리지 않는다.
[시트에서 얻은 코드의 모습]
[실제로 적용한 모습]
2) 코드에서 가로/세로 길이를 페이지에 맞게 조정한다.
- 단위는 % 또는 px를 사용할 수 있다.
- 코드에 있는 frameborder="0"의 숫자 "0"은 테두리선을 그리지 않음을 뜻한다. 테두리선을 그리고 싶으면 선의 두께를 수자로 지정해 주면 된다.
- 시트를 좌우로 정렬하려면, align="left"등과 같이 코드를 추가하면 된다. 왼쪽정렬은 "left", 오른쪽 정렬은 "right", 가운데 정렬은 "center"이다.
이 예제에서는 가로/세로 길이를 아래와 같이 조정하였다.
[가로/세로 길이를 조정한 뒤의 코드 모습]
[길이를 조정한 뒤 적용한 모습]
>> 구글 드라이브 (Google Drive) 사용법 : 글 목록
=> 구글 드라이브에서 삽입할 시트를 작성하거나 이미 작성된 시트를 연다
=> 오른쪽 맨 위의 메뉴바에서 파일(File) > 웹발행(Publish to the web...)
=> 열린 창에서 아래와 같이 설정한다
① 삽입할 시트 선택: 작은 화살표를 누르면 모든시트와 특정이름의 시트를 선택하는 창이 뜬다. 이 페이지의 예제에서는 "삽입예제"라고 이름 붙인 시트만 삽입되도록 "삽입예제"시트를 선택하였다.
② 자동업데이트 선택: 시트가 갱신되면 자동으로 재발행(업데이트 : Automatically republish when changes are made)할지를 선택한다. 체크를 하면 시트가 갱신되면 자동으로 블로그에도 업데이트 된다. 체크를 풀면(없애면) 시트가 갱신되어도 블로그에서는 갱신되지 않고 그대로 있다.
③ 발행형식 선택: 두 번째의 "페이지에 삽입할 HTML(HTML to embed in a page)"을 선택한다
④ 코드복사: 삽입코드를 마우스로 드래그하여 선택한 다음, [컨트롤+C]키를 쳐서 복사를 한다
=> 복사한 코드를 블로그에 삽입한다(자세한 방법은 아래 2.에서 설명)
2. 구글 블로그에 코드 삽입하기
블로그 글쓰기(Post)에서 [HTML]을 눌러 HTML편집창을 열고 아래 그림처름 코드를 붙여 넣는다.
1) 아래는 복사한 코드와 실제로 적용한 모습이다.
시트에서 얻은 코드에는 가로/세로의 길이가 조정되지 않아서 시트가 페이지에 잘 어울리지 않는다.
[시트에서 얻은 코드의 모습]
<iframe frameborder="0" height="300" src="https://docs.google.com/spreadsheet/pub?key=0AsX0zuk69kU1dE1XQjNVOWxlbUhDR3NobVBmV3ctMWc&single=true&gid=0&output=html&widget=true" width="500"></iframe>
[실제로 적용한 모습]
2) 코드에서 가로/세로 길이를 페이지에 맞게 조정한다.
- 단위는 % 또는 px를 사용할 수 있다.
- 코드에 있는 frameborder="0"의 숫자 "0"은 테두리선을 그리지 않음을 뜻한다. 테두리선을 그리고 싶으면 선의 두께를 수자로 지정해 주면 된다.
- 시트를 좌우로 정렬하려면, align="left"등과 같이 코드를 추가하면 된다. 왼쪽정렬은 "left", 오른쪽 정렬은 "right", 가운데 정렬은 "center"이다.
이 예제에서는 가로/세로 길이를 아래와 같이 조정하였다.
[가로/세로 길이를 조정한 뒤의 코드 모습]
<iframe frameborder="0" height="300px" src="https://docs.google.com/spreadsheet/pub?key=0AsX0zuk69kU1dE1XQjNVOWxlbUhDR3NobVBmV3ctMWc&single=true&gid=0&output=html&widget=true" width="100%"></iframe>
[길이를 조정한 뒤 적용한 모습]
>> 구글 드라이브 (Google Drive) 사용법 : 글 목록