워드 프레스에서 헤더를 사용자 정의하는 방법:초보자 가이드

워드 프레스 헤더를 사용자 정의 할 수있는 쉬운 방법을 찾고 계십니까?

헤더는 모든 페이지 상단에 있기 때문에 웹 사이트 브랜딩,방문자 탐색 및 가장 중요한 콘텐츠 홍보에 필수적인 역할을합니다.

그러나 사이트의 헤더에서 가장 많은 혜택을 얻으려면 많은 테마가 제공하지 않는 편집 방법이 필요합니다.

이 게시물에서,우리는 당신이 간단한 드래그 앤 드롭 인터페이스와 자신의 코드를 모두 사용하여 워드 프레스의 헤더를 사용자 정의하는 데 사용할 수있는 몇 가지 다른 전술을 공유 할 수 있습니다.

가장 쉬운 옵션은 아스트라 테마와 드래그 앤 드롭 헤더 빌더를 사용하는 것입니다,그러나 우리는 또한 어떤 워드 프레스 테마와 함께 작동합니다 다른 전술을 공유 할 수 있습니다.

워드프레스 헤더란?

워드 프레스 헤더는 모든 페이지의 상단에 나타나는 사이트의 일부입니다. 일반적으로 최소 두 개 이상의 요소가 포함됩니다:

  • 사이트 로고/아이덴티티
  • 탐색 메뉴)

예를 들어,여기에 헤더가 아스트라 블로그에 어떻게 생겼는지입니다. 당신은 아스트라 로고뿐만 아니라,두 개의 탐색 메뉴를 포함하는 것을 볼 수 있습니다:

아스트라 헤더

필요에 따라 소셜 미디어 아이콘,검색 상자,프로모션,전화 번호 및 기타 정보와 같은 다른 요소를 포함 할 수도 있습니다.

만약 당신이 어떻게 작동하는지 볼 필요가 있다면,워드 프레스 헤더는 헤더에 포함되어 있습니다.워드 프레스 테마에 파일.

아스트라와 워드 프레스 헤더를 사용자 정의하는 방법

당신이 당신의 워드 프레스 헤더를 완벽하게 제어 할 경우,무료 아스트라 테마는 당신에게 완전히 워드 프레스 헤더를 사용자 정의 할 수있는 드래그 앤 드롭,노 코드 방법을 제공합니다.

웹 사이트의 실시간 미리보기에서 변경 사항을 바로 볼 수 있으며 버튼,소셜 아이콘,검색 상자 등과 같은 다양한 유형의 콘텐츠를 쉽게 추가 할 수 있습니다.

시작하려면,당신은 설치하고 아스트라 테마를 활성화 할 수 있습니다. 또한 신속하게 실행 얻을 사전 구축 데모 사이트의 수백 중 하나를 가져올 수 있습니다. 당신이 그 단계 중 하나와 도움의 손길이 필요한 경우,우리는 당신을 도울 수있는 가이드를 많이 가지고:

  • 아스트라를 설치하는 방법
  • 스타터 사이트를 가져 오는 방법

당신이 갈 기본 사이트가 준비되면,여기에 아스트라를 사용하여 헤더를 사용자 정의하는 방법은 다음과 같습니다.

수제이 파와르

안녕하세요! 제 이름은 수제이고 아스트라의 대표입니다.

우리는 중소 기업이 저렴한 소프트웨어 제품과 성공에 필요한 교육을 온라인으로 성장할 수 있도록하는 임무에있어.

당신이 대화에 참여하려면 아래에 코멘트를 남겨,또는 당신은 개인적인 도움을 좋아하거나 개인적으로 우리 팀과 함께 참여하려면 여기를 클릭.

1. 아스트라 헤더 빌더를 엽니 다

시작하려면,네이티브 워드 프레스 사용자 정의 프로그램을 실행하기 위해 워드 프레스 대시 보드에서 모양*사용자 정의로 이동합니다. 그런 다음 헤더 빌더 옵션을 선택합니다:

아스트라 헤더 빌더

헤더 빌더를 실행하면 헤더 레이아웃을 제어할 수 있는 새로운 옵션 세트가 표시됩니다:

아스트라 헤더 빌더 사용자 정의 설정

2. 헤더 콘텐츠

을 추가하고 구성하여 재미있는 부분인 콘텐츠 추가를 위한 것입니다. 헤더 빌더에 세 개의 행이 있는 것을 볼 수 있습니다. 각 행은 헤더의 다른 부분에 대한 내용을 제어합니다:

  1. 헤더 위
  2. 기본 헤더-“기본”콘텐츠를 넣을 곳입니다.
  3. 헤더 아래
아스트라 헤더 빌더 내용

당신은 절대적으로 기본 헤더에 콘텐츠를 포함 할 것이다,그리고 당신은 당신의 필요에 따라 그 위 또는 아래에 콘텐츠를 추가 할 수있는 옵션이 있습니다.

