部屋をかたづけようよスマートフォン用の表示で見るたまには部屋をかたづけようよ部屋を片付けせなあかんと思いつついつも放置プレイ。そんな自分の日々の想いをつづった日記系ブログですよ?Home最新記事タイトル一覧ブログ紹介サイドバーへフォトギャラリーお使いのブラウザがJavaScriptがオフになっている場合、正しく閲覧できない場合があります。最近書いた記事2013-10-12はてなブログのリアルタイムプレビューに自分のブログのCSSを適用する方法ブログについて初めに『はてな記法モード』と『Markdownモード』の2つの編集モードは『見たままモード』と違い、プレビューしないとブログでの表示イメージが確認できません。そのため”リアルタイムプレビュー”という機能があるのですが、このリアルタイムプレビューがまた微妙で、自分のブログのCSSが適用されないため、本来の見た目とまったく違って見えてしまいます。自分は常々『これ、なんとかならんのかなぁ』と思っていたんですが、たまたまリアルタイムプレビューにCSSを適用する方法を発見した*1ので紹介します。記事訂正についてのお詫びいつの間にか、この記事で書いたことが効かなくなっていたのですが、久しく自分のブログを見ていなかったため気づくのが遅くなりました......。原因は、はてなブログ側のCSSリンクURLが変更になり、以下のhref="/style/css"が無効になってしまったためです。解決方法は、hrefを有効なURLに変更してやればいいのですが、ちょっと手間がかかります。各自のブログを表示させた状態で、ブラウザの機能を使ってHTMLソースを表示させます。blog_styleという文字を検索し、見つかったURLで置き換えます。例)当ブログの場合href="https://blog.hatena.ne.jp/-/blog_style/11696248318753273899/f6e9ffd297fd52eef5e02f0a09b9801fc500e973"このURLでhref="/style/css"を置き換える。href="https://blog.hatena.ne.jp/-/blog_style/11696248318753273899/f6e9ffd297fd52eef5e02f0a09b9801fc500e973"/>が、しかし。それでも以前に比べると記述すべき文字数が多くなってしまったため、本当にこれをやる価値があるのか微妙になりました......。新しい記事を作成したら、記事の先頭に以下の2行をコピペしてください。←現在はこの記述では効果がありません。上記を参照してください。white;の部分で指定している色は、ご自身のブログの文字色に合わせて見やすいよう変更してください。あと、この背景色の指定が不要なデザインテーマもあると思います。その際、この行は削除して構いません。この2行を追記するだけで、リアルタイムプレビューにもご自身のブログのCSSが適用されます。13/10/12追記:これから書くことは『Markdown記法モード』をお使いの方のみ留意していただきたい点です。white;">は削除する、という意識でお願いします。Markdown記法の仕様として『div要素などのブロック要素で囲われた部分では、Markdown記法は無効になる』というのがあるのですが、はてなブログのエディタでは、なぜかこの仕様が無視される時があります。下記に挙げた例ではMarkdown記法を使っているのですが、画像を見ていただくとわかるように、先頭にdiv要素があるにも関わらずMarkdown記法が有効(仕様が無視されている)になっています。このため自分はすっかりその仕様のことを忘れて、この記事を投稿してしまいました。white;">は削除する、という意識でお願いします。その結果デザインテーマによっては文字が見えなくなる場合もあります。自分の確認不足でした。適用例まず、CSS適用前のリアルタイムプレビューです。次に、上記の2行を追記した後のリアルタイムプレビューです。※この画像は、あくまでも自分のブログの場合で、実際は各自のブログのCSSが適用されます。一つおまけでTips他の方のブログを見ている時『このブログのデザインテーマいいな』と思ったことはありませんか?その場合、上記で紹介した行にちょっと手を加えるだけで、そのブログのデザインテーマを、暫定的に記事に適用してみることが出来ます。href="/style/css"←これのhref="と/style/css"の間に、その方のブログのトップページのURLを入れるだけです。自分のブログで例を挙げるとこうなります。href="https://bnorider-loose.hateblo.jp/style/css"/>まったく同じになるわけではありませんが、テーマストアのプレビューよりも気軽に試すことが出来ますよ。最後にちょっと手間がかかってしまいますが、これでリアルタイムプレビューがますます使いやすくなると思います。これが少しでも、みなさんのお役に立てれば、こちらとしても幸いです。最後になりますが、記事を公開するときは追記した2行を消すのを忘れないようにしてくださいね。16:00広告を非表示にする2013-10-09テーマストア制作用サンプルエントリーをMarkdownモードと見たままモード用に作ってみたブログについてこんばんは。先日、会社の健康診断を受けてきたBのりだーです。その際、胃の検診がありバリウムを飲んだんですが、そのバリウムがなんとイチゴ風味だったんです。バリウムを飲む嫌な気分が、ほんのちょっと安らいで、ほんのちょっとだけ幸せを感じました。ま、そんな前置きはどうでもよいですね(笑)それはさておき、ここのところずっと写真ネタが続いていたので、たまには違うネタで攻めてみたいと思います。今回は、はてなブログにおける編集モードに絡んだネタです。600Fある日の朝の通勤途中のことだった。太陽が昇りつつある東の空をふと見てみると、この写真の風景に出会った。空は青く、しかしまだ太陽が昇り始めて間もないため、地平線にはまだ朝焼け色が残っている。このグラデーションがとてもきれいで、実はこの時、電車の時間が迫っていてあまり時間がなかったにも関わらず、思わず立ち止まり急いでコンデジを取り出し、この風景を写真に収めた。前回のエントリ記事(未来に続く希望の道)の写真を撮った後、停めていた自転車にまたがり帰ろうとした時、その目の前に広がる風景がふと目に留まり、思わず写真に収めたくなった。して撮影したのが冒頭の写真だ。モノクロJPEG撮影ここは前回のエントリ記事(津波被害に抗えなかった木)の場所から500mくらい離れたところにある、海岸沿いの堤防の上から撮った写真だ。プロジェクト』という計画により急ピッチで復旧がなされ、今年の3月に完成したばかりだ。自分は震災後初めてここに来た。モノクロJPEG撮影ほとんど枯れかかってしまっている3本の木。ここは宮城県にある仙台空港そばの風景だ。ここにはアパートがあり、この木馬はそのアパートの小さな遊び場に設置されていたものだ。RAW現像たまたま朝早く目が覚めた日があった。その時、外は既に明るかったが、日の出はまだのようだった。窓から外を眺めると少し霧が出ていて、ふと自宅そばの公園の木々を見ると、それらが霧で霞んでいい感じに見えていた。600Fまず最初にお断りしておく。自分はこの写真を明らかな失敗写真だと思っているが、これが今回の話のいいきっかけになると思いあえて載せた。06:00広告を非表示にする次のページProfileid:BNorider共感してもらえる記事を書くよう日々心がけてます。いいこと書くのでチェックよろしくね。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。