아바다 테마 데모 로드 시 아이콘이 깨지는 문제

오늘 워드프레스 베스트셀링 테마 중 하나인 아바다 테마의 데모가 설치된 사이트에서 폰트 설정 등 몇 가지 기본적인 작업을 맡았습니다. 사이트에 접속하니 설치된 데모 페이지에서 아이콘들이 모두 깨져서 올바르게 표시되지 않는 문제가 있었습니다. 아바다 테마 사용 시 아이콘이 깨지는 문제가 발생할 경우 참고해 보시기 바랍니다.

워드프레스 아바다 테마 데모 로드 시 아이콘이 깨지는 문제

2023년 2월 현재 87만 개 이상의 판매량을 자랑하는 Avada 테마는 10년 동안 엔바토 마켓에서 판매 1위를 기록하고 있습니다. 비슷한 기능과 판매량을 자랑하는 테마로 Divi 테마가 있습니다. 디비 테마는 현재 88만 개 이상 판매되었습니다.

아바다 테마와 Divi 테마에 대한 자세한 정보는 다음 글을 참고해보시기 바랍니다.

워드프레스 아바다 테마와 Divi 테마 비교 - 워드프레스

오늘 기본 설정 작업을 맡은 워드프레스 사이트에는 Avada 테마의 Corporation 데모가 설치되어 있었습니다. 현재 아바다 테마에서는 92개의 데모가 제공됩니다.

아바다 테마의 Corporation 데모는 기업 소개 사이트를 만드는 데 활용할 수 있는 데모입니다.

위의 그림과 같이 아이콘이 표시되어야 하지만, 작업을 맡은 사이트에서는 아이콘이 모두 깨져 있었습니다.

다음 글에서 소개하는 방법을 시도해보았지만 문제가 해결되지 않았습니다.

아바다에서 Fontawesome 아이콘이 제대로 표시되지 않는 문제가 발생하는 경우

사이트의 주소 설정을 살펴보니 SSL 인증서가 설치되었지만 주소는 [**https://...**] 주소가 아닌 [**http://...**] 주소로 설정되어 있었습니다.

주소를 https 프로토콜의 URL로 변경하고, 데모를 제거한 다음 다시 설치하니 문제가 해결되었습니다.

단순한 문제이지만 원인을 파악하는 데 시간이 조금 걸렸습니다.

혹시 이와 같은 문제를 접하게 되면, 여러 가지 조치에도 문제가 해결되지 않을 경우 워드프레스 사이트를 이전하거나 주소를 최근 변경한 적이 있는지, SSL 인증서를 설치한 적이 있는지를 확인해 보시면 좋을 것 같습니다. 워드프레스 주소를 변경한 후에 워드프레스 주소와 사이트 주소를 제대로 변경하지 않으면 예상치 못한 오류가 발생할 수 있습니다.

데모 설치 후 사이트 미작동 문제

이와는 다른 문제로 데모를 설치 후에 관리자로 로그인하면 사이트가 잘 표시되었지만, 구글 시크릿 모드로 접속하면 사이트 콘텐츠가 제대로 표시되지 않는 오류가 발생했습니다.

이런 경우 캐시 플러그인의 문제일 가능성이 높습니다.

해당 사이트가 사이트그라운드(SiteGround)라는 해외 웹호스팅에서 호스팅되고 있었는데, 사이트그라운드에서 제공하는 SG Optimizer가 의심스러웠습니다. 이 플러그인을 비활성화하니 사이트 콘텐츠가 제대로 표시되었습니다. 

사이트그라운드나 클라우드웨이즈(Cloudways) 등의 호스팅을 이용하는 경우 변경 사항이 곧바로 반영되지 않을 것입니다. 변경 사항이 곧바로 반영되기를 원하는 경우에는 캐시 플러그인의 캐시뿐만 아니라 서버 캐시도 삭제하시기 바랍니다.

클라우드웨이즈 서버 캐시 삭제/비활성화 방법 - 워드프레스 정보꾸러미

캐시 플러그인이 계속 문제를 일으키면 다른 캐시 플러그인을 설치하는 것을 고려할 수 있습니다.

참고

https://avada.tistory.com/2791

클라우드웨이즈에서 여러 개의 워드프레스 사이트 운영하기 (도메인, 서브도메인 추가)

https://avada.tistory.com/2897

엘리멘터 무료 버전 vs. 프로 버전 비교

https://avada.tistory.com/2914

워드프레스 Divi 테마 메뉴에 검색상자 표시하기