Big Bang

パソコンの電源を入れた時、メモリー空間に無限の宇宙が拡がる

送信ボタンの隣に投票ボタンを配置

| 11件のコメント

2014年1月22日にA8.netのファンブログはSeesaa Blogのシステムをベースにして生まれ変わりました。よってファンブログ関連の記事は今では当てはまらない可能性があります。新しいファンブログのカスタマイズは別ブログ「ファンブログ テック」で詳しく書いていますので、そちらをご覧ください。

ファンブログで、コメント欄の送信ボタンの隣に
ブログランキングの投票ボタンを配置する方法です。

前準備

ランキングの投票ボタンのソースをそのまま使うと、下のように2行になります。

にほんブログ村 IT技術ブログ HTML/CSSへ
にほんブログ村

ウェブデザイン ブログランキングへ

これだと、レイアウトが崩れるので、2行目の文字を削除します。
削除するのは<br />以降のすべてです。

<a href="http://it.blogmura.com/html/"><img src="http://it.blogmura.com/html/img/html88_31.gif" width="88" height="31" border="0" alt="にほんブログ村 IT技術ブログ HTML/CSSへ" /></a><br /><a href="http://it.blogmura.com/html/">にほんブログ村</a>

この青文字部分をすべて削除

人気ブログランキングも2行ある場合は、同じように<br />以降のすべてを削除します。

ボタンの配置方法

まず、ファンブログの設定画面を開き、左側のスタイルの変更をクリック。
続いて「1記事」を選択。右側にソースが表示されるので、
下のようになっている場所を、「コメント」という文字を頼りに探します。

<h3 id="commentTitle">コメント</h3>

さらにそこから約60行下、次の行を探します。
目印は「submit」と「送信する」という文字。(submitは送信するボタンにしか使わない文字です)

<div><input style="font-weight: bold;" type="submit" name="post" value="送信する" class="btn" /></div>

この行を下のように変更します。

<p style="text-align:right"><input style="font-weight: bold;margin-top:-20px;" type="submit" name="post" value="送信する"/><span style="margin-left:1em;vertical-align:middle;">ここににほんブログ村のソース ここに人気ブログランキングのソース</span></p>

さらにその直後に1行追加して</div>と追加。

書き直した場所の数行上に、<textarea で始まる行があるので、
その上に、<div style=”width:290px”>と追加します。

完成形は下のようになります。

<div style="width:290px">
<textarea name="comment" rows="10" style="width:290px">{$CommentValueComment$}</textarea><br />
{$CommentErrMsgComment$} 
<div id="comment_preview" class="comment_layer"></div>
<p></p>
</table>
<p style="text-align:right"><input style="font-weight: bold;margin-top:-20px;" type="submit" name="post" value="送信する"/><span style="margin-left:1em;vertical-align:middle;">ここににほんブログ村のソース ここに人気ブログランキングのソース</span></p>
</div>

先ほど追加した<div style=”width:290px”>の、290ですが、
もし、textareaの行のwidth:290px290となっていない時は、
その数字に合わせて直してください。

実際にどう表示されているかは、この下のコメント欄を見てください。

11件のコメント

  1. これいいですね!
    早速真似させていただきました♪
    Tomさんのソース説明分かりやすくて助かります。
    簡単にできました!ありがとうです!

  2. どういたしまして。使ってくれてありがとう。

  3. こんにちは^^
    トライしましたが上手くいきませんでした
    残念!

  4. もう一度トライして出来ました^^
    ありがとうございます!
    感謝(=^・^=)

  5. Tomさー。昔、記事ごとにランキングボタンがあるのは
    どうかと思う、とかって記事書いてなかった?

  6. まりりんもんろーさん。
    ありがとうございます。

  7. 記事の最後に、こびるようにボタンがあるのはキライだって
    「ポテッとボタン挿入モジュール」の記事で最初書いていた。

    それが、何か?

    昔の話です。

  8. 大人になったってこと?

  9. スケベな話はここでは恥ずかしいな。

  10. ねーねー。この方法、ちっとも効果なかったよ笑。

  11. やっぱり、ただ置いておくだけじゃだめみたいよ笑。
    いい記事書かなきゃねっ♪

コメントを残す

Top