워드프레스 푸터의 저작권 문구를 변경하는 방법

워드프레스 푸터 영역에 "Theme by 테마 개발자" 또는 "Powered by WordPress'와 같은 문구가 표시되는 경우가 있습니다. 이 경우 푸터 영역의 저작권(Copyright) 문구를 변경하는 방법을 살펴보겠습니다. 아래에 설명하는 워드프레스 푸터의 저작권 문구를 변경하는 다양한 방법 중에서 적합한 방법을 통해 문구를 수정하시기 바랍니다.

카피라이트 섹션을 단순히 제거하고 싶은 경우에는 테마의 footer.php 파일에서 해당 부분을 삭제하거나 혹은 CSS를 사용하여 숨길 수 있습니다. 아래의 "CSS를 사용하여 저작권 문구 변경하기/숨기기" 부분을 참고해보세요.

[ 이 글은 2023년 1월 16일에 최종 업데이트되었습니다. ]

워드프레스 푸터 저작권 문구 변경 방법

테마 옵션에서 변경하기

대부분의 유료 테마와 일부 무료 테마에서는 테마 옵션을 통해 푸터 문구를 변경할 수 있도록 합니다. 외모 (테마 디자인) > 사용자 지정하기 또는 테마 옵션(Theme Options)에서 저작권 문구를 변경할 수 있는 옵션이 있는지 확인합니다.

예를 들어, 가장 인기 있는 테마인 Avada의 경우 테마 옵션 » 푸터 » Footer Content(푸터 콘텐츠) 아래의 "저작권 텍스트" 부분에서 Copyright 문구를 수정할 수 있습니다.

아바다 테마 워드프레스 푸터의 저작권 문구 변경 방법

Enfold의 경우 조금 특이하게 "Enfold Theme by Kriesi"라는 저작권 문구가 기본적으로 추가됩니다. Enfold에서 이 문구를 삭제하는 방법은 이 글을 참고해보시기 바랍니다.

인기 매거진 테마인 Newspaper에서는 Newspaper » Theme panel » Footer » Sub footer settings » Footer Copyright Text에서 변경할 수 있습니다. Cloud Library를 사용하여 푸터 템플릿을 만든 경우에는 클라우드 라이브러리 템플릿을 수정해야 합니다.

푸터 위젯 영역 내의 위젯 수정

경우에 따라 푸터 위젯 영역에 텍스트 위젯이나 사용자 정의 HTML 위젯을 사용하여 저작권 문구나 회사 주소 등의 정보를 넣는 경우가 있습니다. 워드프레스 관리자 페이지 » 외모(테마 디자인) » 위젯 페이지에서 푸터 관련 위젯 영역을 살펴보시기 바랍니다.

테마 또는 플러그인에서 푸터 템플릿 기능을 제공하는 경우

최근에는 테마나 플러그인에서 헤더 템플릿, 푸터 템플릿 등을 만들어 편집할 수 있는 기능을 제공합니다. 이러한 기능을 전체 사이트 편집(Full Site Editing: FSE)이라고 합니다.

예를 들어, 인기 매거진 테마인 뉴스페이퍼에서는 tagDiv Cloud Library를 사용하면 1000개가 넘는 레이아웃, 템플릿을 로드하여 헤더, 포스트 템플릿, 카테고리 템플릿 등에 사용할 수 있습니다. 원하는 템플릿을 로드한 후에 커스텀이 가능합니다("뉴스페이퍼 테마 버전 10: Standard Pack vs. tagDiv Cloud 템플릿" 참고).

Divi 테마도 4.0 버전으로 업데이트되면서 카테고리, 개별 페이지 등의 헤더, 본문, 푸터를 자유롭게 디자인할 수 있는 Theme Builder가 도입되었습니다("Divi 4.0 업데이트: 카테고리, 개별 페이지 등의 헤더, 본문, 푸터를 자유롭게 디자인" 참고).

또한, Elementor 페이지 빌더 Pro를 사용하는 경우 커스텀 헤더와 커스텀 푸터를 만들 수 있습니다. 그런 경우 Elementor 페이지 빌더에서 생성한 템플릿에서 편집할 수 있습니다.

푸터 파일(footer.php) 수정하기

