티스토리 본문 꾸미기
인스타그램 피드 <가운데 정렬해서> 넣기
티스토리 글을 쓸 때 인스타그램 스토리에 있는 내용을 첨부해서 글을 풍성(?)하게 만들고 싶을 때가 있다. 이를 테면 이렇게.
방법은 복잡하지 않았지만 나처럼 프로그램 언어에 익숙치 않으면 헷갈린다. 자세히 캡쳐했으니 천천히 따라해보시길 바란다.
1. 먼저 인스타그램에 접속해 로그인 한다.
2. 원하는 피드를 찾아 클릭한다. 내 계정에 있는 피드뿐만 아니라 다른 사람의 계정에 있는 피드도 넣을 수 있다.
위에선 햄버거 피드를 클릭하겠다.
3. 원하는 피드 화면에서 맨 오른쪽 상단의 (...) 버튼을 클릭한다.
4. 화면 중 <퍼가기> 버튼을 클릭한다.
5. <문구 포함> 부분에서 문구를 넣을지 말지 결정하고, <EMBED 태그 복사> 버튼을 클릭해 태그를 복사해둔다. 자동 복사가 되기 때문에 원하는 곳에 커서를 놓고 ctrl+v만 해도 되지만 PC 메모장에 붙여넣기로 하자. 이유는 금방 알게 된다.
6. 티스토리 글쓰기 본문에서 아래처럼 글쓰기창 상단의 '기본모드' 옆 아래 화살표를 눌러 <HTML> 모드를 클릭한다.
7. 어둑어둑한 <HTML> 모드 화면으로 전환됐다. 이 중에 인스타그램 피드를 넣고 싶은 위치를 찾는다. 외계어 같지만 차근차근 보다보면 내가 쓴 본문 글이 보이고, 그중 <p> </p>라는 코드가 자주 보인다. 이건 한 줄 띄어쓰기 명령어다. 이왕이면 이 명령어 다음에 넣으면 인스타그램 피드 위아래로 공백이 생겨 보기 편하다.
8. 삽입을 원하는 곳에 커서를 위치시키고 ctrl+v를 누르면 아까 복사해 둔 인스타 태그가 자동으로 복사된다.
저 긴 코드가 인스타그램 피드를 복사한 결과다. 인스타그램 피드 복사 시 '문구 포함'을 클릭하면 글이 많을수록 줄이 길어진다. 하단 왼쪽 미리보기로 보면 아직 글이 저장되지 않아 피드가 정확히 뜨진 않지만, 그래도 그 부분에 인스타그램 피드가 들어간다는 것을 알 수 있다.
위 캡쳐화면처럼 말이다. 미리보기 상태에서 나와서 다시 글쓰기 '기본모드'로 가서 글을 마무리하면 된다. 이 방법으로 아까 복사한 '햄버거 사진' 피드를 바로 이 줄 밑에 붙여넣으면 이렇게 된다.
9. 그런데 뭔가 보기가 불편하다. PC화면 기준으로 다른 사진과 글은 중앙정렬 되어 있는데, 인스타그램 게시물만 왼쪽 정렬되어 있다. 인스타그램 게시물을 화면 가운데 정렬시키는 방법은 생각보다 간단하다. 아까 복사한 인스타그램 태그 앞뒤에 <center></center>코드를 넣어주면 된다. 아까 5번 순서에서 PC 메모장에 붙여넣은 인스타 게시물 주소를 찾아 맨 앞에 <center>, 맨 뒤에 </center>를 넣는다.
글씨가 너무 작아 안 보이니 두 부분만 확대해보겠다.
10. 앞뒤에 <center></center> 코드를 넣으면 바로 아래처럼 인스타 게시물이 가운데에 정렬한다. 물론 모바일 화면에서 똑같이 보이겠지만 PC에선 아까 올린 인스타 게시물은 왼쪽, 이 줄 아래 게시물은 가운데에 뜰 것이다.
'방구석 공부 > 티스토리' 카테고리의 다른 글
| 내 티스토리 만들기｜구글 서치 콘솔에 등록하기 (0) | 2020.05.10 |
|---|---|
| 방금 쓴 내 티스토리 글 구글 검색에 즉시 노출시키기｜구글 서치 콘솔 2탄 (1) | 2020.05.10 |
| 내 티스토리 구글에서 제대로 검색되고 있나?｜구글 서치 콘솔에 사이트맵 다시 제출하기(rss 등록방법 추가됨) (0) | 2020.05.10 |
| 티스토리 다음 검색 누락 의심｜네이버 검색은 잘 되는데... (0) | 2020.05.09 |