はてなブログ
はてなブログをグリッドレイアウトとDOM操作モジュールでカスタマイズ このブログのテーマを作り変えようと思います。 まずは、ベースとなるグリッドレイアウトのSASS開発環境とユニークなテーマづくりに必須のDOM操作をモジュール化してまとめてみました。 …
はてなブログでページ読み込み時のDOM操作をモジュール化する はてなブログで自分の思うようにカスタマイズしようとしますとDOM操作が避けられなくなります。そのコードを毎回コピペするのではなく、モジュール化して github.io などに上げておき、オプショ…
CSS Grid Layout の auto-fit を @mixin で実現 「CSS Grid Layout の auto-fit を擬似的に IE11 で実現させる」の続きです。 IE11 では対応していいない Grid Layout の auto-fit を擬似的に対応させます。擬似的というのは、auto-fit を使えばメディアクエ…
CSS Grid Layout の auto-fit を擬似的に IE11 で実現させる CSS Grid Layout を使いますとウェブの表現力があがりますね。「グリッドレイアウト」などでググってみてください。おしゃれなサイトがいっぱい紹介されています。このブログもそろそろグリッドレ…
はてなブログに CSS グリッドレイアウトを導入してみる はてなブログのテーマを display: grid を使って作ってみようと思います。ブラウザの対応状況は Can I use... Support tables for HTML5, CSS3, etc です。IE にベンダープレフィックスを付けても機能…
Google Web Fonts の subset=japanese の意味がわからない 前記事 で書きましたように別ブログ「＠半径とことこ60分」に Google の Web フォントを導入しましたので、デベロッパー・ツールで読み込み速度がどんなものか調べてみました。 なお、標題の件、こ…
はてなブログで Google Web Fonts を使ってみる 日本語早期アクセスとして公開されていた日本語 Google Web Fonts が正式版になっていますので使ってみましょう。 ウェブフォントとは？ 日本語 Google Fonts の導入 はてなブログに設定する ウェブフォントと…
はてなブログテーマ開発（8）スマホ用 offcanvasmenu の作り方 別ブログ「＠半径とことこ60分」のテーマ変更を機に、はてなブログのテーマ開発について書いています。今回はスマホ用のナビゲーションメニューを作ります。 はてなブログテーマ開発（1） はて…
はてなブログテーマ開発（0）とりあえず完成させた 別ブログ「＠半径とことこ60分」のテーマ変更を機に、はてなブログのテーマ開発について書いています。まだいろいろ書くことはあるのですが、テーマ変更とともに独自ドメイン化と HTTPS 化をやろうというこ…
gulp で sass コンパイル環境を構築 + autoprefixer + browser-sync はてなブログのテーマの作り方（それほどでもないけど）を７回ほど書いていまして、前回、display: grid を使ってみようと思いましたが、Hatena-Blog-Theme-Boilerplate ではベンダープレ…
はてなブログテーマ開発（番外）グリッドレイアウトを使ってみる 記事ページの基本構造がほぼ出来ましたので、トップページに移り、ブログタイトルなど共通部分がこのままでいけるかどうか確認します。 トップページのレイアウトは、１カラムでグリッドレイ…
はてなブログテーマ開発（7）フォントサイズを可変にする フォントサイズの指定っていうのは結構悩ましいですね。絶対値指定の px 、相対値指定の %, em, rem 、最近では vw も使われます。はてなブログテーマ開発の7回目は、フォントサイズを可変に出来ない…
はてなブログテーマ開発（6）Javascript を使って要素を移動する Wordpress や Joomla! を使って自分でブログを立ち上げれば、そもそもの基本構造も自由に変えられるのですが、はてなブログなどではそんなわけにはいかず、せいぜい CSS で見た目を変えるくら…
はてなブログテーマ開発（5）ブログタイトル、記事タイトルの装飾 はてなブログのサンプルテーマ Boilerplate を使ってのテーマ開発の５回目です。基本構造ができましたので、細部の装飾に入るのですが、トップページは各記事やアーカイブとは別に考えること…
はてなブログテーマ開発（4）ブログの基本構造を作る はてなブログのサンプルテーマ Boilerplate を使ってのテーマ開発の４回目です。前回で自動リロードの環境も整いましたので、実際に scssファイルに手を加えていきます。 はてなブログテーマ開発（1） は…
はてなブログテーマ開発（3）HTTPS環境下でBrowsersyncの自動リロードを実現 はてなブログテーマ開発（1） はてなブログテーマ開発（2） 今回は、HTTPS環境下の開発でも Hatena-Blog-Theme-Boilerplate（Boilerplate） の自動リロードを有効にする方法です。…
ドメイン移管（２）／エックスドメインからバリュードメインへ ドメイン移管／エックスドメインからバリュードメインへ 上記記事のその後です。バリュードメインからエックスドメインへ移管申請をし、エックスドメインからのメールで、キャンセルの場合は８…
はてなブログテーマ開発（2）Hatena-Blog-Theme-Boilerplate を使って はてなブログテーマ開発（1） はてなが公開しているサンプルテーマ「Hatena-Blog-Theme-Boilerplate」を使ってのテーマ開発の２回目です。 npm-scripts cssファイルのインポート _core.s…
ドメイン移管／エックスドメインからバリュードメインへ 現在、独自ドメインではてなブログを利用している２つのサイトともに、ドメインはエックスドメインの管理、ネームサーバはバリュードメインという設定になっています。その経緯は、 はてなブログ HTTP…
Hatena-Blog-Theme-Boilerplateを使ってテーマ開発（1） 別ブログ「＠半径とことこ60分」のテーマを変更しようと思うのですが、この機会に、はてなブログのテーマをどうやって作っているかを書いていこうと思います。 もちろん、どんな方法であれ、HTMLの構…
XREA の転送設定 302を .htaccess で 301にする 現在、はてなブログで運用しているサイトのうち、このサイトと「そんなには褒めないよ。映画評」は HTTP化を完了し、必要であるかないかは過去記事に書きましたようによくわかりませんが、wwwなしのドメイン名…
SSL/TLS 証明書にドメイン名 https://www.imuza.com/ がありません 「そんなには褒めないよ。映画評」に続いて、当サイトも HTTPS化し、これでOKと思っていましたら、今朝、Search Console から標題のメールが来ていました。 一瞬、え！？ とびっくりします…
はてなブログ HTTPS化後の wwwなしリダイレクト完了！ ここに至る詳細は前記事をご覧ください。また、そもそもこれが必要なことかどうかについても書いています。 はてなブログ HTTPS化後の wwwなしリダイレクト で、ドメイン移管か？ というところまでいっ…
はてなブログ HTTPS化後の wwwなしリダイレクト はてなブログで運用している「そんなには褒めないよ。映画評」を HTTPS 化した際に、古い記事の YouTube の引用が表示されない件を下記の記事で公開していますが、その追加記事です。 はてなブログの HTTPS 化…
はてなブログの HTTPS 化は大変だ（涙） はてなブログも昨年末から HTTPS 配信が可能になり、独自ドメインでも今年６月に可能になりました。 独自ドメインで運用されているブログが、HTTPSで配信できるようになりました - はてなブログ開発ブログ 私の場合、…
はてなブログにインフィード広告を貼る さほどアクセスもないブログしか書いていませんが、せめてはてなブログの利用料くらいは広告でまかなえないかと Google AdSense を利用しています。その程度の意識ですので、つい最近まで１ページに３つまでとの制約が…
（bug fix）はてなブログ「一覧形式」の画像をオリジナルのものに変える はてなブログのトップページを「一覧形式」にした場合の画像をサムネールではなく元画像に差し替える下記記事のスクリプトは、画像が png や gif の場合にエラーとなります。 元記事：…
はてなブログ／カウントなし SVG 軽量ソーシャル（SNS）シェアボタン ブログのソーシャルボタンを見直してみようと思います。シェアカウントもたくさんあればいいのですが、大した数ではありませんので（笑）、それよりも軽さを求めようと思います。なお、Go…
Google フォームをブログに埋め込み、自動返信メールを送る（完成版） はてなブログなど Javascript を使えるブログに Google フォームをブログデザインのまま埋め込み、Google Apps Script（GAS）を使って自動返信メールや管理者への通知メールを送る方法の…
Google Form に自動返信スクリプト実装 Google Apps Script Google フォームをはてなブログにブログデザインのまま埋め込み、自動返信機能を Google Apps Script（GAS）で実装しようというプロジェクトです。 前記事 Google Form を自前のフォームで実装 Goo…
