미넴 스킨 링크, 밑줄 스타일 수정 변경하는 방법 - 티스토리 블로그 무료 스킨

같은 미넴 스킨이라도 약간의 수정만으로 본문의 느낌이 많이 달라지더군요. 웹 프로그램 능력이 뛰어나신 분들에게는 아주 간단한 일이지만 본문에 밑줄은 수정하였으며, 본문 링크 스타일을 없어서 만들었습니다. 필요하신 분은 참고하세요.

 

 

미넴 스킨 - 본문 링크, 밑줄 스타일

 

미넴스킨은 애드센스 광고을 수월하게 운영할 수 있도록 제작된 광고 친화적인 티스토리 블로그용 스킨으로 무료로 사용이 가능합니다.

 

현재 애드센스 광고를 운영하시는 분들 중에서 많은 분들이 미넴스킨을 사용하고 있으며, 웹 프로그램을 잘하시는 분들은 다양하게 커스텀하여 사용하고 있습니다.

 

현재까지 미넴스킨 2.7.3 버전까지 업데이트가 되어 있으며, 티스토리 블로그에서 미넴스킨을 사용해보고 싶다는 분은 아래에 있는 다운로드 링크를 이용해 주세요.

 

미넴 스킨을 제작하고 무료로 배포해 주신 제작자님에도 항상 고마운 마음을 가지고 사용하고 있습니다. 정말 감사합니다.

 

✔티스토리 블로그용 미넴스킨은 제작자 블로그에서 다운로드 할 수 있습니다.✔

 

 

 

미넴 스킨 밑줄, 링크 스타일을 지금 보고 계시는 스타일로 변경하시려면 css 수정 및 추가가 필요합니다.

 

 

✔미넴스킨 링크 스타일을 변경, 상단광고 위치 변경 방법✔

미넴스킨 상단광고 2개 블로그 포스팅 제목 위로 이동

 

미넴스킨 상단광고 2개 블로그 포스팅 제목 위로 이동

 

 

 

본문 링크 스타일 추가 및 밑줄 스타일 수정 변경하는 방법

 

 

티스토리 관리페이지 - [스킨 편집] - [html 편집]에서 css에서 밑줄의 스타일을 수정하고, 링크 스타일을 추가하시면 됩니다.

 

티스토리 관리페이지 - 스킨 편집 - html 편집

 

 

본문 링크 스타일 추가

 

본문에 링크가 아래에 있는  css 스타일이 적용되도록 css 내용을 추가하였습니다.

.tt_article_useless_p_margin a{
 border-bottom: 2px solid #ff8cbc;
 font-size: 1em;
 transition: all 0.25s linear;
 position: relative;
 text-decoration: none;
 background-image: linear-gradient(to bottom, #ffffff, #fffce2);
}

.tt_article_useless_p_margin a:hover{
 border-bottom: 3px solid #61a3ff;
}

.tt_article_useless_p_margin a:active {
	position:relative;
	top:1px;
}

 

본문 작성 시 링크가 있다면 배경과 밑줄이 나타나도록 css 코드를 추가하였습니다. 노란색 배경이 싫으시면 background-image: linear-gradient(to bottom, #ffffff, #fffce2); 이 부분을 삭제하거나 주석으로 처리하시면 됩니다.

 

 

밑줄 스타일 수정

 

미넴 스킨에 있는 밑줄 스타일은 아래와 같이 되어 있으며 이쁘게 표현되고 있습니다.

기존 스타일
.content-article u {
	text-decoration-color: red;
	text-decoration-style: wavy;
	text-decoration-thickness: 0.08em;
}

 

개인적인 취향하고 맞지 않고 본문 작성시 글씨도 두껍게 보이도록 하려고 아래와 같이 수정했습니다.

 

사실 본문 작성시 강조해야 되는 부분에 글씨를 두껍게 하고 색상을 추가하는 스타일로 작성했는데, 이러한 반복 작업도 줄이기 위해서 밑줄에 색상을 추가하고 두껍게 표현되도록 수정했습니다. 

변경된 스타일
.content-article u {
 box-shadow: 0 -8px 0 #CEF6E3 inset;
 font-weight: bold;
 text-decoration: none;
}

 

 

블로그 운영에 도움이 되는 팁

 

블로그 운영시 화면 캡처를 하거나 사진 등 추가하실 때 jpeg 형식보다는 구글이 만든 이미지 저장 형식 webp를 사용하시는 것을 추천드립니다.

 

같은 크기의 이미지라도 jpeg나 png보다 훨씬 작은 용량을 가지고 있어서 매우 효율적이고 이미지 최적화에 많은 도움이 됩니다.

 

무료 화면 캡처 프로그램 sharex와 구글 web 라이브러리를 활용하면 화면 캡처 즉시 이미지를 편집하고 webp 형식으로 즉시 변환시켜 줄 수 있는 방법도 있으니, 한번 사용해 보세요.

 

✔블로그에 사용하는 이미지의 저장형식을 구글이 만든 Webp로 해보세요.✔

 

 

 

 

맺음말

 

 

티스토리 블로그에서 무료로 사용 가능한 미넴 스킨의 밑줄 스타일을 수정하는 방법과 본문에 적용되는 링크 스타일을 추가하는 방법에 대한 포스팅을 마무리 하겠습니다.

 

부족한 글이지만 끝까지 읽어주셔서 감사합니다. 다음에는 더 좋은 내용으로 뵙겠습니다.

 

 

✔미넴스킨 링크 스타일 변경, 상단광고 2개 위치 변경 방법은 아래의 링크를 참고해주세요.✔

 

 

 

 

출처 및 저작권 표시

 

자료 출처

 

저작권 표시

썸네일 디자인 : 미리캔버스에서 제작되었습니다.

본문 글꼴(폰트) : Google Noto Sans Korean - OFL(Open Font Licese)

이미지에 삽입된 글꼴(폰트) : 이 페이지는 카페24(주)이 제공한 "카페24 당당해"가 적용되어 있습니다.