테마 옵션을 통해 저작권 문구를 변경할 수 없는 경우 테마 소스 파일을 수정할 수 있습니다. 보통은 footer.php 파일에서 가능하지만 일부 테마에서는 Copyright 문구를 제어하는 부분을 함수 파일이나 다른 파일에 추가했을 수 있습니다. 테마 소스 파일을 수정하는 경우 반드시 차일드 테마(자식 테마; 하위 테마)를 만들어서 작업하시기 바랍니다(자식 테마 만드는 방법은 이 글을 참고하세요).

예를 들어, 올해의 기본 테마인 Twenty Sixteen의 경우 footer.php 파일에서 다음 부분을 수정하면 됩니다.

<span class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></span>
<a href="<?php echo esc_url( __( 'https://wordpress.org/', 'twentysixteen' ) ); ?>"><?php printf( __( 'Proudly powered by %s', 'twentysixteen' ), 'WordPress' ); ?></a>

하지만 위의 부분을 수정하더라도 끝 부분에 슬래시(/)가 추가될 것입니다. 이 경우 요소 검사를 하여 그 부분을 없애주어야 합니다.

.site-footer .site-title:after {
display: none;
}

위의 CSS 코드를 테마의 스타일시트 파일에 추가하도록 합니다.

CSS를 사용하여 저작권 문구 변경하기/숨기기

테마 옵션에 변경하는 설정이 없는 경우 CSS를 통해서도 저작권 텍스트를 변경할 수 있습니다. 예를 들어, Attitude라는 테마(Interface 테마도 동일)에서 다음 CSS 코드를 스타일 시트 파일에 추가하면 저작권 문구가 변경됩니다. 이 경우에도 마찬가지로 자식 테마를 만들어서 작업해야 추후 테마가 업데이트되더라도 수정 사항이 사라지지 않습니다.

/* Attitude 테마와 Interface 테마에서 Copyright 부분 변경하기 */

#site-generator .copyright {
visibility: hidden;
line-height: 0;
}
#site-generator .copyright:before {
visibility: visible;
content: 'Copyright(C) 2016. 워드프레스'; /* 적절한 문구로 변경 */
line-height: 1.2em; /* 글자 크기를 적절히 변경 */
color: #bdbdbd; /* 글자 색상을 적절히 변경하도록 합니다 */
}

위와 같은 코드를 style.css 파일에 추가하면 저작권 문구가 변경된 것을 확인해볼 수 있습니다. (또는, 워드프레스 알림판 > 외모 > 추가 CSS 아래에 커스텀 CSS 코드를 추가할 수 있습니다.)

다른 방법으로 "How can I replace text with CSS?" 문서에서 소개하는 CSS 코드를 사용할 수 있습니다. 예시:

.element {
  text-indent: -9999px;
  line-height: 0; /* Collapse the original line */
}

.element::after {
  content: "New text";
  text-indent: 0;
  display: block;
  line-height: initial; /* New content takes up original line height */
}

예를 들어, Moina Lite라는 테마에서는 다음과 같은 CSS 코드를 외모 » 사용자 정의하기 » 추가 CSS 섹션에 추가하면 저작권 문구가 변경됩니다. 다른 테마에서도 비슷하게 적용이 가능합니다.

.copyright {
    text-indent: -9999px;
    line-height: 0;
}

.copyright:after {
    content: "Copyright(C) 2023. 샬라샬라";
    text-indent: 0;
    display: block;
    line-height: initial;
}

저작권 섹션이 브라우저에 표시되지 않도록 하고 싶은 경우에는 CSS를 통해 간단히 숨길 수 있습니다. 예시:


#site-generator .copyright {
display: none;
}

CSS로 숨길 경우 실제로는 로드되지만 브라우저에서 표시가 되지 않습니다. HTML 소스를 보면 Copyright 섹션이 로드되는 것을 확인할 수 있습니다.

다른 테마에서는 요소 검사를 수행하여 적절한 요소 이름으로 변경하여 적용해야 합니다. 요소 검사를 하여 CSS를 적용하는 방법은 "워드프레스에 CSS를 적용하는 방법"을 참고해보시기 바랍니다.

참고:


댓글 남기기

* 이메일 주소는 공개되지 않습니다.