はてなブックマーク

どうも、こうすけ（@kosuke_upd）です。 今回は、Windows 10 で US キーボードを使用しているときに、Google 日本語入力の日本語・英語切り替えキーを変更する方法を解説します。 Windows 10 では、US キーボードを使用し、Google 日本語入力も使用している際ののデフォルトでの日本語・英語切り替えは「Alt + `」キーに設定されているかと思いますが、「Alt + `」で日本語・英語切り替えを行うのに違和感を感じる人は多いと思います。 というわけで、Windows 10 で US キーボードを使用し、Google 日本語入力を使用しているときの、日本語・英語の切り替えキーを変更する方法を解説します。 手順 まずタスクバーにある Google 日本語入力の上で右クリックし、「プロパティ」を開きます。 「一般」タブ内の「キー設定の選択」にて「ことえり」を選択

どうも、こうすけ（@kosuke_upd）です。 今回は、WordPress プラグイン「UpdraftPlus」を用いて WordPress サイトを超簡単に移行 (引っ越し) する方法を解説します。ドメインの異なる WEB サイトへの移行ももちろん可能です。 WordPress を移行するのに便利なプラグインとして最も簡単に行えるのは、当ブログでも以前紹介した「All-in-One WP Migration」というプラグインです。 WordPressの引越しを超簡単にできる「All-in-One WP Migration」の使い方 しかし、「All-in-One WP Migration」は無料版だと容量に制限があり、ある程度記事数や画像数のある WEB サイトをこのプラグインで移行しようとすると、すぐに制限を超えてしまい、有料版を購入しなくてはならなくなります。 しかし、今回紹介する

どうも、こうすけ（@kosuke_upd）です。 今回は、タイピングアニメーションを簡単に実装できる Vue.js ライブラリ「vue-typed-js」を紹介します。実際にどんなタイピングアニメーションを表現できるのか、どうやって使うのかということについてお伝えします。 vue-typer-js は、タイピングアニメーションライブラリの中でもオプションの種類が多く、様々な表現ができることが特徴です。 では早速、vue-typer-js の紹介とその使い方についてお話していくので、順番に見ていきましょう。

どうも、こうすけ（@kosuke_upd）です。 今回は、Docker Compose による WordPress の日本語の開発環境の構築方法を解説します。 WordPress の開発環境といえば MAMP を使用したものがよく知られていると思いますが、Docker を使ってもさくっと簡単に作れてしまうんです。プログラミングができる人からすると、Docker を用いた開発環境のほうがサクサク開発を行えます。 加えて、Docker の中でも Docker Compose を用いることでより簡単に開発環境を構築できます。通常の Docker だとコンテナ同士を関連付けたり、起動する順番に気をつけたりする必要がありますが、Docker Compose を利用することでそれらの手間は一切不要になるからです。 というわけで、Docker Compose を用いた WordPress の開発環境の構

どうも、こうすけ（@kosuke_upd）です。 今回は、Laradockで複数のLaravel開発環境を構築し、管理する方法を解説します。 以前、こちらの記事でLaradockでのLaravel開発環境の構築方法を解説しましたが、この方法で複数の開発環境を動かそうとすると、環境を変更するごとに設定ファイルを変更する必要が出てきます。 Docker (Laradock) を使って Laravel の開発環境を構築する方法 しかし、これから紹介する方法でLaravelの開発環境を構築することで、複数のLaravel環境を構築しても簡単に環境を切り替えることができる汎用性の高いものを構築できるのです。 新規でLaradockによる複数のLaravel開発環境を構築する方法と、すでにLaradockによる開発環境が存在する状態からLaradockによるLaravel開発環境を追加する方法とに分け

