본문 바로가기

블로그 TIP

Square 스킨 메뉴에 이미지 넣기

336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.

Square 메뉴에 이미지 넣기

똑같은 스킨이라 할지라도 색상, 사진, 메뉴 위치 등 < UI >에 따라 전혀 다른 느낌의 블로그를 나타낼 수 있습니다. 티스토리는 바로 그점이 강점이죠. 남들과는 전혀 다른 자신만의 취향을 나타낼 수 있다는 것이 말이죠.

Square 스킨도 메뉴에 이미지를 추가만 해도 전혀 다른 분위기를 연출 할 수 있으니, 여러분들도 자신을 나타내는 무언가의 이미지를 등록해보시길 바랍니다. 

  • Square 스킨은 왼쪽에 메뉴가 있는데, 이미지를 삽입할 수 있습니다.
  • 이미지 크기는 마음대로 조절할 수 있으나, 메뉴 넓이 보다 지정된 값보다 길면 < 좌우 스크롤바 >가 생겨 가독성이 떨어집니다.
  • 가로 크기는 자신의 취향껏 설정하길 바라며, 대충 추천을 해주자면 < 230 px >  좋은 거 같네요. (저는 232)


설정은 스킨편집에서

  • [ 관리자 - 꾸미기 - 스킨편집 - HTML편집 ]에서 편집합니다.



사용할 이미지 파일 업로드

  • [ HTML편집 - 파일업로드 ]에서 사용할 이미지를 올립니다.
  • 이미지 명칭을 HTML에 입력하기 때문에 간단할 수록 좋겠죠? 또한 영문이어야 합니당.



업로드한 사진을 설정

  • [ HTML ]에서 편집합니다.
  • HTML에서 < Ctrl+F >로 찾기로 "h1"로 검색합니다.
  • h1 명령어에 파일업로드에 올렸던 사진을 넣어 줍니다.


이미지만 넣을 시 ↓
<h1><a href="https://qq12.tistory.com/"><img src="./images/이미지 이름"></a></h1>
이미지와 링크 넣을 시 ↓
<h1><a href="링크"><img src="./images/이미지 이름"></a></h1>

※ 이미지 이름에서 < 확장자 대소문자 구분 필수! > ex) [ a.png ] [ a.PNG ]