四方良しのブログ運営とは何でしょうか？ 近江商人の三方良しを参考に、もうひとつステークホルダーを増やして四方良しとし、収益化を行うブログ運営に生かそうという発想です。 四方とは、読者、広告主、検索エンジン、ブログ運営者（ブロガー）の4者です。 はるなぴのブログの場合は、読者、AdSense広告の広告主、Google検索エンジン、はるなぴ自身ということになります。 なぜ四方良しのブログ運営をお勧めするのか、順を追って説明していきましょう。 近江商人の三方よしとは 世間よしは企業の社会的責任（CSR）の源流 四方よしのブログ運営 四方よしの関係性 優先順位 まとめ 近江商人の三方よしとは 近江商人の三方よしとは何でしょうか？ まずはWikipediaの近江商人の記事を見てみましょう。 ja.wikipedia.org 近江商人の思想・行動哲学のところに三方よしの解説がありますね。 売り手よし、

お名前.comでDNS設定した後はてなブログProを独自ドメイン化する方法について記録しておきます。 ドメインを取得した後にDNSの設定をし、はてなブログでの設定をしてようやく独自ドメイン化が完了します。更にリンクの張り替えなどの作業が待っています。 はてなブログProでいつか独自ドメイン化しようと考えている方は参考にしてみてくださいね。 お名前.comでDNS設定 DNSとは DNS設定方法 はてなブログProに取得したドメインを設定する方法 独自ドメイン化をした後にすること 外部リンクのURL修正 お名前.comでDNS設定 お名前.comでDNSを設定する方法について書きます。 お名前.comでドメインを取得する方法については先日書きました。 www.halu7.com でも、このままはてなブログProに取得したドメインを設定してもダメです。まずDNS設定をすることが必要です。 DN

前回はAdSense自動広告を導入する方法をお伝えしましたが、今回は広告ユニットを作成してはみ出しのないよう気をつけながら記事下に配置する方法について説明します。 はてなブログでの設置を前提に書いていますが、他のブログシステムでも同じような方法でAdSenseの広告ユニットを設置できます。ご参考にしていただければ幸いです。 AdSense広告ユニットを作成する 記事欄の幅を広げる 広告ユニットの作成 はてなブログ記事下にAdSense広告ユニットを配置する方法 記事下に配置するHTMLコード 見栄えを調整するCSS設定 まとめ AdSense広告ユニットを作成する AdSense自動広告ではコードをブログのhead部分に設置すれば後は全自動で挿入する場所を決めてくれました。 心配すべきなのは表示崩れでした。回避するためのCSS設定については、こちらの記事で紹介しましたので自動広告を使う方は

はてなブログProで独自ドメインを取得するときの注意点について備忘録として書いておきます。 はてなブログを無料版からProにした後すぐにお名前.comで独自ドメインを取得しました！ ついに自分の土地を持ったという感じです！ドメイン名はhalu7.comです。 お名前.comで独自ドメインを取得した理由 独自ドメインの取得費用 お名前.comでのドメイン取得方法と注意点 ドメイン名を決めるときの注意点 ドメイン取得方法 Whois情報公開代行とは まとめ お名前.comで独自ドメインを取得した理由 なぜ独自ドメインを取得したか？ 理由は、はてなブログProに切り替えたあとの調子がすごく良かったからです。アクセスが一気に増えました！こんなことなら最初からProにしておけば良かったと思いました。 独自ドメインについても、どうせ取得するなら早い方がいいことは明白です。なので思い切ってお名前.com

Windows ユーザーがMacに乗り換えすると、どうも勝手が違って苦労するということが多いと思います。 今まで使えていたショートカットが全く使えなかったり、たくさんのアプリを開くとメモリ不足になって動きが遅くなったりと戸惑うこともあります。 そこで今回はWindows、Mac両刀使いのはるなぴが、こんな風に使うと便利とか導入するといいよとお勧めできるアプリをご紹介します。 WindowsユーザがMacに乗り換えて苦労する話 ショートカット＆キーの使い方編 ファイルやフォルダーのカットアンドペースト（移動） Deleteキーでファイルやフォルダを削除する方法の代替 Alt＋Tabキーでのウィンドウ切り替え 開いたウィンドウを閉じるショートカット Macでメモリ不足になった時のためのアプリ まとめ WindowsユーザがMacに乗り換えて苦労する話 こちらの記事で詳しく書いていますが、Win

