ヘッダーにロゴを挿入する方法は？

9

私はWordPressの世界でかなり新しいです（私はJoomlaから来ました）

このWordPressテストサイト（http://onofri.org/example/）にロゴを挿入するのが難しいことがわかりました。

ロゴを「例」のテキストではなく、ウェブサイトのヘッダーに配置したい。

WordPress構成パネルを調べても、ロゴをアップロードして、ヘッダーに「例」のテキストを自動的に配置できる場所が見つかりません（これがJoomlaのような標準のWordPress関数であるかどうか、またはそれが特定のテーマで利用できるようにする機能、またはコードに直接挿入する必要がある場合）

ただし、テーマ設定でも見つかりません。

ロゴを配置するにはどうすればよいですか？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（Webホストのコントロールパネル）を介して、「images」という名前のテーマフォルダーのサブフォルダーに画像をアップロードできます。
ロゴの背景付きの巨大な画像を作成する代わりに、Photoshop（または任意のグラフィックソフトウェア）で背景なしのシンプルなロゴを作成してみてください-Photoshopの場合は、それを実行します。ロゴ画像をレイヤーに配置した後、削除背景レイヤーを選択し、Web用に画像を保存して（[ファイル]> [Web用に保存... ] [ Ctrl+ Alt+ Shift+ S]）、良好な結果を得るためにPNG-24形式を選択します。次に、名前を付けて保存logo.pngし、「/ wp-content / themes / simplemarket / images /」フォルダーに配置します。

残りの部分を取得してください。ご不明な点がございましたら、以下のコメント欄からお気軽にどうぞ。

— Mayeenul Islam
ソース

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>

— ヤム
ソース