カテゴリー
General はてな ブロンプトン

やばい…給水しないで乗ってました…。自転車に乗って逆に不健康になったを読んで。

すごいバズっているこの記事を読みました。

オレもやばい…

帰り道、出来るだけキレイな路面で直接を選んでいるのですが、延々と40分くらい給水しないで乗ってました。タイミング的に、自分への注意喚起としてはすごくタメになった記事です。

photo by .mw

ブロンプトン(自転車)に乗って通勤は楽しすぎる

ゆえに補給を怠ってしまうのか…。というより、自転車に乗ることが通学自転車のような意識レベルで始めてしまうからいけないのかもしれない。ミニベロだってそれなりに漕いだらそれなりに体力使うし、運動と捉えたら補給して当然ですよね。もはや自己管理不足としか言いようがない…反省です…。

ブロンプトン用のボトルホルダーが欲しい

色々なブログを読んでいると、100均のものを工夫して取り付けていたりしていますね。まずはそこから始めてみようかな。本当はTバッグをフロントにつけちゃえばいいのだけど、まだ、買えない…w

通勤気をつけます!ではまた!

カテゴリー
General はてな

はてなブログでの見出しデザインと目次表示、シンタックスハイライト

はてなブログは、WordPressのようにテーマを着せかえすることができます。自分が使っているテーマは「Written」というテーマで、とてもシンプルで見やすい反面、見出しデザインがちょっと物足りなくなってきたのと、そろそろ記事数も増えてきたので休日の時間を使って少し調整してみました。

見出しデザインの設定方法

見出しにはHTMLで言うところの「h」タグが使われています。はてなブログProでは、デザインCSSを使って該当タグのデザインをCSSで設定ができるんですね。

こちらを参考にしました

「見出し CSS」で検索して、よさ気なサイトを参考にさせていただきました。

webnonotes.com

www.keni-customize.net

このサイトでの見出しデザイン

特に難しいことをしているわけでもなく、凝った見出しではありませんが、さらりとコピペしたい方がいらっしゃいましたら、ぜひご利用ください。色はお好みで変更してみてくださいね。

/* 見出し */
article .entry-content h2 {
margin:0 0 10px 0;
padding:2px 8px;
border-width:0 0 0 5px;
border-color:#6e633f;
border-style:solid;
color:#6e633f;
line-height:140%;
font-weight:bold;
}
article .entry-content h2 {
margin:0 0 10px 0;
border-width:0 0 2px 0 ;
border-color:#c9bb92;
border-style:solid;
background:#fff;
color:#6e633f;
line-height:140%;
font-weight:bold;
}

見出しデザインをスマホにも反映させる

使用しているテーマがレスポンシブデザインに対応している場合は不要ですが、そうでないテーマを選択している場合は、スマホデザインにも個別にCSSを適用してあげる必要があります。

スマホ用のデザイン設定から、ヘッダのタイトル下に、下記のように記述します。

<style type="text/css">
ここにPC版で使用しているCSSをコピペする
</style>

これで概ね同じ見た目になるはずです。

目次を表示させる方法

記事を書く際、見出しを文節のように使うことが多いのですが、IIJからdocomoへの移行記事など、手順を説明するような記事の場合は目次があった方が見やすいですよね。SEO的にも目次があったほうが良いそうです。

www.b9-design.net

そこでググってみたところ、下記の記事を参考に設定したらあっという間に出来てしまいました。(すでにデザインCSSをカスタマイズされている方は、適宜ソースコードを変更する必要があります)

nohack-nolife.hatenablog.com

はてなブログでは、CSSとJSをこんな風に使えるんですね〜。しかもクリックすると、スルスルっとスクロールしてくれます。CSSのスタイリングは今後もう少し詰めるとして、あっさりと設置できるので未設置の方は試してみてはどうでしょうか?ただ、目次表示の判定がh2タグ(スクリプトいじれば変更できます)なので、これまで書いた記事を修正するか悩みどころです・・・。

おまけ)はてなブログでのシンタックスハイライト(markdown記法)の方法

ソースコードを記事に掲載したい場合、コピペをしやすくするための記法があります。その方法とは、バッククォート(`)を3つ打ち、その後ろに言語名、ソースコードを書いて、バッククォート3つ打って閉じる、これだけです。

こちらを参考にしました

akio-t.hatenablog.com

しばらくの間、見た目がちょこちょこと変わるかもしれません…。ではまた!

Web制作者のためのCSS設計の教科書 モダンWeb開発に欠かせない「修正しやすいCSS」の設計手法

Web制作者のためのCSS設計の教科書 モダンWeb開発に欠かせない「修正しやすいCSS」の設計手法

カテゴリー
はてな

自動リチャージ設定に気をつけろ!二重請求と勘違いしてしまった話

まず始めに、これは自分のウッカリが原因であり、はてなに非が無いことをお伝えしておきます。私と同じような目に会う方を少しでも減らせるように、備忘録として残しておきます。

photo by 401(K) 2013

はてなブログProの料金が2回課金された?!

先月、WordPressからはてなブログProへ以降したのですが、はてなブログProを利用するには「はてなポイント」の購入が必要です。はてなポイントはクレジットカードで購入し、そのポイントを消費して各種サービスの決済をするのですが、自動リチャージ(ポイントの残額が300ポイントを下回った際、自動リチャージを設定して最初に購入した金額を、翌日に自動購入する機能)によって、はてなブログPro2年分を支払った翌日に、もう一度同額を引き落とされてしまうという自体になってしまいました。

クレジットの明細で気付いた

毎月郵送されるクレジットの明細をながめていたら、はてな名義で2回引き落とされていたので気づきました。二重請求かと思い、お問い合わせページから自分の状況を説明しました。

気付いたらまず問い合わせよう

これに気付かずにいると、次回更新まで、特に使わないポイントを支払う事になってしまいます。いまはなりふり構っていられる状況ではなかったので、気付いたら問い合わせていました。

とても早く、丁寧なレスポンスをもらいました

自動リチャージによって、意図せずにポイントを購入してしまった事が伝わり、返金の手続きについて、とても早く、丁寧なレスポンスをもらいました。昨今のクールな顧客対応とは違うなぁと感じました。

手順としては、自動リチャージ設定を解除し、その後、解除した旨を担当の方に返信するだけです。

同じような方がいらっしゃいました。

自分と同じような境遇の方がいらっしゃいました。

14400ポイント復活!?自動リチャージとは? – 今日からオレは

自動リチャージ機能の悪夢。 – 雲外蒼天

正直、一ヶ月前のオンライン上の決済画面を覚えておらず、自動リチャージ設定がどのタイミングであったのか記憶にありませんでした。

はてな、やるね!

サービスを運営するなかで、色々と言われる事もあるかと思いますが、お問い合わせに対応してくださった方をはじめ、真摯に対応してくれるはてなは、使い続けるに値するなぁと、自分は感じました。

きちんと返金が完了したら、改めて報告したいと思います。ではまた!