헤더에 로고를 삽입하는 방법은 무엇입니까?

9

나는 워드 프레스 세계에서 꽤 새롭다 (나는 Joomla에서왔다)

이 WordPress 테스트 사이트에 로고를 삽입하는 데 어려움이 있습니다. http://onofri.org/example/

웹 사이트 헤더에 "EXAMPLE"텍스트 대신 로고를 넣고 싶습니다.

워드 프레스 구성 패널을 살펴보면 로고를 업로드 할 수있는 곳을 찾지 못하고 대신 헤더에 "EXAMPLE"텍스트를 대신 넣을 수 없습니다 (Jomla에서와 같이 표준 워드 프레스 기능인지 또는 특정 테마에서 사용할 수 있거나 코드에 직접 넣어야하는 기능)

그러나 테마 설정에서도 찾지 못했습니다.

로고를 넣으려면 어떻게해야합니까? HTML 코드에 직접 삽입해야합니까?

— 안드레아
소스

14

표준을 준수하도록 헤더 섹션을 약간 수정하십시오. 코드는 다음과 같습니다.

<div id="header-image">
   <img width="1102" height="350" alt="" class="header-image" src="http://onofri.org/example/wp-content/uploads/2013/06/header1.jpg">
</div>

사물을 수정하는 방법은 다음과 같습니다.

<div id="header-image">
    <a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home">
       <img src="<?php echo get_template_directory_uri(); ?>/images/logo.png" alt="Logo" width="HERE" height="HERE" />
    </a>
</div>

현재 3 단계 만 있습니다.

테마의 기본 헤더 이미지 설정을 사용하는 대신 header.php위에 제공된 코드 를 사용하여 테마를 편집 할 수 있습니다 .
새 미디어 추가에서 이미지를 삽입하는 대신 cPanel (웹 호스트의 제어판)을 통해 'images' 라는 테마 폴더의 하위 폴더에 이미지를 업로드 할 수 있습니다 .
로고의 배경이있는 거대한 이미지를 만드는 대신 Photoshop (또는 모든 그래픽 소프트웨어)에서 간단한 배경이없는 로고를 만들어보십시오. Photoshop의 경우 로고 이미지를 레이어에 배치 한 후 삭제하십시오. 배경 레이어를 클릭 한 다음 웹용 이미지 (파일> 웹용으로 저장 ... [ Ctrl+ Alt+ Shift+ S])를 저장하고 PNG-24 형식을 선택하여 좋은 결과를 얻으십시오. 그런 다음 다른 이름으로 저장 logo.png하고 '/ wp-content / themes / simplemarket / images /'폴더에 저장하십시오.

당신이 나머지를 얻을 바랍니다. 질문이 있으시면 아래에 의견을 보내주십시오.

— Mayeenul 이슬람
소스

2

"로고"기능이있는 경우 테마의 일부가됩니다. 아마도 테마 옵션 또는 일부 테마 사용자 정의 시스템 .

나는 일반적으로 커스텀 헤더 를 사용하여 상업용 사이트 에이 작업을 수행하지만 커스텀 헤더는 특별히 로고가 아닙니다. 일반적인 "헤더 이미지"기능입니다.

요컨대 테마에 따라 다릅니다. 작성중인 테마 인 경우 테마를 편집하여 추가 할 수 있습니다. 이미 언급 한 코덱스 기사를 참조하십시오.

— s_ha_dum
소스

2

헤더 이미지를 변경하려면 워드 프레스의 관리자 패널로 이동하십시오. 모양 메뉴에서 헤더를 클릭하면 헤더에 표시 할 헤더 이미지와 텍스트를 업로드하는 옵션이 있습니다.

표시되지 않으면 헤더 파일을 편집하고 헤더에 다음 코드가없는 경우 삽입해야합니다.

<?php $header_image = get_header_image();
    if ( ! empty( $header_image ) ) : ?>
        <a href="<?php echo esc_url( home_url( '/' ) ); ?>"><img src="<?php echo esc_url( $header_image ); ?>" class="header-image" width="<?php echo get_custom_header()->width; ?>" height="<?php echo get_custom_header()->height; ?>" alt="" /></a>

— 야무
소스