GeneratePress 테마 Back to Top Button 위치 앵커 광고 위로 변경하기

By비케이팩토리

많은 분들이 워드프레스로 수익형 블로그를 운영할 때 선택하고 계신 GeneratePress 테마.
애드센스의 자동 광고 중 앵커 광고를 설정하게 되면 GeneratePress 테마에서 제공하는 Back to Top Button이 앵커 광고에 가려지는 경우가 생깁니다.

GeneratePress 테마 Bact to Top Button 위치 변경하기

바로 위 이미지와 같이 하단에 뜨는 앵커 광고 때문에 Back to Top Button을 볼 수가 없습니다.
모바일에서는 앵커 광고가 위에 보통 뜨기에 문제가 없습니다만 PC에서는 앵커 광고가 하단에 뜨기에 Back to Top Button을 가리는 경우가 자주 생깁니다.

GeneratePress 테마 Bact to Top Button 위치 변경하기

이렇게 앵커광고를 내려줘야 Back to Top Button을 볼 수 있습니다.

Back to Top Button을 앵커 광고 위로 이동하기

OceanWP 테마는 Back to Top Button의 위치를 설정하는 옵션을 제공합니다만 GeneratePress 테마는 설정 옵션이 없기에 직접 코드를 추가해 줘야 합니다.

워드프레스 알림판(대시보드)에서 외모 > 사용자 정의하기 > 추가 CSS 메뉴로 들어갑니다.
그 이후 아래 코드를 복사 붙이기를 한 이후 발행함 버튼을 클릭하면 됩니다.

.generate-back-to-top,
.generate-back-to-top:visited {
    bottom: 150px; 
}
GeneratePress 테마 Bact to Top Button 위치 변경하기

그럼 이렇게 앵커 광고 위로 노출되는 Back to Top Button을 확인할 수 있습니다.

유의할 점

기존에 비해 쉽게 CSS 부분을 수정할 수 있게 워드프레스가 변경되기는 했습니다만 GeneratePress 테마의 차일드 테마를 꼭 활용하는 것을 추천합니다.

GeneratePress 테마의 차일드 테마는 이 곳에서 다운로드 할 수 있습니다.

GeneratePress 테마의 Back to Top Button은 무료 버전에서도 제공이 됩니다.
워드프레스 알림창 > 외모 > 사용자 정의하기 > Layout > Footer 에서 Back to Top Button 설정 옵션을 확인할 수 있습니다.

연관 글