ブックマーク / psn.hatenablog.jp (15)

  • はてなブログ「あわせて読みたい」機能を追加するAlso readのCSSカスタマイズ - すなばいじり

    関連エントリーを表示させる機能の「見た目」を変更する方法を解説します。 psn.hatenablog.jp data-user-css="true" カスタマイズ用のCSSを利用する設定です。あらかじめ用意されたCSSを利用せず、ご自身でデザインをカスタマイズしたい場合はtrueにします。 基的な構造 iframe版 リスト表示版 例:操作パネルの表示を変更する よくある質問 基的な構造 以下の通りとなります。 ※変更されることがあります。 iframe版 div .js-htnpsne-awasete-module Also readの表示設定などが含まれるDiv要素です。 この中に操作パネルや一覧表示等が生成されます。 div .js-htnpsne-awasete-control-outer 操作パネルや一覧表示等が含まれる外枠となるDiv要素です。 span .js-htnps

    BL-beginner
    BL-beginner 2016/07/01
    使わせていただきました!
  • はてなブログでパンくずリストを利用する - すなばいじり

    検索結果にカテゴリーを表示して、訪問者に便利な案内を提供しましょう。(SEO対策) はてなブログ(無料版)、はてなブログProのどちらでもご利用いただけます。どうぞご利用ください。 パンくずリストは最新の仕様*1に合わせてあります。 はてなブログの「カテゴリーごとのページ」に欠落しているパンくずリストを修正します。 説明をスキップして貼り付けコードを作成する サマリー パンくずリストとは? パンくずリストを設置する準備 準備と考え方 カテゴリーが1つ(親)ではダメですか? 孫カテゴリーを作りたいのですが コードを貼り付ける きちんと動作しているか確認したい エントリーを書くときのコツ 旧バージョンからのバージョンアップについて 古い設定を貼り付けた場所を忘れてしまいました よくある質問 リストの表示は無くても良いのですか? はてなブログ(無料版)でパンくずリストは利用できますか? Goog

    はてなブログでパンくずリストを利用する - すなばいじり
    BL-beginner
    BL-beginner 2016/03/27
    超嬉しい。
  • はてなブログに「あわせて読みたい」機能を追加するAlso readをリリースしました - すなばいじり

    はてなブログに関連記事や人気エントリーを表示させるブログパーツです。 一般的に「あわせて読みたい」というフレーズと一緒に表示されています。 特徴 利用方法 とりあえずペタリと貼って試したい 表示用コードをはてなブログに貼り付ける 各種の設定 表示するエントリー数の設定 リストの種類 リストのテキスト表示 テキスト型リストの「はてなブックマーク数」の表示 タイトル 「もっと読む」ボタン 「feedlyで購読」ボタン カスタムCSSの利用 追加パラメータ(実験中) 描画用コードをはてなブログに貼り付ける スクリーンショット あれ?表示されない?(困ったときは) 諸注意など 特徴 はてなブログ(無料版)、Proのどちらでも利用可能です。 PC/スマートフォン版のどちらでも動作します。 記事上、記事下、サイドバーといったHTMLを挿入できる場所であれば、何処に置いても表示する事ができます。 リスト

    はてなブログに「あわせて読みたい」機能を追加するAlso readをリリースしました - すなばいじり
    BL-beginner
    BL-beginner 2016/02/04
    早速試してみよう!こういう記事大好き!
  • はてなブログでナカセンを引きたい - すなばいじり

    物書きではないのであまり詳しくはないのですが、 吐く息が白くなる季節になった。 「今年もこの季節が廻ってきた。あの時、 いや、今はこの話は止めよう。」 この「ダッシュ」「ナカセン」「棒」などと言われているらしい小説などに付けるあれです。 q.hatena.ne.jp 最初は<hr>で区切りたい という質問だと思っていましたが、どうやら上記の装飾をしたいようでした。 ―― ダッシュ2個でも良いのですが、環境によっては隙間が出来てしまって恰好が悪い と感じる場合は、打消し線で代用する。*1 なるほどそういえば。という質問でした。 熊が見ている。 NEW リズムでともだち こぐまのトンピー 出版社/メーカー: イワヤ メディア: おもちゃ&ホビー この商品を含むブログ (1件) を見る *1:こちらを多用した場合、出版するような場合は修正が必要になるかと思います。InDesignなどのDTP方面

    はてなブログでナカセンを引きたい - すなばいじり
    BL-beginner
    BL-beginner 2016/01/12
    おおー!なるほどー!使いたい場面あるわー嬉しいわーどうせ出版なんか出来ないから使おうーっと
  • はてなブログチャレンジオンライン - すなばいじり

    ごあいさつ はい、あけましておめでとうございます。 年もよろしくお願いします。 サマリー ごあいさつ はてなブログオンライン YOUR STATUS 一歩を踏み出した荒鷲の上級王 psne レベル 獲得ポイント 達成したチャレンジ ステータスの分類 ブログチャレンジの一覧 初級 ブロガーを目指す君へ 初級部分のコメント 中級 ここからが番だ!! 中級部分のコメント スマホデザインのアクセントカラーを設定する 上級 ブログマスターへの道 上級部分のコメント ブログの全体ブックマーク数を確認するには? 新春 お正月限定チャレンジ お正月限定チャレンジのコメント 書初めは? ここまで読んだ方へのヒント はてなブログオンライン YOUR STATUS 一歩を踏み出した荒鷲の上級王 psne レベル Lv. 13(silver) 獲得ポイント 172pt 達成したチャレンジ 83個 ステータスの

    はてなブログチャレンジオンライン - すなばいじり
    BL-beginner
    BL-beginner 2016/01/02
    やってみよーっと
  • ファン活動などのお話 - すなばいじり

    進捗 おねいまんチェック対応 やりました/やります(8月分)。 書き出しに悩むやつ 一つの時代というか側面というか選択肢、とでも言いますか。 Kindle同人誌即売会をやってみたらどうだろう?というエントリー。 kindou.hatenablog.com まず、この*1エントリーを出すには10万字使っても結論は出ないものであるという事を前提に、何処かの立場になる事を避け、どこのポジションとも言えない立場を保つ感じで書きます。 ざっくり言うと 2000年くらいから、そういう考えを持っている人は居る (が、何故出現しない・長続きしないのか) 許諾を取りに行ったら「ダメです」としか言えない版元 ファン活動とは の3立てで語らないといけないやつなのですが、エントリーに充てる時間もあまりない上に散々あれこれやってきたものを書き直すのは車輪の再発明をするくらい「またか」となりますので、簡単に。 イ

    ファン活動などのお話 - すなばいじり
    BL-beginner
    BL-beginner 2015/08/27
    興味深いです。
  • パクられた感があるキャッシュサイトに対抗するやつ - すなばいじり

    作った。 数日前に「サイトのページをキャッシュするサイト」のネタが出てきていて、そういえば完全コピーされて区別がつかないようなキャッシュをするサイトが時々問題になるよね。と思って、今のところ実害が無いけど作っておくかと、サクサクやったやつです。 様子を見て大丈夫そうなので、みんなで使えるように。 Googleの検索結果からコピー先を消すこともできます。 はてなブログ以外の方向けもあります。どうぞご利用ください。 どうして「リダイレクト」するだけではダメなの? コピーをしたサイトがページ内のURLを書き換えて、正規のページへリダイレクト(転送)する事を阻止する事がある為です。 また、 検索エンジンの結果からのアクセスの場合には表示そのものを変更して偽の通販サイトを表示する といったフィッシングサイトを表示する事例もあります。 あなたのブログだと思ってアクセスした人が、フィッシング被害に遭う可

    パクられた感があるキャッシュサイトに対抗するやつ - すなばいじり
  • 周りを巻き込み過ぎない というお話 - すなばいじり

    ここ数日で書こうか止めておこうか考えて、書くなら皆が忘れた頃に気が向いたら書けば良いだろうと思っていたものを「はい。」と押されたので書きます。 いつものパターンを知っていれば、PVがどうとか最近話題のとか関係なく、「今更それ書くの?」というやつが珍しいね。という感覚で読めるかと思いますよ。 技術的な事は熱いうちに書く事もありますけれど。 もう一つは、ブログ名長くなってるぞなにこれ。というお話の二立て。 持たない主義 持たない主義については、それぞれのやり方とゴールがあるので各自の目標に向かって進んで行けば良いのですが、件については、わざわざ人の家に行って「きったねー部屋ですね!」*1とやったようなもので、その行為について「流石にどうなのよ迷惑ですわ」と言われているだけの話なので、きちんと切り分けて考えましょう。というスタンスです。 断捨離でもあったじゃないですか。自分の持ち物ならまだしも

    周りを巻き込み過ぎない というお話 - すなばいじり
  • Google Chromeモバイル版の モバイルフレンドリー ビュー - すなばいじり

    Chromeモバイル版(Beta)にて「リーダーモード」が一時期使えるようになりましたが、Dev版のフラグ設定を変えると、名前が変更されたリーダーモードが表示できるようになっています。 psn.hatenablog.jp モバイルフレンドリー ビューを試す このエントリー時点では、Beta版では設定を行っても上手く機能せず、Dev版のみとなります。 Make page mobile-friendly というトーストが出てきますので、タップします。 暫くすると、お久しぶりなやつが出てきます。 ※スクリーンショットを取る都合上、若干文字の大きさを小さくしています。 マテリアルデザイン ライクに変更され、邪魔な物が殆ど取り除かれた「読みに徹するモード」になります。 広告も消えますが、以前と同様、はてなブログに埋め込んだAmazonの商品紹介画像は残るようです。 これはこれで読みやすいので、サクサ

    Google Chromeモバイル版の モバイルフレンドリー ビュー - すなばいじり
  • はてなブログにサイドメニューをつけるやつを更新しました - すなばいじり

    少し前の話になりますが、はてなブログのスマートフォン版に表示できるサイドメニューが表示されなくなっていたものを修正しました。 psn.hatenablog.jp ブログを購読済みか判定する部分の仕様が変更されて動かなくなっていましたが、修正されました。 そろそろガツンと作り直してリリースしたいやつです。 NEW リズムでともだち こぐまのトンピー 出版社/メーカー: イワヤ メディア: おもちゃ&ホビー この商品を含むブログ (1件) を見る

    はてなブログにサイドメニューをつけるやつを更新しました - すなばいじり
  • はてなブログのヘッダメニュー消すやつ - すなばいじり

    なんどめだこのネタというハック。 ちゃんとロードしているので「表示が早くなった!」といった感想は気のせいかと思いますよ。そもそも後ろの方で処理が開始されるので、その差が分からない事もありますね。 詳細設定のヘッダ・フッタ設定で非表示に設定しても、色々な事情で中身がロードされる為、ヘッダ内にCSSを置く方法がお勧めです。(はてなブログProのみ) → ブログの詳細設定を開く #globalheader-container { display: none; } スマホ版でも消えます。 上部に隙間が出来て見栄えが!という場合は #container { padding-top: 0px; } containerの余白を消すことで上手い事できます。(はてなブログProのみ) 設定と上手く組み合わせると幸せになれそうです。 enjoy :) suzukidesu23.hateblo.jp その他:や

    はてなブログのヘッダメニュー消すやつ - すなばいじり
  • はてブロリンクメーカー FX - すなばいじり

    はてブロリンクメーカー FXは、埋め込みのリンクボタンを生成するやつです。 とりあえず何かに使えたらご一報ください。 良い良い。 他のサイドバーモジュールと同じように表示させる場合には良いですね。 何故通常ではここにリンクが無いのかと考えたら、アイコンまたはID表示をすると、デフォルトのaboutページへのリンクが出るからです。 個人的には都度生成するより、予めHTML埋め込んだ方がもっと読めるようで良いかな?という事で、物凄く手抜きでプロフィールとかへリンク貼れるやつを書いた。 HTMLをそのまま貼り付けできるので、後からDOM弄る必要がないやつです。ベタなので早い。 タイトル リンク先 開き方 新しいウインドウで開く 貼り付けHTML 生成する 生成が終わりましたら、デザインにあるサイドバーモジュール「プロフィール」等にぺたりと貼り付けると完成です。 適用ボタンと保存ボタンも忘れずに。

    はてブロリンクメーカー FX - すなばいじり
  • サイドメニュー作った - すなばいじり

    サクッと作って公開してしまえば3月中に正式版になっていたかもしれないサイドメニューをβ版として公開しました。 概要 元々は「某ブログパーツのシェアボタンがスクロールするとチラチラしてつらい」という所からスタートしたのですが、スマホ表示・PC版表示・レスポンシブ版の3つの環境に合わせるにはどうしたら良いか考えていたり、欲しいメニューリストを選定していたりと色々調査をしていたらキリが無い状態になっていたところ、はてブの新着に4/6だぞという画像が舞い込んできたので、この勢いに任せる感じです。 使い方 ヘッダに貼り付けるだけでOKです。 psn.hatenablog.jp このエントリーの時点では、スマホのみで表示されます。 カスタマイズ 表示前にキューを送る事でメニューリストの種類や順番を変更できるようになっています。 Htnpsne.SideMenu('create','subscribe'

    サイドメニュー作った - すなばいじり
  • Googleにsocial profile を教えるやつを作った - すなばいじり

    自分でGoogleに教える事ができるのなら、サクサクと作れるやつを作れば良いのです。という事で作った。 つかいかた 各部を入力してボタンを押すだけでJSON-LD(構造化データ)が出力されます。 丸ごとHTMLのヘッダに貼り付ければOKです。 ヒント 「URL」には貼り付けたいサイトのTOPページのURL 例 http://psn.hatenablog.jp/ 「表示する関連アカウント」にはSNSのURLを入力します。複数入力する場合は、改行で区切ります。 例 https://twitter.com/psne https://twitter.com/hatebu つくるやつ プロフィールタイプ Person (個人) Organization (組織) 名称(名前) URL 表示する 関連アカウント (URL) 貼り付けるやつ 生成する ※15/03/15 一部修正 はてなブログ以外でも利

    Googleにsocial profile を教えるやつを作った - すなばいじり
  • 大はてな実験 - すなばいじり

    はてな実験とは 「あれ?これってどうやればいいの?」「この機能はあったかな?」 はてなブログで大実験。 はてなブログをちょっとリッチに。 お役立ちモノから実験レベルまで、はてなブログで使えるスクリプトのご紹介。 基的に数行入れるだけで完了する設計になっています。 どうぞご利用ください。 (投げ銭)ポイントを送信できます この砂場、砂が漏れてる。*1 全部試してみよう 大はてな実験とは 記事一覧の中にHTMLを挿入したい!(記事リンクなどを挿入) 曜日を表示させたい! 検索結果にカテゴリを表示させたい!(パンくずリスト) 画像のタイトルを変えたい!(SEO対策) 検索結果にプロフィールを表示させたい!(SEO対策) いつか「検索するボックス」を表示を出したい!(SEO対策) はてなブログの画像を拡大表示しないようにしたい ブログ記事のコピー対策をしたい リンクのボタンを作りたい! お賽銭

    大はてな実験 - すなばいじり
  • 1