안녕하세요 테크라소스입니다.
블로그 포스팅할 때 워드프레스 이미지 테두리 추가하고 싶은 경우가 있습니다.
대표적으로 스크린샷 같은 경우가 그렇죠. 아래 이미지 보실까요?
오른쪽 이미지가 테두리 덕분에 더 보기 편합니다.
독자에게 좋은 경험을 제공하는 블로그는 당연히 검색 엔진도 좋아하겠죠?
그래서 워드프레스 이미지 테두리 추가 방법을 알려드리려 합니다.
제가 사용하는 방법은 귀찮게 플러그인을 설치할 필요가 없고, 필요한 이미지만 선택하여 경계선을 넣을 수 있습니다.
또, 한 번 세팅으로 계속 사용할 수 있기도 하죠. 그럼 함께 알아보시죠!
워드프레스 이미지 테두리 추가 방법
1. CSS 추가
1. 워드프레스 왼쪽 메뉴 → 외모 → 사용자 정의하기 클릭
2. 추가 CSS 클릭
3. 아래 코드를 빈 칸에 복사 → 붙여넣기 해주세요.
.border img {
border: 1px solid gray;
}
코드는 “이미지에 굵기 1픽셀의 회색 실선 그려줘”라는 뜻입니다.
2. 이미지 테두리 추가하기
1. 워드프레스 글 작성 화면에서 테두리를 추가할 이미지를 클릭하세요.
2. 오른쪽 메뉴 → 고급 → 추가 CSS 클래스에 border 입력하면 끝~
정말 간단하죠?
심지어 이 방법은 테두리 모양을 다양하게 꾸밀 수 있습니다.
구글에 [border css style] 라고 검색하면, 테두리 꾸밀 수 있는 아주 많은 옵션이 나옵니다.
그 중 마음에 드는 스타일로 예쁘게 꾸며보세요.
성공적으로 코딩을 통해 테두리를 그리셨다면 잠시 자축하는 시간을 갖도록 합시다.
앞으로 그릴 5조 5천 개의 멋진 테두리를 상상하면서 말이죠.
저도 진심으로 축하 마음 전합니다 😁😁