最終更新:2021年11月12日 こんにちは。久しぶりにJavaScriptの記事です。 長ったらしいコードを手でコピーするのはなかなか大変だと思って、ずっと実装したかったコピーボタンの設置をしました。 コピペで是非どうぞ！

この度実績積みのための一環として、はてなブログのカスタマイズ及び不具合修正をココナラにて承ることにしました。 料金は一律4,000円（ココナラカテゴリ内最低料金）です。 見出しデザイン 目次デザイン グローバルメニュー 追従メニュー アコーディオンメ…

グローバルメニューっていうのは、当ブログにあるようなこれ↓ グローバルメニュー とか、これ↓ グローバルメニュー２ グローバルメニュー３ のようなメニューのこと。 Check! ハンバーガーメニューの作り方はこちら micche-labo.hatenablog.com こんな感じの…

コードを書いた切っ掛け デフォルトのコードブロック 横スクロールするための追加コード 完成形 さいごに コードを書いた切っ掛け はてなブログはコードブロックが改行されるようになっていて、コードが変なところで改行されて見辛く、間違えそうだと思い、…

横並びの方法はいろいろありますが、わたしはいつもdisplay:flex;を使用しています。 まあ手軽だし使い慣れてきたし…と思ってたんですが、そろそろ他のやり方も研究しようと思って、floatとtableパターンを作ってみました。

プログラミングの勉強用記事ばかりあげてたので、ここいらでWebデザインの記事を投稿させていただきます。 よく巷で見かけるラベル付きボックス。 サンプルは1種類 × 4色。 とりあえず形だけ作って、あとはなんぼでもいじってデザイン整えていきましょ！の気…

記事下のSNSボタンをデフォルトからはやくデザイン整えたかったのをようやく調整しました。 今回の実装内容 ボタンの種類は はてなブックマークボタン twitterシェアボタン FaceBookシェアボタン Pocket保存ボタン の４つ。 ホバーエフェクトは 少し大きくな…

CSSで作る、フッターデザインの覚書き。アーチの上に画像をのせたようなデザインにしてみます。擬似要素を使います。はてなブログでも再現可能。他のブログやホームページでもできると思います。是非参考にしてみてください。

よくある、「リンクを新しい窓（タブ）で開く」の横にある、 のようなアイコンをcssで表示させる方法。 Font Awesome 5 使用。（フリー版） 覚書きシリーズ。

覚書。 ターミナル起動してgithubからダウンロード、Sassの設定、の流れが初心者には難しく、なかなか行き詰まってテーマ制作まで進めない…となりがちだったので、MacのFinder上での操作とVScodeでの操作で完結させる方法。 過去記事は以下 micche-labo.hate…

覚書。

はてなブログでテーマ制作をする際、ブログの数を増やしたいと思っても無料版だと3つまでしか作れないので、サブアカウントを作って最大15つまで制作できるようにしよう！という記事です。

はてなブログのテーマ制作をするにあたり、様々なサイトを参考にしました。 Web全般 Webデザイン系 クイックリファレンスサイト 便利ツール 圧縮ツール 配色参考 モックアップ Git関連 質問サイト系 プログラミングを学ぶなら Web全般 coliss 外国のサイトの…

前回、ターミナルでテーマ制作のための環境構築を行い、「Boilerplate」をダウンロード、Sassでの制作環境を整えました。 前回の記事 micche-labo.hatenablog.com 今回はその続きになります。 いよいよSCSSファイルを編集して、テーマ制作に入っていきます。…

私が初めてはてなブログのデザインテンプレート（テーマ）を制作した時、ターミナルやGitHubについて何も知らず、かなり初めから手こずりました。 いろんなサイトを参考に四苦八苦しながら、なんの知識もない初心者の私がテンプレート制作するまでに至った経…

この記事では、Macではてなブログのテーマ制作をするための事前準備として、ターミナルでのSSH Key作成と、GitHubで新しくSSH Keyを作成する方法を紹介しています。 この記事を読んでわかること ターミナルで自分のPCにSSHKeyを作る方法と確認方法 GitHubにS…