• 홈페이지
  • 조항
  • 가이드
  • 웹사이트 사용자 정의에 도움이 되는 WordPress용 무료 10가지 최고의 사용자 정의 CSS 플러그인

웹사이트 사용자 정의에 도움이 되는 WordPress용 무료 10가지 최고의 사용자 정의 CSS 플러그인

게시 됨: 2019-05-31

워드프레스는 시장에서 가장 인기 있는 CMS(콘텐츠 관리 시스템)일 뿐만 아니라 고품질 웹사이트 구축을 위한 가장 맞춤화 가능한 플랫폼이기도 합니다. 수백 가지 테마와 강력한 페이지 빌더에 액세스할 수 있으므로 코딩 배경이 없는 사람들도 전문가 수준의 웹 사이트 레이아웃을 간단하게 만들 수 있습니다. 이제 일부 사람들은 이러한 도구에 한계가 있다고 주장할 수 있지만 사용자 정의 CSS 플러그인을 사용하여 이를 초월할 수도 있습니다.

사용자 정의 CSS 플러그인을 설치해야 하는 이유는 무엇입니까?

방금 말했듯이 WordPress를 사용하면 코더가 아닌 사람도 전문가 수준의 웹 사이트를 만들 수 있습니다. 이것이 엄청난 인기의 이유 중 하나입니다. 그러나 플랫폼을 위한 이러한 사용자 정의 및 설계 도구 중 상당수는 비용을 지출해야 합니다. 이제 코딩 방법을 이미 알고 있다면 직접 변경할 수 있는데 왜 플러그인에 돈을 쓰겠습니까?

이것이 특히 코딩을 두려워하는 사람들에게 WordPress 웹 사이트에 사용자 정의 CSS 플러그인을 설치하는 것이 중요한 이유입니다. 타사 플러그인을 설치하고 비용을 지불하지 않고도 디자인에 간단한 조정을 추가할 수 있는 간단하고 값비싼 수단을 제공합니다. 이는 웹사이트의 전체 크기를 증가시킬 수도 있습니다.

따라서 이 글의 목적을 위해 웹사이트를 사용자 지정하는 데 도움이 되는 WordPress용 최고의 사용자 지정 CSS 플러그인 목록을 작성했습니다. 더 이상 고민하지 않고 시작하겠습니다.

WordPress용 최고의 무료 맞춤형 CSS 플러그인

1. 간단한 커스텀 CSS와 JS

간단한 사용자 정의 CSS 및 JS 플러그인

다운로드

목록에서 시작하여 Simple Custom CSS와 JS가 있습니다. 이름에서 알 수 있듯이 사용자 정의 CSS 플러그인은 WordPress 웹 사이트에서 CSS 및 JS 코드를 조정/추가할 수 있는 간단하고 사용하기 쉬운 플랫폼을 제공합니다.

특징:

  • 구문 강조 표시를 지원하는 텍스트 편집기를 추가합니다.
  • 코드를 인라인으로 인쇄하거나 외부 파일에 포함하는 옵션입니다.
  • 머리글이나 바닥글에 직접 코드를 인쇄하도록 지원합니다. Google Analytics 추적 코드와 같은 코드 스니펫을 추가하는 데 유용합니다.
  • 프론트엔드와 관리자 측에 CSS와 JS를 추가할 수 있습니다.
  • 테마를 변경해도 모든 변경 사항이 저장됩니다.

그리고 훨씬 더.

2. WP 사용자 정의 CSS 추가

WP 사용자 정의 CSS 플러그인 추가

다운로드

2번에서는 WP Add Custom CSS 플러그인이 있습니다. 플러그인을 사용하면 게시물, 페이지 및 사용자 지정 게시물 유형(WooCommerce 제품 포함)을 포함하여 웹사이트 어디에서나 사용자 지정 CSS를 추가할 수 있습니다.

특징:

  • 텍스트 편집기 인터페이스 및 구문 강조 지원으로 WordPress 사이드바에 새 섹션을 추가합니다.
  • 게시물, 페이지 및 맞춤 게시물 유형에 맞춤 CSS를 추가하는 옵션입니다.
  • 전체 웹사이트에 적용된 CSS 규칙은 테마 및 플러그인의 기본 설정보다 우선합니다.
  • 웹사이트의 특정 부분에 적용된 CSS 규칙은 기본 스타일시트를 재정의합니다.

그리고 훨씬 더.

3. TJ 커스텀 CSS

