클라이언트가 워드프레스를 엉망으로 만드는 방법

게시 됨: 2022-03-10
빠른 요약 ↬ WordPress는 다양한 사용자를 위해 즉시 사용할 수 있는 유연성을 제공하는 많은 다목적 기능과 함께 제공되는 놀랍도록 강력한 CMS입니다. 그러나 사용자 지정 테마 및 플러그인을 전문적으로 구축하는 경우 이러한 기능이 문제가 될 수 있습니다. 기성품 테마를 다양한 사용 사례에 적용할 수 있도록 하는 동일한 기능 및 옵션이 특정 사용 사례를 위해 신중하게 설계된 사용자 지정 테마를 약화시키는 데 사용될 수도 있습니다.

WordPress는 다양한 사용자를 위해 즉시 사용할 수 있는 유연성을 제공하는 많은 다용도 기능과 함께 제공되는 놀랍도록 강력한 CMS입니다. 그러나 사용자 지정 테마 및 플러그인을 전문적으로 구축하는 경우 이러한 기능이 문제가 될 수 있습니다. 기성품 테마를 다양한 사용 사례에 적용할 수 있도록 하는 동일한 기능 및 옵션이 특정 사용 사례를 위해 신중하게 설계된 사용자 지정 테마를 약화시키는 데 사용될 수도 있습니다.

다음 기사는 거의 모든 WordPress 프로젝트에서 반복해서 사용하는 코드 조각 모음으로 구성되어 있습니다. 이들 모두의 공통점은 불필요하거나 혼란스럽거나 안전하지 않은 기능을 제한한다는 것입니다. 다음 내용은 모든 사이트에서 사용할 수 있지만 이 팁은 특히 클라이언트용 맞춤 테마 및 플러그인을 만드는 전문가에게 적용됩니다.

SmashingMag에 대한 추가 정보:

  • WordPress 하위 테마를 만들고 사용자 지정하는 방법
  • WordPress 최종 사용자를 위한 효과적인 문서 작성
  • 사용자 이름을 통한 WordPress 게시물의 가시성 제한
  • WordPress에서 사용자 역할 활용

주목할만한 차이점은 사용자 정의 테마를 특정 목적에 맞게 구축할 수 있다는 것입니다. 따라서 저자의 콘텐츠에 대한 공백은 훨씬 더 좁을 수 있고 또한 더 좁아 합니다. 잘 디자인된 워드프레스 테마는 가능한 한 많은 디자인 결정을 내려야 하므로 작성자는 그럴 필요가 없습니다.

점프 후 더! 아래에서 계속 읽기 ↓

플러그인 및 테마 편집기 비활성화

누군가가 WordPress 대시보드를 통해 사용자 정의 테마 또는 플러그인 파일을 실시간 편집해야 할 이유가 없습니다. 전문가는 그런 식으로 일하지 않으며 머글은 일반적으로 세미콜론 하나를 건너뛰어 사이트를 깨는 것이 얼마나 쉬운지 깨닫지 못합니다. 해커가 악용할 수 있는 보안 취약점이기도 합니다. 다행히 WordPress.org의 친구들이 이 기능을 아주 쉽게 비활성화할 수 있게 해주었습니다. wp-config.php 파일에 다음 스니펫을 추가하기만 하면 됩니다.

 define( 'DISALLOW_FILE_EDIT', true );

테마 편집기 외에도 플러그인 편집기도 비활성화됩니다. 나는 이것이 버그가 아닌 기능이라고 생각한다.

워드프레스 플러그인 편집기
워드프레스 플러그인 편집기. (큰 버전 보기)

시각 및 텍스트 편집기 제한

기본적으로 WordPress WYSIWYG 편집기는 잘 설계된 사용자 정의 테마에 대해 너무 많은 서식 옵션을 지원합니다. 클라이언트가 텍스트 색상이나 글꼴 크기를 재정의하도록 하는 것은 가장 세련된 사이트라도 저렴하고 보기 흉하게 보이게 만드는 빠른 방법입니다. 블로그 게시물 텍스트가 항상 왼쪽 정렬되도록 설계된 경우 작성자에게 오른쪽 정렬 버튼을 제공하는 이유는 무엇입니까? 정보 페이지의 텍스트가 보라색, 굵게, 기울임꼴이면 보기 좋을 것 같습니까? 그런 다음 클라이언트에게 그렇게 할 수 있는 수단을 제공하지 마십시오. 대부분의 경우 비주얼 편집기를 완전히 비활성화하는 것이 좋습니다.