콘텐츠를 추가하려면,당신은 당신이 콘텐츠를 추가 할 지점을 클릭 할 수 있습니다. 그러면 옵션 집합이 열립니다:

  • 기본 메뉴
  • 보조 메뉴
  • 로고
  • 버튼
  • 검색
  • 소셜
  • 2

콘텐츠를 추가 할 때,당신은 더 적은 옵션을 볼 수 있습니다. 예를 들어 로고를 한 번만 추가할 수 있으므로 헤더에 로고를 이미 추가한 후에는 해당 옵션이 사라집니다:

아스트라 헤더 빌더 콘텐츠를 추가

일부 콘텐츠를 추가 한 후에는 해당 콘텐츠를 클릭하여 설정을 열 수 있습니다. 예를 들어 버튼을 추가하면 버튼 텍스트 및 링크를 제어 할 수 있습니다.

당신은 또한 더 일을 사용자 정의 할 수있는 디자인 설정을 열 수 있습니다:

아스트라 헤더 빌더 콘텐츠를 사용자 정의

콘텐츠를 다시 정렬하거나 다른 행으로 이동하려면 드래그 앤 드롭만 하면 됩니다:

아스트라 드래그 앤 드롭 헤더 빌더

3. 헤더 레이아웃 사용자 정의

위,우리는 어떻게 헤더 내부의 개별 요소를 사용자 정의하는 방법을 보여 주었다. 또한 전체 헤더를 사용자 정의 할 수있는 몇 가지 옵션이 있습니다.

먼저 기본 헤더 빌더의 디자인 탭으로 이동하여 헤더의 너비와 간격을 제어 할 수 있습니다. 당신은 또한 높이와 디자인을 사용자 정의 할 각 머리글 행에 대한 기어 아이콘을 클릭 할 수 있습니다:

아스트라 헤더 빌더 레이아웃을 사용자 정의

4. 헤더의 종류와 실험

당신은 아스트라 또는 아스트라 프로의 무료 버전을 사용하고 있는지 여부에 따라,당신은 또한 투명 헤더(무료)및 스티커 헤더(프로)와 같은 헤더의 추가 유형에 대한 액세스를 얻을 수 있습니다.

위의 동일한 머리글 및 바닥 글 빌더를 사용하여 투명하거나 끈적 끈적한 머리글을 디자인 할 수 있습니다. 당신은 헤더 유형 섹션에서 해당 옵션을 볼 수 있습니다. 당신은 설정을 확장하고 그 다른 헤더 유형을 디자인하기 위해 그들을 클릭 할 수 있습니다:

아스트라 헤더 빌더 투명 헤더

워드 프레스 헤더를 사용자 정의 할 수있는 세 가지 다른 방법

아스트라의 드래그 앤 드롭 헤더 빌더는 워드 프레스 헤더를 사용자 정의 할 수있는 가장 쉬운 방법을 제공하지만,당신이 사용할 수있는 다른 전술도 있습니다,아무리 당신이 사용하고있는 테마.

다음은 최고의 전략 중 일부입니다…

1. 테마의 사용자 정의 설정을 사용하여

대부분의 워드 프레스 테마는 당신에게 기본 워드 프레스 사용자 정의에서 사이트의 헤더를 통해 몇 가지 제어 할 수 있습니다. 당신은 아스트라가 제공하는 세부 수준을 얻을 가능성이있어,하지만 당신은 당신의 헤더의 모양과 기능을 제어하는 몇 가지 옵션을 얻을 것이다.

이러한 옵션은 테마에 따라 다르지만 일반적으로 헤더의 요소 옆에 있는 파란색 연필 아이콘을 클릭하여 열 수 있습니다. 예를 들어,새로운 스물 스물 한 기본 테마에서,당신은 당신이 사용자 정의 할 수있어 것을 볼 수 있습니다:

  • 로고
  • 사이트 제목
  • 메뉴
기본 테마 헤더 사용자 정의

당신은 몇 가지 여분의 도움이 필요한 경우,당신은 당신의 테마 개발자의 문서를 참조 할 수 있습니다.

2. 요소 및 무료 사용자 지정 헤더 플러그인을 사용

당신이 요소에 익숙하지 않은 경우,그것은 당신이 당신의 사이트에 콘텐츠를 만드는 데 사용할 수있는 시각적,드래그 앤 드롭 디자인 도구입니다. 블록 템플릿 사용자 정의 헤더 워드 프레스 플러그인,당신은 당신의 자신의 워드 프레스 사용자 정의 헤더를 디자인 할 요소의 무료 버전을 사용할 수 있습니다.

이 플러그인은 무료 아스트라 테마뿐만 아니라 당신이 사용 될 수있는 다른 워드 프레스 테마와 완벽하게 작동합니다.

시작하려면,설치 및에서 무료 플러그인을 활성화 WordPress.org.당신은 또한 당신이 이미 수행하지 않은 경우 엘리먼트의 무료 버전을 설치해야합니다.

당신이 그 일을 한 후,모양으로 이동 머리글 바닥 글&블록 및 새로 추가를 클릭합니다:

