엑셀의 표를 티스토리의 표로 변환하는 매크로(1) - HTML 작성

1. 티스토리 표 작성의 어려움

티스토리에서 표를 작성하는 것은 네이버의 블로그보다 어려운 편입니다.
예를 들어 아래와 같이 3칸 표를 만든 후

맨 오른쪽에 열을 추가하게 되면 열의 폭을 조절할 수 있는 기능이 없어서

화면 위 기본모드를 눌러서 HTML모드로 바꾼 다음

아래와 같은 HTML 소스에서 width를 모두 25%로 수정해야 합니다. 그러나 바꾸기가 안되기 때문에 메모장 등에서 수정한 후 붙여 넣는 것이 편리합니다.

그러나 네이버 블로그에서는 '너비 맞춤' 기능이 있어 쉽게 열 너비를 일정하게 맞출 수 있습니다.

따라서 엑셀에서 표를 작성한 후 티스토리로 옮기는 것을 매크로로 다뤄보겠습니다.

HTML을 눌러 기본모드로 돌아옵니다.

2. 엑셀 표를 복사해서 티스토리에 붙여 넣기 안됨

네이버 블로그의 표를 복사해서 엑셀에 붙여 넣은 후

다시 엑셀의 표를 복사해서 티스토리에 붙여 넣고 보면 아래와 같이 표가 아니라 나열식으로 표시됩니다.

구분

이전

현행

1. 개인통관고유부호 발급사이트

‘개인통관고유부호 유효성 검증’ 가능

‘개인통관고유부호 유효성 검증’ 서비스 중단

2. 유니패스 사이트 내 ‘개인통관고유부호 유효성 검증’ 메뉴

비로그인 / 필수값인 개인통관고유부호 만으로 검증결과 확인 가능

로그인 / 개인통관고유부호, 성명, 휴대전화번호(전체) 입력 시에만 검증결과 표출

3. 오픈API를 이용한 ‘개인통관고유부호 유효성 검증’

필수값인 개인통관고유부호 만으로 검증결과 확인 가능

신규 신청접수 중단 / 개인통관고유부호, 성명, 휴대전화번호(전체) 입력 시에만 검증결과 표출

 

 

3. 엑셀 표를 티스토리에 맞게 변환하기

위 표를 티스토리에 맞게 하려면 table, tbody, tr과 td 태그를 추가하는 매크로를 만들어야 합니다.

Sub make_table()
    '변수 형식 선언
    Dim end_Row As Integer, end_Col As Integer, i As Integer, j As Integer
    
    ' 마지막 행과 열을 구함
    end_Row = Range("a1000").End(xlUp).Row
    end_Col = Cells(Range("a1000").End(xlUp).Row + 1, 100).End(xlToLeft).Column
    If end_Col = 1 Then
        For j = 1 To 100
            If InStr(Cells(end_Row, j), "<tr>") > 0 Then
                end_Col = j - 1
                Exit For
            End If
        Next
    End If
    
    ' 기존 데이터 지움
    Range(Cells(1, end_Col + 1), Cells(end_Row, 100)).ClearContents
    
    ' 첫번째로 기록할 셀에 table, tbody 입력
    Cells(1, end_Col + 1) = "<table style='border-collapse: collapse; width: 100%;' border='1' data-ke-align='alignLeft'><tbody>"
    
    '1행부터 끝행까지 반복 처리
    For i = 1 To end_Row
        '1열부터 끝열까지 반복 처리
        For j = 1 To end_Col
            '첫열에는 여는 tr태그, 끝열에는 닫는 tr태그를 넣고, 나머지는 td태그로 열고 닫기만 함
            Select Case j
                Case 1:
                    Cells(i, end_Col + j) = Cells(i, end_Col + j) & "<tr><td>" & Cells(i, j) & "</td>"
                Case end_Col:
                    Cells(i, end_Col + j) = Cells(i, end_Col + j) & "<td>" & Cells(i, j) & "</td></tr>"
                Case Else:
                    Cells(i, end_Col + j) = Cells(i, end_Col + j) & "<td>" & Cells(i, j) & "</td>"
            End Select
        Next
    Next
    
    ' 마지막에 닫는 tbody와 table 태그 추가
    Cells(end_Row, end_Col + j - 1) = Cells(end_Row, end_Col + j - 1) & "</tbody></table>"
