티스토리 블로그를 하다 보면 결국 html 태그로 글을 수정하는 데 익숙해져야 한다는 생각이 듭니다. 그래서 엑셀로 후다닥 작성해서, 그걸 테이블 태그로 변경하는 방법을 포스팅해 볼께요
이 글의 순서는 다음과 같습니다. 각 제목을 클릭하면 항목으로 이동하니 참고하세요!
테이블을 작성하는 편한 방법이 뭘까?
티스토리 에디터에서 만들어서 내용을 입력해도 됩니다.
근데 html은 기본적으로 뭔가 내용을 표현하는 방법이지, 사실 작성하기가 편한 구조는 아닌 거 같아요. 그래서 제가 엑셀에 익숙한 것에 더해 내용 작성이나 수정도 엑셀이 훨씬 수월하다는 느낌이 들었습니다.
그래서 일단은 내용은 엑셀로 쭉 작성해놓고 내용을 자동으로 테이블로 옮겨주면 좋겠다 싶어서 이 내용을 소개드립니다. 결국 결론은 엑셀로 작성한 내용을 테이블 태그로 변경해주는 엑셀 파일을 하나 공유하려고 해요
테이블 태그 생성 파일 주요 기능
공유할 파일은 vba로 작성한 xlsm 파일이구요, 공유할 파일의 기능은 크게 두가지입니다.
1. 테이블 생성 : 내용을 적으면 테이블을 생성하여 별도 시트에 저장해 줍니다.
2. rowspan : 몇 개 행을 합친 것도 병합된 것처럼 보이도록 해 줍니다.
테이블 생성
기본적으로 티스토리에서 테이블을 생성해 보면, <table> <tbody> <tr> <td> 이렇게 네개 태그를 사용하더라구요. 그래서 저도 그 태그들만으로 테이블을 생성합니다.
rowspan
rowspan 은 셀을 아래위로 병합해주는 태그 속성입니다.
<td rowspan=4> ... </td>
위처럼 쓰면 4개 행을 병합해 주고, 그 밑의 행에는 <td> 태그를 하나 사용하지 않는 식으로 쓰게 됩니다. 아래에 코드 예시를 보죠.
<table>
<tbody>
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
</tr>
<tr>
<td>낮음</td>
<td>높음</td>
<td>높음</td>
</tr>
<tr>
<td rowspan=2>낮음</td>
<td>높음</td>
<td>낮음</td>
</tr>
<tr>
<td>높음</td>
<td>높음</td>
</tr>
</tbody>
</table>td 태그 하나에 rowspan 옵션이 들어갔습니다. 그러면 그 다음줄은 기본적으로 병합되기 때문에, td 태그가 3개가 아니라 2개만 존재하게 됩니다. 이 기능을 파일로 구현했다는 뜻이예요! 위 코드를 그림으로 표현하면 아래와 같은 형태입니다.
사용 방법 및 다운로드
파일을 열면 시트가 두개 있습니다.
1. 내용 : 만들 테이블의 내용을 작성해 주세요. 작성 후에 "테이블 생성" 버튼을 눌러 주시기 바랍니다.
2. 태그 : 생성될 테이블의 태그가 붙여넣어집니다. 이 내용을 복사해서, 티스토리 에디터의 "html" 로 바꾼 후 붙여넣으시면 됩니다.
J 열 쯤에 "테이블 생성" 버튼이 있습니다. 위와 같이 내용을 작성하신 후 테이블 생성 버튼을 누르시면, "태그" 시트에 변환 결과가 붙여넣어집니다.
파일은 아래에서 다운 받으시면 됩니다.
* 기존 코드에 버그가 있어 새로 업로드하였습니다.
테이블 작성 후에 큰 노력 없이 html 태그로 만들려고 작성한 내용을 공유드립니다. 유용하게 쓰셨으면 좋겠고, 다음에 더 알찬 글로 돌아오겠습니다.
댓글