パソコン・ウェブ制作

WordPressのブロック要素全体をクリックできるように修正

投稿日:2014年10月5日 更新日:

※記述に間違いがあったので訂正しました。(2014.10.8)

キャプチャ

今日は天気があまり良くないので、朝一で外出した後は家でじっとしていたので、ちょこちょことサイトの修正をしました。
※作業開始前に必ずバックアップを取ってください
※素人のカスタマイズですので同じように設定しても動作しない場合があります。あらかじめご了承ください。

ブロック要素全体をクリックできるように

まずはJavaScriptの設定

リンクをテキストだけではなく、全体をクリックできるように修正をしました。
今回はjQueryを使って対応しています。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

jQueryは外部ファイル読み込みにしました。
この記述の下あたりに、適用させたいidやclassを指定します。
ここでは、トップページの一覧に適用させるので「#topnews」「div#topnews dl」となっています。
※記述が一部間違っていました。(2014.10.8)

<script type="text/javascript">
$(function(){
     $('div#topnews dl').click(function(){
         window.location=$(this).find('a').attr('href');
         return false;
    });
});
</script>

 CSSの設定

style.cssに下記を追記しました。

#topnews dl.clearfix:hover {
	background-color : #faf5ca ;
	cursor : pointer ; /*マウスカーソルをポインターに変更する指定 */
}

これでOKです。

右側の「NEW POST」やランキング表示も同様に設定をしたので、クリックしやすくなりました。

-パソコン・ウェブ制作
-

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

*

関連記事

FC2ブログからWordPressに移行しました

約4年前から、キャンプレポートに特化したブログをFC2で更新していたのですが、2014年からWordpressに切り替えてリニューアルしました。 キャンプに頻繁に行くことが出来なくなり、更新が出来なか …

Hit bit HB-101

ソニーPC事業譲渡で思い出したMSXとの出会い

Hit bit HB-101 VAIOブランド譲渡のニュースで思い出したのだけど、私のパソコンルーツはソニーのMSX、HiTBiTを購入したのが始まりだったということ。 今後何回か書いていきたいと思っ …

WordPress Popular Posts

WordPress Popular Postsを導入しました

閲覧数をランキング表示してくれるWordpressのプラグイン「WordPress Popular Posts」を導入しました。 普通にランキング表示するだけであれば、難しくはないのですが、Sting …

ちょこっとリニューアル

シンプルな構成にしました ほんとうにちょこっとなんですけど、ブログリニューアルしました。 このブログはWordpressで作っていますが、テーマを新しくしてカラフルだったサイトを白ベースのシンプルな色 …

カテゴリ

WordPressのカテゴリ一覧表示をカスタマイズしました。

シンプルすぎるWordpressのカテゴリ一覧表示をカスタマイズしました。 ※作業開始前に必ずバックアップを取ってください ※素人のカスタマイズですので同じように設定しても動作しない場合があります。あ …

散水栓から立水栓に変更しました
2018年10月10日 に投稿された
ベアボーンズ エジソンリビングライトLED
ベアボーンズ エジソンペンダントライトLEDの収納にはチャムスチャムス ブービーマルチハードケースが最適!
2020年3月3日 に投稿された
バンドブレーキからサーボブレーキに交換
2017年2月26日 に投稿された
ピルツ19買っちゃった!
2018年8月17日 に投稿された
花の森オートキャンピア
2016年12月5日 に投稿された
オートキャンプインむじな
2017年5月21日 に投稿された
ニュー田代オートキャンプ場
2016年10月24日 に投稿された
ランボルギーニ・カウンタック LP400と500の違いって?
2014年1月5日 に投稿された
THV-2000
Thermos(サーモス)お客様相談室の対応に感動した
2014年11月14日 に投稿された
宝台樹キャンプ場
2010年5月4日 に投稿された
follow us in feedly
にほんブログ村に参加しています
にほんブログ村 アウトドアブログ ファミリーキャンプへ