728x90 티스토리 및 워드프레스12 [티스토리] 블로그 상단 글 제목 이미지 삭제 및 크기 줄이기 블로그의 제목에 있는 배경 이미지는 글 제목의 가독성을 떨어뜨릴 뿐만 아니라, 배경 이미지로 인하여 로딩 속도가 느려지게 된다. 그에 따라 사이트 최적화 SEO에도 악영향을 미치게 된다. 이번 글에서는 크게 두 가지에 대해서 알아보도록 하겠다. a. 제목 부분의 배경 이미지 삭제 b. 제목 부분의 크기 줄이기 1. 제목 부분의 배경이미지 삭제 1.1 HTML 수정 (1) 티스토리의 HTML 편집창에서 `s_permalink_article_rep` 태를 찾는다. (2) `s_permalink_article_rep` 태그 내에서 `background-image`이 들어간 코드를 찾은 후 수정을 한다. - 나의 경우에는 아래와 같은 코드 내에 `background-image`가 있었다. by 수정 삭제 - 위.. 2024. 1. 29. [티스토리] 구글 - 페이지 색인 생성, 발견됨 - 현재 색인이 생성되지 않음 구글 서치 콘솔과 관련된 다른 문제들 □ 구글 - 적절한 표준 태그가 포함된 대체 페이지: https://m31phy.tistory.com/719 1. 문제점 1.1. 구글의 답변 구글의 고객 센의 설명에 따르면, "현재 색인이 생성되지 않음"에 대한 이유는 아래와 같다 [1]. "페이지를 발견했지만 아직 크롤링되지 않았습니다. 일반적으로 Google에서 URL을 크롤링하려고 했지만 이로 인해 사이트가 과부하 상태가 될 수 있기 때문에 Google에서 크롤링 일정을 변경한 경우입니다. 그렇기 때문에 보고서에 마지막 크롤링 날짜기 비어있는 것입니다." NOTE 1: 색인의 생성 여부가 중요한 이유? 블로그를 구글 서치 콘솔에 등록을 하는 것은 본인의 블로그의 위치를 알려주는 것에 불과하다. 실제로 구글 검.. 2024. 1. 25. [티스토리] 인라인 코드 블럭 (꾸미기, 백틱으로 인라인 코드 삽입) (Updated: 2014-01-13) 1. 문제점 티스토리 에디터는 인라인 코드를 삽입하는 기능이 없어, html 모드에서 태그를 일일이 덧씌워 적용해야 함. 2. 백틱을 사용하여 인라인 코드 작성 이러한 문제점을 해결하는 방법으로 태그를 일일이 입력하는 것이 아닌 백틱(`)을 사용하여 인라인 코드를 작성할 수 있다 [1]. 원리는 백틱을 Java script를 사용하여 태그로 치환을 하는 것이다. 2. 1. 코드 삽입 우선, 설명하기 앞서, 내가 참조한 웹페이지에서 작성한 코드를 먼저 살펴보도록 하겠다. (1) querySelectorAll을 이용하여, 태그 내부의 내용 중, figure와 pre를 제외한 모든 내용을 추출 (2) 그 이후, Javascript의 replace 명령어를 사용하여, 백틱.. 2023. 12. 28. [티스토리] 구글 - 적절한 표준 태그가 포함된 대체 페이지 1. 페이지 색인 생성 1.1. 색인이란? - 데이터를 기록할 경우, 그 데이터의 이름, 데이터의 크기 등의 속성과 그 기록 장소 등을 표로 표시하는 것 - 색인을 통해, 해당 자료의 위치를 쉽게 파악할 수 있도록 도와줌 - 인터넷에서 검색을 할때도, 색인을 이용한다. 2. 적절한 표준 태그가 포함된 대체 페이지 요약: Google에서 표준으로 인식하는 페이지의 중복 페이지이다. 이 페이지는 표준 페이지로 올바르게 연결되므로 별도의 조치는 필요 없다 [1]. [1] https://support.google.com/webmasters/answer/7440203#indexed_not_submitted_in_sitemap 2.1. 표준 페이지 (표준 URL)이란? 표준 URL은 Google이 사이트의 중복된 .. 2023. 12. 26. [티스토리] 포스팅 목차 자동으로 생성 (ToC) 및 꾸미기 (Update: 2024-01-13) 티스토리에서 글을 작성할 시, 우리는 대제목, 소제목 등으로 구분하여 글을 작성하며, 이러한 구분들은 구글 SEO가 우리의 글을 평가할 때 좋은 요소가 된다. 이러한 목차들은 html에서 수동으로 직접 만들 수 있지만, 자동으로 매번 목차가 생성될 수 있도록 할 수 있다. 이를 위해서 기본적으로 알아야할 내용들은 아래와 같다. 1. ToC (Table Of Contents) • ToC란? 목차, 차레, 순서 등을 나타내는 테이블 • 자동 목차를 생성함으로써, - 대제목 ( 태그), 중제목 ( 태그)에 대한 목차가 자동으로 생성 - 해당 제목을 클릭하면 본문의 위치로 자동 이동. 2. ToC 코드 2.1. Tocbot TOC를 만들어주는 tocbot와 관련된 코드를 티.. 2023. 12. 24. [티스토리] 소제목 꾸미기 및 서식 1. 티스토리 소제목 꾸미기 방법 티스토리 내의 소제목을 꾸미는 방법은 크게 두 방식으로 나뉜다. • CSS 활용: 모든 게시글의 소제목 서식을 변경하는 것 • HTML 활용: 특정 게시글의 소제목을 변경하는 방법 2. CSS를 이용하여 소제목을 꾸밀 경우 티스토리 내에서 CSS를 이용하여 h태그들(즉, 소제목들)을 꾸밀 경우 아래의 과정을 거친다; • HTML 탭에서 본문 상위 class 정보 찾기 • 해당 class에 대응되는 CSS 내용 수정 1) HTML 탭에서 본문 상위 class 정보 찾기 티스토리 내의 CSS를 이용하여 소제목을 꾸밀 경우, 먼저 관리 페이지의 스킨 편집에서 HTML 탭에서 "##_article_rep_desc_##"를 감싸고잇는 class 명을 먼저 확인해야 한다. - .e.. 2023. 12. 24. [워드프레스] 워드프레스 시작하기 (Update: 2023/12/03) 티스토리의 백업용으로 워드프레스를 준비하는 과정에서 이리저리 정보를 알아봐야 할 필요가 있어서 이 페이지에 내가 정리한 내용들을 작성을 했다. 1. 워드 프레스란 워드 프레스는 무료 오픈 소스 CMS (컨텐츠 관리 시스템)으로 2003년 만들어진 이후, 전세계 웹사이트의 40%이상이 워드프레스를 이용하여 웹페이지를 관리를 할만큼 유명한 프로그램이다. 이러한 워드 프레스를 사용하여, 다양한 형태의 사이트들을 만들 수 있다. 1.1 워드 프레스의 장점 및 특징 워드 프레스는 티스토리나 네이버 블로그에 비해 진입장벽이 있긴 하지만 다음과 같은 장점들이 존재한다. 높은 자유도 및 다양한 플러그인: 다양한 플러그인들을 사용하여, 사용자가 원하는 거의 모든 수준으로 웹페이지를 .. 2023. 11. 26. [티스토리] 블로그 개발 일지 - 1 - 티스토리 블로그를 개설한지 약 3년 가까이 되는 것 같다. 전반적으로 티스토리 블로그와 관련해서 만족을 하는 편이긴 하지만, 사람인지라 욕심이 계속 생기는 부분이 있다. 크게 보면 아래와 같이 2가지 부분에 대한 불만족이 있다. 1. 티스토리에서 글을 작성 시, 생각보다 선택의 폭이 좁다. (e.g. 글씨체, etc...) 2. 티스토리 내에서 꾸밀 수 있는 테마가 마음에 들지 않는다. 1번과 관련해서는 이후에 시간이 만약 남게 된다면 개인적인 프로젝트로 데스크탑에서 사용하는 vim과 연동을 해서 할 수 있는 방법을 구현해보고 싶다. 하지만 현재 주로 다루고 싶은 건 전반적인 내 티스토리 블로그의 디자인이다. 그렇다면, 내가 원하는 방향으로 블로그의 디자인을 바꾸려면 어떻게 해야하는가? 먼저 티스토리 내.. 2023. 11. 23. [티스토리] 기본 글자색 변경 일반적으로 티스토리에서 글을 쓸 때, 글자의 색상은 약간 회색이 기본값으로 되어있다. 이 기본값을 변경하기 위해선, 티스토리 내에서 css의 일부를 변경해야 한다. 기본적인 변경 방법은 아래와 같다. 1. [티스토리 관리페이지] → [HTML 편집] → [CSS] 2. 코드 수정 NOTE: 본문의 경우 html 코드를 살펴보면 태그로 분류되는 것을 알 수 있다. 따라서, 태그의 기본 속성을 바꿔서 기본 글 색상을 변경해야 한다. 1) CSS 코드 페이지에서 +를 눌러 다음을 검색한다: .entry-content p Figure 2처럼 태그를 설명하는 부분을 찾았다면, color부분의 값을 #555(#555: 회색)에서 #000(검정색)으로 바꾼 후, 설정을 저장한다. NOTE 2: 기존에 직접 색상을 바.. 2022. 12. 10. 이전 1 2 다음 728x90
