デザイン
Amazonアソシエイトの画像をそのまま貼り付けると左寄せになってしまいます。 それを自動的にセンタリングするCSSを作ってみました。 imgタグをブロック要素にしてセンタリングする 解除する場合 imgタグをブロック要素にしてセンタリングする 画像リンクを…
Amazonアソシエイトのバナーを貼り付けるときに、そのままだと左に寄っているのを自動的にセンタリングするCSSです。 アソシエイトのiframeを指定してセンタリング センタリングを解除する場合 style属性で指定する ブロック要素で囲う アソシエイトのiframe…
Markdown記法を使用していて、divタグなどで囲うと無効化されてしまいます。どうやらこれはMarkdownの仕様のようです。 Markdownをブロック要素に書いてみる はてな記法は有効 ブロック要素で無効化されるのはMarkdownの仕様 インライン要素の中では使用でき…
所謂、よく見るこういうものです。 ・チェック例です CSSの修正 適用範囲を広げる Markdownを使用できるようにブロック要素にする 種類を増やす 最終的なCSS 設置 記事で使用する こういったカスタマイズははてな記法やMarkdownが便利 CSSの修正 ベースとな…
MarkdownでプログラムやHTMLなどのコードやスクリプトを表記する方法です。 「```」(バッククォートの3連続した行」で囲む 「```」(バッククォートの3連続した行」で囲むと、そこがコードの表記とされます。 例えば次のような表記だと、 ``` <html> <head> <title>テストページ</tite> </head> <body></body>…
各カテゴリへのシンプルなメニューバーをつけてみました。 こういうやつです。 ブラウザのサイズがメニューより小さくなるとスクロールに切り替わります。(主にスマホ向け) 設置方法 ゆきひーさんの以下のスクリプトを使用させていただきました。ありがとう…
staff.hatenablog.com より。ブログのトップページを一覧形式にできるようになったみたいです。 だいぶ待ち望まれていた機能ですね。そしてProのみ。 一覧表示とはつまり「月別アーカイブ」 具体的にどういった表示かといいますと、「月別アーカイブ」で見え…
はてなブログの目次を折りたたんで表示する方法です。 …といっても、すでにだいぶ広まっているものなので自分メモみたいなリンク。 目次を折りたたむ はてなブログでは「[:contents]」と記述することで、目次を自動生成してくれる機能があります。 しかし項…
はてなブログで使用した画像を自動的にセンタリングする方法です。 画像が左に寄ってしまっているのはずっと気になっていて、またCSSでなんとかできるだろうなあと漠然と考えていたのですが結局放置してしまっていましたけれど、いろいろ見直すなかでやって…
「見たままモード」から「はてな記法」や「Markdown」へ、またはその逆など、はてなブログの編集モードを後から変更するための方法です。 といってもコンバート (自動変換) をすることはできません。別の記事を新しい編集モードで書いて、URLを入れ替える方…
はてなブログはAMPにしてもAdSenseが表示できないという話がずっとあったのですが、ふとしたところから実は表示できるのでは、という話があったので対応してみました。 AdSenseのAMP対応 参考にした記事は以下の二つ。 www.weblog-life.net 30cm.xyz あと、G…
はてなブログのMarkdown記法で使っているソースコードの配色を変えます。 デフォルトでは背景黒のものなのですけど、個人的には白が好みなのです。 CSSの変更をする 例えば変更前はJavaだとこんな感じ。 こちらのサイトを参考にしてCSSを変更していきます。 …