못생긴 타이포그래피 페이지
못생긴 타이포그래피 페이지. (큰 버전 보기)

비주얼 편집기 비활성화

테마의 functions.php 파일에 다음 스니펫을 추가하면 WYSIWYG 편집기를 토글하는 탭이 사라집니다.

 function emersonthis_disable_visual_editor(){ # add logic here if you want to permit it selectively return false; } add_filter('user_can_richedit' , 'emersonthis_disable_visual_editor', 50);

이것은 좋은 시작이지만 굵게 및 기울임꼴 단추가 일반 텍스트 편집기에 여전히 있음을 알 수 있습니다. 내 경험에 따르면 클라이언트는 WYSIWYG 편집기의 즉각적인 만족감이 사라지면 이 버튼을 훨씬 덜 자주 남용합니다. 그러나 필요하지 않은 경우 제거하는 것을 선호합니다.

비주얼 편집기 탭
비주얼 편집기 탭. (큰 버전 보기)

텍스트 편집기에서 굵게 및 기울임꼴 Quicktag 제거

텍스트 편집기에는 선택한 텍스트를 <strong><em> 태그로 래핑하는 빠른 태그 버튼이 있습니다. 테마의 functions.php 파일에 다음 코드를 추가하면 작성자는 더 이상 볼드체 또는 이탤릭체 버튼을 사용할 수 없습니다.

 # Removes bold and italic quicktags from text editor function emersothis_quicktags_settings( $qtInit ) { //To disable ALL butons it must be set to "," (not "") $qtInit['buttons'] = 'more,'; return $qtInit; } add_filter('quicktags_settings', 'emersonthis_quicktags_settings');

이렇게 하면 클라이언트가 전체 기사를 기울임꼴로 표시할 가능성이 제거됩니다. 그러나 이것은 텍스트 편집기에 손으로 마크업을 작성하는 기능을 제거하지 않습니다. 가끔 급할 때 유용하게 사용할 수 있습니다.

사용자가 텍스트 자체에 서식을 지정해야 하는 드문 상황에 있는 경우 비주얼 편집기를 활성화된 상태로 두고 특정 버튼을 개별적으로 비활성화할 수 있습니다.

비주얼 편집기에서 버튼 비활성화

내가 비주얼 편집기를 활성화 상태로 두는 몇 가지 경우 중 하나는 작성자가 자체 내부 구조가 있는 긴 게시물이나 페이지를 작성할 때입니다. 예를 들어, 10페이지짜리 기사의 작성자는 부제목을 추가할 수 있는 기능이 필요할 수 있습니다. 이러한 상황에서는 하위 섹션에 대한 사용자 정의 클래스를 설정한 다음 필요하지 않은 다른 모든 서식 지정 버튼을 비활성화합니다.

TinyMCE 편집기를 수정하기 위한 WordPress API는 제거하려는 각 버튼을 참조하는 데 사용되는 코드 이름을 조회해야 하기 때문에 약간 까다롭습니다. 가장 문제가 되는 서식 지정 버튼이 포함된 두 번째 행 전체를 토글하는 "주방 세면대" 버튼을 제거하여 비용을 최대한 절감할 수 있습니다. 테마의 functions.php 파일에 다음 코드를 추가하면 됩니다.

 # Remove visual editor buttons function emersonthis_tinymce_buttons($buttons) { # Remove the text color selector $remove = array('wp_adv'); //Add other button names to this array # Find the array key and then unset return array_diff($buttons,$remove); } add_filter( 'mce_buttons', 'emersonthis_tinymce_buttons' );

제거하려는 버튼의 코드 이름을 알아내는 한 가지 트릭은 양식의 마크업을 검사하는 것입니다. 작성 당시 각 버튼에는 mce-i- 시작하는 클래스 이름이 있고 그 뒤에 위의 배열에 넣을 코드 이름이 옵니다.

"미디어 추가" 버튼 제거

사용자 정의 게시물 유형이 편집기 기능을 지원할 때마다 "미디어 추가" 버튼이 기본적으로 나타납니다. 그러나 사용자 정의 게시물 유형은 다양한 용도로 사용될 수 있으며 종종 해당 필드에 이미지를 포함하는 것이 부적절합니다.

못생긴 이미지로 가득 찬 블로그 게시물
못생긴 이미지로 가득 찬 블로그 게시물. (큰 버전 보기)

대부분의 경우 작성자가 텍스트와 함께 이미지를 게시할 것으로 예상할 때 게시물 썸네일(특집 이미지라고도 함)을 사용합니다. 이렇게 하면 이미지를 테마 템플릿에 쉽게 통합할 수 있으며 개발자는 이미지의 크기와 사양을 더 잘 제어할 수 있습니다.

에디터의 '미디어 추가' 버튼으로 임베드된 애드혹 사진은 컨트롤이 어렵고 작성자가 주변 텍스트와 관련하여 이미지를 삽입하는 위치에 따라 어색해 보이는 경향이 있습니다. 또한 "미디어 추가" 버튼은 페이지 아래쪽(기본값)에 표시되는 "추천 이미지" 업로드 버튼과 쉽게 혼동되고 테마에 따라 매우 다르게 사용될 수 있기 때문에 많은 작성자에게 혼란을 주기도 합니다. 테마의 functions.php 파일에 다음 코드를 추가하여 거의 항상 제거합니다.

 # Remove media buttons function emersonthis_remove_add_media(){ # do this conditionally if you want to be more selective remove_action( 'media_buttons', 'media_buttons' ); } add_action('admin_head', 'emersonthis_remove_add_media');

특정 게시물 유형에 대해 조건부로 미디어 버튼만 제거하기 위해 remove_action() 전에 로직을 추가할 수 있습니다. 예를 들어 작성자가 페이지에 이미지를 추가하도록 허용하지만 축소판을 대신 사용하는 블로그 게시물은 허용하지 않을 수 있습니다.

테마 사용자 지정 옵션 비활성화

하위 테마에서 작업하는 경우 상위 테마가 하위 테마에 적합하지 않은 사용자 지정 옵션을 제공할 수 있습니다. 사용자 지정 옵션은 하위 테마에서 사용되지 않거나 문제를 일으킬 가능성이 있습니다. 어느 쪽이든 WordPress 테마 사용자 정의 API를 사용하면 테마의 functions.php 파일에 다음 스니펫을 추가하여 쉽게 제거할 수 있습니다.

 # Remove customizer options. function emersonthis_remove_customizer_options( $wp_customize ) { // $wp_customize->remove_section( 'static_front_page' ); // $wp_customize->remove_section( 'title_tagline' ); $wp_customize->remove_section( 'colors' ); $wp_customize->remove_section( 'header_image' ); $wp_customize->remove_section( 'background_image' ); // $wp_customize->remove_section( 'nav' ); // $wp_customize->remove_section( 'themes' ); // $wp_customize->remove_section( 'featured_content' ); // $wp_customize->remove_panel( 'widgets' ); } add_action( 'customize_register', 'emersonthis_remove_customizer_options', 30);

위 스니펫의 각 줄은 주석을 제거하여 비활성화할 수 있는 개별 테마 사용자 지정 옵션에 해당합니다.

사용하지 않는 대시보드 메뉴 항목 숨기기

모든 사이트에 동일한 유형의 콘텐츠가 있는 것은 아닙니다. 예를 들어 일부 사이트에는 블로그가 없습니다. 다른 사용자 인터페이스에 적용하는 것과 동일한 논리를 WordPress 대시보드에 적용하면 아무 작업도 수행하지 않는 버튼을 표시하는 것이 혼란스럽고 불필요합니다. 이 예에서 Posts 메뉴 항목은 불필요하므로 functions.php 에 다음 스니펫을 추가하여 제거하겠습니다.

 function emersonthis_custom_menu_page_removing() { // remove_menu_page( 'index.php' ); //Dashboard // remove_menu_page( 'jetpack' ); //Jetpack* remove_menu_page( 'edit.php' ); //Posts remove_menu_page( 'upload.php' ); //Media // remove_menu_page( 'edit.php?post_type=page' ); //Pages remove_menu_page( 'edit-comments.php' ); //Comments // remove_menu_page( 'themes.php' ); //Appearance // remove_menu_page( 'plugins.php' ); //Plugins // remove_menu_page( 'users.php' ); //Users // remove_menu_page( 'tools.php' ); //Tools // remove_menu_page( 'options-general.php' ); //Settings } add_action( 'admin_menu', 'emersonthis_custom_menu_page_removing' );

각 줄은 대시보드의 특정 메뉴에 해당합니다. 파일 이름은 대시보드 메뉴에 표시되는 이름과 항상 일치하지 않으므로 주석 처리된 행은 빠른 참조로 남겨둡니다.

사이트에 블로그가 있는지 여부에 관계없이 게시물 메뉴가 기본적으로 나타납니다.
게시물 메뉴 항목은 사이트에 블로그가 있는지 여부에 관계없이 기본적으로 나타납니다. (큰 버전 보기)
06-게시물-메뉴-숨김-미리보기-선택
게시물 메뉴 항목이 없는 WordPress 대시보드. (큰 버전 보기)

이러한 메뉴 항목을 제거해도 실제로 사용자의 권한이 취소되지는 않는다는 점을 이해하는 것이 중요합니다. 사용자는 여전히 URL을 사용하여 숨겨진 메뉴 항목에 직접 액세스할 수 있습니다. 불필요한 컨트롤을 숨겨서 대시보드를 덜 복잡하게 만드는 것이 목표라면 아마도 괜찮을 것입니다. 목표가 실제로 사용자가 이러한 컨트롤에 액세스하는 것을 방지 하는 것이라면 사용자 역할의 기능을 수정해야 합니다. 이를 수행하려면 플러그인의 활성화 후크에 다음과 같은 스니펫을 추가합니다(한 번만 실행하면 됨).

 global $wp_roles; // global class $role = 'author'; $cap = 'delete_published_posts'; $wp_roles->remove_cap( $role, $cap );

이 포괄적인 모든 기능 표를 사용하여 각 기본 역할에 대해 추가하거나 제거할 수 있는 특정 기능을 찾으십시오.

편집기에서 줄 바꿈이 작동하는 방식에 대한 힌트 추가

기본적으로 시각적 편집기(TinyMCE)는 작성자가 Return 키를 누를 때 새 단락을 생성합니다. 구식 줄 바꿈(캐리지 리턴이라고도 함)을 원하면 Shift+Return 을 눌러야 합니다. 이것은 멋지고 강력하지만 많은 저자에게 직관적이지 않습니다. 게시물이나 페이지에 나타나는 "이상한 공백"에 대한 불가피한 불만을 피하기 위해 빠른 알림을 추가하기 시작했습니다.

보기 흉한 추가 공백이 있는 블로그 게시물
보기 흉한 추가 공백이 있는 블로그 게시물입니다. (큰 버전 보기)

functions.php 파일에 다음 스니펫을 추가하십시오. $tip 의 값을 변경하여 작성자에게 상기시키고 싶은 내용을 말하십시오.

 # Adds instruction text after the post title input function emersonthis_edit_form_after_title() { $tip = '<strong>TIP:</strong> To create a single line break use SHIFT+RETURN. By default, RETURN creates a new paragraph.'; echo '<p>'.$tip.'</p>'; } add_action( 'edit_form_after_title', 'emersonthis_edit_form_after_title' );

이 기술은 작성자가 콘텐츠를 추가하거나 편집할 때 기억하기를 바라는 모든 것에 대한 알림을 삽입하는 데 사용할 수 있습니다.

공백 팁이 추가된 게시물 페이지
공백 팁이 추가된 게시물 페이지. (큰 버전 보기)

관리자 계정을 배포하지 마십시오

WordPress 관리자 역할은 매우 강력하며 큰 권한에는 큰 책임이 따릅니다. 일부 클라이언트는 사이트를 유능하게 관리하는 경험이 풍부한 WordPress 고급 사용자입니다. 그들 중 많은 사람들이 그렇지 않습니다. 후자는 관리자로서 주변을 파고들어서는 안 됩니다. 대신, 그들을 편집자로 만들고 매우 강력한 암호로 별도의 관리자 계정을 만드십시오. 클라이언트와 지속적인 관계가 있는 경우 클라이언트가 사이트 자체를 관리할 준비가 될 때까지 해당 자격 증명을 유지할 수 있습니다.

관리자로 가득 찬 사용자 목록
사용자 목록은 관리자로 가득 차 있습니다. (큰 버전 보기)

또는 클라이언트에게 두 가지 자격 증명 세트를 모두 제공하고 관리자 자격 증명을 안전한 곳에 저장하고 관리 작업을 수행하는 데만 사용하도록 합니다. 많은 클라이언트가 관리자 자격 증명을 즉시 잃게 되지만 괜찮습니다. 암호는 항상 재설정할 수 있으며 이러한 유형의 클라이언트는 대개 정기적인 사이트 유지 관리를 수행하기 위해 다시 고용할 것입니다.

관리자 계정에 인색한 가장 중요한 이유는 보안 취약점이기 때문입니다. 즐거운 부작용은 초보자 WordPress 사용자가 게시물 추가 또는 편집과 같은 기본 기술을 배우는 동안 정렬할 메뉴가 적기 때문에 작성자 또는 편집자로 로그인할 때 대시보드 UI가 덜 부담스럽다는 것을 종종 알게 된다는 것입니다.

뮤 플러그인 사용

mu-plugins/ 디렉토리는 오래전부터 존재했지만 내가 만나는 대부분의 워드프레스 해커는 들어본 적이 없습니다. "mu"는 반드시 사용해야 함을 나타냅니다. 디렉토리는 플러그인을 설치할 수 있는 대체 위치입니다.

Wordpress 대시보드에서 플러그인 인터페이스를 사용해야 합니다.
WordPress 대시보드에서 플러그인 인터페이스를 사용해야 합니다. (큰 버전 보기)

차이점은 "필수" 플러그인이 자동으로 활성화되며 대시보드 전체에서 실수로 비활성화할 수 없다는 것입니다. 또한 다른 플러그인 보다 먼저 로드됩니다. 이는 사이트가 제대로 실행되기 위해 반드시 있어야 하는 플러그인에 이상적입니다. 또한 일반적으로 사용자 정의 테마의 functions.php 파일에 끼일 수 있는 비 프레젠테이션 해킹에 대한 훌륭한 대안입니다. 예를 들어 mu-plugin에서 사용자 정의 게시물 유형을 정의하는 것을 좋아합니다. 왜냐하면 해당 콘텐츠는 특정 테마가 활성 상태인지 여부에 관계없이 지속되어야 하기 때문입니다.

mu-plugins/ 디렉토리는 기본적으로 존재하지 않습니다. wp-content/ 내에서 수동으로 생성합니다.

 wp-content/ mu-plugins/ plugins/ themes/ ...

가장 큰 제한은 WordPress가 최상위 수준의 mu-plugins/ 에서만 파일을 찾고 하위 디렉토리 내의 코드는 무시한다는 것입니다. 그러나 mu-plugins/ 의 맨 위에 형제 하위 디렉토리에서 코드를 로드하는 단일 PHP 파일을 만들어 이 문제를 해결할 수 있습니다. 또한 업데이트 알림은 mu-plugins에 적용되지 않습니다. 나는 mu-plugins/ 를 클라이언트가 절대 생각할 필요가 없는 중요한 코드를 넣는 장소라고 생각합니다.

Codex에서 플러그인을 사용해야 하는 경우에 대해 자세히 알아보세요. 비활성화하는 기능을 방지하여 다른 플러그인을 요구하려는 경우 WDS-Required-Plugins 라이브러리가 유용할 수 있습니다.

최종 메모

WordPress에서 무료로 제공하는 기능을 비활성화하는 것이 직관적이지 않을 수 있습니다. 그러나 당신의 클라이언트는 그들에게 많은 버튼을 주기 위해 당신에게 돈을 지불하지 않는다는 것을 기억하십시오. 귀하의 임무는 클라이언트의 목표에 맞게 조정된 효과적이고 강력한 웹사이트를 만드는 것입니다. 문제가 있거나 관련 없는 기능을 비활성화함으로써 실제로 더 많은 가치 를 제공하고 있습니다.

더 많은 스니펫을 원하시면 위의 최신 버전의 해킹과 주기적으로 추가하는 다른 버전이 포함된 유용한 WordPress 스니펫의 공개 GitHub 리포지토리를 만들었습니다. 공유하고 싶은 편리한 스니펫이 있다면 풀 리퀘스트를 환영합니다!