안녕하세요. 인돈사입니다. 워드프레스를 운영하다보면 이미지를 추가하는일이 있습니다. 이미지 추가 시 정렬의 기본값은 왼쪽입니다. 하지만 저를 비롯한 많은 블로거들은 이미지 가운데 정렬이 익숙할 것이라고 생각합니다. (티스토리 때문에 그런가…?)
오늘은 워드프레스에서 이미지를 추가하면 자동으로 가운데 정렬이 되도록 설정하는 방법에 대해서 알아 보겠습니다. 아직도 워드프레스가 없는 분들은 아래 ‘워드프레스 따라오세요’ 무료강의를 참고하시면 쉽고 빠르게 워드프레스를 만들 수 있으니 참고하세요! (무료체험 3일 제공, 유료전환 시 3개월동안 20% 할인)
📌 WP 따라오세요 (feat. 클라우드웨이즈)
📌 아스트라 프로 유료테마($59/년)를 무료로 설치하기 (Astra Pro)
들어가며
워드프레스 이미지 중앙정렬을 기본값으로 설정하는 방법은 WP 팔로워즈 소통방에서 대화 중 나왔던 팁입니다. 이자리를 빌어 레모나X님께 감사인사드립니다! 이렇듯 워드프레스 따라오세요를 통해 워프를 개설하고 운영하면 WP 팔로워즈에 가입하고 혜택도 받고 함께 소통할 수도 있어서 보다 즐겁게 워프를 운영할 수 있습니다. WP팔로워즈 가입 및 혜택은 아래글을 참고하시기 바랍니다.
※ 앞으로도 소통방 대화를 참고해 도움이 될만한 팁들이 있으면 정리 해 보도록 하겠습니다.
📌 WP 팔로워즈 모집 안내
📌 클라우드웨이즈 서비스 유료전환 회원 추가혜택 안내(feat. WP팔로워즈)
테마 functions.php 파일 열기
워드프레스는 테마마다 구성하는 파일들이 다릅니다. 다만 기본적으로 포함하고있어야 하는 파일들이 몇가지 있는데 그 중에 한가지가 functions.php 파일입니다. 말 그대로 여러가지 테마들에서 작동하는 ‘기능’을 정의하는 파일이라고 생각하면 됩니다. 워드프레스 이미지 중앙정렬을 설정하기 위해서는 이 펑션파일 마지막에 제가 알려드리는 어떤 코드를 넣어야 합니다. 그러려면 일단 파일을 열어야겠죠? 이 파일을 여는 방법은 2가지가 있습니다.
워드프레스 테마 파일 편집기로 열기
워드프레스 이미지 중앙정렬을 기본값으로 하기 위해서는 워드프레스 테마에서 제공하는 펑션 파일을 편집해야합니다. 네… 우리같은 초보들이 무서워하는…. 코드수정입니다. ㄷㄷ 그래도 쉽게 해 볼 수 있게 설명 드릴테니 너무 겁먹지 마세요! 먼저 워드프레스 관리자 페이지에 로그인하셔서 외모>테마편집기를 눌러주세요.
이부분은 막 잘못만지면…. 내 소중한 워드프레스가 망가질 수 있으니… 백업을 하고 진행을 하시던지… 아니면 한단계 한단계 천천히 따라하시는것이 좋습니다. 일단 테마 파일 편집기 메뉴를 누르면 오른쪽에 우리가 싫어하는 코드들이 주르륵 나오는데요. 우측 상단 설치된 테마 목록 중에서 지금 사용하고 있는 테마 이름을 선택해 주세요.
보고계시는 워드프레스 따라오세요 강의사이트는 Neve 라는 테마 하나만 설치 되어 있습니다. 그렇기 때문에 위처럼 나오는거구요… 설치한 테마가 많으면 여러개 나올겁니다. 그 중에 워드프레스 이미지 가운데정렬을 기본설정으로 하기 위한 테마를 선택해 주세요. 이후 function.php 파일을 클릭해주세요.
클릭하면 쌸라쌸라 어려운 코드들이 적힌 파일이 왼쪽에 열립니다. 이제 아래쪽에 안내해 드리는 코드를 functions.php 파일 마지막에 넣고 파일업데이트를 눌러주시면 됩니다. 혹시 파일업데이트 하면서 오류가 나서 업데이트가 안되는경우 다른방법으로 파일을 열어야 합니다.
SFTP를 이용해서 functions.php 파일 열기
클라우드웨이즈 서버에서 SFTP를 이용하기 위해서는 일단 계정을 생성해야 합니다. 아래 게시글을 참고해서 SFTP 계정을 생성하고 파일질라를 통해 서버로 접속해 주세요.
서버에 접속하면 다음 경로를 통해 테마폴더에 들어갑니다. public_html >> wp-content >> themes >> 수정할 테마이름 (저의 경우 neve) >> functions.php
저의 경우 neve 테마 하나만 설치되어 있다고 했죠? 그러니 폴더도 하나 뿐입니다. 테마가 여러개라면 여러개 폴더가 있을겁니다. 참고로 이곳에서 폴더를 지우면 테마가 사라집니다. 아무튼… functions.php 파일 위에서 오른쪽 버튼 누르고 편집하기를 선택하면 다운받아서 편집할 수 있습니다.
메모장, 노트패드, 에디트플러스, vs코드 등등… 본인이 사용하기 편리한 편집기를 열어서 아래에 말씀드리는 코드를 적용하면 워드프레스 이미지를 가운데로 정렬하는것을 기본설정으로 만들 수 있습니다.
이미지 중앙정렬 코드 넣기
펑션파일을 열었으면 아래와 같은 코드를 넣고 저장해 주시면 적용완료! 이제 글쓰기로 들어가서 이미지를 추가해 보시면 바로 가운데 정렬이 되는것을 확인 할 수 있을것입니다.
add_filter( 'block_type_metadata', 'set_image_auto_centre' );
function set_image_auto_centre( $metadata ) {
if ( 'core/image' !== $metadata['name'] ) {
return $metadata;
}
$metadata['attributes']['align']['default'] = 'center';
return $metadata;
}마치며 (주의사항)
오늘 배운 functions.php 파일은 워드프레스 모든 테마에 있는 파일입니다. 파일 속에 정의되어 있는 기능은 다를지라도…. 무슨 테마든 100% 갖고있습니다. 테마가 여러개 설치되어있다면…. 실수로 다른파일을 수정해놓고 왜 안되지? 할수도 있으니… 이미지 중앙정렬을 원하는 테마를 선택했는지 잘 확인해 보시고… 향후 테마를 바꾼다면 바꾼 테마에도 다시 적용해야 할것입니다.
워드프레스에서는 재미있는 기능들을 펑션파일을 수정해서 적용할 수 있는 경우가 많이 있습니다. 위의 방법처럼 펑션파일을 열어서 수정하는 것 정도 할줄 알고 있는것이 좋으니 꼭 익혀 두시기 바랍니다! (플러그인을 설치하는것보다 펑션파일 수정하는게 효율적인 경우가 많음)
감사합니다. 제가 많이 부족하지만 최대한 쉽게 설명해 보도록 하겠습니다.
다른 팁 보러가기
📌 클라우드웨이즈 워드프레스에서 ads.txt 경고 해결하기
📌 워드프레스 트래픽 관리 (feat. 이미지 용량 줄이기)