Florida2アップデートから早一か月、検索順位が変動し突然圏外に飛んだ、アクセスが激減したなどブログ界に激震が走りました。 さまざまなブログやサイトを見渡して何が起こったのかを総括し、検索順位を回復するための対処法について考えていきます。 Florida2アップデートとは Googleのアナウンス付きコアアップデート 検索順位が圏外まで飛んだサイトも ブログへの影響 サーチコンソールでのGooglコアアップデートの確認方法 Googleアナリティクスによる詳細な影響の確認方法 Florida2アップデートで検索順位が飛んだ理由 特化サイトの検索順位変動理由 雑記ブログの検索順位変動理由 検索順位変動でアクセスが激減した時の対処法 はるなぴの対処法 雑記ブログでの対処法 今後の課題 Florida2アップデートとは Florida2アップデートとは3月12日にGoogleが実施した大幅な

はてなブログに外部CSSファイルをリンクする方法のお勧め記事です。 この方法はメリットいっぱいなのに案外知られていないみたいです。ブログのデザインをCSSでカスタマイズする時にとってもラクチンです。 はてなブログでCSSカスタマイズする方法についても書いていますので、こちらのカテゴリページをご覧ください。 www.halu7.com Dropboxに外部CSSファイルを置いて共有化する はてなブログのhead内にリンクタグを設定 外部からCSSファイルを配信するメリット テーマCSSとの干渉を避けることが可能 小さくて見にくい「デザインCSS」の窓ではなく使い慣れたテキストエディタが使用可能 ファイルを更新するだけですぐにCSSが適用される 外部CSSファイルの読み込み速度もOK まとめ Dropboxに外部CSSファイルを置いて共有化する 外部CSSファイルをDropboxに置いて共有化

はてなブログProの30日間無料体験をお試しした時の感想です。 はるなぴは去年2018年6月に、はてなブログPro版の無料体験を申し込みしました。その時の体験談記事が好評なのでリライトして復活しました。 登録費用は2019年2月現在の数字なので今後の消費税アップに伴い変動があることご承知ください。 はてなブログProの30日間無料体験 はてなブログProにしてやったこと 広告非表示 キーワード自動リンクオフ ヘッダとフッタを非表示 ブログのトップを一覧形式に はてなブロググループに参加する これから利用してみたい、はてなブログPro版の機能 固定ページを作成できる 最大10個の複数ブログ カテゴリー別記事一覧ページのカスタマイズ 数日間はてなブログProを利用してみての感想 はてなブログProの30日間無料体験 はてなブログではPro版に移行しようかどうか迷っている人のために30日間の無料

独自ドメイン化のあとでGoogleサーチコンソールのインデックスを旧サイトから新サイトに引き継ぎする方法について備忘録として書いておきます。 はてなブログProを独自ドメイン化した後やることのひとつにGoogleサーチコンソールのインデックスを新ドメインに引き継ぎすることがあります。 しかしこれがなかなかの曲者。うまくいかず困っている人が多いみたい。 はるなぴも設定はしてみたもののGoogleサーチコンソールのインデックスがなかなか更新されずハラハラしていました。 今回はサーチコンソールの新旧引き継ぎ方法を備忘録として記録しておきます。ご参考にしてみてくださいね。 Googleアナリティクスとサーチコンソールを連携する Googleサーチコンソールから連携する方法 新サイトのサーチコンソールを作成する 登録した新サイトの所有権の確認 旧サイトのサーチコンソールでアドレス変更をする はてなブ

お問い合わせフォームの作成と設置方法について備忘録として書いておきます。 Google Adsenseやアフィリエイトをするならお問い合わせフォームは必須ですね。将来のことを考えて早めにお問い合わせフォームを設置するのがお勧めです！ Google Formを利用してお問い合わせフォームを作成する方法 Google Formでお問い合わせフォームを作成する ブログに貼り付けるコードを取得する はてなブログへのお問い合わせフォーム設置方法 固定ページでお問い合わせ用の記事を作成する サイドバーに固定記事を表示させる方法 スマホにGmailアプリをインストールしておこう Google Formを利用してお問い合わせフォームを作成する方法 Googleフォームを利用してお問い合わせフォームを作成する方法について説明します。 Google Formでお問い合わせフォームを作成する まずGoogle検

