본문 바로가기
IT, Coding

티스토리 북클럽 스킨 글 내부 URL 링크 색 변경, 커서 올리면 색깔 변하게 하는 법!

by &%^##$^%^! 2024. 11. 3.

오늘은 티스토리 블로그 북클럽 스킨 글에 첨부한 URL링크(하이퍼링크) 색깔을 변경하는 법에 대해 알아보겠습니다. 무조건 되는 방법이니, 북클럽 스킨 쓰시는 분들은 자세히 봐주세요.  마우스 커서 올렸을 때 하이퍼링크 색깔 변하게 하는 법도 알아볼게요. 간단하게 5분만에 바꾸실 수 있으니 참고해주세요. 

 

 티스토리 블로그 북클럽 스킨 링크 기본 색 바꾸는 법

참고로 오늘 알려드리는 방법은 블로그 글들 전체에 적용되는 방법입니다. style태그를 넣는 방법도 있지만, 귀찮잖아요?? 

 

1. 티스토리 관리자 페이지에서 '꾸미기' > '스킨' > 'HTML/CSS 편집'으로 들어갑니다.(아래 사진 참고)

꾸미기-스킨편집-HTML편집-들어가는-사진

 

 

2. CSS 수정창에 들어간 후 'entry-content a' 부분을 검색(Ctrl +F)해서 찾습니다

 

 

3. 원하는 색깔코드로 바꿉니다.( '! important'를 추가해줘야 합니다.  )

 

간단하죠!! 글만 보면 어려우니, 아래 코드 변경한 최종 사진 첨부드립니다. 

하이퍼링크색-변경한-최종사진

 

저는 링크 색이 초록색으로 변하게 하고 싶어서, 원하는 새로운 색상코드 부분에 초록색인 '09A56F'를 넣어줬어요.

그러면 아래 사진처럼 글 내에 쓴 하이퍼링크들이 초록색으로 보이게 됩니다. 

 

 

 링크위에 마우스 올렸을 때 색깔 바뀌게 하는 법

링크 위에 마우스 올렸을 때 색깔 바꾸는 법도 간단합니다.

 

1. 티스토리 관리자 페이지에서 '꾸미기' > '스킨' > 'HTML/CSS 편집'으로 들어갑니다.(아래 사진 참고)

꾸미기-스킨편집-HTML편집-들어가는-사진

 

 

 

 

2. 아래 빨간색 글자 코드를 복사 후 HTML 수정 창에서 style태그들 사이에 붙여넣어 줍니다.

 

a:hover { color: #원하는 새로운 색상코드; /* 마우스를 올렸을 때 링크 색상 */ }

 

직접 적용해본 코드 결과는 아래 사진과 같습니다. 저는 마우스 링크 올렸을 때 빨간색으로 변하게 하고 싶어서, 원하는 새로운 색상코드 부분에 빨간색인 'df3E62'를 넣어줬어요.

 

HTML에-태그-추가한-사진

 

자 그럼 결과를 확인해볼까요??!! 에메랄드 색이었던 링크가 커서를 갖다대니 빨간색으로 보입니다. 성공이네요. 

 

 

커서-올렸을-때-빨간색으로-변한-모습

 

댓글