End Sub

① 개발도구 visual Baisc을 누르고 Visual Basic Editor로 들어갑니다.

② 삽입 - 모듈을 눌러 통합 문서에 모듈을 추가하고,

③ 오른쪽 코드 창에 위 코드를 복사해서 붙여 넣습니다.

④ 그리고 파일 메뉴에서 'Excel로 돌아가기' 하위 메뉴를 누르거나

파일 메뉴 아래 엑셀 아이콘 모양을 눌러 엑셀로 돌아갑니다.

⑤ 개발도구 - 매크로를 누르고,

make_table 매크로를 선택한 다음 실행 버튼을 누릅니다.

그러면 아래와 같이 HTML 코드가 생성됩니다. <table>로 시작해서 </table>로 끝납니다.

⑥ D1셀부터 F4셀까지 마우스를 끌어서 생성된 HTML 코드를 선택하고

마우스 오른쪽 버튼을 누른 후 복사 메뉴를 누릅니다.

⑦ 티스토리 글에 붙여 넣어야 하므로, 기본모드를 눌러 HTML 모드로 변경합니다.

⑧ 마지막 줄에서 엔터 키를 눌러 줄을 추가한 다음 Ctrl + V키를 눌러 붙여 넣습니다. 그러면 아래와 같이 붙여 넣어지는데

오른쪽으로 너무 길어서 좌우로 잘라서 캡처하면 아래와 같습니다.

(왼쪽)

(오른쪽)

⑨ HTML을 눌러서 기본모드로 돌아오면

⑩ 위와 달리 아래와 같이 표로 잘 보입니다.

구분	이전	현행
1. 개인통관고유부호 발급사이트	‘개인통관고유부호 유효성 검증’ 가능	‘개인통관고유부호 유효성 검증’ 서비스 중단
2. 유니패스 사이트 내 ‘개인통관고유부호 유효성 검증’ 메뉴	비로그인 / 필수값인 개인통관고유부호 만으로 검증결과 확인 가능	로그인 / 개인통관고유부호, 성명, 휴대전화번호(전체) 입력 시에만 검증결과 표출
3. 오픈API를 이용한 ‘개인통관고유부호 유효성 검증’	필수값인 개인통관고유부호 만으로 검증결과 확인 가능	신규 신청접수 중단 / 개인통관고유부호, 성명, 휴대전화번호(전체) 입력 시에만 검증결과 표출

 

HTML 모드로 들어가 코드를 살펴보면 입력할 때와 달리 코드가 태그별로 한 줄씩 잘 정리되어 있습니다.

 

4. 매크로 사용 통합 문서로 저장하기

① 파일 탭을 누른 후 저장 메뉴를 누릅니다.

② 저장을 눌렀는데도 '다른 이름으로 저장' 메뉴로 이동하면서 폴더를 선택하라고 하는데 적당한 폴더를 선택합니다. 여기서는 D:\data\excel을 선택하겠습니다.

③ 파일 이름을 입력하라고 하는데, '티스토리표변환'이라고 입력하겠습니다. 그리고 오른쪽 저장 버튼을 누릅니다.

④ 그러면 "VB 프로젝트 기능은 매크로 제외 통합 문서에 저장할 수 없다"는 메시지가 표시되면서 예, 아니요 등을 선택하라고 하는데, '아니요'를 눌러야 합니다.

⑤ 위 메시지 창이 닫히고 아무런 변화가 없는데, 아래 화면에서 'Excel 통합 문서' 부분을 누른 후

'Exel 매크로 사용 통합 문서'를 클릭하고 저장 버튼을 누릅니다.

아래는 완성된 파일입니다.

티스토리표변환.xlsm

0.02MB

다음에는 가운데 정렬과 셀 병합 시 처리방법을 다뤄보도록 하겠습니다.

한 번만 잘 만들어놓으면 두고두고 잘 써먹을 수 있습니다.