🗒️ 티스토리 (9)

1. 2022.12.01 [티스토리 블로그] 특정 문자로 인라인 코드 블럭 설정하기 (인라인 코드 블럭으로 만들기) 7

   특정 문자로 인라인 코드 블럭 설정하기 (인라인 코드 블럭으로 만들기) 들어가며 마크 다운을 사용할 때, 다음과 같이 작성할 경우, 인라인 코드 블럭이 적용된 요소를 작성할 수 있다. (문자) `(문자)` 이 방법처럼 티스토리 에디터를 사용할 때, 문자를 특정 문자로 둘러 쌓을 경우 인라인 코드 블럭이 적용되도록 하려면 어떻게 해야할까? 물론, 위와 같은 방법으로 [마크다운] 모드로 바꾼 후 인라인 코드 블럭을 적용한 후, 다시 [기본모드]로 작업해도 되겠지만, [마크다운] 모드에 들어갔다가 [기본모드]로 돌아오면 기존에 입혔던 스타일이 깨진다는 문제점이 존재했다. 어떤 블로그에서는 자주 사용하지 않는 취소선의 CSS를 인라인 코드 블럭처럼 바꿔서 사용하라는 글이 있었는데, 취소선을 사용할 수 없게 된다..
2. 2022.09.05 [티스토리 블로그] 표 내부 이미지 정렬시키는 방법

   표 내부 이미지 정렬시키는 방법 들어가며 티스토리 에디터를 사용할 때, 표(Table) 내부에 이미지를 삽입하면 무조건 가운데 정렬로 표현되는 것을 발견하였다. CSS를 이용하여 이미지 정렬을 하려고 해도 먹히지 않았다. 다음과 같이 간단하게 태그를 수정해주는 방법으로 문제를 해결하였다. 방법 티스토리 블로그에 이미지를 첨부할 경우, 다음과 같이 [##_Image ~ ##] 형식으로 표현된다. 이때 맨 마지막의 옵션에 "style":"alignLeft" (왼쪽 정렬) 또는 "style":"alignRight" (오른쪽 정렬)을 추가해주면 된다. [＃＃_Image|kage@dnTSuf/btrLqdmVnlt/rcxIkAdf0qV23dywfkZ0d1/img.png|CDM|1.3| {"originWidth":1..
3. 2022.05.30 [티스토리 블로그] 첫 화면 특정 페이지로 설정하기

   첫 화면 특정 페이지로 설정하기 들어가며 자바스크립트(JavaScript)를 사용하여 티스토리 블로그의 홈 화면에 접속했을 때, 특정 페이지가 나타나도록 설정 할 수 있다. 방법 티스토리 [스킨 편집] 페이지의 [HTML] 탭에서, 태그 사이에 다음의 코드를 넣어준다.
4. 2022.05.29 [티스토리 블로그] 관리자인지 확인하기

   관리자인지 확인하기 들어가며 자바스크립트(JavaScript)를 이용하여 블로그에 접속한 사용자가 관리자인지, 아닌지 쉽게 확인하고 관련 작업을 수행시킬 수 있다. 방법 방법 1 : 접속한 사용자가 관리자일 경우 $(documnet).ready(function() { if ($(".tt.add_link[data-alert]").length > 0) { // 작업 수행 } }); 방법 2 : 접속한 사용자가 관리자가 아닐 경우 $(documnet).ready(function() { if ($(".tt.add_link[data-alert]").length == 0) { // 작업 수행 } }); 사용 예 접속한 사용자가 관리자가 아닐 경우, 해당 요소를 없앤다. Top Secret $(documnet).re..
5. 2022.05.10 [티스토리 블로그] 티스토리 스킨 가이드

   티스토리 스킨 가이드 설명 티스토리 스킨을 수정 또는 제작할 때 참고할만한 사이트이다. 티스토리 블로그에서 사용되는 치환자에 대한 설명이 자세히 소개되어 있다. 바로가기 https://tistory.github.io/document-tistory-skin/ 소개 · GitBook 티스토리 스킨 가이드 티스토리에서는 스킨을 통해서 사이트를 자유롭게 디자인할 수 있습니다. 스킨은 치환자를 사용하여 제작되고 사용된 치환자에는 티스토리의 데이터가 대입되어 티스토 tistory.github.io
6. 2022.01.20 [티스토리 블로그] 블로그 폰트 변경 방법

   [티스토리 블로그] 블로그 폰트 변경 방법 개요 간단하게 CSS 파일에 코드를 추가해줌으로써 블로그의 폰트를 변경할 수 있다. 우선, 웹 폰트를 무료로 제공해주는 사이트를 찾는다. 대표적으로 눈누와 구글 폰트 사이트가 있다. 눈누(https://noonnu.cc/) 한글 폰트 많음. 구글 폰트(https://fonts.google.com/) 한글 폰트 적음. 영문 폰트 많음. 방법 사이트에서 원하는 폰트를 고른 후, 티스토리 블로그의 [스킨편집]→[CSS]에 코드를 추가해준다. 그리고 body 부분의 font 옵션의 맨 앞 부분에 복사한 코드의 "font-family" 부분을 적어준다.
7. 2021.12.28 [티스토리 블로그] 표 배경 색상 넣기

   표 배경 색상 넣기 (티스토리 블로그) 개요 최근에 티스토리 에디터가 신에디터로 변경하고 나서, 표에 원하는 색상을 넣기가 힘들어졌다. 티스토리에서 기본적으로 제공하는 표 템플릿은 다음과 같이 지나치게 한정적이다. 방법 (귀찮지만) HTML 코드를 조금만 수정해줌으로서 표에 원하는 배경색을 넣을 수 있다. 표1 (Before) 표1 : 소스 코드 기존의 소스 코드의 태그 안에 bgcolor="색상명" 속성을 추가해주자. ※ r : Row(행), d : Data(데이터) 표2 (After) 표2 : 소스 코드
8. 2021.11.16 [티스토리 블로그] 코드블럭 원하는 언어로 확장하기

   코드블럭 원하는 언어로 확장하기 (티스토리 블로그) 티스토리는 기본적으로 다음의 언어들을 코드블럭에 적용시킬 수 있도록 지원한다. 하지만, 티스토리에서 지원하지 않는 다른 언어를 코드블럭에 적용시키고 싶다면? 티스토리 블로그의 코드블럭은 hightlight.js 를 이용하기 때문에 간단하게 HTML 코드만 수정해주면 적용시킬 수 있다. https://github.com/highlightjs/highlight.js/blob/main/SUPPORTED_LANGUAGES.md GitHub - highlightjs/highlight.js: JavaScript syntax highlighter with language auto-detection and zero dependencies. JavaScript synt..
9. 2021.04.14 [티스토리 블로그] 깃허브 마크다운(GitHub Markdown) 스타일 적용하는 방법

   [티스토리 블로그] 깃허브 마크다운(GitHub Mardown) 스타일 적용하는 방법 서론 평소에 깃허브 페이지 에 공부한 내용을 정리하는 습관을 갖고 있었다. 최근에 티스토리 블로그가 대폭 개편되면서 마크다운(Markdown)으로 글을 쓸 수 있게 되었는데, 깃허브 페이지의 스타일과 너무 맞지 않아 이질적인 느낌이 들었다. 또 글을 쓴 대로 잘 표현되지 않았다. 그래서 구글링을 통해 티스토리 블로그에 깃허브 마크다운(GitHub Markdown) 스타일을 적용시키는 방법을 알게되었다. 앞으로 마크다운 형식으로 블로그에 글을 올리려고 한다. 스타일 적용 방법 ① github-markdown.css 소스 코드 복사 : Link ② 티스토리 블로그 설정 -> [스킨 편집] -> [html 편집] [CSS] ..