web-dev-qa-db-ja.com

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

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

私はこのWordPressテストサイトにロゴを挿入するのが難しいと思っています: http://onofri.org/example/

私は自分のロゴをウェブサイトのヘッダーに入れたいのですが、代わりに "EXAMPLE"というテキストを入れます。

WordPressの設定パネルを見ても、ロゴをアップロードして代わりにヘッダーに "EXAMPLE"というテキストを自動的に置くことができる場所が見つかりません(Joomlaのように標準のWordPress機能かどうかはわかりません)。いくつかの特定のテーマで利用できるようにすることができる機能、または直接コードに含める必要がある場合)

しかし、私は私のテーマ設定でさえそれを見つけていません。

私のロゴを入れるために私は何をしなければなりませんか? HTMLコードに直接挿入する必要がありますか?

9
AndreaNobili

標準に準拠するようにヘッダーセクションを少し修正してみてください。これがあなたの今のコードです。

<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 /'フォルダに置きます。

あなたが休むことを願っています。ご質問がございましたら、以下にコメントしてください。

13
Mayeenul Islam

「ロゴ」機能がある場合、それはテーマの一部になります。おそらく themeオプション または themeカスタマイズシステムの一部 です。

私は一般的に カスタムヘッダー を商用サイト用に使いますが、カスタムヘッダーはロゴ専用ではありません。これは一般的な「ヘッダー画像」関数です。

つまり、これはテーマによって異なります。作成中のテーマの場合は、テーマを編集して追加できます。既に参照されているコーデックスの記事を参照してください。

2
s_ha_dum

ヘッダ画像を変更するには、ワードプレスの管理パネルに行きます。外観メニューでヘッダをクリックすると、ヘッダ画像をアップロードするオプションとヘッダに表示するテキストがあります。

表示されない場合は、ヘッダーファイルを編集し、次のコードがまだ存在しない場合はヘッダーに挿入する必要があります。

<?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>
2
Yamu