ブログ

Webサイト上に配置した画像内の任意の場所をクリックできるようにするコーディング方法の紹介です。 「クリッカブルマップ」あるいは「イメージマップ」と呼ばれたりしていて、特別な実装方法ではなくHTMLがあらかじめ用意されて […]

途中からヘッダー固定にする方法の紹介です。 スクロールしてグローバルメニューが画面の上部に達した時に固定するという動きを実装していきます。 実際の動きとしてはこんな感じです。 途中からヘッダー固定にする方法 HTML ヘ […]

TwitterやFacebook、Lineなどの公式が提供しているSNSボタンを設置する方法を紹介していきます。 ※ 本記事は2019年3月29日現在の情報です。公式の仕様変更などでコードや使い方が変わっている可能性があ […]

EJS（イージェーエス）はテンプレートエンジン呼ばれるNode.jsのパッケージの１つです。JavaScriptとHTMLを混ぜた感じでHTMLサイトが作れることをイメージしてもらえたらと思います。 1番のメリットとして […]

これまで約300件のWordPress案件を対応してきました。そのほとんどが既存テーマを書き換える「カスタマイズ」案件です。ビビリなので石橋を叩きつつ対応するのですが、失敗がゼロというわけにはいきませんでした。 数多くの […]

Font AwesomeをPCにインストールしておくと、XDやPhotoshopなどのデザインカンプにコピペで使うことができるようになります。 一般的に画像で作られていることが多いですが、個人的にFont Awesome […]

WordPressのお問い合わせフォームで郵便番号から住所を自動で入力できるようにする方法です。 対象のお問い合わせフォームとして、「Contact Form 7」と「MW WP Form」で作ってみました。住所の自動入 […]

VScodeのテキスト比較（diff）する3つの方法の紹介を紹介します。 1つ目はVSCodeで標準に備わっているテキスト比較の使い方で実用的ではないかもしれませんが、操作方法だけでも覚えておくと後から役立つかもしれませ […]

WordPressの記事内コンテンツを一括置換できるプラグイン「Search Regex」の紹介です。 個人的には主にURLの置換で使うことが多いかと思います。 Search Regexのインストール プラグイン → 新 […]

EditorConfigはテキストエディタで標準で利用するタブ数やインデントをタブにするかスペースにするか、改行コードをどうするか、みたいなことを定義できるツールです。 多くのテキストエディタ（を拡張すること）でサポート […]

物販系で使えるWeb APIのサービスを3つ紹介します。Amazon、楽天、Yahoo!の3つですね。 思い返せばわたしがインターネット経由で初めてお仕事をいただいたのが、「Web APIを使って物販ツールを作って欲しい […]

WordPressには2台巨塔のお問い合わせフォームプラグインがあります。 Contact Form 7 MW WP Form いつもお世話になりっぱなしで、開発者の方には足を向けて寝ることはできません…。本 […]

Basic認証の設定方法の紹介です。 Basic認証とは、サイトにアクセスした時に以下のようなポップアップが表示されて、閲覧できるユーザーを制限できる簡易的な仕組みなります。 公開前のサイトなどのまだ不特定多数からアクセ […]

WordPressの記事中に目次を自動作成してくれるプラグイン「Table of Contents Plus」の紹介です。 目次があれば、読み手にとって優しいサイトになるだけでなく、Googleの検索結果にサイトリンクが […]

「〇〇の公開されているサイトをフルリニューアルしたい」 「〇〇の公開されているサイトをWordPress化したい」 「〇〇の公開されているサイトをレスポンシブ化したい」 「〇〇の公開されているサイトを引っ越ししたい」 み […]

フォルダ（ファイル）の整理する方法をまとめてみました。 安易にデスクトップに作らないことと、一時的に作った用済みファイルは削除することが優先順位が高めで大事なことかもしれないなって思いました。 ファイル、フォルダ管理術 […]

GitHubとのやり取りをコマンドではなく、ボタンなどの操作で直感的に操作できるのがSourcetreeというツールです。 ターミナルなどの黒い画面が苦手な方でも、Sourcetreeを入れておけば簡単にGitの操作、お […]

Photoshopがゴリゴリで使える必要はありませんが、最低限でも使えるとコーディングでちょっとだけ楽になったりします。 わたしがよく使う5つの項目と使い方をまとめたので、「Photoshopの画像加工ってどこから勉強す […]