본문 바로가기
경제적 자유/티스토리-에드센스

티스토리 블로그 HTML 편집하기 _ 1

by ┌ΘΔΣ┘ 2021. 10. 3.
반응형

티스토리 블로그 HTML 편집하기 _ 1

 

티스토리는 HTML을 알지 못해도 관리하기 매우 쉽도록 편의성이 높은 플랫폼입니다. HTML을 알지 못해도 사용하기 쉬우며 HTML 적용도 할 수 있어서  관련 소스를 넣어서 이런저런 효과 등을 넣을 수 있습니다. 그렇지만 에드센스를 사용하면서 불가피하게 HTML 소스를 넣어야 할 때가 있는데요. HTML을 한 번도 사용해 보지 않으셨다고 하더라도 몇 가지 기초적인 것만 알면 내게 필요한 <소스>를 복사해서 원하는 위치에서 작동하도록 붙어 넣어 적용할 수 있습니다. 

 

1. HTML 편집 열기 

HTML 소스를 붙여 넣으려면 편집창을 열어야겠죠? 티스토리 블로그 관리에서 꾸미기/스킨 편집을 들어가시면 됩니다. 스킨 편집 창 내에 [HTML 편집] 버튼을 누르시면 외계어 같은 HTML로 된 창이 펼쳐집니다. 

 

편하게 버튼 몇 번 눌러서 티스토리를 이용하지만 원래라면 이렇게 HTML로 페이지를 다 꾸며야 하는 것이죠. 각종 소스코드의 삽입은 모두 해당 창에서 이용하시면 됩니다. 

 

2. 하나의 소스의 시작과 끝 표시 <    >,  <   />

HTML 페이지를 보시면 가장 많이 보이는  <  > 표시입니다. <head> 나 <body> 등을 보시게 될 텐데요. 소스 삽입 시 가장 많이 보게 되는 것은

<script> 내용 </script>

 

대부분 복사하는 소스의 경우 시작과 끝이 이렇게 표시될 텐데요. 소스를 복사하시고 위치에 삽입 시에 확인하셔야 할 것은 시작할 때는 <단어> 표시 해당 소스가 끝날 때는 <단어/>라는 것입니다. 해당 내에 있는 것은 하나의 소스이므로 처음과 끝에 항상 있어야 합니다.  간혹 복사 붙여 넣기 하시다가 닫는 표시를 삭제하거나 하면 소스가  깨지게 됩니다.   

 

티스토리의 HTML창에서는 아무거나 < >의 시작을 눌러보시면 친절하게 끝나는 코스까지 표시도 됩니다. 만약에 어떤 소스를 <s_article_related_rep> 안에 붙여 넣으라고 했다면 코드 시작과 끝나느 중간에 넣어야 합니다. 중간에 있는 다른 소스가 깨지기 않도록 보통은 시작 바로 아래 붙여 넣거나 끝나기 바로 직전에 붙여 넣습니다.  

 

붙여 넣은 소스의 시작을 눌러보신 후 끝나는 곳이 아래 사진처럼 표시되지 않는다면 뭔가 잘못되었다고 보셔도 맞습니다. < > </>는 한 세트로 시작과 끝이 같이 있어야 합니다. 

 

3. 들여 쓰기 확인하기 

어떤 소스 아래 붙어 넣는다는 건 그 소스의 하위로 넣으라는 말인데요. 그 경우 그 표시보다 들여 쓰기가 되어야 한다는 말입니다. 위에 이미지 보시면 <s_article_related_rep> 내의 모든 소스는 해당 표시보다 무조건 다 들여쓰기 되어 있는 게 보이시죠? 그냥 붙여 넣었는데 해당 소스보다 앞에 붙여진다면 당연히 제대로 적용되지 않습니다. 만약 <s_article_related_rep> 안에 삽입한다면 <s_article_related_rep>뒤어 커서가 깜박이게 한 후에 엔터를 누른 후 붙여 넣기 하시면 됩니다.  해당 소스 내에 적용하는 다른 소스들은 무조건 들여 쓰기 되어야 한다는 게 기본입니다. 붙여 넣기 한 소스가 깨져서 제대로 작동하지 않는다면 소스 내에 삽입하는 다른 소스의 <시작 >은 무조건 들여 쓰기가 되었는지 확인해주세요. 

 

3. 어디에 붙일까? ctrl + F 

어디에 붙여 넣으라고는 했는데 위치를 찾기 힘든 경우가 많이 있습니다. 이럴 경우 crtl +F 를 눌러서 검색하시면 쉬워요. 보통 어느 위치에 붙여넣으라고 안내가 되기 때문에 해당 위치에 대한 단어를 입력하시면 위치가 표시됩니다.

 

 

 

 

 

반응형
-->

댓글