はてなブログでのリンクの貼り方を教えてください

はてなブログを始めた者です
htmlとかはてな記法とか初心者なので分かりません
理解する気はないのでやり方を教えてください

画像付きでそれをクリックすると
そのホームページに飛ぶというものです
記事では無くブログのトップに張りたいです
回答お願いします

回答の条件
  • 1人50回まで
  • 登録:
  • 終了:2012/01/15 19:44:09

ベストアンサー

id:Cherenkov No.1

回答回数1504ベストアンサー獲得回数493

これを記事に書いてみてください。

<script type="text/javascript">
$(function() {
  if (!$('#blog-title #ika-banner').length) {
    var src = '<a id="ika-banner" target="_blank" href="http://www.ika-musume.com/"><img alt="画像1" src="http://www.ika-musume.com/images/middle/sp/bn/bn_ikamusume_200_50.jpg"></a>';
    $('#blog-title').append(src);
  }
});
</script>

flandlescarlet (八咫烏)さんがコメントしていますが、
はてなダイアリーとは違いはてなブログはまだベータなのでヘッダーなどを編集する機能が揃っていません。
現段階でヘッダーにバナーを設置するにはブログにアクセスした時に表示される記事に上記のような、JavaScriptを記入しておいて実現するしか方法がありません。

全ての記事に上記のコードを書いても、バナーは1つだけ追加されるようにコードを修正しました。


追記:
はてなブログ サイドバーのリンクに追加

$(function() {
  var links = $('.hatena-module-links .hatena-urllist');
  if (!$('#ika-banner', links).length) {
    var src = '<a id="ika-banner" target="_blank" href="http://www.ika-musume.com/"><img alt="画像1" src="http://www.ika-musume.com/images/middle/sp/bn/bn_ikamusume_200_50.jpg"></a>';
    //上
    links.prepend('<li>'+src+'</li>');
    //下
    links.append('<li>'+src+'</li>');
  }
});
他6件のコメントを見る
id:Cherenkov

追記しました

2012/01/15 19:24:02
id:tomo0903

最後までワガママに付き合ってくださって
本当にありがとうございました!
質問が解決できましたので
閉め切りたいと思います
八咫烏さんもありがとうございました!
また何か質問する時があると思いますので
その時はよろしくお願いします

2012/01/15 19:43:59
  • id:flandlescarlet
    はてなブログでまだヘッダは無いですよ
    だからリンクに貼りたいというならばCSSとJavaScriptで制御する事になると思います


    javascript

    <script type="text/JavaScript">
    document.getElementById("globalheader-container").innerHTML += "<a href='URL'>リンク先の名称</a>";
    </script>

    基本的にはこんな感じになります
    ヘッダを簡単に編集できないのがまだ痛い所ですね
    サイドバーがあるのにサイドバーが編集できないのも少し残念です

    画像の時は

    <a href="リンク先URL" target="_blank"><img src="画像のURL" alt="画像1"></a>

    これでOKです

    少しややこしいですが
  • id:flandlescarlet
    ※注意

    JavaScriptはまだCSSのように別途に準備ができません
    ですから記事に書くことになります(それでもヘッダを操作するので実質ヘッダにリンクが作られる)

    記事は何回か書くとどんどん流されていくので
    同じページにスクリプトがなくなったとたんにヘッダの内容が消えてしまいます
    その時はひっそりとまたリンクを投稿する記事と添えて編集しましょう...
    こればかりははてなblogの今後の改善に任せるしかないですね
  • id:tomo0903
    ドラころ 2012/01/14 22:43:28
    ご回答ありがとうございます
    ちょっと分かりません・・・
    自分が低脳な初心者なんで・・・
    どこにどういった文章を
    また、手順を教えていただけるとうれしいです
    わがまま言ってすいません
  • id:tomo0903
    ドラころ 2012/01/14 22:44:47
    意見でヘッダー機能を付けてほしいと頼んでみます
    詳しく説明していただいてありがとうございます
  • id:flandlescarlet
    とりあえずリンクの仕方を理解していきましょう!!
    始めだから初心者なだけです。使っていけば案外分かってくるものです

    話が飛翔しすぎましたのでゆっくりと説明します
    まずリンクですが

    <a href="リンク先のURL">表示させる内容</a>

    これ一つで終わりです
    具体的に書くと

    < a href="http://q.hatena.ne.jp/1326546160">はてなblogでヘッダにリンク追加</a>

    こうなります。ここのリンク先になります
    まずこれを普通に記事に追加してみましょう
    編集場所はHTMLでの所です記事を書くときのモードもHTMLにしておきます
  • id:flandlescarlet
    < a href="リンク先のURL"><img src="画像のURL" alt="画像に適当な名前を付ける"></a>

    これが画像をクリックすると飛ぶリンクです

    <a href>の部分はそのままでOKです
    画像のURLは一旦貼りたい画像をパソコンに保存して同じはてなサービスのフォトライフにあげてそのフォトライフ(自分の)画像を使うのが一般的です

    それでないと、他の人の画像を使ってるとそこの管理人さんがその画像を消しちゃうと
    自分のブログの画像も消えてしまいますからね

    とりあえずここまでが「HTML」って呼ばれる記述方法です
    極めても良いですし、嫌ならコピペで使いきりでもいいです
    でも最低使う分は押さえておいてもよいでしょう

    とりあえず確認してみてください
    ヘッダの説明はややこしいのでとりあえず部分的に形を作ろうと思います
  • id:tomo0903
    ドラころ 2012/01/14 23:30:57
    ご丁寧に説明
    ありがとうございます
    <a href="リンク先URL" target="_blank"><img src="画像のURL" alt="画像1"></a>
    を使って記事に画像付きでリンクを貼ることができました。
    引き続きがんばってみます
  • id:flandlescarlet
    とりあえずヘッダにですか!?

    リンク先ならサイドバーにもありますが
    いろいろと仕様があれですのでサイドバーも調べてます

    ヘッダよりサイドバーに貼った方が
    自分としては良い気もしましたが...どうしましょう
  • id:tomo0903
    ドラころ 2012/01/14 23:50:33
    http://gesogeso.hatenablog.com/
    こんな感じです
  • id:flandlescarlet
    ちょっと使うデザインで変わるのかな
    それに変えて試してみますのでちょっと時間がかかります

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

回答リクエストを送信したユーザーはいません