머리글 바닥 글 및 머리글을 디자인하는 블록

템플릿에 이름을 지정하고 템플릿 유형에서 헤더를 선택합니다. 표시 대상 또는 사용자 역할 옵션을 사용하여 헤더를 특정 콘텐츠/사용자에게 타겟팅할 수도 있습니다.

그런 다음 헤더를 게시하고 엘리멘터로 편집을 클릭하여 비주얼 빌더를 엽니다:

머리글 바닥 글 및 블록 헤더 설정

이제 엘리먼트의 시각적 드래그 앤 드롭 인터페이스를 사용하여 헤더를 완전히 사용자 정의 할 수 있습니다. 플러그인은 또한 당신에게 새로운 머리글,바닥 글을 제공합니다&당신이 당신의 사이트의 로고 또는 탐색 메뉴와 같은 중요한 사이트 요소를 추가하는 데 사용할 수있는 블록 위젯:

머리글 바닥 글 및 블록으로 요소 편집 머리글

요소 사용에 대한 자세한 내용은 전체 요소 자습서 또는 요소 검토를 확인하십시오.

3. 사용자 정의 코드를 사용하여(고급)

당신이 고급 사용자의 경우 마지막으로,당신은 또한 당신의 자신의 코드를 사용하여 워드 프레스 헤더를 사용자 정의 할 수 있습니다. 그래서 이것은 비 기술적인 사용자에 대 한 옵션이 아닙니다.

이러한 코딩 언어를 모르는 경우 이 목록의 이전 방법 중 하나를 고수하고 싶을 것입니다.

코드를 사용하여 헤더를 사용자 정의하는 두 부분이 있습니다:

  • 헤더의 실제 내용을 제어합니다.
  • 이 헤더의 스타일을 제어합니다.

앞서 언급했듯이 사이트의 헤더 콘텐츠는 헤더에 있습니다.파일. 따라서 헤더의 콘텐츠를 사용자 지정하려면 이 파일로 직접 작업해야 합니다. 또는,아스트라와 같은 일부 테마는,또한 헤더에 콘텐츠를 추가하는 데 사용할 수있는 후크를 제공합니다.

아스트라 비주얼 후크 가이드에서,당신은 당신이 헤더를 사용자 정의 할 수있는 옵션이 있음을 볼 수 있습니다:

아스트라 후크

당신은 당신의 테마의 헤더를 편집 할 경우.직접,당신은 당신이 당신의 테마를 업데이트 할 때 변경 사항을 덮어 쓰지 않도록 확인하기 위해 자식 테마를 사용해야합니다.

반면에 후크를 사용하는 경우 아스트라 후크 또는 코드 스 니펫과 같은 플러그인을 사용하는 한 하위 테마를 사용할 필요가 없습니다. 당신은 당신의 테마의 기능에 직접 후크를 추가하는 경우.하지만 여전히 자식 테마를 사용해야합니다.

아스트라 프로,당신은 또한 아스트라 프로의 사용자 정의 레이아웃 기능을 사용하여 후크를 추가 할 수있는 옵션이 있습니다.

아스트라 프로의 사용자 정의 레이아웃에 대한 깔끔한 점은 변경 사항이 표시 될 때 정확하게 제어하는 표시 규칙을 사용할 수 있다는 것입니다. 예를 들어 로그인한 사용자에게만 표시되는 사용자 지정 콘텐츠를 헤더에 추가할 수 있습니다.

헤더의 콘텐츠를 사용자 정의하는 방법은 무엇입니까?

헤더의 스타일을 사용자 정의하려면 스타일을 편집할 수 있습니다.자식 테마를 사용하는 경우 직접 파일. 또는,당신은 헤더에 자신의 사용자 정의 스타일을 추가 할 워드 프레스 사용자 정의 프로그램에서 추가 사용자 정의 영역을 사용할 수 있습니다.

오늘 워드 프레스 헤더를 사용자 정의

워드 프레스 헤더는 사이트의 성공에 필수적인 역할을한다. 그것은 당신의 웹 사이트를 브랜드화하는 데 도움이,주요 콘텐츠에 방문자를 안내,중요한 정보 또는 사회적 프로필,그리고 더 많은 홍보.

사이트의 헤더를 완벽하게 제어 할 수있는 가장 쉬운 방법은 무료 아스트라 테마를 사용하는 것입니다. 아스트라,당신은 시각적,드래그 앤 드롭 헤더 빌더에 액세스 할 수 있습니다. 당신은 어떤 코드 나 외부 플러그인이 필요하지 않습니다-당신이 바로 워드 프레스 사용자 정의 내부에서 헤더의 100%제어를 얻을 것이다.

다른 상황에서는,당신은 또한 다른 테마의 사용자 정의 설정을 사용할 수 있습니다,요소–머리글,바닥 글&블록 템플릿 플러그인,또는 자신의 코드 당신은 기술적 인 지식이있는 경우.

Write a Comment

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