TJ 커스텀 CSS 플러그인

다운로드

다음으로 WordPress용 TJ Custom CSS 플러그인이 있습니다. 플러그인이 설치 및 활성화되면 관리 페이지에 직접 사용자 지정 CSS 관리자를 추가합니다. 이를 사용하여 WordPress 웹 사이트의 어디에서나 사용자 정의 CSS를 작성하고 추가할 수 있습니다. 사용자 정의 CSS 코드는 모든 테마 또는 플러그인 기본 스타일을 자동으로 재정의합니다.

특징:

  • 사용자 정의 CSS 관리자를 WordPress 백엔드에 직접 설치합니다.
  • 구성이 필요하지 않습니다. 상자에서 나갈 준비가 되었습니다.
  • 라이브 미리보기가 지원됩니다.
  • 사용자 정의가 어떻게 나타나는지 확인하는 데 도움이 되는 하위 테마 대안을 사용할 수 있습니다.

그리고 훨씬 더.

4. 커스텀 CSS 프로

사용자 정의 CSS Pro 플러그인

다운로드

Custom CSS Pro는 표준 전문가 수준의 CSS 편집기를 WordPress 대시보드에 바로 추가합니다. 화면 오른쪽에 웹사이트 미리보기가 열리고 왼쪽에는 사용자 정의 CSS를 추가하기 위해 할당됩니다. 사용자 정의 변경 사항이 실시간으로 발생하는 것을 볼 수 있습니다. 그리고 인터페이스는 시장에 나와 있는 모든 표준 CSS 편집기와 완전히 유사합니다.

특징:

  • WordPress 백엔드에 표준 전문 CSS 편집기를 추가합니다.
  • 웹사이트 미리보기가 오른쪽에 있고 CSS 편집기가 왼쪽에 있는 간단한 UI.
  • 구문 강조를 지원하는 전체 텍스트 편집기.
  • 모든 사용자 정의 조정의 실시간 미리보기.

그리고 훨씬 더.

5. 내 사용자 정의 CSS PHP 및 ADS

내 사용자 정의 CSS PHP ADS

다운로드

이름에서 짐작할 수 있듯이 My Custom CSS PHP & ADS는 PHP 및 ADS는 물론 사용자 정의 CSS 코드를 추가하는 데 도움이 되는 완전한 기능을 갖춘 코드 편집기 플러그인입니다. 플러그인은 코드를 효율적으로 작성하는 데 도움이 되는 많은 유용한 기능이 포함된 ACE(Ajax.org Cloud9 Editor) 코드 편집기를 추가합니다.

특징:

  • WordPress 웹 사이트에 ACE – Ajax.org Cloud9 Editor를 설치합니다.
  • CSS, PHP 및 ADS를 작성하는 데 도움이 될 수 있습니다.

6. 간단한 사용자 정의 CSS

간단한 사용자 정의 CSS wp 플러그인

다운로드

Simple Custom CSS 플러그인을 사용하면 WordPress 백엔드에 바로 텍스트 편집기를 추가하여 사용자 정의 CSS 코드를 작성하고 웹사이트를 사용자 정의하는 데 사용할 수 있습니다. 작성하고 웹사이트에 추가하는 모든 사용자 정의 CSS는 자동으로 기본 테마 및 플러그인 설정을 재정의합니다.

특징:

  • 전용 사용자 지정 컨트롤이 있는 유용한 코드 구문 형광펜.
  • WordPress UI에 구축된 간단한 인터페이스.
  • 매우 가볍습니다. 사이트 성능 및 로딩 속도에 영향을 미치지 않습니다.
  • 복잡한 데이터베이스 쿼리를 어지럽히는 것을 포함하지 않습니다.
  • 다중 사이트 지원.

그리고 훨씬 더.

7. 커스텀 CSS-JS-PHP

커스텀 CSS-JS-PHP 플러그인

다운로드

사용자 정의 CSS-JS-PHP를 사용하면 사용자 정의 CSS와 PHP 및 JS 코드를 직접 작성하고 WordPress 웹사이트에 추가할 수 있습니다. 전용 인터페이스에 액세스하여 사용자 정의 코드를 작성한 다음 단축 코드, 작업 또는 필터를 사용하여 웹사이트에 적용할 수 있습니다.

