平日WEB系SE 週末時々自転車屋

WEB系の技術ネタや大好きなお酒、週末手伝う自転車屋の話などを書きます。

はてブロ

はてなブログで下書きした記事を公開するときは気を付けた方が良いかも

いつも通りお酒の記事を公開したところ全然PVが伸びず、はてなスターもつかないので、なんでだろうと調べてみた結果、理由が分かりました。 さっき公開したばかりの記事がTOPページに表示されない なんでかなーとあまり見ることのない自分のブログのTOPペー…

はてなブログの記事下にサムネイル付きの関連記事をランダムに出す方法 に nendのネイティブ広告を追加してみた(nendのネイティブ広告導入方法も書いてあります)

スマホ表示の場合の広告としてnendを利用しているのですが、nendからネイティブ広告始めました!というメールが来ました。 ※nendはスマートフォン専用の広告です。 ネイティブ広告というのはyahooやmsnなどニュースサイトで見かける、記事の一覧の中に埋め込…

地味に便利なはてなブログの画像を自動で中寄せする方法

はてなブログの画像は左寄せ はてなブログのPC版の画面で普通に画像をドラッグアンドドロップしたり、UP済みの画像を配置しようとすると左寄せで配置されます。 スマホで見る限りは全然わかりませんが、PCで見ると左に表示されます。 特に私の場合、横幅を特…

はてなブログの記事下にサムネイル付きの関連記事をランダムに出す方法の機能説明やカスタマイズ方法を簡単にお知らせします。

はてなブログの記事下にサムネイル付きの関連記事をランダムに出す方法が思ったよりブックマークしていただいているようなので、機能やカスタマイズの解説をしたいと思います。 jitenshaya-se.hatenablog.com 主な機能 記事に設定されているカテゴリと同じカ…

やっと完成!はてなブログの記事下にサムネイル付きの関連記事をランダムに出す方法(2015 11/5,11/19,12/8追記)

1度作ってからバグ修正などを何度か繰り返してきましたが、再度大幅に修正しなければいけない部分が出てきたので、作り直しました。 ※2015 11/15 追記 と言いつつまたもや修正してしまいました。 このブログは問題ないのですが、TOPページに複数記事表示して…

はてなブログでスクロールすると画面上部に固定されるPC・スマホ両方に対応したグローバルメニューを表示する方法(PC・スマホ両方に対応)の改良版

