カスタマイズに関するhututukaのブックマーク (5)

  • 1ヶ月である程度のWebデザインができるようになった独学勉強法を書いてみる - Yukihy Life

    最近はてなブログのカスタマイズ記事ばかり投稿しているゆきひーです。 4月ぐらいまでは「HTMLって何?」ってレベルだったのですが、この数ヶ月でいろいろと学んできて、素人ではあるもののレスポンシブデザインぐらいまでなら作れるようになりました。 実際に集中して学んだのは1ヶ月ぐらいですが、趣味程度には十分だと思うので、どのようにして学んだのかをまとめてみたいと思います! Webデザインをある程度できるようになるためのステップ Step1 「Progate」で作りながら学ぶ Step2 「ドットインストール」で総復習&補完 Step3 書籍を数冊読んでできることを確認する Step4 実際に自分のブログに応用してみる その他Webデザインを効率よく学ぶコツ Webデザイン系ブログをFeedlyで定期購読する クロームの拡張ツール クロームのディベロッパーツール Color Pick Eyedro

    1ヶ月である程度のWebデザインができるようになった独学勉強法を書いてみる - Yukihy Life
    hututuka
    hututuka 2018/07/13
    わかりやすい!そしてクローム拡張機能すごい!
  • はてなブログの強調表示を蛍光ペン風にマーキングする - むじん島

    最近よく見かける蛍光マーカー風の強調表示 CSS3のlinear-gradient()でいい感じに再現してみました。 <style type="text/css"> /* 強調表示を蛍光ペン風に */ article strong{ margin:0 0.1em; padding:0.1em 0.2em; background:#fcfc60 !important; background:linear-gradient(to bottom, transparent 60%, rgba(252,252,84,0.8) 60%) !important; } /* bタグは太字 */ article b{ font-weight:bold !important; } </style> 太字のみの「bタグ」と下線マーカーの「strongタグ」で使い分けできるようにしました。 はてなブログでの設定方

    はてなブログの強調表示を蛍光ペン風にマーキングする - むじん島
    hututuka
    hututuka 2018/07/06
    参考にさせていただきます!
  • はてなブロガーは必須!はてなブログの記事下にプロフィールを貼り付ける方法。 - (旧)宮森はやと公式ブログ

    ぼくは自分のプロフィールを記事下に貼っています。 この効果がかなり高かったので、今日ははてなブログの記事下にプロフィールを貼り付ける方法を説明します。 っと、その前に少しだけ。 プロフィールを記事下に貼るメリットは以前の記事でもかきました。 www.miyahaya.com メリットは大きく3つです。 読者に自分のことをより具体的に知ってもらえる。(プロフィールを読んでファンになってくれるかもしれない) PVが増加する。 リアルの場での自己紹介がいらなくなる。(プロフィールにかいてる内容でどんな人間か把握してもらえるので) ぼくはプロフィールを記事下に貼ったことで毎月1000PV前後読まれています。 しかも、プロフィールを読んでくれた人はありがたい事に読者になる率も高まります。 プロフィール記事をつくっておもうことは、はてなの簡易的なプロフィールだけで終わらすのは、余りにも勿体ないことです

    はてなブロガーは必須!はてなブログの記事下にプロフィールを貼り付ける方法。 - (旧)宮森はやと公式ブログ
    hututuka
    hututuka 2018/07/06
    記事へのリンクすら知りませんでした…。(プロフィール記事のURLコピペしてた)とても参考になりました!
  • 当ブログで行ってきたはてなブログデザインカスタマイズまとめ! - Yukihy Life

    PR:はてなブログのテーマ「Naked」を作成しました!デフォルトでもカスタマイズもしやすいテーマです。よろしければご利用ください!↓ www.yukihy.com 今までいろいろとはてなブログをカスタマイズしてきて、特にシェアボタンなどはいろんなところで使われているようでありがたいです! 数も多くごちゃごちゃになってきたので、一旦まとめたいと思います。 新しいカスタマイズを行い次第、この記事にどんどん付け加えていこうと思っています。 カスタマイズ記事まとめ 見出しのデザイン SNSシェアボタン関係 旧バージョン 新バージョン SNSフォローボタン メニュー関係 スマホ版のみ グローバルメニューと両立してレスポンシブ対応にする グローバルメニュー(ドロップダウン)&トグルメニューのレスポンシブ対応 グローバルメニュー(ドロップダウン)&スライドメニューのレスポンシブ対応 レスポンシブ対応な

    当ブログで行ってきたはてなブログデザインカスタマイズまとめ! - Yukihy Life
    hututuka
    hututuka 2018/07/05
    これでデフォルトから前進したい…!わかりやすいまとめありがとうございます!
  • CSSで組んだドロップダウンメニューとトグルメニューを両立させたレスポンシブなメニューの作り方【コピペでOK】 - Yukihy Life

    12/07:その他のカスタマイズを充実させました。 以前、グローバルメニューとトグルメニューを両立してレスポンシブスタイルにするメニューバーを作りました。 以前の記事 www.yukihy.com このメニューバー、CSSを勉強したてに作ったものなので、若干の不満な点などが残ったりしていました。例えば「タイトル下」の部分に広告を入れるとトグルメニューのときにデザインが崩れたりすることです。 また、メニューバーにドロップダウンメニューにできないかとのご質問もいただいたので、合わせて修正版のやり方を記事にしたいと思います。 はてなブログ向けですが、全く同じコードで他のブログサービスでも使えるのではないかと思います。 カスタマイズを行う際は、必ず以前のコードをメモ帳などにバックアップをとっておくようにしてください。 実装図 注意点 カスタマイズ CSS HTML&jQuery HTMLの中にリン

    CSSで組んだドロップダウンメニューとトグルメニューを両立させたレスポンシブなメニューの作り方【コピペでOK】 - Yukihy Life
    hututuka
    hututuka 2018/07/05
    とてもわかりやすいです!
  • 1