WordPressのカスタムフィールドを簡単にかつ詳しく作成できるプラグイン「Advanced Custom Fields」の使い方を解説します。Advanced Custom Fieldsで扱える全項目の説明、出力方法、活用事例などを丁寧に説明していきます。 賃貸サイトやECサイトなど、ページの型が決まっているサイトの場合、WordPressの投稿編集ページにデフォルトでついているエディタを使用して1ページずつ作成していては面倒ですよね。また、WordPressやHTML、CSSなどがわからない人にページ作成を任せることも難しいと思います。 しかし、WordPressのカスタムフィールド機能をうまく活用することで、予め設定した項目を一つずつ埋めることでページを作成できるため、どんな人でも簡単に、かつ効率的にページを作成できます。 そんな便利な機能であるカスタムフィールドを簡単に実装できる

どうも、こうすけ（@kosuke_upd）です。 今回はカスタム投稿タイプ、カスタムタクソノミーを簡単に設定できるWordPressプラグイン「Custom Post Type UI」の使い方を解説します。Costom Post Type UIを使用してカスタム投稿タイプやカスタムタクソノミーを作る方法を、初めての人にもわかるように説明していきます。 カスタム投稿タイプやカスタムタクソノミーを使いたいと思っても、実際に使うためには少しハードルが高く、使い方がわからずに挫折してしまうことも多いと思います。 しかし、カスタム投稿タイプやカスタムタクソノミーを使いこなせるようになると、ユーザーからしても管理者からしても使いやすいサイトにすることができます。 というわけで、これから「Custom Post Type UI」を使用したカスタム投稿タイプやカスタムタクソノミーの設定方法を丁寧に解説して

WordPressで自動挿入されるpタグやbrタグを除去する方法を、状況別に6つ紹介し解説します。 WordPressの投稿ページや固定ページを編集して、いざプレビューで確認してみると、なぜかデザインが崩れてしまっていることがありますよね。デベロッパーツールなどでコードを確認してみると、なぜか勝手にpタグやbrタグが入っていることがあるのです。 実はこれ、WordPressにデフォルトで実装されているオートパラグラフという機能によるものなのです。より細かい部分までデザインしたい人にとっては余計な機能ですよね。過去に僕もこの機能のせいで何時間も苦戦した経験があります。 というわけで、今回は自動挿入されるpタグ、brタグを除去するための設定方法を解説します。一度設定すれば良いだけなので、ぜひ取り組んでみてください。 自動挿入されるpタグ、brタグを除去する方法 やり方はいくつかあり、状況によっ

正直なところどちらもかなり評価の高いプラグインですね。どちらも頻繁に更新されており、有効インストール数もものすごく多く、レビュー数や平均値も多く高いです。 ただし、これら2つを比べてみると、有効インストール数、レビュー数、レビューの平均値どれをとってもYoast SEOのほうが高い評価を得ていることがわかります。特に、Yoast SEOのレビュー数は22506というえげつない数値にもかかわらず、平均値も4.9というえげつない数値であり、このプラグインがどれほど世界中で好まれているかがおわかりかと思います。 といわけで、「すでにAll in One SEO Packを使用されている場合は無理にYoast SEOに乗り換える必要はありませんが、これからどちらかのプラグインを使用するならYoast SEOのほうがいいよ！」というお話でした。 では、Yoast SEOの使い方と設定方法を見ていきま

どうも、最近WordPressの開発環境構築を楽しんでいるこうすけ（@kosuke_upd）だ。 今回はAmazonの運営するAWS Cloud9を利用したWordPressのクラウド開発環境の構築方法を丁寧に解説する。 以前、自分の利用するPC内にサイトのデータを置いてWordPressの開発を行えるローカル開発環境「Local by Flywheel」でのWordPress開発環境構築方法を紹介したが、今回はクラウド（オンライン）上にサイトなどのデータを置いて開発を行えるクラウド開発環境「AWS Cloud9」によるWordPress開発環境構築方法を紹介する。 最近（現在2018年6月12日）Cloud9の仕様が変更され、以前は簡単にCloud9上にWordPressの開発環境を構築できたのだが、今では多少手間がかかるようになっている。 そのため、今のままだとプログラミング初心者はC