はてなブログの記事下にプロフィールカードを表示するカスタマイズ - Minimal Green
はてなブログの記事下にカード型のプロフィール欄を表示するカスタマイズを作りましたのでご紹介します。 こんな感じ カスタマイズコード HTML CSS こんな感じPCではこんな感じに表示にされます。 スマートフォンではこんな感じです。 デザインはこのブログに合わせているので、背景色やボーダーの色など適宜変更してお使いいただければと思います。 またアイコンははてなブログのアイコンwebフォントを使っているのではてなブログ以外で使うときはFontAwesomeなどに置き換えて下さい。 はてなブログで使えるアイコンwebフォント一覧はしろかいさんの記事をご参照下さい。 shirokai.hatenablog.com カスタマイズコード HTML はてなブログ管理画面>デザイン>カスタマイズ>記事下に以下のコードを追加します。 <div class="entry-footer-profile"> <
はてなブログの記事上下にレスポンシブなカウント付きシェアボタンをつけるカスタマイズ（修正あり） - Minimal Green
このシェアボタンはid:hiroseyonakaさんのコードを参考にしています。ありがとうございました。 こんな感じのデザイン はてなブックマーク、Facebook、Twitter、Google+のソーシャルシェアボタンです。 レスポンシブでスマートフォンだとカウント、テキストなしでロゴのみです。 こんな感じのデザイン FontAwesomeの呼び出し 記事上か下に貼り付けるHTMLコード デザインを決めるCSS スマートフォン版のコード ガーリーデザインのシェアボタン HTTPSへの対応 下記のコードは以前のままではHTTPS化されたはてなブログではMixed Contentになってしまいます。 namikuguri.hatenablog.com blog.hinaloe.net 上記記事を参考にはてなブックマークAPIのURLを変更しました。 FontAwesomeの呼び出し head
はてなブログのHTTPS化の対応やることリスト【独自ドメイン・はてなドメイン】 - Minimal Green
はてなブログの独自ドメインのHTTPS配信がついに有効になりました。 staff.hatenablog.com ていうかはてなブログの開発ブログがまだHTTPS化されてない(´・ω・`)最近WordPress移転する方が多くて寂しいです。 HTTPS化の手順・やることリスト 修正すべき記事を検索 置換ツール Upgrade Insecure Requestsのメタタグをheadに入れる Mixed Content（混在コンテンツ）の確認 忘れやすいポイント はてなブックマークのシェアボタンをカスタマイズしている場合 jQueryを使ったカスタマイズをしている場合 管理画面（デザイン＞カスタマイズの画面）が崩れている・混在コンテンツになっている場合 【追記】2016年12月以前のブログカード 画像の置換のやり方の詳細 Google Search ConsoleとGoogleアナリティクスの再
サイドバーの記事一覧モジュールで、変数を用いた高度なカスタマイズをできるようにしました - はてなブログ開発ブログ
はてなブログでは、サイドバーに追加できる「最新記事」「関連記事」「注目記事」の各記事一覧モジュールにおいて、変数を用いた高度なカスタマイズをできるようにしました。タイトルや投稿日時などの表示順を変更したり、任意のHTMLを記述したりできます。 ※高度なカスタマイズは、HTMLやCSSの知識を持っており、デフォルトの記事一覧のスタイルがわかる方を対象としています。はてなブログでは、デザインやレイアウトのカスタマイズに関してサポート対象としておりませんのでご了承ください。 記事一覧モジュールで高度なカスタマイズを利用するには デザイン設定画面の「カスタマイズ」ページで、「サイドバー」の項目から「最新記事」「関連記事」「注目記事」の各モジュールの設定ウィンドウを開き、「高度なカスタマイズを使う」のチェックボックスをチェックします。 それぞれのモジュール編集画面で「高度なカスタマイズ」にチェックを
自腹で他人のエッセイ集を出版する、最高の大人の道楽｜はてなベストエッセイ集 - ニャート
2017 - 01 - 29 自腹で他人のエッセイ集を出版する、最高の大人の道楽｜はてなベストエッセイ集 エッセイ紹介 自腹で、はてなブログや増田（はてな匿名ダイアリー）に投稿されるエッセイをまとめて出版したいという、お大尽が現れた。 dk4130523.hatenablog.com dk4130523.hatenablog.com dk4130523.hatenablog.com 「はてなベストエッセイ集」の企画概要 ３番目の記事に、こう書いてある。 2017年中にはてなブログ（＋増田）に発表されたエッセイの中から id:dk4130523 氏が24編選んで（＋特別寄稿）、エッセイ集仕立てにする 230部を刷って、氏が書店を回って置いてもらう 300円（未定）で売上は寄付 電子化はたぶんしない（PDFは作るかも） この活動を10年続けたい （詳しくは 元記事 を読んでください） 記事には
はてなブログの下書きがChromeで消えた時に救われる記事に感激した。 - 45 For Trash
今回は、はてなブログ執筆中に下書きが消失してしまい困っている中、まさにぴったりの解決方法を教えてくれる記事を見つけ、ムチャクチャ感動したのでシェア。 これは良さそう！と思ったら是非リンク先のサイトを訪問してみてください（私も今回初めて訪問・ブクマしました。弊ブログよりも格段に多い読者登録があるようなので知っている方も多いかも知れませんが…）。 Chromeのクラッシュで痛い目に遭う Chromeのキャッシュだとバイナリーデータを触らなきゃいけないと思っていた 簡単な方法があった（Cache viewer for Google Chrome Web browser）感謝！ Chromeのクラッシュで痛い目に遭う 私、普段使いのブラウザはGoogle Chrome(グーグルクローム)で、はてなブログの編集画面もChromeで開いているのですが、最近Chromeが定期的にクラッシュしてしまいます
はてなブログで保存せずに消えた記事の復元方法。下書き中に消した記事の復旧方法。 - よつば君
2017 - 01 - 22 はてなブログで保存せずに消えた記事の復元方法。下書き中に消した記事の復旧方法。 カスタマイズ フォローする はてな Twitter Feedly シェアする Bookmark! Facebook Twitter Google+ Pocket はてなブログで記事を書いていたら、突然ブラウザが落ちた。 書いていた記事が消えてしまった。２００文字ぐらいなら諦めもつく。しかし、２０００文字や５０００文字などの長いブログ記事を書いていたら諦めきれない。大声で叫びたくなる。 私も６０００文字ぐらい書いている途中でブラウザがダウンして記事が消えた。それも １回も下書き保存していない記事 だ。 怒りよりも喪失感の方が大きく、茫然としてしまった。その時、記事を復活させる方法を調べた、とにかく調べまくった。その結果を記事にしていく。 この記事を見ている方も以下のような理由で記事
はてなブログの記事はMarkdown形式だと圧倒的に書きやすい - nasust life blog
はてなブログでのMarkdownのメリット ゴミなhtmlが生成されない コードが書きやすい 表も書きやすい リストも書きやすい はてな記法も使える htmlも書ける エディタの右側のAmazonなどのツールも問題なく使える Markdownでもはてなブログの全機能が使える 関連記事 こんにちはnasustです。 このブログは全てMarkdownで更新しています。 Markdownとは文章を記述するための軽量マークアップです。分かりやすく解説しますと、htmlはタグを書いたりして文章をの書式を記述しています。Markdownでは簡単な記号や書き方で書式を指定することができます。物凄く簡単ですので、書式指定が文章の邪魔になることはありません。 Markdownの詳しい説明はWikipediaに書いてあります。書式の指定方法は簡単ですので1日で覚える事ができます。 Markdown - Wik
目次を入力補助ツールバーから挿入できるようにするなど、はてな記法を便利に使えるようにしました（2件） - はてなブログ開発ブログ
はてなブログでは、記事編集画面（PC版）の上部にある入力補助ツールバーに「目次」ボタンを追加しました。記事の見出しから目次を自動的に作成する「目次記法」をワンクリックで挿入できます。どうぞご利用ください。 「目次」ボタンをクリックすると、本文に「目次記法」が挿入される 目次を自動で作成するには、記事編集画面に[:contents]という文字列（目次記法）を入力する必要があります。入力補助ツールバーの「目次」ボタンをクリックすると、編集中の記事のカーソル位置に目次記法が挿入されます。 目次記法について詳しくは、はてなブログ開発ブログの以前の告知などを参照してください。 記事中の見出しから目次を自動的に作成する「目次記法」を追加しました - はてなブログ開発ブログ ※目次記法や、次のid記法など一部のはてな記法は、記事編集画面のモード（見たまま、はてな記法、Markdown）によらず利用できま
バズる記事を書きたいブロガーへ、手っ取り早くバズを起こす方法を暴露する
www.flickr.com 「バズる」という言葉は近年ネット界隈でよく聞かれるようになった。この「バズる」という言葉における「バズ」とは元々英語の「Buzz」から派生している。Buzzは日本語における擬音語に相当し、「ハチがぶんぶん飛び回っている音」、「ざわざわ騒がしく噂話をする」といった意味で使われている。 ネット上では、ソーシャル（TwitterやFacebook、はてなブックマーク等）を中心にコンテンツが大きく拡散した際に使われる言葉である。 バズらせる方法 はてなブックマークにおけるバズ はてなブックマークで拡散されるための環境作り はてなバジェット はてなブックマークでのバズを定期的に起こすための環境 バズりやすい環境 Twitterでのバズ Facebookでのバズ 短期間で定期的なバズをもたらすブロガーになるためには？ インフルエンサー 定期的にバズを起こすには？ バズらせ
h3タグをh2に変更するとアクセスが増える? はてなブログのSEO対策 - シロッコの青空ぶろぐ
目次 h3タグをh2に変更するとアクセスが増える? Chrome拡張機能を作ったのは「蕎麦湯」の人だった ポジ熊さんは「ブログアドバイザー」 追記：アドセンスの位置が下にまとまってしまった問題 h3タグをh2に変更するとアクセスが増える? 昨日、はてなブログで『ポジ熊の人生記』を書いているポジ熊さんが、h2タグを修正するとアクセスがアップするということをツイートしていました。 ツイートからたどるとポジ熊さんが過去にこんな記事を書いていました。 はてなブログ大見出しはh3だからh2に直そうよって話 - ポジ熊の人生記 そうなんでしょうか・・・アクセスがアップしたという人がいるのですから、やってみる価値はあります。 この記事の中に、指定した範囲の文字列を一発でh2にするアドオンが紹介されています。 それがこちら。 はてなブログ編集用のChrome拡張機能を作りました（使い方の説明） - NO
Vol.36 はてなブログ村のまとめ - 『 30代童貞無職男性が婚活に失敗しないアドバイス - きなこ猫のスッキリ生活 』など 16件 - nasust life blog
こんにちはnasustです。 自分が注目した記事をピックアップして配信します。 記事には自分のコメントと、はてなブックマークの人気のコメントを載せています。 30代童貞無職男性が婚活に失敗しないアドバイス - きなこ猫のスッキリ生活 nasust ブクマするしかない!! kinako222 もうきよねこさんでいいと思う tail_y しっかりした漫画でブログ界隈の壮大な身内ネタを見せられるという新鮮な体験をした…。 masumizaru お前これだけ漫画が描けるのに、なんではてなで燻ってんだよ。本来の戦場で戦え。 kybernetes こういう馴れ合いはコミュニティが成熟してきた良い傾向だと思う．ただ，一言言いたいのは，俺はまなみさんという女性とみどりさんという女性を好きになって失敗したことがあるので，この記事を読むのが辛いんだよ… x-goblin マンガ上手すぎるwww はてなブックマ
スマホでやるべきalt属性、title属性対策 - 図描きの備忘録
スマホでもSEO対策 ※2016年4/12 はてなフォトライフの仕様変更によりソースコードの修正を行っております。と参考元のvarさんに教えて頂きました！ ありがとうございます！ 4/12以前にブックマークレット作成した人は作り直しをお願いします！ こんにちは！ エカキオです！ はてなブログで画像を貼り付ける時、はてなフォトライフという機能を一般的には使用しますね。 通常通り貼り付けると、特に意味のない文字列でリンクが貼られます。 ただ、それはSEO的にはあまり良くないと有名ブロガーのB-CHANさんも言っています。 www.b-chan.jp 前々から、何か対策を使用とは考えてはいましたが、見たままモードでhtmlを編集するのも大変だしなぁと思って、とりあえず放置してきました。 そこで、先日購読しているブログの中で興味深い記事が！！ www.aritai.net さっそく読ませて頂きまし
WordPressじゃなくて、はてなブログProにしてみた。 - 45 For Trash
ブログを書くのは初めてではなく、既にWordPressでやっているブログもあるのだが、今回ははてなブログにしてみた。 なぜWordPressではなく、はてなブログなのか。 沢山はてブされているのが羨ましかった。 WordPressとの比較。 はてなブログProにしたわけ。 独自ドメイン キーワード自動リンク、広告表示 はてなブログProは高い？ なぜWordPressではなく、はてなブログなのか。 沢山はてブされているのが羨ましかった。 はてな自体あまり使っていないけれど、ブログが沢山はてブされている感じがちょっと羨ましかった。 WordPressでやっているブログの方も、そこそこブックマークされると馬鹿にできないようなアクセスがある時もあるし、今更ながらはてブの力が気になった。 あまりSNSを上手に使えない性質だけど、はてなだったらもう少しアクティブに使えるかも知れないという気もしたし。
はてなブログProの独自ドメイン設定とテーマBlankのCSSカスタマイズメモ - 45 For Trash
とりあえず、はてなブログProを始めて記事を書き始めるまでの簡単な流れを書いておく。 はてなブログProを独自ドメインで始める。 テーマは超定番のBlankを選択 背景画像 ブログタイトルとブログの説明 ブログタイトルとブログの説明をセンターに ブログタイトルの文字サイズを大きくし影をつける ブログの説明の文字色を白に 文字の大きさ 見出しまわり h3、h4、h5を太字に h3、h4、h5の背景、ボーダーなどの装飾 margin サイドバー幅変更 はてなブログProを独自ドメインで始める。 はてなブログを始めるにあたっては、 はてなブログ（無料）にまず登録。 ダッシュボードのはてなブログProのリンクからProに登録 2-1. はてなポイントを購入（俺はクレカで購入） 2-2. はてなポイントで支払い（俺は2年分14,400円を支払い） 独自ドメインの設定 3-1. ドメインの取得（俺はs
はてなブログのCopyright（コピーライト）の年度表記をjavascriptで自動更新。 - 45 For Trash
非常に些細な部分だけど、Copyright（コピーライト）の年度表記の更新を忘れるので自動更新できるようにするという話。 Photo credit: © 007 via VisualHunt / CC BY Copyright（コピーライト）表記には更新年度も入れたいけど忘れる フッター部分に表示するCopyright（コピーライト）表記。 Copyright © 2015-2016 45（しごう） All Right Reserved. みたいなやつ。 この年度表記、本当は発行年だけ書いておけば良いみたいだけど、なんとなく習慣上更新年も表記しておきたい。 でも、絶対忘れる。 javascriptで更新年度表記を自動更新 WordPressのサイトでは、PHPで更新年が自動的に切り替わっていくようにしているが、はてなブログではどうか。 はてなブログでこれをやるなら、たぶんjavascrip
はてなブログでシンタックス・ハイライトを使いたくてMarkdown記法の超抜粋チートシート。 - 45 For Trash
ソースコードなどを表示する際に、構文に応じた色分けをするシンタックス・ハイライト。プログラマでもWEBデザイナーでもないのでそんなに使わないけれど、たまには使う。 前の記事でたちまち必要になり、はてなブログでシンタックス・ハイライトを使う方法を探してみたら…。 シンタックス・ハイライトははてな記法かMarkdown記法でのみ。 Markdownを覚えることに 参考にしたMarkdown記法チートシート とりあえず覚えるやつ 見出し Markdown記法での書き方 置き換えられるHTML このブログでの見た目 リンク Markdown記法での書き方 置き換えられるHTML このブログでの見た目 段落 Markdown記法での書き方 置き換えられるHTML このブログでの見た目 改行 Markdown記法での書き方 置き換えられるHTML このブログでの見た目 引用 Markdown記法での書
はてなブログでレスポンシブデザインにしたら設定メニューのチェックも忘れずに。 - 45 For Trash
このブログにあてているテーマは今のところレスポンシブデザインのBlank。 ところがスマートフォンでアクセスしてみると、なんだか違う。なんだ？ Photo credit: ZERGE_VIOLATOR via Visual Hunt / CC BY テーマを適用しただけではレスポンシブにならない デスクトップPCでの表示 スマホでの表示 ヘッダー付近 フッター付近 一箇所チェック入れるだけで解決 逆もありかも テーマを適用しただけではレスポンシブにならない テーマを適用した直後の見た目を見てみよう。 デスクトップPCでの表示 スマホでの表示 ヘッダー付近 はてなブログのツールバーも表示されているし、画像などの見た目も違う。 フッター付近 はてなブログの広告が表示されていたり、フッターのコピーライト表記も違う。 そして、赤丸のところにPC表示への切り替えボタンがある。 つまり、選択したテーマ
自分の記事がはてなブックマークされたのをfeedlyウィジェットで知る - 45 For Trash
はてなブログを始めたからには、はてなブックマークされたい。今日はまだ開設3日目だからはてブ０だけど、いずれはされたい。正直たくさんされたい。だってはてなブログだもの。 かといって、自分の記事がブクマされているかどうか､いちいちはてなを訪問して「あなたへのお知らせ」で見るのも面倒。だけど、はてブされたのに気づかないのもイヤ。どっちやねん。 Chrome拡張の「はてなのお知らせ」 自分のブログへのはてブのフィードを知る androidスマホではfeedlyのウィジェットがいい感じ。 メールで受け取れる方法は見つけられず feedlyのウィジェットがちょうどいい Chrome拡張の「はてなのお知らせ」 Chrome拡張の「はてなのお知らせ」なら、はてなにアクセスしなくても自分のブログにはてブがついたこと、はてなスターがついたことなどの知らせがプッシュ通知で来る。 www.hatena.ne.jp
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://www.okuni.me/entry/profile-like-a-sango
