WordPress에서 배경색을 변경하는 방법

게시 됨: 2021-08-09

웹 사이트 방문자가 가장 먼저 알아차리는 것 중 하나는 배경입니다. 때로는 단순한 색상이지만 이미지 또는 기타 시각적 자료의 조합일 수도 있습니다. 첫인상과 함께 품질 디자인의 필수 요소 중 하나입니다. 좋든 나쁘든 브랜드, 스타일, 가독성, 전문성 자체를 반영합니다. 그렇기 때문에 WordPress에서 배경색을 결정하는 것은 일반적으로 첫 번째 디자인 선택 중 하나입니다 . 문제는 너무 많은 테마가 있기 때문에 다양한 사용자 정의 옵션이 제공된다는 것입니다. 일부는 그 자리에서 모든 것을 변경할 수 있도록 하는 반면 다른 일부는 드물고 제한된 옵션을 제공합니다.

WordPress에서 배경색을 변경하는 몇 가지 방법

짐작하시겠지만 약간의 코딩 지식만 있으면 모든 것이 가능합니다. 그러나 WordPress로 작업하는 모든 사람이 전문적으로 프로그래밍하는 것은 아닙니다. 일반 사용자의 대다수는 페이지를 맞춤설정하기 위해 초보자에게 친숙한 솔루션이 필요합니다 . 이 중 WordPress에서 배경색을 변경하는 것은 일반적인 문제 중 하나입니다. 물론 모든 요소를 ​​구축하고 웹사이트 디자인을 완성하는 데 도움이 되는 전문 WordPress 사이트 관리 지원에 항상 의존할 수 있습니다. 그러나 이것이 귀하에게 적합한 옵션이 아닌 경우 웹 사이트를 개인화하기 위해 다른 접근 방식을 시도할 수 있습니다.

풍경 이미지를 웹사이트 배경, 잡지 표지 및 팸플릿으로 사용합니다.
웹사이트를 개인화할 때 다른 접근 방식을 시도하십시오.

그러나 항상 그렇게 간단하지는 않습니다. 가장 먼저 결정해야 할 것은 원하는 배경 유형입니다 . 선택할 수 있고 결합할 수도 있는 몇 가지 인기 있는 옵션이 있습니다.

  • 간단한 색상 또는 색상 조합을 선택할 수 있습니다.
  • 하나 이상의 색상을 그라디언트로 결합
  • 이미지를 배경으로 배치
  • 대신 동영상 사용

WordPress에서 배경색을 단순히 변경할 것인지 아니면 더 복잡한 옵션을 사용할 것인지 결정했으면 이제 사용자 정의를 적용하는 몇 가지 방법을 찾아야 합니다 .

  1. 테마가 사용자 정의 배경을 지원하는 경우
  2. 간단한 코드를 사용해 볼 수 있습니다
  3. 플러그인으로 WordPress의 배경색 변경
  4. 고급 도구를 사용하여 모든 것을 사용자 정의

1. 테마가 사용자 정의 배경을 지원하는 경우

대부분의 경우 모양 > 사용자 정의로 이동하여 테마가 지원하는 옵션을 쉽게 확인할 수 있습니다. 거기에서 어떤 사용자 정의 옵션이 허용되는지 확인할 수 있습니다. 때로는 색상, 배경 이미지, 색상 및 어두운 모드, 색상 및 배경 등을 선택할 수 있는 옵션이 있습니다. 정말 테마에 따라 다릅니다. 지원하는 경우 원하는 제안을 선택하고 추가 사용자 정의를 수행할 수 있습니다.

배경색을 변경하는 적절한 옵션을 찾으면 클릭하고 매우 직관적인 인터페이스를 탐색하기만 하면 됩니다. 일반적으로 선택할 수 있는 몇 가지 기본 색상 옵션이 제공됩니다. 그러나 근처에는 항상 "팔레트 선택" 옵션이 있습니다. 또는 모든 색상의 16진수 코드를 간단히 입력할 수 있습니다.

더 복잡한 원형 색상 팔레트입니다.
다양한 도구를 사용하여 올바른 16진수 색상 코드를 선택할 수 있습니다.

색상 외에도 일부 테마는 이미지 및 기타 시각 자료를 배치할 수 있는 옵션을 제공합니다. 여기에서 배경 이미지를 미디어 라이브러리에 업로드하고 직접 선택하라는 메시지가 표시됩니다. 또한 위치, 반복, 기본 또는 오버레이 색상 등을 설정할 수 있습니다.

2. 간단한 코드를 사용해 볼 수 있습니다.

