워드프레스 아바다 업데이트 후 워드프레스 관리자 툴바 아이콘이 깨질 때 해결 방법

최근 아바다 테마와 워드프레스 코어, 플러그인, PHP 버전을 모두 최신 버전으로 업데이트하는 작업을 진행했습니다. 테스트 서버에서 업데이트 테스트를 진행했는데, 업데이트 후 프런트엔드에서 관리자 툴바의 일부 메뉴 아이콘이 깨져 보이는 문제가 발생했습니다. 이외에도 중요하지 않은 미미한 레이아웃 이슈가 있었습니다. 다행히 치명적인 오류나 레이아웃이 복구 불가능할 정도로 깨지는 현상은 발생하지 않았습니다.

워드프레스 관리자 페이지에서는 상단 어드민 툴바가 정상적으로 표시되었지만, 로그인한 상태에서 사이트의 프런트엔드를 확인하면 일부 대시아이콘(Dashicon)이 네모 상자 안에 X가 표시된 것처럼 표시되었습니다.

관리자 페이지에서는 정상이고 프런트엔드에서만 일부 발생한 문제

아바다(Avada)는 현재 100만 개가 넘는 판매를 기록하고 있는 베스트셀링 테마입니다.

워드프레스 사이트를 오랫동안 안전하게 운영하려면 가능하면 워드프레스 코어, 테마, 플러그인을 항상 최신 버전으로 유지하시기 바랍니다.

오랫동안 업데이트를 하지 않다가 한꺼번에 업데이트를 하면 치명적인 오류나 레이아웃 깨짐, 기능 오작동 등 다양한 오류가 발생할 수 있습니다.

업데이트 작업을 맡은 사이트에는 워드프레스 6.7.7 버전이 설치되어 있었고 PHP 버전은 7.4였습니다.

PHP 버전이 낮은 경우 워드프레스에 로그인하면 관리자 페이지 알림판에 "PHP 업데이트 권장. 사이트가 오래된 버전의 PHP (7.4.5p1)에서 작동중이며 보안 업데이트를 받지 못합니다. 업데이트하세요" 경고가 표시됩니다.

설치된 아바다 테마의 버전은 6.2.3이었습니다.

현재 (2026년 9월) 아바다 최신 버전은 7.16.1로 약간의 버전 차이가 있습니다. 

저는 클라우드웨이즈(Cloudways)에 새로운 서버를 하나 만들어서 테스트 사이트를 생성하여 업데이트를 시도해보았습니다.

업데이트 후에 치명적인 오류를 일으키는 플러그인을 확인하여 중요하지 않은 플러그인은 클라이언트의 동의를 얻어 삭제했습니다. 불필요한 플러그인은 가급적 삭제하는 것이 바람직합니다. 플러그인이 많으면 사이트 속도가 느려지고 충돌 가능성도 있습니다.

아바다 테마를 버전 6에서 7로 올려도 치명적인 오류가 발생하지 않았습니다. 다만, 메뉴 항목의 글자 크기가 달라지고 버튼에서 한 라인으로 되어 있던 것이 두 라인으로 바뀌는 등 경미한 증상이 있었습니다.

그리고 중요하지는 않지만 로그인 상태에서 프런트엔드에 접속하면 일부 대시아이콘이 깨져 보였습니다.

Avada는 동적 CSS와 JavaScript 파일을 생성하여 사용합니다. 테마 업데이트 후 이전 버전의 동적 CSS가 캐시에 남아 있으면 프런트엔드에서 스타일 문제가 발생할 수 있습니다. 보통 아바다 옵션에서 캐시를 리셋하면 오류가 사라지기도 합니다.

이 조치에도 해결되지 않아서 여러 가지를 체크하다가 관리자 툴바 아이콘 요소에 Dashicons 폰트를 강제로 지정하니 문제가 해결되었습니다.

#wpadminbar #wp-admin-bar-comments .ab-icon,
#wpadminbar #wp-admin-bar-comments .ab-icon::before {
    font-family: dashicons !important;
    font-weight: normal !important;
    font-style: normal !important;
}

알고 보면 간단하지만 원인을 찾아서 해결하기까지 조금 시간이 걸렸습니다.😄

이런 문제가 발생하면 사이트 운영에 지장이 없으므로 보통은 방치할 것 같습니다. 눈에 거슬리는 경우 원인을 찾아서 해결을 시도해볼 수 있을 것입니다.

👉 워드프레스 사이트 업데이트, 멀웨어 치료 등 워드프레스나 웹호스팅 관련 문제 해결이 필요한 경우 여기에서 서비스(유료)를 의뢰하실 수 있습니다.

참고

https://avada.tistory.com/3941

카페24 뉴매니지드 워드프레스 호스팅으로 변경 및 워드프레스 아바다 테마 업데이트 작업

https://avada.tistory.com/3587

워드프레스 베스트셀링 아바다 vs. Divi 테마 비교