🧾

노션에 엑셀 표 그대로 넣기

주의! 2021년 11월 19일자로 노션은 심플 테이블 기능을 정식 지원하기 시작했습니다. 따라서 본 포스팅의 활용도는 크게 위축되었으니 참고해주시기 바랍니다.
노션에 표를 있는 그대로 넣는 방법! (구글 스프레드 시트 임베딩 아님)

우리의 기대와 노션의 현실

응 안 돼...

제작 절차

1.
엑셀 혹은 구글 스프레드시트에서 열심히 만든 표를 복사한다.
2.
HTML Table Generator 에 붙여넣고 html로 변환한다
•
사이트 링크
•
File → Paste table data → Ctrl V (cmd V) → Paste with formatting 란 체크
체크해야만 표의 배경색, 디자인을 그대로 입힐 수 있어요
•
Generate 버튼 클릭 & Copy to clipboard 버튼 클릭
3.
변환한 HTML을 DIY 임베딩 프로그램으로 변환한 링크를 노션에 바로 붙인다
•
DIY Embed URL 사이트 링크
노션 한국 사용자 모임의 이한결님께서 만든 사이트의 도움을 받았습니다
•
Paste any html code 에 위 사이트에서 복사해 온 걸 그대로 붙여넣고 Generate URL 버튼 클릭
•
Here you go! 의 링크를 복사해 노션에 paste 한 뒤, create embed로 넣는다.
4.
결과물을 가다듬는다.
•
아래의 표가 임베딩으로 탄생한 표입니다.
•
노션 안에서 표 수정 (데이터, 크기, 디자인 등) 이 불가능하니 앞 절차에서 충분히 다듬어 주세요.

몇가지 팁들

•
표의 배경은 회색이 기본값입니다. 흰색 혹은 다크모드에 맞는 검정색을 희망하시는 분들은 표 제작 단계에서부터 표의 배경색 + 표 테두리 색을 지정해 주셔야 합니다.
•
HTML Table Generator 에서 csv를 바로 import 할 수도 있습니다.
•
간단한 표는 HTML Table Generator에서 직접 제작할 수 있습니다.

써보고 아쉬운 점

•
노션 개발팀이 빠르게 에버노트와 드롭박스의 simple table을 만들어 줬으면 좋겠습니다
•
HTML을 임베딩할 수 있는 DIY Embed URL만 있으면 HTML과 CSS 디자인에 능숙하신 분들은 보다 좋은 퀄리티의 표를 넣을 수 있을 거라 생각합니다 (제가 이 분야를 잘 알지는 못해서 아쉽네요)
•
HTML Table Generator 사이트 내에서 약간의 표 수정이 가능합니다. 다만 row의 폭 조절이 안 되는 것 같아서 아쉬웠습니다.
그래도 노션에 가운데정렬, 배경색, 이미지도 포함되는 표를 넣을 수 있는 게 어디입니까!!
김문과의 데이터