はてなブログ

Google AdSenseのダブルレクタングルをスマホ表示の時に片方だけ消す方法

ブログの記事下にアドセンス広告を横に2つ並べて表示している人は多いですよね。いわゆるダブルレクタングルというものです。これ、スマホ表示の時にどうしてますか? スマホ表示の時も無理やり横に並べることはできますが、それでおかしな横スクロールが発…

プロフィール部分をマテリアルデザインのアレっぽくしてみる

前回の記事でサイドバーにあるプロフィール画像を丸くしてみたので、ついでにその部分をもう少しカスタマイズしてみました。なんかマテリアルデザインによくあるっぽい感じです。

はてなブログのプロフィールアイコン表示を丸くする

Twitterのアイコンが丸くなってしまって、少しの間私のタイムラインが騒がしくなっていました。Twitterが丸くなったのなら、はてなブログのアイコンも丸くしたいな、という人のためのカスタマイズです。

関連記事と記事下の順番を変えたり、いろいろカスタマイズ

はてなブログに自動で「関連記事」が表示され始めたので、前回サラッと見てみました。それで、その時は「関連記事が記事本文の直下にあって使いにくい、カスタマイズした記事下と入れ替えたい」みたいに書きましたが、あっさりできたので共有します。

はてなブログの記事下に「関連記事」が表示されるようになりました。が…

2017年6月13日から、はてなブログの記事下に「関連記事」がデフォルトで表示されるようになりました。これまでサイドバーに表示できたものとは、場所だけでなく仕様が少し異なります。

アイキャッチを記事全体の背景にしてなんかいい感じにするカスタマイズ

前回の記事で記事タイトルの背景にアイキャッチ画像を敷いてみました。同じように、記事全体の背景としてアイキャッチを使ってみます。記事ごとに背景が変わるので、なかなかカッコイイですよ。

アイキャッチをタイトルの背景にしてなんかいい感じにするカスタマイズ

アイキャッチ画像を暗くしてタイトルの下に置き、なんかカッコいい感じにカスタマイズします。

はてなブログProでトップページを一覧表示にして更にカード型にするカスタマイズ

はてなブログProでトップページを一覧表示できるようになったので、それを使ってカード型のレイアウトにするカスタマイズを考えてみました。残念ながらcssだけでは思うようになりませんが、いくつかのコピペだけでできます。

はてなブログProでトップページを「一覧表示」にできるようになった…けど

6月1日に、はてなブログProにおいて、トップページを「一覧表示」にできるようになりました。これまでもjavascriptでarchiveページに飛ばしている人がいましたが、それをやらないでも良くなったということです。

ブログにアップしたはてなフォトライフの画像は削除しても残ってる?

はてなブログで画像のアップロード先にもなっている「はてなフォトライフ」ですが、ここにアップロードした写真がフォトライフ上から削除しても実際には削除されていないのではないか?と思い始めました。

カテゴリごとの新着記事一覧をトップページに出す(メモ)

前に書いた「別記事内に書いたテンプレートを呼び出して記事内に表示する」を使えば、トップページにカテゴリごよの新着記事一覧を表示できるのでは?と考えたのでメモ。

源界明朝フォントをブログのタイトルに使ってみよう!

先日、フロップデザインさんからまた魅力的なフォントが公開されました。今回のフォントは源ノ明朝の派生フォントで個人利用・商用利用にかかわらず、無償で使用することができます。

はてなブログの編集モード、どれをつかう? 私はMarkdown

はてなブログには3つの編集モードがあります。はてなブログのみなさんはどの編集モードを使っていますか?というアンケート付きの記事がありました。

たった2つのcssだけでサイドバー最下段のモジュールを固定する

いろいろ限定的で誰にでもオススメできるわけではないカスタマイズをもう1つ。よくあるサイドバーの最下段のモジュールが画面トップに来たら位置固定されるものです。通常はjavascriptとか使うのでしょうが、cssだけでもある程度は可能です。

はてなブログで画面サイズごとに複数のテーマを使い分ける方法

需要がある気がしないはてなブログのカスタマイズ(?)です。1つのブログで2つのブログテーマを使います。大画面の時はDUDE、スマホなど画面が小さい時はInnocent、みたいな事ができます。

はてなブログで使われているテーマが何か調べる方法

質問系サイトってブログネタの宝庫ですね。はてなブログに関する質問で、そのブログで使われているテーマを調べる方法はないか、というのを見かけました。これは簡単です。

はてなブログで別記事内に書いたテンプレート文を呼び出して記事中に埋め込む方法

ブログ記事を書いていると稀に、ほかのファイルにテンプレートとなるものを書いておいて、それを呼び出して記事中に埋め込みたい時があります。複数の記事から同じテンプレート文を呼び出して使い、修正が必要な時はテンプレートの元文章を直せば、その1箇所…

はてなブログで日付の表示内容をカスタマイズ-曜日追加や月の英名表示など

はてなブログではトップページや個別記事で投稿の日付が表示されますが、デフォルトではその形式を選んだりすることができません。なのでcssやjavascriptを使って強引にカスタマイズしてみました。

はてなブログでカテゴリごとに違うcssを適用させる(メモ)

はてなブックマークのトップみたいに、カテゴリごとにボーダーの色を変更とかできないかな?と思ってたのですが、なんとなくできそうなのでメモメモ。ただし運用で何とかするものなのでそういうテーマとかではないです。

高度なカスタマイズを使ってサイドバーにそれぞれの記事のシェア数を表示する (未完成)

しばらく前に、はてなブログのサイドバーで「高度なカスタマイズ」というものが使えるようになりました。これを使って、「最新の記事」などでリスト表示される記事それぞれのシェア数を表示できないかなーと思ってやってみました。まぁ、結果から言うと未完…