はるなぴのサイトで実際に起こった出来事を紹介します。 アドセンス対策を行った結果は凶、いや大凶。もうダメ。Googleアドセンスによる収益化は諦めよう。さすがにもう受かる見込みはないだろう。Amazonアソシエイトに申し込もう。 そこまで追い詰められていました。ほぼ諦め状態で記事修正などをして最後のつもりでアドセンス審査を申請しました。 すると…なんと見事合格！ 皆さまの参考になるかどうか分かりませんが、ご一読いただければ幸いです。 凶と出たGoogleアドセンス対策 ポリシー違反の記事がどれか分からない問題 ポリシー違反に該当しそうな記事を丸ごと削除 サイトがGoogleアドセンスから認識されなくなった？ 最後のブログ記事修正 Googleアドセンスを諦めAmazonアソシエイト審査を考える 今までやってこなかったアドセンス対策を実行 Googleアドセンス合格へ その後 凶と出たGoo

d3-graphvizを使用してブラウザ上にフローチャート図を表示する方法について説明します。 D3.jsとGraphvizを使用して動的グラフをブラウザで表示してみましょう。 いちいち画像ファイルを出力しなくともDOT言語で記述したグラフをブラウザに表示することができ大変便利です！ d3-graphvizとは ウェブブラウザにフローチャート図を表示する d3-Graphvizの使い方 はてなブログで使う方法 d3-graphvizとは d3-graphvizとはDOT言語で書かれたファイルをGraphvizを用いてブラウザ上に表示させるオープンソース・ソフトウェアです。 Githubにソースがあります。 github.com D3.jsとはブラウザ上で動的にコンテンツを扱うJavaScriptライブラリです。 公式サイトはこちらをご参照ください。 d3js.org d3-graphviz

Graphvizを知っていますか？ これを使うとフローチャート図を描くことができます。 おっと今はあまりフローチャート図とは言わず状態遷移図と言ったりするのですね。 Windows10にChocolateyを使ってGraphvizを簡単にインストールしましょう。 Graphvizの使い方についても紹介します。 Graphvizとは DOT言語とは Chocolateyを使ってGraphvizをWindowsにインストールする方法 Graphvizの使い方 画像として出力する方法 Chrome拡張機能 Dot Lang Viewerをインストールして描画しよう まとめ Graphvizとは GraphvizとはDOT言語で記述されたグラフ構造を描画するフリーウェアです。 PostScript、PDF、SVGなどさまざまな形式の画像ファイルを出力することができます。 公式サイトはこちらです。

Mathjaxを導入して数式を美しく表示してみましょう。 CDNを利用して簡単にMathjaxを導入する方法についてご紹介します。 またインライン表示、ディスプレイ表示の方法や数式番号を付ける方法についても解説していきます。 はてなブログのMarkdown記法モードでの書き方、Pandocを用いて秀丸エディタなどのテキストエディタで記事を書く場合についてもまとめてみました。 はてな記法による数式表示 Mathjaxとは 美しい数式表示が可能 Mathjaxの導入方法 はてなブログへのMathjaxの導入方法 Mathjaxの使い方 インライン表示 ディスプレイ表示 Mathjaxを使った場合のPandocでの変換 長い数式でスマホで数式がはみ出す場合の対処方法 定理や公式をそれらしく表示する方法 まとめ はてな記法による数式表示 はてなブログでは、はてな記法で数式を簡単に書くことができます

クリックされやすいリンクの色はどんな色でしょうか？ 大抵のリンクは青色をしていますが、その青色も調べてみると実にさまざまな種類があることが分かりました。 主だった検索エンジンやブログサービスなどの青色リンクの色を比較して独自テーマ制作の参考にしていきます！ リンクの色 CSSカスタマイズで手間いらず 何か参考になるリンクはないか？ 2019年リンク色の調査結果 大手の検索エンジンでの検索結果の表示やブログサービス 大手ニュースサイトやブログサービス ターゲットリンクの色を考える まとめ リンクの色 今回はクリックされやすいリンク色についてトコトン考えてみましょう。 まぁまずはリンクは青色ってことでいいですよね。 リンクの色を赤にしても誤認されるだけですからね。 特にココゾというターゲットリンクは誤認されないように注意することが必要です。奇をてらう必要はありません。 じゃあ次に、どんな青色だ

