워드프레스로 이사하기 위해 1단계, 2단계를 지나 3번째 단계로 백업한 티스토리 글 URL을 워드프레스에 동일하게 맞추는 작업을 해야합니다. 그렇게 해야지 백링크로 된 URL도 살아남고, 검색엔진에서 수집한 링크도 살아남기 때문에 해당 작업을 꼭 진행해야 합니다. 다만, 티스토리의 2차도메인을 사용 중인 분에 한해서 가능합니다.
티스토리 백업 파일 html 번호로 변경
Step 1. 티스토리에서 백업 받은 파일을 압축을 풀어준 뒤 html 파일명을 폴더명과 똑같이 변경해야 합니다. 티스토리에서 백업받은 압축 파일을 압축 해제 해주세요.
Step2. html 파일의 이름을 숫자만 남기고(티스토리 URL을 숫자로 했을 경우)제목을 삭제해야 하기 때문에 이지네이머 프로그램을 이용해야 합니다. 다운로드 경로는 아래와 같습니다.
Step 3. 다운받았으면 EasyNamer.exe를 실행 후 폴더째 추가2를 선택합니다.
Step 4. 백업파일을 압축해제 한 폴더를 전체 선택 후 폴더 선택을 누릅니다.(Ctrl+A -> 전체 선택)
Step 5. 모든 파일명 변경 – 문자열 자르기 – “- (하이픈)” – 앞부분 선택을 한 후 확인을 누른 뒤 변경 실행을 선택합니다.
Step 5. 모든 html 파일이 숫자로만 변경 된 것을 볼 수 있습니다.
이미지, html 파일명 공백 없애기 및 상대 경로를 절대 경로로 변경
이미지 파일 공백 없애기
Step 1. 공백이 있는 이미지 파일은 파이픈(-)으로 변경 필요합니다.
상단에서 설명 드린 Easynamer 를 이용해서 공백(스페이스바)을 파이픈으로 변경해줄 겁니다.
Step 2. 이지네이머에서 폴더째 추가3 을 선택해서 전체 폴더를 불러 옵니다.
Step 3. 불러온 전체 파일에서 “문자열 치환”을 선택하고 찾을 파일명에 띄어쓰기(스페이스바)한 뒤 변경할 빈칸에는 파이픈(-)을 넣고 확인을 누릅니다. 그리고 변경실행을 선택하면 뛰어쓰기가 있는 파일명은 파이픈이 붙습니다.
html 소스코드 내 파일명 변경하기
Step 1. html 소스코드에 바라보고 있는 파일명 이름도 동일하게 띄어쓰기를 파이픈(-)으로 변경해줘야 합니다.
사용 할 프로그램은 notepad++를 사용해야 합니다. 아래의 링크에서 다운로드 받기 바랍니다.
Step 2-1. notepad++을 실행 후 Ctrl+F(찾기)를 눌러서 “파일에서 찾기”를 선택합니다.
Step 2-2. 디렉터리를 변경할 폴더를 선택 후 찾을 내용을 정규표현식으로 넣고 바꿀 내용도 정규표현식으로 넣습니다.
Step 2.3. 필터는 *.html만 넣습니다.
Step 2.4. 찾기 모드를 정규 표현식으로 변경 및 모든 하위 폴더 포함을 선택합니다.
찾을 내용 : (src="\.\/img\/[^" ]*) ([^"]*?") 바꿀 내용 : $1-$2 필터 : *.html 디렉터리 : F:\moonit\백업\moonit-1-1-aticle1-500\(포스팅 한 폴더 까지 진입할 필요 없음 상위폴더(moonit-1-1aticle1-500)까지만 폴더선택)
Step 3. 파일에서 바꾸기를 선택하여 모든 html 소스코드내 이미지파일 참조 url은 띄어쓰기가 없어지고 파이픈으로 변경됩니다.
이미지 상대경로를 절대 경로로 변경
html 소스를 보면 이미지가 상대경로로 되어 있는 모습을 볼 수있습니다. 이것을 절대 경로로 변경을 해야지 워드프래스로 임포트한 후 엑박으로 뜨지 않습니다. 글이 많으면 많을 수록 노가다가 심하니 참고 바랍니다.
Step1. notepad++에서 파일에서 찾기 탭을 선택 하고, 상단에서 알려드린 것과 같이 디렉토리 및 필터는 그대로 둡니다. 찾을 내용은 ./img/로 해서 모두 찾기를 누릅니다.
Step 2. 찾은 내용은 찾기 결과물에서 볼 수 있습니다. 상대 경로로 되어 있는 src 이미지 경로를 볼 수 있습니다. 더블클릭 해주세요. 100.html 소스 파일이 자동으로 열리게 되고 더블클릭한 src 이미지 경로를 알려줍니다. 바꾸기 탭에서 2번과 같이 “워드프레스 주소/tistory/100/img/”를 하고 모두 바꾸기를 누릅니다. 여기서 100은 src 이미지가 100이라는 경로에 있기 때문에 지정하는 것이니 변경한 src 이미지마다 틀립니다. 101번 경로에 있는 이미지는 “워드프레스 주소/tistory/101/img/이 됩니다.
변경하면 가장 좌측에 +, -가 있는데 -를 해서 가려줍니다. 계속 작업 하면 어디까지 작업했는지 헷갈리기 때문입니다.
Step 3. 상단과 똑같이 반복적으로 끝날때까지 계속 동일한 작업을 거칩니다. 100번 html은 끝나고 101.html 소스코드를 고쳐야 하기 때문에 1번에 더블클릭 하고 100이였던 경로는 101번으로 수정 뒤 모두 바뀌기를 누릅니다. 4번과 같이 변경된 모습을 볼 수있습니다.
이미지, html 파일 워드프레스 서버에 업로드
WinSCP를 통한 서버 접속
Step 1. 2단계에 알려드린 클라우드 웨이즈로 가입을 진행했다면 아래의 절차대로 진행하면 됩니다. 우선 Winscp를 다운로드 후 설치합니다.
호스트 이름, 포트 번호, 사용자 이름, 비밀번호를 작성해야 하는데, 클라우드 웨이즈에 접속하면 작성할 내용이 있습니다. Step 3을 확인해주세요.
Step 2. 클라우드 웨이즈에 접속해서 2단계에서 구축한 어플리케이션을 선택합니다.
Step 3. Access Details – SSH/SFTP 에 들어 오면 IP및 계정, 비밀번호를 확인 할 수 있습니다. 계정을 생성하면 됩니다.
Step 4. 이제 WinSCP에 확인한 IP및 계정, 비밀번호를 넣고 로그인합니다.(포트번호는 22번 입니다.)
티스토리에서 백업한 html, 이미지 파일 서버에 업로드하기
Step 1. 서버내 Public_html 디렉터리에서 tistory 이름으로 디렉터리를 만든 후 백업 받은 포스팅을 폴더에 업로드합니다.
서버에 업로드된 파일 워드프레스에 추가하기
서버에 업로드된 파일을 워드프레스에 추가하기 위해서는 HTML Import 2 플러그인이 필요합니다.
Step 1. 아래의 링크에서 HTML Import 2 플러그인을 다운로드 합니다.
Step 2. 플러그인 > 새로 추가 > 플러그인 업로드 > 파일 선택(다운받은 zip파일) > 지금 설치를 합니다.
Step 3. 설치 완료 되면 플러그인에서 HTML Import 2를 활성화 해줍니다.
Step 4. 설정 > HTML Import 에서 Files 탭을 선택 후 Directory to import, File extensions to include, Preserve file names를 아래의 그림처럼 설정합니다.
Step 5. Content 탭에서 Select content by을 HTML tag로 변경하고 tag, Attribute, value 값을 div, calss, contents_style로 변경합니다.
Step 6. Title & Metadata탭에는 아래의 그림처럼 변경합니다. Set status to 는 발생 또는 임시 저장 이니 참고 바랍니다. 아래의 그림은 발행에 대한 설정입니다.
Step 7. Custom Fields는 티스토리 발행 날짜와 동일하게 맞추기 위해 설정하는 란이라고 보시면 되고, 아래의 그림처럼 설정후 Save Settings를 선택해주세요.
Step 8. Files 탭으로 돌아가면 Import Files 버튼이 활성화되어 있는 모습을 볼 수 있습니다. 버튼을 클릭 시 티스토리에서 포스팅한 글들이 워드프레스로 넘어오게 됩니다. 이제 Submit을 눌러주세요. 포스팅한 글이 많을 수록 오래 걸립니다.
워드프레스로 글을 옮긴 후 이미지 수정
워드프레스로 옮긴 후 이미지 폼이 이상할 경우 있습니다. 이것은 티스토리 글쓰기 폼과 워드프레스 글쓰기 폼이 틀리기 때문에 그런 것입니다. 하나하나 모니터링해가며 수정해야 합니다.
마무리
잘따라 오셨나요? 저는 이렇게 해서 티스토리에서 워드프레스로 정상적으로 다 옮기게 되었습니다. 포스팅한 글들을 하나하나 다시 보면서 수정할 내용과 이미지를 힘들게 변경하였고 지금은 티스토리보다 쾌적하며, 저 입맛대로 홈페이지를 꾸미고 있습니다. 홈페이지 꾸미는데 제약사항이 많이 없다는 것이 가장 좋은 것 같습니다. 다음은 사이트 꾸미기와 플로그인 적용 방법에 대해 알아보겠습니다.