フォーラム

フォーラム » テーマ

オリジナルのヘッダー画像にリンクを付けたい (7 件の投稿)

  1. xariat
    メンバー
    6 ヶ月前の投稿 #

    テーマは「BlogTube」です。

    ヘッダーにオリジナルの画像を入れる事ができました。
    そのヘッダー部分にリンク(ブログのトップ)を付けたいのですが、
    CSSを変えてみましたが、うまくできません。。。

    アドバイスをお願いします！！

  2. shokun0803
    メンバー
    6 ヶ月前の投稿 #

    テーマの配布場所が記されていないので具体的なソースが明示できませんが、ヘッダーの画像はおそらく<h1>～</h1>などで指定されている場所にcssでbackground: url(～)などのように指定されている場合がほとんどだと思います。
    ということは<h1>～</h1>にリンクを貼ってしまえばいいでしょう。ただし、この例の場合h1タグにdisplay: block;などの指定があることが前提になります（まあ、画像が指定されているなら大丈夫でしょうが・・・）

  3. xariat
    メンバー
    6 ヶ月前の投稿 #

    shokun0803さま

    回答ありがとうございます！
    配布先はhttp://www.problogthemes.com/blogtube-video-theme.htmlです。

    よろしくお願いします！！！

  4. shokun0803
    メンバー
    6 ヶ月前の投稿 #

    ソースを見ると

    <!-- Title -->
		<div id="header-info">
			<h1><a href="<?php echo get_option('home'); ?>/"><?php bloginfo('name'); ?></a></h1>
		</div>
		<!-- /Title -->

    タイトル画像（ブログタイトルの文字部分）にデフォルトでホームへのリンクがありますね。

    ヘッダーにオリジナルの画像を入れる事ができました。

    これはどこをどのように修正して画像を入れたのでしょうか？

  5. xariat
    メンバー
    6 ヶ月前の投稿 #

    shokun0803さま

    回答ありがとうございます。

    ＞これはどこをどのように修正して画像を入れたのでしょうか？

    headerのCSSに画像URLをいれました！

  6. shokun0803
    メンバー
    6 ヶ月前の投稿 #

    少々情報が少なくてわかりませんね。
    サイトのアドレスを明示できるのであれば直接ソースを見て判断しますが、それが難しいのであれば書き換えたcssのソース（一部分{から}までくらいが理想？）をコピペしてみてください。
    現状の判断ですと

    #header {
width: 907px;
height: 156px;
background: url("images/header.jpg") no-repeat;
position: relative;
}
    #header #header-info h1 {
width:297px;
line-height:64px;
background: url("images/logo.png") no-repeat;
color: #fff;
font: bold 24px Verdana;
padding-bottom: 27px;
padding-top: 18px;
padding-left: 25px;
}

    のどちらかのurlを変更したということだと思いますが、仮にソース・cssがこのままであればヘッダー部分のh1タグで囲まれた部分（おそらくヘッダーの左側一部分）にすでにリンクが入っているものと思われます。

  7. kurageotoko
    メンバー
    6 ヶ月前の投稿 #

    ちょっとやりたい事がよくわかりませんが、aタグに背景画像を置けば画像にリンクが貼ったようにみえます。
    display: block;でブロック要素にします。

    #header #header-info h1 a {
width:297px;
height:画像の高さ;
background: url("images/logo.png") no-repeat;
display: block;
}

返信

ログイン しなければ投稿できません。

About this Topic

Tags