【0からはじめるブログデザイン】CSS初心者でも活用できるこだわりデザインカスタマイズの記事を集めました！ - 週刊はてなブログ
はてなブログでは現在「デザインテーマコンテスト」を開催中です！ そこでCSSに馴染みのない方も挑戦しやすいよう「0からはじめるブログデザイン」と題し、簡単なデザインカスタマイズからデザインテーマ作成まではてなブロガーさんのアイデアが詰まった記事をご紹介する連載を始めます。 第1回となる今回は、CSSって難しそう……と感じている方に向けて、簡単な「デザインカスタマイズ」を紹介した記事を集めました！ ほとんどがCSS初心者も活用できるものばかり。是非参考にしてみてください。 記事の印象をガラッと変える、オリジナル目次の作り方 記事のアピールポイントを好きな色で強調 ブログにおいてユーザーが一番目にするものといえば文字！ 文字を自分の好みにカスタマイズする方法 人気テーマの作者が紹介する「サイドバーカスタマイズ」 【超個性派】CSSの知識0、コピペのみで行ったオリジナルブログデザインの制作過程を
【はてなブログ初心者に読んでほしい】PVを増やすための設定・カスタマイズ【やることリスト】 - おおまめとまめ育児日記
おおまめです、こんにちは。 ブログを始めて一年が経過しました。 全くと言っていいほどブログの知識がなかった私ですが、勉強して、少しずつ成長しているなと感じています。 初めてのブログは検索流入(GoogleやYahoo!から検索でブログを訪れてくれる)が発生するまで丸2ヶ月かかりました。 しかしこの知識を活用し、新しく立ち上げたブログでは1ヶ月目から検索流入が発生しました！！(歓喜) ブログを始めたけど何から手を付けたら良いかわからない… そもそもしないいけないことがまずわからない そんな方に見ていただけたらと思い、この一年で身につけた知識を公開致します。 ブログを今から始めようと思っている方やブログを始めたばかりの方の手助けになれるよう「やることリスト」をまとめましたので是非ご覧ください。 ワードプレスや他のブログサービスを使用している方でもブログをやるなら知っていた方が良い知識もあります
【はてなブログ】基本のカスタマイズまとめ＊テーマをUnderShirtにしました！ | まとまるデザイン
はてなブログを始めてすぐぶつかったのがカスタマイズの壁。 「難しいことはわからないけど、カスタマイズして自分らしいブログにしたい！」 と思い、いろいろ調べてやってみましたが思い描くようなイメージにはならず……。思い切ってテーマを変えることにしました。 カスタマイズも0からやり直しです。 この記事では、初心者の私ができる範囲で頑張ったカスタマイズ、参考にしたサイトなどをまとめていきます。（ほとんどUnderShirt以外のテーマでも使えるカスタマイズばかり） 記事の内容 テーマの選び方 トップページのカスタマイズ（ヘッダー、フッター、トップ他） 記事内のカスタマイズ（吹き出し、装飾、ボックス他） 定型文の使い方 こんな人におすすめ テーマ選びの仕方がわからない オリジナル性のあるブログにしたい 初心者にもできるカスタマイズをしたい Undershirtのカスタマイズがしたい 当ブログは202
はてなブログでサイト内検索をしやすくするカスタマイズ方法を紹介します。 PC版ではサイドバー上部に検索窓を移動します。またスマホでもページ上部にサイト内検索できるウィンドウ枠を設置します。 更にGoogleアナリティクスとも連携して読者がどんな内容の記事を探しているのかキーワードを取得しましょう。読者が探している記事がまだサイト内に無い場合は、記事を追加していくことで網羅性を上げ、アクセス数を増やすことが可能になります。 サイト内検索をしやすくするメリット はてなブログでサイト内検索をしやすくするカスタマイズ サイドバー上部に検索窓を移動するカスタマイズ スマホページ上部にサイト内検索できるWindowを設置 Googleアナリティクスとの連携 サイト内検索のキーワードを確認する方法 サイト内検索をしやすくするメリット 記事が増えてくるとブログ形式のサイトは読者が目指す記事を探し出すのが難
こんにちは、さくさくです。 このブログではMinimalismというテンプレートを使っています。 シンプルでとても好きなデザインですが、見出しもシンプル過ぎる（笑）。 もう少し見出しが目立つようにしたくて、カスタマイズに挑戦してみました。 今は親切な人が見出しデザインのCSSを公開してくれているので、思ったより簡単でした。 はてなブログテンプレート Minimalism 見出しカスタマイズ前 文字装飾すると 見出しカスタマイズ後 文字装飾すると 見出しのカスタマイズ方法 見出しのデザインを選ぶ 見出しのタグを変更する 見出しの色を変える 気に入る色の探し方 CSSのカラーコードを変更する はてなブログの設定 スマホ用の表示は別に設定が必要な場合も スマホ版とPC版でそれぞれデザイン設定したい場合 まとめ 見出しカスタマイズ前 このブログで使っているMinimalismのテンプレート、手を加
更新日時を自動で表示させるカスタマイズをご紹介します。はてなブログでの設定方法をご説明します。 - 雨のち晴れ
こんにちは。今回はブログカスタマイズをご紹介していきたいと思います。 今回ご紹介するのはこれ！ 左の日付が記事を書いた日にち、右の日付が記事を更新した日にちになります。 更新とは記事をリライトしたり、カテゴリーを変更したりした日にちのことです。 あったら便利ですよね♪ それでは早速ご紹介していきます。 更新日時をお知らせ！ headに貼るコード Font Awesomeのコード jQuerry のコード 記事下に貼るコード デザインCSSに貼るコード さいごに 更新日時をお知らせ！ ブログを復活させてからおよそ１３０記事を書きました。まだまだビギナーだと思っています。 それでも以前に書いた記事や内容を更新した方がいい記事については、定期的に見直すようにしています。 そこで、自分の書いた記事がいつ新しい情報に更新されたのかをお知らせする機能があれば便利だなと思い、今回のカスタマイズを取り入れ
はてなブログで行った10のカスタマイズ方法まとめ 連休明けくらいからはてなブログのカスタマイズ記事を書いてきました。 他のブログを参考に様々なカスタマイズを行ってきましたが、ブログの見栄えは以前よりよくなったでしょうか？ 読者にとって見やすくなっているでしょうか？ カスタマイズももう個人的にはいじろうと思う部分がなくなってきたので、今日はこれまでこのブログで行ったカスタマイズ、全部で10+2個をまとめてみたいと思います。 はてなブログカスタマイズ 1. 広告などを中央揃えにする方法 2. グローバルメニュー 3. フォントサイズ 4. アンダーラインを蛍光ペン風に 5. 目次に「目次」の文字を入れる 6. 見出しのカスタマイズ 7. 記事リンクを枠で装飾(あわせて読みたい) 8. 吹き出しを使った会話形式のカスタマイズ 9. 記事下関連記事のカスタマイズ 10. サイドバーモジュールのタイ
はてなブログでヘッダ画像を横いっぱいに大きく広げるカスタマイズをご紹介します。Under ShirtやMinimalismで使うことができます。 - 雨のち晴れ
こんにちは。私ははてなブログの「Under Shirt」というテーマを使っていますが、今回はヘッダ画像を変更してみました。 他の「Minimalism」や「Brooklyn」等でも同じように設定ができます。 フォントも変えてみましたが、一番の変更点は横幅いっぱいに大きく広げたこと！ 縦幅も少しだけ大きくしてみました。 before after このような感じです♪ 簡単にできますので、ご紹介したいと思います。 ヘッダ画像の作成 はてなフォトライフでアップロード はてなブログでの設定 既存のヘッダー画像の消去 タイトル下の設定 さいごに ヘッダ画像の作成 ヘッダ画像を作成するといっても、今使っているヘッダを画像をそのまま使って大丈夫です。 使うのはCanvaというサイトです。無料で使うことができます。 https://www.canva.com/ サイトで右上にある「デザインを作成」をクリッ
こんにちは、さくさくです。 前記事でははてなブログ見出しデザインのカスタマイズ方法 について書きました。 今日ははてなブログ目次の作り方と、目次デザインをコピペで簡単にカスタマイズする方法をご紹介します。 目次は簡単に作ることができます。 そして目次デザインのカスタマイズもコピペだけなので、貼る場所を確認しながらやれば簡単です。 ブログの目次とは 目次と見出し はてなブログ目次の作り方 記事を書いて見出しを作る 見出しを作って記事を書く はてなブログ目次のカスタマイズ方法 レスポンシブデザインのチェックを確認 今回の目次カスタマイズ内容 PC版の目次デザインカスタマイズ 目次カスタマイズ前 目次カスタマイズ後 目次リストに数字を入れるカスタマイズ方法 「目次」の文字を追加するカスタマイズ方法 目次に背景色をつけるカスタマイズ方法 スマホ版の目次デザインカスタマイズ 目次カスタマイズ前の状態
どうも、たつとら(@tatsutora6) です。 「はてなブログ」ユーザーの方の中には、自分のブログを使いやすいようにカスタマイズをやられていたり、初心の方の中にはこれから始めようかと思っている方もいるかと思います。 ボクも時間がある時、ちょっとずつやっていて紹介もしていますが、今回はちょっとした小ネタ的なカスタマイズの紹介と以前書いたカスタマイズ記事を紹介しようと思います。 初心者の方はもちろん、これからやってみようと思っている人にも参考になるのでご覧ください。
久しぶりの『ブログ日和』 記事を書いていると、そちらに時間をとられ なかなかカスタマイズに手が回らない ろみです。 記事数は少ないですが、雑記ブログなのでトップページを見た時に これは何の記事だろう、興味がある記事はどこだろう？ 少しだけ分かりやすくするために一覧形式を取り入れてみました。 『はてなブログpro』の人は管理画面の設定ですぐに変更出来るので 私のように無料版で利用している場合の記事となっています。 簡単！コピペで出来るトップページを記事一覧にする方法 まずはバックアップ 最初の確認 おさらい レスポンシブデザインかの確認 トップを記事一覧にするコード ろみの失敗 スマホへの設定 参考にしたサイト トップページ、カスタマイズの注意点 最後に 簡単！コピペで出来るトップページを記事一覧にする方法 たくさんの先輩方が記録を残してくれているので、とても助かります。 しかもコピペ！ コ
吹き出しを使用した会話形式のカスタマイズ みなさん、こんばんは。 いろんなブログを巡回していると、たまに見かけるのが吹き出しを使った会話風の文章です。 ちょっとしたアクセントになって非常に訴求力があるテクニックですよね。 今日はその吹き出しを使用した会話形式のカスタマイズをやっていきたいと思います。 吹き出しを使用した会話形式のカスタマイズ 吹き出しとは？ 参考にしたブログ 吹き出し設置の作業の流れ 吹き出しアイコン画像のURLを取得する 貼り付けるCSSコード コード貼付け後の使い方 吹き出しを使用した会話形式のカスタマイズまとめ 吹き出しを使用した会話形式のカスタマイズ 吹き出しとは？ 漫画の吹き出しならみなさんよくご存知ですよね。 はてなブログでつくる吹き出しは左からアイコンが話す場合と、右からアイコンが吹き出しで話す場合の2通りで会話表現を作っています。 実際にどうなるか以下を参考
私が現在使用しているのは無料版はてなブログで、テーマは「UnderShirt」です。 カスタマイズの知識がない私でも、ブロガーさんのカスタマイズ記事を参考にすることで、現在のブログデザインにできました！ 初心者でもできるカスタマイズをまとめましたので、ぜひ参考にしてください♪ 全体のカスタマイズ 色を変更 アイコンを変更 トップページのカスタマイズ グローバルナビゲーション ボトムナビゲーション ヘッダー下におすすめ記事を表示 上に戻るボタンを表示 記事内のカスタマイズ 目次 見出し 囲み枠 吹き出し まとめ 全体のカスタマイズ テーマを変更してしまうと、デザインCSSに保存していたコードはすべて消えてしまいます。 テーマを変更する方はカスタマイズをする前に、保存していたコードを別の場所に保存するようにしてください。 色を変更 色を変更する時は、こちらのサイトを参考にさせていただきました！
はてなブログのカスタマイズ～デザインのタイトル下・記事上・記事下・ページャ下・フッタが反映する位置は？まとめ - さくさくの日常
こんにちは、さくさくです。 はてなブログのカスタマイズ、やってますか？ 「あの人のブログでみた、あのパーツを追加したい」 「アドセンスに合格したから広告を貼りたい」 「アドセンス広告の位置や種類を変更したい」 そんな時、カスタマイズのヘッダ・記事・サイドバー・フッタ、どこを変更すればいいか迷うことはありませんか。 ページャ下とフッタって、どう違うんでしょうね💧 図で示して、ご説明します。 PC表示画面のカスタマイズ ヘッダ タイトル画像 タイトル下 記事 記事ページをプレビュー ソーシャルパーツ 関連記事 記事上下のカスタマイズ パンくずリスト サイドバー フッタ {}デザインCSS スマートフォン表示画面のカスタマイズ ブログのデザイン設定を確認 テーマがレスポンシブデザイン対応か レスポンシブデザインモードを確認 敢えてPC版とスマホ版別々にカスタマイズ ヘッダ ブログアイコン タイ
こんにちは。 最近のブログカスタマイズをご紹介していきたいと思います。 今回ご紹介するのはこれ！ 左の日付が記事を書いた日にち、右の日付が記事を更新した日にちになります。 更新とは記事をリライトしたり、カテゴリーを変更したりした日にちのことです。 あったら便利ですよね♪ それでは早速ご紹介していきます。 更新日時をお知らせ！ headに貼るコード Font Awesomeのコード jQuerry のコード 記事下に貼るコード デザインCSSに貼るコード さいごに 更新日時をお知らせ！ 私のブログはこの記事でちょうど６０記事目、まだまだビギナーだと思っています。 それでも以前に書いた記事や内容を更新した方がいい記事については、定期的に見直すようにしています。 そこで、自分の書いた記事がいつ新しい情報に更新されたのかをお知らせする機能があれば便利だなと思い、今回のカスタマイズを取り入れてみまし
はてなブログ初心者が楽しむカスタマイズ～デザインテーマの選び方・変更方法とレスポンシブデザインについて - さくさくの日常
こんにちは、さくさくです。 ご自分のはてなブログのデザイン、気に入ってますか？ 上級者の方は自分好みにどんどんカスタマイズすることができますが、ブログを始めたばかりの初心者だと、どこか一つ設定変更するのもドキドキですね。 この記事では、はてなブログを始めたばかりの人でも着せ替え感覚で楽しめるデザインテーマの変更やテーマの選び方についてご説明します。 デザインテーマとは デザインテーマの変更方法 デザインテーマの選び方 1カラム？2カラム？ 個性的かシンプルか レスポンシブデザイン対応か レスポンシブデザイン非対応テーマの表示 レスポンシブデザイン対応テーマの表示 レスポンシブデザイン対応のテーマを選んだら 使いやすいか？カスタマイズしやすいか？ テストブログがあると便利 私がテーマMinimalismを選んだ理由 まとめ デザインテーマとは はてなブログに関する記事を見ていると、時々テーマ
この記事を読むと以下のことがわかります。 「もしもアフィリエイト」でAmazonと提携するためのコツ Amazon・楽天・yahooが1つになった「かんたんリンク」の作り方 「かんたんリンク」をカスタマイズする方法 AmazonプライムやKindle Unlimitedなど、Amazon関連サービスの、アフィリエイトリンクの作り方 「もしもアフィリエイト」以外の登録しておきたいASP4選の特徴 「かんたんリンク」や「どこでもリンク」の使い方の他に、主要ASP4社の特徴も解説していますので、アフィリエイトに興味があるブロガーさんは、ぜひチェックしてみてください。 もしもアフィリエイトへ審査に出すタイミング もしもアフィリエイト「かんたんリンク」の作り方 「かんたんリンク」をカスタマイズしてみよう！ 「Amazonプライム」等のアフィリエイトリンクは「どこでもリンク」から作るべし！ もしもアフ
元はてなブロガーのマロニーです。 （現在はワードプレスで運営しています） 今回は、初心者はてなブロガーさん向けの記事となります。 私がはてなブログで実装したカスタマイズ内容をその１～８までに分けてご説明していきます。 先人のご意見を参考にしながら、webデザインなんかやったことのないど素人の私でもある程度のカスタマイズはできましたので、初心者のはてなブロガーさんでも簡単にこだわりのサイトができますよ。 まず今回はその１として準備編！ 早速行ってみましょう♪ デザインテーマ選び 変更前のデザインテーマ今までのテーマは『Natully』を利用していました。 タイトルがピンクメインでかわいらしい感じのデザインテーマ。 ブログを立ち上げた当初は猫ブログ１本で行こうと思っていたので、かわいらしい方がいいかなと思ったのですが、すぐに猫だけではネタが尽きて今は雑記ブログとなりました。 仕事関係のシリアス
〈カスタマイズ〉無料はてなブログでどこまで出来るか挑戦 カエレバ利用方法 カスタマイズ編 - sylvaniantedukuriのブログ
こんばんは👩 前回の記事を書いてから、カエレバという商品紹介のサイトを利用させてもらうことにしました。 利用方法はこちらのサイトを参考にさせてもらいました✐ とっても分かりやすくて、無知な私でも出来ました（笑） 今まで楽天アフェリエイトのみの利用でしたが、これを機にAmazonアソシエイトにも登録をして、A8.netから７ネットにも提携をさせてもらいました。 これでカエレバを利用すれば広告から、見ている方が普段利用しているサイトから購入することが出来るので、もしかすると収入が見込めるかもしれません。 分かってはいましたが、この登録とやらが面倒で後回しにしていました💦 でも、やってみると数時間で出来たのでもっと早く試みていれば少しは収入に繋がったかもしれませんね。 A８．ネットの無料登録はこちらからどうぞ〜 お得なセルフバックもあるので、私も色々と利用しています💰 あちこち登録しては、
こんにちは、Kome（@chankomeppy）です。 はてなブログでカスタマイズをしていると、CSSが狙い通りに反映しないことが時々あると思います。 そんな時、はてなブログデフォルトのidやclassを理解していれば、セレクタを詳しく指定することができるので、細かい部分もピンポイントでカスタマイズできるようになります。 というわけで、自分の備忘録も兼ねて、はてなブログのHTML構造をまとめてみました。 はてなブログでカスタマイズしている人や、テーマを自作する方の参考になれば幸いです。 大まかな構造 5つの主なパーツ Tips: ページの種類とclass名 ヘッダーエリア タイトル下編集エリア メインコンテンツエリア 記事ページ Tips: 記事本文内でCSSが効かないとき トップぺージ（一覧形式） アーカイブページ サイドバー プロフィール 検索 カテゴリー 最新記事 関連記事 注目記事
はてなブログを10ヶ月経験したマロニーです。 初心者のはてなブロガーさん向けに、デザインテーマのカスタマイズをシリーズで紹介しています。 今回はその3《フォントサイズ・ブログアイコン編》。 Webデザインど素人の私でもコピペだけでカスタマイズがある程度できましたので、初心者の方向けに私のカスタマイズを記事にしていきますね。 はじめにブログテーマは『Minimalism』。 （※現在はワードプレスで運営しています） はてなブログpro（有料版）を使用しての操作なので、無料版の場合、できない範囲があるかもしれません。 あらかじめご了承ください。 注意点ネット上ではワードプレスでテーマ変更によるアクセス減少が起きたという記事もありますので、変更は慎重に。 必ず今のデザインcssをコピーしてテキストファイル等に保存しておくことを強くお勧めします。 また、はてなブログは追加料金なしで複数のブログを開
どうも！フジグチです！ 当ブログで目次のデザインをカスタマイズしたので、今回はそのカスタマイズを紹介します。 目次には下記のような読者のユーザビリティを向上させることができます。 読む前に一目見て記事に何が書かれているか 求めている答えが書いてあるか 求めている答えにすぐたどり着ける この記事では目次の部分的なカスタマイズから、コピペするだけですぐに使えるコードまで用意したので、良ければお使いください。 また、当ブログで使用している「大学ノート風」の目次デザインも公開しています。※現在は使用していません。 ※サンプル画像 とりあえずコピペして今すぐ使いたい！という方はコピペで使える目次のCSSの項にお進みください。 記事内のコードは全て「このコードをコピーする」というボタンを押すだけで、コピーすることが出来ますのでご利用ください。 最初にCSSを貼り付ける場所を確認しておきます。 記事内の
マロニーです。 はてなブログをリニューアルをした時のカスタマイズです。 （現在はワードプレスで運営しています） Webデザインど素人の私でもコピペだけでカスタマイズがある程度できましたので、初心者の方向けに私のカスタマイズを記事にしていきますね。 今回はその6《サイドバー編》です。 はじめにブログテーマは『Minimalism』。 はてなブログpro（有料版）を使用してのご説明なので、無料版の場合、できない範囲があるかもしれませんのであらかじめご了承ください。 注意点ネット上ではワードプレスでテーマ変更によるアクセス減少が起きたという記事もありますので、変更は慎重に。 必ず今のデザインcssをコピーしてテキストファイル等に保存しておくことを強くお勧めします。 また、はてなブログは追加料金なしで複数のブログを開設することができます。 無料版で3つ、有料版で10つまで。 テスト用ブログを開設し
文章を枠で囲むカスタマイズ みなさん、こんばんは。 はてなブログでカスタマイズを色々やってきました。 やってないカスタマイズで気になっていたのが、文章を枠で囲むカスタマイズです。 今日は、引用とは違った枠で囲むカスタマイズをやってみたいと思います。 以前やったリンクを枠で囲むカスタマイズ 文章を枠で囲むカスタマイズ 参考にしたブログ CSS HTML HTMLの記入方法 その他、応用方法 終わりに 以前やったリンクを枠で囲むカスタマイズ 以前、記事にしたリンクを枠で囲むカスタマイズです。 「合わせて読みたい」とタイトルのついた枠でリンクを囲むカスタマイズとなっています。 こちらも参考にどうぞ。 記事のリンクを枠で装飾するカスタマイズ - Random Life Blog 文章を枠で囲むカスタマイズ 参考にしたブログ saruwakakun.com CSS 上記ブログ内に記載されている、いく
ブログの外観がかっこいいとテンションが上がりますね。 おしゃれなブログには憧れるけど、CSSコードとか、HTMLとか…よくわからない。 カスタマイズをやってみたけれど、うまくいかなくてデザインが崩れちゃった。 うん、そういうことあるよね！だけど大丈夫！！ この記事で初心者でも絶対にできるサイドバーのカスタマイズを超絶わかりやすく解説します！ ＊カスタマイズは失敗するとデザインが崩れることがあります。必ずバックアップを取ってからはじめてね。 カスタマイズ１/プロフィールをめちゃくちゃカッコよくする プロフィールを表示する手順 プロフィールカスタマイズのポイント カスタマイズ２/カテゴリーにアイコンをつけてスッキリまとめる アイコンを使ったカテゴリーを設置する手順 カテゴリー一覧のカスタマイズのポイント カスタマイズ３/オススメ記事を大きな画像でふわっキラっと表示させる ふわキラのおすすめ記事
はてなブログを10ヶ月経験したマロニーです。 初心者のはてなブロガーさんでも簡単にデザインカスタマイズができる方法をシリーズでお伝えしています。 今回はその２《ヘッダー画像編》です。 Webデザインど素人の私でもコピペだけでカスタマイズがある程度できましたので、初心者の方向けに私のカスタマイズを記事にしていきますね。 はじめにこの時使用していたブログテーマは『Minimalism』。 はてなブログpro（有料版）を使用してのご説明なので、無料版の場合、できない範囲があるかもしれません。 あらかじめご了承ください。 注意点ネット上ではワードプレスでテーマ変更によるアクセス減少が起きたという記事もありますので、変更は慎重に。 必ず今のデザインcssをコピーしてテキストファイル等に保存しておくことを強くお勧めします。 また、はてなブログは追加料金なしで複数のブログを開設することができます。 無料
こんにちは、ゆるミニマリスト主婦のくうかです。 この記事では、はてなブログのデザインテーマ「Minimalism」でおこなった、いくつかのカスタマイズをまとめています。 Minimalismは極力シンプルに作られており、シンプル好きな方にはたまらないテーマです＾＾ そこから気になった部分や追加したいことをカスタマイズをして、より自分好みのブログにしています。
こんにちは。青です。 はてなブログの皆さん、ブログのデザインにこだわっていますか？ WordPressのようには自由にはできないですが、はてなブログでも色々とカスタマイズできますよ。 基本CSSをコピペしていくだけなので、初心者の方も是非参考にしてくださいね。 (※2021.1.10、テーマを「UnderShirt」から「Brooklyn」に変更しました。紹介しているカスタマイズは現在の当サイトのデザインとは異なります。) はてなブログのカスタマイズを詳しく紹介【UnderShirt】 はてなブログのカスタマイズを詳しく紹介【UnderShirt】 はてなブログのテーマストアからデザインを選ぶ ブログのヘッダーを作る ヘッダー下にグローバルメニューを表示 ヘッダー下におすすめ記事を表示 TOPページ記事のスターとブックマークを外す TOPページ記事「カテゴリー」の位置を移動 ソーシャルボタ
はてなブログを9ヶ月経験したマロニーです。 （現在はワードプレスで運営しています） Webデザインど素人の私でもコピペだけでカスタマイズがある程度できましたので、初心者の方向けに私のカスタマイズを記事にしていきます。 今回はその8《グローバルナビゲーション編》です。 はじめにこの時使用していたブログテーマは『Minimalism』。 はてなブログpro（有料版）を使用してのご説明なので、無料版の場合、できない範囲があるかもしれません。 あらかじめご了承ください。 注意点ネット上ではワードプレスでテーマ変更によるアクセス減少が起きたという記事もありますので、変更は慎重に。 必ず今のデザインcssをコピーしてテキストファイル等に保存しておくことを強くお勧めします。 また、はてなブログは追加料金なしで複数のブログを開設することができます。 無料版で3つ、有料版で10つまで。 テスト用ブログを開設
【はてなブログデザインカスタマイズ】「はてなブログ」でサイドバーをお洒落にカスタマイズする方法を紹介 - redoブログ
こんにちはブログデザインを模索中の管理人のredo (@redo5151)です。 今回は「はてなブログ」のサイドバーをおしゃれにカスタマイズする方法を紹介します。 ブログ初心者の方でも「デザインCSS」と「FontAwesome」を使ってカンタンにコピペでカスタマイズできる方法になってます。 少しでもブログの回遊率をあげるためにはブログカスタマイズは重要です。 やはり有名なブロガーの方ほどブログのデザインにこだわっているのは一目見て分かります。 今回ご紹介するFontAwesomeを設定しておくと、サイドバーに限らず「グローバルメニュー」や「トップへ戻るボタン」「記事の更新に使うアイコン」など私が別の記事で紹介している様々な用途でも使えるので大変便利です。 "無料"で簡単に実装できますので、まだ未実装の方はこの機会に実装しておきましょう。サイドバーのカスタマイズは「無料はてなブログ」でも実
整理収納・ゲーム・プログラミングが好きな40代専業主婦。4人家族。 小さなおうちに引っ越して収納が減っちゃった！少しずつ物を減らしているミニマリストでもあります。
記事の種類 はてなブログのカスタマイズ SEO対策 関係あり SXO対策 関係あり 難しさ かんたん 重要さ 重要 次のような方にオススメ！ はてなブログのカテゴリーを階層化したい？ はてなブログのカテゴリー階層化のカスタマイズを知りたい はてなブログのカテゴリーが階層化できない ぴっぴ（@hiyoko_no_pippi）も、はてなブログのカテゴリーを階層化したいと思ったことがありました。 ところが、はてなブログにはカテゴリーを階層化する機能がありません。 しかし、ご安心ください。 カスタマイズすれば、はてなブログのカテゴリーを階層化することができます。 そのような訳で今回は、はてなブログのカテゴリー階層化のカスタマイズを紹介します。 カスタマイズと言っても、そんなに難しいコードを書く訳ではありません。 なので、はてなブログを始めたばかりの方でも簡単にカテゴリーの階層化はできますよ。 ぜひ
マロニーです。 はてなブログでの目次カスタマイズは簡単ですよ！ Webデザインど素人の私でもコピペだけでカスタマイズがある程度できましたので、初心者の方向けに私のカスタマイズを記事にしていきますので是非参考になさってみてくださいね。 今回はその5《目次編》です。 （※現在はワードプレスで運営していますのでこのサイトの目次とは異なります） はじめに使用しているテーマは『Minimalism』。 はてなブログpro（有料版）を使用しての操作ですので、無料版の場合できない範囲があるかもしれません。 あらかじめご了承ください。 注意点ネット上ではワードプレスでテーマ変更によるアクセス減少が起きたという記事もありますので、変更は慎重に。 必ず今のデザインcssをコピーしてテキストファイル等に保存しておくことを強くお勧めします。 また、はてなブログは追加料金なしで複数のブログを開設することができます。
整理収納・ゲーム・プログラミングが好きな40代専業主婦。4人家族。 小さなおうちに引っ越して収納が減っちゃった！少しずつ物を減らしているミニマリストでもあります。
こんにちは、ゆーんです お気付きの方いらっしゃいましたでしょうか。 最近、アイコンからお喋りする「吹き出し」を取り入れましたー！！ tmt_krkさん最初に気付いてコメントありがとうございました(〃▽〃) 苦戦した…！！ めちゃくちゃ苦戦したけれど、じっくりCSSとにらめっこして自分の使いたい吹き出しCSSにすることができました～(;O;) 枠の色を自分好みに変えたい ３人以上の人物を登場させたい 片側からのみ吹き出しを出したい 吹き出しとか高度な技、絶対ムリ！！…でも気になる… てな方の参考になるかと思います。 機械オンチなわたしでも一目見たらどこを変えたら良いか分かるよう色つきにしてφ(..)メモしました。 左アイコンから吹き出しのCSS デザインCSSに貼るコード “ｒ”部分を変え登場人物を増やす 吹き出しの枠の色を変える 画像を指定し名前をつける クラス名 画像のURL 同じ色の吹
はてなブログを10ヶ月経験したマロニーです。 （現在はワードプレスで運営しています） Webデザインど素人の私でもコピペだけでカスタマイズがある程度できましたので、初心者の方向けに私のカスタマイズを記事にしていきます。 今回はその4《見出し編》です。 前回のその3《フォントサイズ・ブログアイコン編》の記事の次回予告は『その4《目次編》』とお伝えしていましたが、その4は《見出し編》とさせていただきました。 すみません。 見出しと目次はセットなので、初めに見出しからご説明しますね。 はじめにブログテーマは『Minimalism』。 はてなブログpro（有料版）を使用しての操作方法なので、無料版の場合、できない範囲があるかもしれません。 あらかじめご了承ください。 注意点ネット上ではワードプレスでテーマ変更によるアクセス減少が起きたという記事もありますので、変更は慎重に。 必ず今のデザインcss
はてなブログ-フォローボタンのカスタマイズ【Twitter、Pinterest、YouTubeにも対応】 - フジブロっ！
どうも！フジグチです！ 今後当サイトではプロフィールのカスタマイズを公開する予定なので、プロフィール欄にはフォローボタンを設置したいのではないかと思い、先にフォローボタンを作成してみました。 ご自身が使用しているSNSを選び、設置したい場所にお使いください。 最近ではブログとの連携をしている方も増えているPinterestのフォローボタンも、はてなブログではあまり見かけないので作ってみました。 シェアボタンのカスタマイズをしたときに調べたロゴの使用ガイドラインに従い、Twitterが白もしくは青、形は決まったものしか使えないためデザインパターンは多くないですが、シンプルなので使いやすいかと思います。 この記事の特徴 入力フォームでコードを作成できる その場で形やサイズを変えられる カラーやモノクロからデザインを選べる ワンクリックでコピー Font Awesomeの読み込み※Pintere
どうも！フジグチです！ 今回はCappuccinoのデモサイトに設置している、プロフィールカードのカスタマイズを公開いたします。 「近日中に公開する」とデモサイトに書いていたのですが、まさかのテーマ２作目の製作をするという想定外のことが起きて、自分でそう書いていたことも忘れていました。（小声） せっかく公開するのならと、色々なプロフィールカードのパターンを作ったので、お好きなデザインを選んで使ってください。 この記事のカスタマイズの特徴を以下に挙げます。 この記事の特徴 入力フォームでコードを作成できる その場でプレビュー デザインを１０種類から選べる その場でカラーの変更が出来る ワンクリックでデザインの切り替え ワンクリックでコードのコピー このカスタマイズは、はてなブログに関わらずHTMLを入れることが出来るブログサービス（WordPressとか）であれば、お使いいただくことが出来る
整理収納・ゲーム・プログラミングが好きな40代専業主婦。小学生兄妹と夫の4人家族。 小さなおうちに引っ越して収納が減っちゃった！少しずつ物を減らしているゆるミニマリストでもあります。
こんにちは、ミニマリスト主婦のくうかです。 はてなブログの見た目でずーっと気になっていた部分があります。 「記事の幅」です。 はてなブログのデザインテーマ、Minimalismを使用していた頃は気にならなかったのですが、UnderShirtは少々幅が狭いと感じています。 特にスマホから見た時の固定ページの狭さが気になり過ぎて、修正に取り組み、やっと改善できたので記事にしておこうと思います。
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
はてなブログでサイト内検索をしやすくするカスタマイズ（Googleアナリティクス連携） - はるなぴログ
はてなブログ見出しデザインをカスタマイズ～大丈夫、コピペで簡単にできます - さくさくの日常
はてなブログで行った10+2のカスタマイズ方法まとめ - Random Life Blog
はてなブログ目次の作り方＆目次デザインのカスタマイズ方法～コピペで簡単 - さくさくの日常
初心者必見！「はてなブログ」カスタマイズ記事のまとめと小ネタ集 | たつブロ
はてなブログ無料版でトップページのカスタマイズ・記事一覧で見やすく - ことり日和
はてなブログで吹き出しを使った会話形式を作るカスタマイズ - Random Life Blog
【はてなブログ】初心者でもできるカスタマイズまとめ - ちょこっとぶろぐ
更新日時を自動で表示させるカスタマイズをご紹介します。はてなブログでの設定方法をご説明します。 - 雨のち晴れ
はてなブログにもしもアフィリエイトの商品リンクを貼る＆カスタマイズの方法 - だけど生きていく！
【初心者向け】はてなブログ デザインテーマカスタマイズ その１《準備編》
【カスタマイズ用】はてなブログのHTML構造まとめ - 【ちゃんこめBlog】インド在住OLの雑記ブログ
【初心者向け】はてなブログ デザインテーマカスタマイズ その3《フォントサイズ・ブログアイコン編》
はてなブログ【目次カスタマイズ】コピペで使えるデザイン集 - フジブロっ！
【初心者向け】はてなブログ デザインテーマカスタマイズ その6《サイドバー編》
はてなブログで文章を枠で囲むカスタマイズ - Random Life Blog
初心者でもできる！はてなブログのサイドバーをおしゃれにするカスタマイズ - キラッとはてログ
【初心者向け】はてなブログ デザインテーマカスタマイズ その２《ヘッダー画像編》
はてなブログのテーマMinimalismカスタマイズまとめ | くうかんしんぷるライフ
はてなブログのカスタマイズを詳しく紹介【UnderShirt】 - 八方美人ママの日常
【初心者向け】はてなブログ デザインテーマカスタマイズ その8《グローバルナビゲーション編》
はてなブログ目次カスタマイズ｜シンプル・おしゃれ・コピペOK | くうかんしんぷるライフ
はてなブログのカテゴリー階層化のカスタマイズ - ぴっぴのはてなブログでアフィリエイト
【初心者向け】はてなブログ デザインテーマカスタマイズ その5《目次編》
はてなブログのテーマUnderShirtのカスタマイズまとめ | くうかんしんぷるライフ
【はてなブログ】吹き出しを色付きで可愛くカスタマイズ！片側からのみのＣＳＳも♪ - ゆーんの徒然日記
【初心者向け】はてなブログ デザインテーマカスタマイズ その4《見出し編》
はてなブログ-プロフィールをおしゃれにカスタマイズするデザイン１０選 - フジブロっ！
はてなブログでおすすめピックアップ記事・not foundカスタマイズ | くうかんしんぷるライフ
はてなブログの記事横幅・固定ページ横幅の変更カスタマイズ | くうかんしんぷるライフ