して働くための生産性↗向上Hacksスマートフォン用の表示で見るワクワクして働くための生産性↗向上Hacksワクワクは最強のライフハックなのです。はてなブログカスタマイズ:カスタマイズの計画を立てる2017-05-25はてなブログカスタマイズ:カスタマイズの計画を立てるはてなブログカスタマイズどうも。ganapatiです。今日はカスタマイズに向けた準備を進めようかと思います。私と同じくはてなブログを始めたばかりの人の参考になればと思います。個人的に以下のようなカスタマイズを計画しています。基本的にはCSSって何?という人は難しいかもしれませんが、多少理解できる人であれば同じようなカスタマイズ計画になるかと思います。テーマをあてるテーマをあててみなければカスタマイズもへったくれもありません。調べたのですがカスタマイズを前提にしたシンプルなテーマも多いようですね。ganapatiの場合、5月25日時点ですでにZENO-TEALというテーマをあてています。テーマファイル(CSS)を入手するテーマをあてて、ブラウザのデベロッパーツールを使って細々とカスタマイズのCSSを考えていっても良いのですが、そもそもテーマがどのようなデザインを持っているのか、機能を持っているのかをできれば理解してから始めたほうが良いです。理解していないと無駄な作業が発生したりしますので。そこでテーマファイルを入手します。はてなブログはCSSをベースにしたファイルのようなのでスタイルシートと呼んでも良いかもしれません。※もちろんテーマのデモサイトでかなり詳しく説明がなされていれば必要ないかもしれません。やって入手するかというと、デモサイトや製作者のサイトで配布していればそこから前述で入手できなければデベロッパーツールを利用してコードを読み込むのどちらかになります。ZENO-TEALの場合、デモサイトのフッターエリアにてダウンロードリンクが表示されているのですが、実際にダウンロードしたら以前のバージョンの要だったので後者の方法で入手しました。詳しくは別途記事を書きます。ZENO-TEALのようなある程度デザイン化されたテーマの場合、カスタムCSSを個別に充ててもうまく思い通りにデザインできないことがあります。いう場合は、元のテーマファイルを編集して自分用のテーマとしてアップロードして使用したほうがうまくいきます。カスタマイズしたい要素をリストアップする次に実際にカスタマイズしたい要素はどのようなものかリストアップします。4のステップと前後するかもしれませんが、デモサイトや導入済みのブログを見て「この部品は変えたいな~」とか「これを真似したいな~」とか考えると良いでしょう。念のため以下のようなものから考えると良いです。ブログカードタグクラウドAuthor写真テーマのCSSを見て、テーマ専用の部品から例えば同じ太字でもクラス指定で複数パターンを作っているようなものもあります。スタイルガイドを作成する実際には3と同時並行する作業になるかもしれません。スタイルガイドを作成します。ここで言うスタイルガイドとは、見本ページのようなものです。具体的には3でリストしたものをサンプルページのような形で1ページの中に全部配置するだけです。公開しても非公開でもどちらでも構いません。このスタイルガイドを作るメリットはいくつかあります。自分の今のテーマとカスタムCSSでどのように表示されるのかすぐわかる忘れたころにデザインを確認できる画像として保存しておけば変化の変遷が分かるこんなところです。分析できるようにする最初からやる必要はないかもしれませんが、GoogleAnalyticsのような分析系サービスのコードを埋め込みます。はてなブログは設定画面でできるので楽ちんです。広告を設置するこれも最初からやる必要はないのですが、せっかくなので広告を設置します。このあたりなのでしょうが、他にもいろいろあるようなので検討しても良いかもしれません。広告を貼るのはどうかなと・・・個人的には思います。PVが1万/月を超えてからでも十分だと思います。部品を使いやすくするブログのカスタマイズとは少し異なるのですが、実際にブログを投稿するようになると頻繁に使う部品のようなものが出てきます。コードを入力する必要があるものはいちいち入力していると大変です。そこでCliborのようなコピペ支援ソフトを使用して、特定の部品を登録し、呼び出して使えるようにします。ヘッダーエリアやフッターエリア、サイドバーで表示する内容を再検討する投稿数が20を超えてくると、カテゴリ表示を生かしたいとか、特定の投稿を注目記事として表示したいとかそういう願望が出てきます。なってきたらヘッダーエリアやフッターエリア、サイドバーなどに手を入れていきます。こんな感じでカスタマイズの計画を立て、1~2か月かけてじっくりカスタマイズしていくと良いのかなと思います。「ワクワクこそ最強のライフハック」を合言葉にワクワクするネタ探しの日々。(2)関連記事2018-01-31はてなブログの常時HTTPS化に関する考察2018-01-31はてなブログを常時HTTPS化するまでの全手順(2/1修正:検証中)2018-01-30はてなブログをHTTPS化できた!2017-10-24非エンジニアの私がはてなブログテーマを公開するまでやった全工程2017-10-233カラムレイアウト対応のはてなブログテーマ「Focus」を公開しました。▲はてなブログをはじめよう!ganapati55さんは、はてなブログを使っています。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。