年末になったので、はてなブログの大掃除をしてみました。 半年ほどの間に50本と少々の記事をアップしてきましたが、はてなブックマークのホットエントリ入りも果たすことができ、読者の数も順調に増えてきました。 ひとつの区切りとしてブログの中身を見直し、手を入れるべきところには手を入れてメンテナンスをしてみました。 ご参考にしていただければ幸いです。 ブログのバックアップ 普段からマークダウン記法でローカルに記事を書く方法 ブログ大掃除（記事の削除） 今年書いたブログ記事を読み直してみる ブログのバックアップ 大掃除の前にブログのバックアップを取っておくことをお勧めします。 はてなブログの場合のバックアップ方法を記載しておきます。 ダッシュボードから「設定」を選びます。 「詳細設定」のタブをクリックします。 スクロールして「エクスポート」の項目にある「記事のバックアップと製本サービス」のリンクをク

Chromeブラウザの拡張機能を使っていますか？ とても便利でお勧めしたいChrome拡張を紹介します。 Web開発する場合にお役立ちのものやSEO対策用など10個の拡張機能をリストアップしてみました。 はてなブログを運用する方に便利なものも最後にご紹介します！ Hover Zoom+ Roomy Bookmarks Toolbar CSSViewer WhatFont ColorZilla HTML5 Outliner headingsMap HTMLエラーチェッカー Wappalyzer Hatena Bookmark はてなのお知らせ まとめ Hover Zoom+ まず最初にご紹介するお勧めのChrome拡張はHover Zoom+です。 chrome.google.com これには随分とお世話になっています。 WEBサイトで表示されている画像にカーソルを当てることで拡大したものを

秀丸エディタをインストールしていますか？ 秀丸マクロではrunex文を使って外部コマンドを実行することができます。これは超便利！ 前回の記事で紹介したPandocを秀丸マクロに組み込み、マークダウン記法で書いているブログ記事を簡単にHTMLファイルに変換する方法をご紹介します。 秀丸マクロのrunex文 runex文のオプション指定 秀丸マクロを使ったPandocによるマークダウン記法のHTMLファイルへの変換 Pandocによるマークダウンファイル変換マクロの使い方 まとめ 秀丸マクロのrunex文 秀丸で外部コマンドを実行できる文としてはrun文、runsync文，runsync2文 などがあります。 この他にrunex文というものもあり、こちらではパラメータで細かく動作を指定することができ、同期/非同期を細かく指定して標準入出力を扱うことが可能になります。 runex文のオプション指

前回の記事では、はてなブログでのマークダウン記法の書き方について説明しました。 今回はPandocというソフトウェアをWindows10にインストールします。 更にPandocのオプション設定によりマークダウン記法を自分好みに変換する方法について説明します。 Pandocのインストール方法（windows10） Chocolateyによるインストール Pandocの使い方 変換可能なファイルの種類 Pandocのオプション指定 Pandoc拡張マークダウン Option例 まとめ Pandocのインストール方法（windows10） Chocolateyを使うと簡単にPandocをインストールすることが可能です。 Chocolateyのインストール方法はこちらをご参照ください。 ameblo.jp Chocolateyによるインストール それではさっそくPandocをインストールしていきま

はてなブログをマークダウン記法で書く方法を網羅的に調べます。 どのようなHTMLタグに変換されているのかをきちんと調べてテーマ制作の参考にしようと思います。 更に、ツールボックスを使った場合に挿入される内容などもこの機会に調べておきます。 はてなブログをマークダウン記法で記述する場合の参考にしていただければ幸いです。 見出し 見出しレベル1（H1) 見出しレベル2（H2) 見出しレベル3（H3) 段落と改行 強調表示 リンク 画像 リスト 箇条書きリスト 順番付きリスト 引用（ブロッククウォート） コード コードブロック テーブル 水平線 ツールバー 見出し 大見出し 箇条書き 番号付きリスト リンク 続きを読む 引用 目次 脚注 太字 斜体 打消し アンダーライン 文字の大きさ 文字色 まとめ 編集サイドバーからの挿入 写真を投稿 過去記事貼り付け 引用貼り付け 見出し 見出しを書く時は