はてなブログでアイキャッチ画像を使って「この記事が気に入ったらフォロー」を設置

はてなブログで「この記事が気に入ったらフォロー」を設置する方法です。アイキャッチ画像を使うので、記事の最初にメイン画像がなくても使えます。

はてなブログカスタマイズ初心者こそ使って欲しい、テスト用ブログのススメ

最近はてなブログのカスタマイズをやっているからか、はてブを見ていてもそれ系の記事に目が行くようになりました。そんな中には「それ、わかってないで書いてるでしょ。参考にされたら困るよ、これ」な記事もあったりで、色々思うこともあるのです。

はてブボタンを押すと「URLが正しくありません」と出るようになったので修正

いつからだったのかはわからないのですが、このブログにあるはてブボタンが一定の条件だとうまく機能していませんでした。いくつか調べて、とりあえず修正できたので今は大丈夫なはずです。

はてなブログテーマ「CARTA-YEL」をテーマストアに投稿しました

前々からちょっとリクエストを受けていた「GIGAZINEみたいなテーマ」を作りました。「みたいな」どころかもろにパク模倣している感じです。

はてなブログのcssをDropboxに保存して編集しやすくしよう

はてなブログのcssをカスタマイズする時、デザイン設定から編集しますが、これがなかなか使いにくいです。そこで、cssファイルをDropboxに保存し、それを読み込ませるようにすることで編集しやすくできます。

お前…パクリテーマ作者かよ…

さっき投稿した新しいテーマについての記事なんですけど、はてブ付いてたのでコメントを読んだんですね。そしたら…

はてなブログのテーマをまた作ってみた(未リリース)

こういうのも欲しいよなーと思ってたテーマをまた1つ作ってみました。今回はかなりシンプルで落ち着いたデザインを目指したモノ。

デベロッパーツールもそんなにアテにならないのね

おかげさまでZENO-TEALは何人かの方に使っていただけているようで。で、不具合の報告なんかもいくつかもらっています。やっぱり自分以外の人のやり方で試してもらうのは必要ですね。

はてなブログテーマ「ZENO-TEAL」をテーマストアに投稿しました

以前より何回か書いていた、はてなブログ用の公開テーマ「ZENO-TEAL」をテーマストアに投稿しました。問題なければインストールできるようになっているはずです。

はてなブログで記事タイトルの前に画像を表示する方法

カード型デザインのはてなブログ用テーマZeno Teal(仮)は、もう少ししたら公開できそうです。とりあえずそのテーマのキモとなっているカード型デザインの「タイトルの上にアイキャッチ画像を表示する」方法について解説します。

はてなブログテーマ作成の進捗:カード型が少ない理由がわかった気がする

先日少し書いた、はてなブログの公開テーマ作成の進捗状況です。だいたいできてきました。あとは表示を確認しつつ、テーマを使った上でのカスタマイズ項目なんかをサンプルエントリーとして追加したり、それに合わせて追加・調整していくだけです。

はてなブログの公開用のテーマ(カード型トップページ)を作成中です

なんだか今日は妙な気分です。やるせないというかなんというか。今やりたいことはこれじゃないんだけど何がやりたいのかわからない、でもここじゃない、みたいな気持ちで悶々としています。

はてなブログでふい字が使えたのでメモ風cssを作ってみた

はてなブログでウェブフォントとして使えるアイコンフォントが用意されているということは知っていましたが、日本語の手書き風フォント「ふい字」も用意されているということを知りました。ので、さっそく使ってみました。

はてなブログの画像が勝手にリサイズされたりしてけっこう面倒だという話

ちょっとしたことからはてなブログの画像挿入に関して変な仕様に気づきました。ヘルプなど見ればちゃんと書いてあるみたいなんですが、まぁ読んでみてもちょっと面倒だなーと。

ブログデザインの微調整:フォントサイズや余白、行間を調整して読みやすく

基本的なテーマを変更してからも、細かい調整を続けています。今日はちょうどほかのブログで読みやすくするとかそういう話題を見かけたので、最近の私が気をつけている「読みやすさのためのcss」について。

ブログのテーマを明るくリニューアルしてみました

このブログのテーマを新しくしてみました。公開されているものではなく、すべて自分でcssなどゴリゴリしています。前のも同じように自分で作っていたのですが、どうにも自分で見ていて「狭い」というイメージがあったもので…。

Android版Chromeでアドレスバー(アクションバー)の色を変える方法

Android版のChromeでは、ウェブサイト側の設定でアドレスバー(アクションバー)の色を変えることができます。はてなブログを始めるにあたっていくつかデザインカスタマイズ系の記事も読んだのですが、ここに触れているブログはあまりないようです。

Fontelloで作成したフォントをDropboxに置いてはてなブログでアイコンフォントとして使う方法

前回Fontelloで作成したフォントですが、cssだけで表示しようとすると意味不明な文字列がめちゃくちゃ長くて困ります。なので普通にフォントファイルを置いて使うことにします。

自分の好きなアイコンだけを選んだウェブフォントを使う方法

前回、はてなブログで最初から用意されているアイコンフォント(ウェブフォント)の一覧と使い方を書きました。しかしその中にはFeedlyのアイコンが入ってなかったりと、自分的にはいまいち足りないものでした。今回は自分で好きなアイコンを選んでフォント…

はてなブログで使えるアイコンフォント(Webフォント)116種類

はてなブログでいろいろ書こうと思って、数記事書きながらテーマのカスタマイズにも入っています。その中でアイコンフォントを使いたいと思っていたけど、どうやらはてなブログではデフォルトでいくつかのアイコンフォントを読み込んでいるようです。それを…