블로그 운영
페이지마다 다른 스타일로 꾸미기
페이지마다 다른 스타일로 꾸미기
2021.10.23서식 기능 활용 블로그 관리 홈(블로그주소/manage) > 콘텐츠 > 서식 관리 서식 관리 > 서식 쓰기 > HTML 모드 스킨 편집에서 html 코드를 수정해도 되지만 그러면 블로그 전체에 적용되니까 서식으로 만들어두면 페이지마다 다른 분위기를 낼 수 있다. 꼭 html 코드로 만든게 아니어도 글자 스타일이나 문단 간격, 사진 배치를 해놓은 스타일을 만들어도 되니까 활용하기 나름이다. 코드 설명 서식에서 만들땐 첫번째 코드였는데 만든 서식 스타일을 불러와서 HTML 모드로 코드 확인하니 width, style, color처럼 세부 디테일로 지정된 좀 더 정확한 모양의 코드로 바뀌어 있다. 적용 모습은 둘 다 같다. 서식 기능 활용하기 서식 기능 활용하기 이렇게 하면 이 글의 검정색 라벨 같은 모양의 ..
티스토리 스킨 바꾸기전 메타태그 먼저
티스토리 스킨 바꾸기전 메타태그 먼저
2021.10.23여러 스킨을 사용해보는 스타일이거나 직접 스킨의 코드를 바꾸는데 백업을 안해 메타태그값을 잊어버리는 경우 메타태그 플러그인에 먼저 등록해두면 아주 도움이 된다. 티스토리는 여러 플러그인 기능이 있는데 메타태그 플러그인에 값을 등록해두면 티스토리 스킨을 자주 바꾸는 경우 HTML 코드 안에 다시 입력하지 않아도 자동으로 사이트 인식을 한다. 구글서치콘솔 메타태그값 찾기 ■ 구글 서치 콘솔 https://search.google.com 설정 > 사용자 및 권한 > 세로방향 점 3개 > 속성 소유자 관리 웹마스터센터 > 메타태그 옆 상세정보 선택 > 메타태그 주소 복사 메타태그 플러그인에 값 입력하기 ■ 티스토리 관리 페이지 > 플러그인 > 메타태그 등록 name 선택 이름 입력란에 < google-site-..
HTML로 라벨 모양 스티커 만들기
HTML로 라벨 모양 스티커 만들기
2021.10.22보기 HTML 코드로 제목 앞에 직사각형 모양의 네모상자 바 bar 같은 모양을 만드는 방법 순서 블로그관리 페이지 > 꾸미기 > 스킨 편집 > html 편집 > CSS 적용할 제목 태그를 코드에서 찾아 코드 추가 적용 원본 코드는 저장해두거나 지우지 말고 주석처리한 다음 밑에 새로 적용할 코드를 적어도 좋다. 태그 이름 오디세이 Odyssey 스킨에서 ctrl / command + F로 제목 태그 찾기 제목1 : / .article-view h2 제목2 : / .article-view h3 밑줄 만들기 border-bottom: 1px solid #000000; 아래쪽에 : border-bottom 실선 : solid 크기 : 1px 검정색 HEX 코드 : #000000 색상은 인터넷에 #000000 ..
티스토리 스킨 수정하기
티스토리 스킨 수정하기
2021.10.22개발자도구 활용 블로그관리 페이지에서 위젯으로 스킨을 편집하는게 잘안된다면 개발자도구를 통해 바꾸고 싶은 부분을 직접 편집할 수 있다. F12 키 마우스 오른쪽 버튼 > 페이지 검사 메뉴 웹브라우저 상단 메뉴 > 개발자용 같은 이름의 메뉴 검사할 페이지 요소 선택 > 선택한 부분의 코드 확인 제목 글자 크기 줄이기 블로그관리 페이지 > 꾸미기 > 스킨 편집 > html 편집 > 적용 원본코드는 편집 전에 저장해두기 제목1인 를 font-size 24에서 4px로 줄인 모습
Odyssey 스킨 애드핏 광고 본문 상단 배치
Odyssey 스킨 애드핏 광고 본문 상단 배치
2021.10.22오디세이 스킨 폭이 좁아 애드핏 광고를 본문 상단에 배치하니 밑에 첨부한 사진처럼 상단 광고가 본문 폭을 넘는다. 수정할 부분 코드는 main.main으로 가로 1020px을 적당한 크기로 바꿔보자. .main의 max-width 값을 1020px에서 1030px, 1050px로 적당한 값을 입력해가며 사이드 메뉴바까지 넘어갔던 상단 광고가 적당해지는지 보는데 1070px이 맞는거 같아 그렇게 수정. 개발자도구에서 값을 조정했다고 티스토리 스킨 코드가 변경된건 아니라서 적용을 원하면 까먹지 말고 티스토리 스킨 코드에 적용하도록 한다.