특징:

  • CSS, JavaScript 및 PHP 코드를 WordPress 웹사이트에 바로 추가할 수 있는 옵션입니다.
  • 단축 코드를 사용하거나 바닥글 및 머리글에 직접 사용자 지정 코드를 추가하는 옵션입니다.
  • PHP 코드는 작업과 필터를 사용하여 구현할 수 있습니다.
  • 모든 사용자 정의 코드를 내보내고 다른 웹사이트로 가져오는 옵션입니다.
  • FTP를 참조하지 않고 모든 코드를 구현할 수 있습니다.
  • 잠재적으로 무제한 사용자 정의 코드를 생성, 저장 및 관리하는 옵션입니다.
  • 플러그인 또는 테마를 변경하거나 업데이트해도 사용자 정의 코드는 삭제되지 않습니다.

그리고 훨씬 더.

8. 간단한 CSS

간단한 CSS WP 플러그인

다운로드

Simple CSS를 사용하면 WordPress 백엔드에서 바로 구문 강조 기능을 갖춘 완전한 기능을 갖춘 CSS 편집기에 액세스할 수 있습니다. 실시간으로 모든 조정을 미리 볼 수 있는 WordPress 사용자 지정 프로그램에서 액세스할 수도 있습니다. 플러그인은 또한 게시물과 페이지에 메타 상자를 추가하여 특정 콘텐츠에 사용자 정의 CSS를 추가하는 데 도움을 줍니다.

특징:

  • 구문 강조를 지원하여 WordPress 백엔드에 완전한 기능을 갖춘 CSS 편집기를 추가합니다.
  • 어둡고 밝은 편집기 테마 지원.
  • CSS 편집기도 WordPress 사용자 정의 도구에 추가되어 실시간으로 변경 사항을 미리 볼 수 있습니다.
  • 페이지 및 게시물 특정 CSS에 대한 메타 상자.

그리고 훨씬 더.

9. 커스텀 CSS와 자바스크립트

사용자 정의 CSS 및 Javascript 플러그인

다운로드

사용자 정의 CSS 및 Javascript를 사용하면 WordPress 웹 사이트 전체에 사용자 정의 CSS 및 JS 코드를 추가할 수 있습니다. 설치가 완료되면 구문 강조 표시가 있는 코드 편집기가 WordPress 백엔드에 바로 추가됩니다. 이를 사용하여 테마의 사용자 정의 스타일을 재정의하고 클라이언트 측 기능을 추가할 수도 있습니다.

참고 특징:

  • 구문 강조와 함께 완전한 기능을 갖춘 코드 편집기.
  • 저장을 누를 때마다 편집기를 다시 로드할 필요가 없도록 Ajax 지원 저장.
  • 사용자 정의 CSS 및 JS 코드를 필요한 권한이 있는 로그인한 사용자에게만 적용되는 초안으로 저장하고 미리 볼 수 있는 옵션입니다.
  • CSS 및 JS의 이전 버전을 복원하는 옵션입니다.
  • 사용자 정의 CSS 및 JS 코드를 자동으로 축소합니다.
  • 더 나은 코드 구성을 위해 CSS 및 JS 코드를 여러 가상 파일로 나누는 옵션.

그리고 훨씬 더.

10. 커스텀 바디 클래스

커스텀 바디 클래스 플러그인

다운로드

이제 목록의 최종 사용자 정의 CSS 플러그인에 대해 Custom Body Class WordPress 플러그인이 있습니다. 플러그인을 사용하면 게시물과 페이지에 고유한 CSS 클래스를 추가할 수 있습니다. 이렇게 하면 특정 게시물 및 페이지에 영향을 주지 않도록 특정 테마 및 플러그인 설정을 재정의할 수 있습니다.

특징:

  • 게시물과 페이지에 고유한 CSS 클래스를 추가하는 데 도움이 됩니다.

그리고 훨씬 더.

결론적으로

다음은 WordPress용 상위 10개 사용자 정의 CSS 플러그인에 대한 우리의 선택이었습니다. 읽기가 유용하다고 생각하고 사용자 정의 요구 사항에 도움이 되도록 선택한 플러그인을 알려주십시오. 이 측면에서 베테랑 WordPress 사용자도 토론에 참여하고 좋아하는 사용자 지정 CSS 플러그인을 작성할 수 있습니다(여기에 언급되지 않은 플러그인일 수 있음). 귀하의 기여는 동료 독자에게 자신의 프로젝트에 도움이 되는 더 많은 옵션과 통찰력을 제공할 것입니다.

이제 WordPress에 사용자 정의 CSS를 추가하여 코딩 없이 웹사이트를 사용자 정의할 수 있습니다.