【決定版】はてなブログ・スマホデザイン最強カスタマイズ集 - ひつじの雑記帳
※記事更新から1年以上が経っているため情報が古い可能性があります 当ブログ「ひつじの雑記帳」は5月1日で運営1ヵ月目を迎えました。お陰様で5記事しか書いてないにも関わらず1ヵ月目で4万PVを達成することができました。 投稿する記事の質は当然意識してきましたが 、短期間でここまで成長できたのはブログデザインの影響も少なからずあるかなと感じています。 そこで今回は、当ブログ「ひつじの雑記帳 」で実践しているカスタマイズ・コード全てを紹介していこうと思います。 当初はこのブログのスマホデザインのカスタマイズコード全てをひとつのパックとして5000円で販売しようと思っていたんですが、いろいろと気が変わったので全て無料で公開することにしました。 デザイン完成図 使う色を落ち着いた色に統一したフラット風のデザインに仕上げています。おすすめ記事を宣伝するスペースもいくつか設けているので直帰率の改善にも貢
はてなブログで特定カテゴリーでのみブックマークボタンを非表示にする方法 - ヘソで茶をわかす
昨日の投稿で書きましたが、特定のカテゴリーでのみブックマークボタンが表示されないようにカスタマイズしました。このブログでは「歴史」と「観光」の二つのカテゴリーでブックマークボタンは表示されないようになっています。 備忘録も兼ねてカスタマイズの手順を書いておきます。 本当は昨日書いておきたかったのですが、一部に問題が生じたために書く事が出来ませんでした。 雑記ブログを書いていると、ブックマークにはなじまない内容の記事もあったりしますので、あまり拡散させたくない身内だけで楽しみたいような記事や、炎上されると困るような記事用に利用してもらえればと思っています。 念のための言い訳 前もって書いておきますが、私はCSSやHTMLなどは書けはしますが学校で勉強したとかいうのではなく、完全に独学で趣味として覚えたものですので、最善の方法では無いかもしれませんし、もっと言ってしまえば間違っている可能性すら
ブログの過去記事をTwitterでbot化させるための準備から実践まで（要GoogleAnalytics） - あれこれやそれこれ
僕はTwitterにこのブログの過去記事をtwittbotを使ってbot化して流しています。 twitter.com 自分のブログのＵＲＬとタイトル、語句を登録しておいてランダムでツイートするようにしてるんですよ。自ブログで過去記事紹介したりはするんだけど、やっぱり他の人の目に触れないと意味ないからねー。 こんな感じ。で、この「タイトル+ＵＲＬ」を拾うのにとある方のお力を拝借してたんですが、自力でなんとかやりたいなと（諸事情） 昨日そんな事を考えてたらタイムリーなことにらくちゃんことらくからちゃさんが そろそろ、記事数もフォロアーも増えてきたので、過去記事紹介とか流してみようかなあ。 — らくからちゃ (@lacucaracha) 2015, 9月 27 とかツイートしたはったので相談したものの、Ｂ29に竹槍で挑んだように自滅。（Googleにジェイソンが、までわかった）ありがとね。 それ
はてなブログでGoogleにパンくずリストを認識させるブログパーツ - 太陽がまぶしかったから
photo by keso こちらのカスタマイズは使用しないでください data-vocabulary.org のサポートが終了されるため、こちらのカスタマイズは利用できません。はてなブログ公式の機能を利用したり、リンク先で紹介されている方法への差し替えをお願いします。 Googleにパンくずリストを認識させるプラグイン 最近のGoogle検索ではブログ内のカテゴリを認識して、検索結果がサイト上のどこに位置付けられているかを表示するようになっているのですが、breadcrumbタグを利用したマークアップをしていないとGoogleから認識してもらえません。 このためJavaScriptでパンくずリストを生成してGoogleにカテゴリを認識させるスクリプトを開発しました。現在のGoogleではJavaScriptの実行時に生成されたリンクやマークアップを解釈しています。『Google Sear
必ず読んでおきたい！はてなブログをカスタマイズする際に超参考になる記事まとめ - hacogaki
この記事は随時更新しております 独自ドメインの登録・設定方法を追加（2017/8/6） おはばんにちわ、みやび（@miyabi_941）です。 このはてなブログもそれなりにカスタマイズしてきましたが、カスタマイズする際に多くの先人はてなブロガー様の知恵をお借りしています。 今回はそんな先人様に感謝の意も込めつつ、はてなブログカスタマイズの超参考になる記事をまとめました。 部分別でまとめているので、自分がカスタムしたい箇所から記事を探してみてください。 もくじ もくじ 初期設定 最低限やっておくべきこと ヘッダー部分 グローバルナビゲーション ヘッダー画像 サイドバー部分 サイドバーにバナー画像を設置 サイドバーにTwitterウィジェット（タイムライン）を設置 サイドバーにFacebookのLikeBoxを設置 サイドバーにAmazonのランキングを設置 はてなブックマーク人気エントリーを
はてなブログのスマホデザインCSSをカスタマイズして、簡単にオシャレに見せる方法 - LITERALLY
はてなブログのスマホ表示時のデザインはカスタマイズが面倒で、ほぼ全てのブログが同じデザインで個性が出しにくいのが特徴だ。簡単に変更できる部分は、ページ上部のアイコン画像ぐらい。 先日、その単調なはてなブログのスマホ向けデザインをカスタマイズしまくってみた。今回は備忘録がてら、その方法と「簡単にはてなブログのスマホ表示デザインをオシャレにするいくつかのテクニック」を記録してみようと思う。 はてなブログのモバイル（スマホ）デザインCSSを編集する方法 まず、ここがあまりネットで探してもなかなか見つからなかった。はてなブログにはPC表示向けのcss編集ボックスはあるが、スマホ表示用のcss編集ボックスはない。そのため、レスポンシブデザインのテーマを設定しない限り、スマホのデザインはカスタマイズできないんだと諦めている人も多いかもしれない。 ぼくもスマホのデザインをなんとか変えることができないが試
はてなブログに「トップへ戻る」ボタンを設置してみました｜スマホページ、PCページどちらにも対応してます - チップの日常
どうもこんばんは☆ 私は自分のブログ向上の為に他のブログを見ることが多いのですが、画面右下にトップへ戻るボタンが付いているブログを良く見かけます。 ↑こんなヤツです。今見ているこのページにも付いていると思います。 スクロールしても画面右下に固定で出てきて、これをクリック（スマホの場合はタップ）すると一発でページの先頭に戻れる優れもの。 とても便利なので私のブログにも設置したいと思い設置方法を検索しました。 スクリプトとかCSSとかあまり良くわからないので、色々な記事を参考にしながら試行錯誤してみた結果、理想に近いもの出来ましたよ！！ ということで、今回は私が行ったはてなブログでの「トップへ戻る」ボタンの設置方法を紹介していこうと思います。 参考にしたサイト： jQueryでスクロールすると表示する系いろいろ | webOpixel トップへ戻るボタン設置方法 ①HTMLの記述 <p id=
【ブログ超初心者でもカスタマイズ！】タイトル画像を作成、設置する方法 - 疲れていたら かわいくないぞ
こんにちは。 ブログカスタマイズ欲が高まっているくすりやです。 スマホでこのブログによく遊びに来て下さっている読者様はお気付きでしたでしょうか。 今週始めにこのブログにタイトル画像を設置した事に！ 自分としてはとても気に入っています。 でも、パソコン画面の方は、初心者がいじったら表示がおかしくなるかもしれないし、レスポンシブルーおしゃれだし〜と思って放置していました。 そんな中、いつも当ブログを応援して下さっているおはぎさん（id:ohg0524)に優しく背中を押してもらいました。 https://twitter.com/ohg0524/status/613021600279977984 ですよね〜 やっぱり、パソコン画面でもスマホ画面でも一目で同じブログだと分かるような統一感が欲しいです。 なのでやってみたら出来ました！ とても嬉しいので、ご存じかもしれませんが、今日はタイトル画像の作り
【ブログ超初心者でも出来た！】カテゴリーを階層化する方法 - 疲れていたら かわいくないぞ
こんにちは。 最近ブログのカスタマイズに興味深々のくすりやです。 せっかくはてなＰＲＯにしたことですし！ qusuriya.hatenablog.com ブログ開始から一か月。 記事数はまだ30を越えた位ですが、新しく記事を書く度に節操なくカテゴリーを作っていったら、すでに収拾つかなくなってしまいました。 そのうちトップ下にメニューをつけたいと思っているので、このままではいけません。 記事の数が少ない今のうちに何とかしなければ！ もっとスッキリまとめたいけどどうしたら良いかと調べていたら、カテゴリーを階層化する方法を書いた記事を発見しました！ www.yukihy.com こちらの記事によるとまず、ぱんくずリストなるものを導入しなければいけないらしいです。 その方法はこちら。bulldra.hatenablog.com 自分のブログのデザイン画面のフッタにこちらのスプリクトを入れました。
はてなブログのデザインカスタマイズ方法（簡易版） - TASK NOTES
はてなブログのデザインカスタマイズ方法です。といっても今回は手の込んだものではなくて少し表示を変えるくらいの方法になります。 初めに はてなブログのデザインには様々なテーマがあります。全体的なデザインはこれがいいけど他のフォントとか見出しはこっちがいいなとか、何かちょっとずつ違ってて悩みますよね。カスタマイズといってもHTMLをいじる訳ではなくCSSを修正(上書き)する作業になるのですが、HTMLとCSSの知識がまったく無いと難しいかもしれません。 デザインテーマを選ぶ まず管理画面のデザインに移動して公式テーマを選びます。 私はReachというテーマにしました。大きく変更する訳ではないので全体的に好きなデザインを選ぶといいでしょう。 CSSを編集する デザイン画面のカスタマイズにある「デザインCSS」を編集していきます。 サイドバーの位置を変える 今回選んだテーマはサイドバーが左にあり、
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://www.tarappism.com/entry/hatena-blog-customize-4