以前作ったこちらの画面をスクロールした時に追従するグローバルメニューですが、細かいところで何か所か修正したので別記事で公開します。 はてなブログでスクロールすると画面上部に固定されるPC・スマホ両方に対応したグローバルメニューを表示する方法(…

はてなブログでスクロールすると画面上部に固定されるPC・スマホ両方に対応したグローバルメニューを表示する方法(PC・スマホ両方に対応)

※2015/7/19に修正版を作りました。 はてなブログでスクロールすると画面上部に固定されるPC・スマホ両方に対応したグローバルメニューを表示する方法(PC・スマホ両方に対応)の改良版 - 平日WEB系SE 週末時々自転車屋 のブログjitenshaya-se.hatenablog.com…

はてなブログでスクロールすると画面上部に固定されるグローバルメニューを表示する方法(PCのみ)

スマホサイトなんかでよく見かける、画面をスクロールした時に画面の上に固定されるグローバルメニューをたまたま仕事で調べていたので、このブログにも実装してみました。 グローバルメニューの表示自体は以前書いた方法を利用します。 はてなブログを改造…

はてなブログを改造する際に利用するスマホの判定方法(UserAgentによる判定から画面幅による判定へ)

UserAgentによる判定から画面幅による判定へ 今までjavascript内でスマホを判定する際には下のコードのようにUserAgentを使っていました。 if ((navigator.userAgent.indexOf('iPhone') > 0 || navigator.userAgent.indexOf('iPod') > 0 || navigator.userAg…

はてなブログの記事下にサムネイル付きの関連記事を出して回遊性をUP!!!(2015 6/10 6/16 6/26 7/6バグ修正版)

※2015 6/16 ブラウザによるcss('background-image')の戻り値の違いを吸収するように修正しました。 ※2015 6/26 jQueryを独自に読み込んだ方が早いので、独自に読み込むように修正しました。また、関連記事は後から処理を行っても良いので、3秒たってから読み…

はてなブログの記事下にサムネイル付きの関連記事を出して回遊性をUP!!!(6/10に別記事で修正版を公開しました)

※2015 6/10に一部バグの修正とCSSとjavascriptの分離を行ったので、別記事にまとめました。 はてなブログの記事下にサムネイル付きの関連記事を出して回遊性をUP!!!(2015 6/10 バグ修正版) - 平日WEB系SE 週末時々自転車屋 のブログjitenshaya-se.hatenab…

はてなブログの記事ページに同じカテゴリの記事を表示して回遊性をUP

直帰率が高い 飲んだお酒の紹介やはてなブログの改造ネタなど話題がバラバラで各順番もランダムなせいか、このブログは直帰率が高いです。(90%前後です) はてなブログは回遊性が低い はてなブログは特に古い記事への導線が弱いので、せっかく検索エンジン…

超便利!はてなブログに自動でグローバルメニューを表示させる方法(チューニングバージョン)

表示が遅い 以前作ったグローバルメニューですが、機能的には満足いくものにはなったのですが、PCでも表示がもっさりして遅く、スマホでは表示される前に画面を下に移動してしまう位遅いので、チューニングしてみることにしました。 以前の記事 超便利!はて…

お小遣いUPのためにgoogleAdsenseの表示回数をUP! はてなブログ(無料版)のカテゴリ一覧にgoogleAdsenseを表示する方法

googleAdsenseを自由に配置できる 過去2回の記事で特定のカテゴリ(お酒)の場合にはgoogleAdsenseの広告を表示せず、また表示場所も自由に指定できる方法が確立できたので、改めて配置場所を考えてみました。 googleAdsenseをはてなブログ(無料版)のバナ…

お小遣いを増やすためにはこれ!googleAdsenseをはてなブログ(無料版)のバナーより上に表示させる方法

前回の記事で予告した記事の上にadsenseのバナーを表示する方法をお知らせします。 ※jQueryのライブラリをあらかじめ読み込んでおくことが抜けていたため4/1に追記しました。 googleAdsenseをはてなブログ(無料版)に表示してみた(組み込む場所やバナーの…

googleAdsenseの規約違反にならないためにはこれ!はてなブログ(無料版)の特定のカテゴリ(お酒)の場合だけ非表示にする方法

前回の記事で予告した記事の上にadsenseのバナーを特定のカテゴリの記事の場合だけ非表示にする方法をお知らせします。 ※jQueryのライブラリをあらかじめ読み込んでおくことが抜けていたため4/1に追記しました。 googleAdsenseをはてなブログ(無料版)に表…

無料版でもお小遣い稼ぎ!googleAdsenseをはてなブログ(無料版)に表示する方法(組み込む場所やバナーの枚数の検討)

やっとgoogleAdsenseの審査が通ったので、さっそく組み込んでみます。 1ページに掲載可能なgoogleAdsenseのバナーは3つまで Ad placement policies - AdSense Helpsupport.google.com googleAdsenseの規約を読むと、1ページに広告ユニットが 3 つ、リンクユ…

超便利!はてなブログに自動でグローバルメニューを表示させる方法

今までの改修で、見た目は満足いくものになったのですが、プログラムの話を書くと記事自体が長くなりがちで、スマホで見た場合はメニューが記事の下にあるので他の記事を探す場合に大変使いづらいため、グローバルメニューを追加しました。 追加自体は はて…

はてなブログのタイトルをスマホで見やすくする方法

※内容が分かりづらいと思い、タイトルを変更しました。 はてなブログをレスポンシブ対応にしてみた - 平日WEB系SE 週末時々自転車屋 のブログ と はてなブログの色の変更について - 平日WEB系SE 週末時々自転車屋 のブログの続きです。 前2回分の内容を反映…

はてなブログのテーマカラーを変更する方法

はてなブログをレスポンシブ対応にしてみました。 - 平日WEB系SE 週末時々自転車屋 のブログ の続きです。 前回ははてなブログのレスポンシブ対応について書きましたが、今回はテーマの色の変更とスマホ向けの見た目の調整について書きます。 まずは 色の調…

はてなブログをレスポンシブ対応にしてみた

はてなブログのスマホ用のviewは表示も速くてよいのですが、googleadsenseが3箇所も入っていて(はてなブログの無料版を使っています)、デザインを自分でいじれないということで、 レスポンシブ対応のテンプレートを導入 してみました。 導入したのはおそ…