CSS에 약간 익숙하다면 사용자 정의 코드를 추가하여 간단한 사용자 정의를 만들 수 있습니다. 특히 배경색을 설정하는 데 너무 고급스러운 것은 아닙니다. 모양 > 사용자 정의로 이동 하여 "추가 CSS" 를 선택 하고 다음 코드 줄을 입력하십시오.

.body { background-color: #fff; }

여기에서 "#fff"는 선택한 색상에 대한 16진수 코드일 수 있습니다. 일반적으로 색상 선택 도구를 사용하여 색상 코드를 쉽게 찾을 수 있습니다. 그러나 이것은 모든 테마에서 작동하지 않거나 허용되지 않을 수 있습니다.

3. 플러그인으로 WordPress의 배경색 변경

SiteOrigin CSS

다른 옵션이 결과를 제공하지 않는 경우 항상 플러그인을 사용하여 작업을 완료할 수 있습니다. SiteOrigin CSS와 같은 WordPress 플러그인은 사용자 정의를 다시 제어할 수 있는 강력한 도구입니다. 특히 이 플러그인을 사용하면 배경색을 쉽게 편집하고 실시간으로 어떻게 보이는지 확인할 수 있습니다 . 기본적으로 대부분의 초보자에게 필요한 것입니다. 고급 사용자라면 CSS 코드를 조정할 때 자동 완성 기능을 좋아할 것입니다. 또한 "Inspector"는 필요한 선택기를 즉시 찾는 데 도움이 될 수 있습니다.

가장 좋은 점은 SiteOrigin CSS는 모든 테마에서 작동하는 무료 플러그인입니다.

AWB – 고급 WordPress 배경

배경색을 변경하는 것 이상의 작업이 필요한 경우 AWB는 웹사이트 레이아웃에 약간의 엣지를 추가하는 간단하면서도 효과적인 플러그인입니다. 기존 옵션 외에도 AWB를 사용하면 다음과 같은 더 복잡한 배경 솔루션을 사용할 수 있습니다.

  • 시차 배경
  • 마우스 시차
  • 패턴
  • 다양한 이미지 형식
  • 투명도가 있는 오버레이 색상
  • 자체 호스팅 및 온라인 소스의 모든 종류의 다양한 비디오 형식

또한 시각적 단축 코드 작성기를 사용하여 프로세스를 더 쉽게 만들 수 있습니다. 그리고 인기 있는 WP 빌더나 구텐베르크를 선호한다면 이들과 완벽하게 작동합니다.

4. 고급 도구를 사용하여 모든 것을 사용자 정의

랩톱, 태블릿 및 스마트폰에 대한 추상 라이브 배경 효과.
배경에서 다른 요소에 이르기까지 모든 것을 사용자 정의하여 웹사이트의 시각적 매력을 변경하십시오.

위의 어느 것도 충분하지 않고 보다 "강력한" 솔루션이 필요한 경우 CSS Hero라는 이름의 꽤 고급 플러그인이 있습니다. WYSIWYG 인터페이스의 효율성을 보여주는 완전한 사용자 정의 시스템에 가깝 습니다. 기본적으로 "What You See Is What You Get" 원칙을 의미합니다. CSS Hero는 기본적으로 작동하는 플러그인으로 대부분의 테마 및 기타 플러그인과의 호환성을 제공합니다. 실제로는 아무 문제 없이 간단히 요소를 클릭하고 색상, 배경, 글꼴 등과 같은 속성을 변경할 수 있습니다. 실시간 미리보기 덕분에 모든 변경 사항을 즉시 볼 수 있습니다.

그 기능에도 불구하고 가벼운 플러그인이라는 것은 CSS Hero의 가장 큰 특징입니다. 무엇보다도 변경 사항은 테마 파일을 수정하지 않는 것입니다. 작업이 완료된 후 웹 사이트가 손상될 위험 없이 쉽게 제거할 수 있습니다. 유일한 단점은 유료 구독이 필요한 프리미엄 플러그인이라는 것입니다.

결론

WordPress에서 배경색을 변경하고 싶을 때 때로는 간단하지 않습니다 . 때때로 기본 WordPress 사용자 정의 옵션을 사용할 수 있지만 항상 그런 것은 아닙니다. 어떤 경우에는 코딩 지식이 있으면 빠른 솔루션을 찾는 데 도움이 될 수 있습니다. 그러나 최고의 WordPress 기능 중 하나이기 때문에 플러그인을 사용하면 거의 모든 작업을 완료할 수 있습니다.