블로그/티스토리 팁

티스토리에 highlight.js를 활용하여 코드 하이라이트 추가하는 방법

highlight.js Highlight.js는 자바스크립트로 쓰인 코드 구문 강조를 위한 라이브러리이다. 어떠한 프레임워크에도 의존하지 않고, 거의 모든 마크업에서 작동하며 언어 감지 기능을 가지고 있다. 다양한 언어와 여러가지 스타일을 제공합니다. 자동으로 사용된 코드 구문을 찾아 알맞은 스타일로 표현할 수 있습니다. 여러가지 혼합된 코드에 대한 구문 강조가 가능합니다. node.js에서 사용 가능합니다. 어떠한 마크업과도 작동합니다. 어떠한 자바스크립트 프레임워크와도 호환됩니다. 모던 브라우저들, IE9 이상을 지원합니다. 자세한 사용 설명법은 highlight.js 문서에서 확인할 수 있습니다. CDN 이용하기 highlight.js CDN은 cdnjs와 jsdelivr을 지원하고 있습니다. cd..

블로그/티스토리 팁

티스토리 검색엔진 최적화(SEO) 시키는 방법

SEO란? SEO는 Search Engine Optimization의 약자로 말 그대로 검색엔진이 좋아하는 웹사이트의 조건을 갖추는 것을 의미합니다. SEO작업을 진행하기 위해서는 Sitemap과 RSS 작업을 해야합니다. Sitemap이란? Sitemap은 웹마스터가 크롤링에 사용할 수 있는 사이트의 페이지에 대한 정보를 검색 엔진에 알리는 손쉬운 방법입니다. Sitemap의 가장 간단한 형식은 검색 엔진에서 사이트를 보다 지능적으로 크롤링할 수 있도록 각 URL에 대한 추가 메타데이터(마지막 업데이트된 날짜, 변경 빈도, 사이트의 다른 URL에 상대적인 중요도)와 함께 사이트에 대한 URL을 나열하는 XML 파일입니다. 웹크롤러는 보통 해당 사이트 및 기타 사이트의 링크에서 페이지를 검색합니다. Si..

블로그/티스토리 팁

티스토리 애드센스 자동광고가 나오지 않을 때 해결방법

애드센스 자동 광고 나오지 않을 때 해결하는 법 애드센스 심사를 마치고 자동 광고를 삽입했는데, 간헐적으로 광고가 안 나오는 증상이 발생하기 시작했습니다. PC, Mobile 둘 다 똑같은 증상이 발생 기존에 애드센스 스크립트를 삽입할 때는 아래와 같은 방법으로 넣습니다. HTML 태그 편집기에서 head 태그나 body태그 하단에 애드센스 스크립트를 동적으로 삽입하게끔 코드를 넣죠. 태그 위에 해당 코드를 삽입합니다. 수정 후 디바이스 타입별로 광고가 잘 붙어있는 것을 확인할 수 있습니다. 자 위와 같이 했는대도 정상적으로 광고가 보이지 않는다면 다음 사항들을 확인해보시는 것도 좋을 것 같습니다. 코드를 훼손하지 않고 위치도 올바르게 넣었다면 우리가 잘못한 부분은 없는 것입니다. 원인 분석차 점검 순서..

블로그/티스토리 팁

[웹폰트] 티스토리 블로그 나눔바른고딕 폰트 적용

하루에 적지않은 양의 글들(주로 웹페이지)을 읽게 되는데 이따금씩 글꼴의 중요성을 실감하게 됩니다. 저는 글꼴 중에도 "나눔바른고딕"을 선호하는데요. 티스토리 블로그를 시작하면서 블로그 디폴트 폰트로 나눔바른고딕으로 설정했습니다. 웹폰트로 폰트를 적용시켰고, 적용시키는 법에 대해서 이설명하도록 하겠습니다 ! HTML / CSS를 모르는 초심자를 대상으로 쉽게 설명할 예정이니 이 글을 쭉 따라서 적용하시면 쉽게 적용하실 수 있을 겁니다. 왼쪽 중간쯤에 있는 HTML / CSS 편집을 들어가면 이렇게 HTML/ CSS을 편집할 수 있는 에디터를 보실 수 있습니다.이제 여기서 몇 가지 코드를 적용을 시켜야 되는데요. 오른쪽 HTML 문서 파일에 부분이 있을겁니다. 그 바로 위에 아래에 코드를 집어 넣도록 하겠..