워드프레스 하이퍼링크 밑줄 없애고 스타일 변경하는 방법

By구기자 9월 20, 20249월 20, 2024

워드프레스 하이퍼링크 밑줄을 없애고 스타일을 변경하고 싶어 ChatGPT, 클로드, 검색 등 다양한 방법을 찾아보았습니다. 그리고 결론을 내어서 쉽게 스타일을 이쁘게 변경하는 방법을 알려드립니다. 이 글을 완독하시면 여러분의 워드프레스 링크 밑줄을 없애고 원하는 색상으로 이쁘게 꾸밀 수 있습니다. 포기하지 말고 끝까지 읽어주세요.

수익형 블로그에 최적화된 워드프레스 테마

수익형 워드프레스 블로그는 예를 들면 쿠팡파트너스 애드픽과 같은 제휴 마케팅, 애드센스 블로그를 의미합니다. 워드프레스에 비교적 SEO에 맞는 글을 쓰기 편리한 플러그인을 많이 제공해서 편리하긴 한데요.

어떤 테마를 사용하느냐에 따라 속도와 성능에 영향을 미치기 때문에 올바른 테마를 선택하는 것이 중요합니다. 전 세계적으로 가장 많이 사용하는 테마는 제네레이트 프레스입니다. 빠른 속도와 쾌적함을 자랑하기 때문이죠.

그리고 최근 부상하고 있는 테마가 Kadence 테마입니다. 제가 이 웹사이트에 적용한 테마이기도 하고요. 속도로 따지면 제네레이트 프레스에 필적하는 성능을 보여줍니다. 그만큼 가볍고 응용하기 편리하다는 뜻이죠.

저는 개인적으로 워드프레스를 이용하여 홈페이지를 제작하는 사업을 하고 있는데요. 그래서 많이 사용하다 보니 편리한 것이 케이던스 테마입니다. 앞으로 케이던스 테마에 대한 좋은 정보들을 많이 다루려고 합니다.

제네레이트 프레스에서 워드프레스 링크 밑줄 변경하는 방법

워드프레스 관리자 페이지로 들어갑니다.
좌측 메뉴에서 모양> 사용자 정의로 들어갑니다.

3. 추가 CSS를 클릭합니다.

4. 아래 코드를 복사 붙여 넣기 한 뒤 발행버튼을 누릅니다.

/*링크 스타일 변경*/
.single .entry-content p:not(.btn-theme):not(.wpml-banner) a, 
.single .entry-content #ftwp-postcontent > ul li a,
.single .entry-content #ftwp-postcontent > ol li a {
  word-break: break-all;
  color: #3e5898;
  transition: color .25s ease-in;
  background-repeat: no-repeat;
  background-size: 100% 0.2em;
  background-position: 0 100%;
  background-image: linear-gradient(to right,#00BCD4,#5C6BC0);
  transition: all .25s ease-in;
  padding: 2px 0;
}

.single .entry-content p:not(.btn-theme):not(.wpml-banner) a:hover,
.single .entry-content #ftwp-postcontent > ul li a:hover,
.single .entry-content #ftwp-postcontent > ol li a:hover {
  background-size: 100% 100% !important;
  color: #fff !important;
  border-radius: 10px !important;
}

Kadence 테마에서 워드프레스 하이퍼링크 스타일 변경하는 방법

케이던스 테마도 제네레이트프레스 테마와 수정하는 방법은 거의 동일합니다.

추가 CSS에 들어가서 복사 붙여 넣기 해주시고 역시 발행 버튼을 클릭해 주세요. 다만 그냥 두면 기존에 있던 링크 밑줄과 겹치는 어색한 상황이 발생합니다.

그럴 경우 추가로 설정 변경이 필요한데요. 사용자 정의 화면에서 가장 위에 있는 colors and fonts 메뉴를 클릭해서 들어갑니다. 다시 가장 위에 colors를 클릭해 주세요. 아래 사진과 같은 화면이 보이실 거에요. 아래쪽에 Content links라는 메뉴가 보입니다. Link style에서 기존에는 underline으로 되어 있을 텐데요. No underline으로 변경해 주세요. 그러면 추가 CSS의 언더라인과 중복되는 밑줄이 사라집니다.

마지막에 발행 버튼 눌러주셔야 변경한 설정이 저장되는 것도 잊지 마세요.