WordPress

XAMPPを使ってWordPress用にローカル環境構築する方法【初心者向け】

XAMPPを使ってWordPress用に【ローカル環境】を構築する方法を初心者向けに解説した記事です。XAMPPのインストール方法から、設定方法の基礎までまとめています。ローカル環境でサイト制作してから公開したい方はお読みください。

テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元：GMOリサーチ株式会社　調査期間：2021年8月12日～8月16日　調査対象：2020年8月以降にプログラミングスクールを受講した18～80歳の男女1,000名　調査手法：インターネット調査

WordPressを使ったサイト制作でも、ローカル環境を構築することができます。サイトをカスタマイズして、完成させてから公開したいという方におすすめです。

「ローカル環境を構築」と言うと、専門的で敷居が高そうですが、XAMPPを使うと手軽にできます。

今回は、XAMPPを使ってWordPress用にローカル環境構築する方法をお伝えします。

なお本記事は、TechAcademyのWordPressオンラインブートキャンプの内容をもとに紹介しています。

田島メンター！！WordPressのカスタマイズをしてみたいんですけど、はじめから本番環境でやるのって怖いので、何かいい方法はないですか？

それならXAMPPを使ってパソコン上にローカルの開発環境を作るといいよ。

XAMPPですか・・・？なんか難しそうですね・・・・・。

手順を踏めばそんなことないよ！やってみようか。

はい、お願いします！

XAMPPをダウンロード、インストール

まずはXAMPPをインストールしてみましょう。

上記のリンクを参考に試してみてください。一緒に簡単な使い方もチェックしておくと良いでしょう。

XAMPPを起動

起動して、「Apache」と「MySQL」をスタートさせます。

local1

スタートさせたら、ブラウザに「http://localhost」を入力して開いてください。

言語を選べるので、一番端の日本語を選択します。
local2

この画面が表示されたら準備完了です。

local3

[PR] WordPressで挫折しない学習方法を動画で公開中

セキュリティ設定

まずはセキュリティを設定していおきましょう。左のメニューから、「ステータス」を確認してください。

赤枠で囲んだ部分が「要注意」として警告が出ていると思います。

local4

このままでは、外部から攻撃されてしまうリスクがあります。

リンク先から、セキュリティの設定をしましょう。

local5

MYSQLのROOTパスワードとXAMPPのディレクトリ制御（.htaccess）のユーザ名とパスワードを決めていきます。

ここで決めたパスワードは忘れないように注意してください。

なお、XAMPPのセキュリティについては、XAMPPでセキュリティ設定を行う方法でより詳しく紹介しています。

WordPress用のデータベースをMySQLに作成

ホーム画面の左メニュー、ツールの「phpMyAdmin」をクリックしてください。

local6

ログイン画面が表示されるので、言語で日本語を選択します。

その下には、先ほど設定したMySQLのユーザ名とパスワードを入力します。

local7

MySQL接続の照合順序が「utf8_general_ci」にであることを確認してください。

OKなら、上部にある「データベース」をクリックします。

続いて、作成するデータベースの名前を決めて入力します。

WordPress用なので、「wp」とするとわかりやすいかもしれません。

local8

XAMPPにWordPressをインストール

いよいよWordPressをインストールしていきます。

まず、WordPressの公式サイトからWordPressをダウンロードしてください。

ダウンロードしたzipファイルは解凍ソフトで解凍し、XAMPPの中に移動します。移動する場所は、C:￥xampp￥htdocsのフォルダの中です。この「htdocs」というフォルダが、公開ディレクトリになります。

これで、WordPressのインストールは完了です。

ブラウザからログイン

最後に、ブラウザからログインしてユーザー名などを設定します。

http://localhost/wordpress（ここは、作成したフォルダ名で変わります）/にアクセスしてください。

このあとは通常のWordPressを設定するときと同じですので、WordPressをインストールする方法を参考にログインしてみてください。

ログインできると、ローカル環境でWordPressの編集ができるようになります。

いかがでしたか？

WordPressを本格的に自分でデザインしてみたい！という人は、ぜひチャレンジしてみましょう。

WordPressをさらに使いこなしたい場合は、WordPressを最新版にアップグレードする方法も合わせてご覧ください。

これで安心してカスタマイズができます♪

そうだね。失敗しても気軽に作り直せるから安心だね！

はい♪

[お知らせ]TechAcademyでは、WordPressを使ってカスタマイズしたオリジナルサイトを構築できるWordPressオンラインブートキャンプを開催しています。期間中の8週間は現役エンジニアのメンターが毎日学習をサポートするので、独学よりも効率的に学ぶことができます。

CKEditor For WordPressの使い方ーWordPressプラグイン【初心者向け】

WordPressのプラグインの使い方を初心者向けに紹介する記事です。今回は、WordPressのビジュアルエディタを拡張できるプラグインの1つである、...

WordPress

TinyMCE Advancedの使い方ーWordPressプラグイン【初心者向け】

WordPressのプラグインの使い方を初心者向けに紹介する記事です。今回は、WordPressのビジュアルエディタを拡張できるプラグインの1つである、...

WordPress

遅いと感じたら導入！WordPressのページ表示速度を高速化できるプラグイン5選

WordPressは、HTMLで構築したサイトと違って、動的にページを生成する仕組みです。そのため、アクセス数が増えると、サーバー負荷が増えてしまい、ページ表示...

WordPress

まずはここから！WordPressのセキュリティを強化できるプラグイン5選

WordPressで制作したサイトを運営しているなら、セキュリティ対策は万全にしておきたいですよね。万が一、Webサイトの乗っ取りや改ざんをされてしまうと、自分...

WordPress

WordPress SEO by Yoastの使い方ーWordPressプラグイン【初心者向け】

SEO対策の人気のプラグイン「WordPress SEO by Yoast」について紹介していきます。とても便利な機能が多いので、一つ一つ見ていきましょ...

WordPress

Slideshowの使い方ーWordPressプラグイン【初心者向け】

WordPressのプラグインの使い方を初心者向けに紹介する記事です。今回は、スライドショーで画像を表示するのに便利なプラグイン、Slidershowの...

WordPress

あわせてよく読まれている記事

今さら聞けない！XAMPPをインストールする方法【超初心者向け】現役エンジニアが解説

プログラミング初心者にとって、開発環境の構築は最初難しいこともあると思います。そこで、今回は開発環境のうち、使われることも多い「XAMPP（ザンプ）」をインストールする方法と、簡単な使い方・設定方法をご紹介します。ぜひ記事を参考にインストールしてみてください。（※記事でインストールする環境のOSはWindows10です）目次本記事では、下記の手順でXAMPPをインストールしていきます。 XAMPPとは XAMPPのインストール方法 XAMPPの使い方おわりにそもそもPHPについてよく分からないという方は、PHPとは何なのか解説した記事を読むとさらに理解が深まります。 XAMPPとは XAMPPとは、Webアプリケーション開発に欠かすことのできないソフトウェアとそれ以外にもあると便利なツールを、無料で一括インストールすることができるパッケージのことです。そもそも、Webアプリケーションを作成するには、最低でも以下が必要になります。 Apache（Webサーバ） MySQL（SQLデータベース） Webプログラミング言語（PHP、Rubyなど）しかし本来この3つのソフトウェアはそれぞれ別の団体で作成・アップデートされているため、個別にダウンロード・インストールする必要があります。これらのソフトウェアのインストールは、Webアプリケーション開発を初めてする人にとっては理解しにくいところがあるため、肝心のアプリ開発の前に挫折することもあるでしょう。そんな時に役に立つのが「XAMPP」です。ただし、XAMPPはパッケージとしての特性上、ソフトウェアによっては最新版のものでなかったりすることもあります。そのため、商用利用する際は、セキュリティ面からそれぞれのソフトウェアのバージョンアップが必要になるのでご注意ください。大石ゆかりいろんなソフトウェアで成り立っているんですねー。田島悠介 Webアプリケーションって何か特別な感じがするけど、プログラムで作られているソフトウェアで成り立っているんだ。大石ゆかりテスト環境では、セットでダウンロードした方がいいですね。田島悠介そうだね。XAMPPっていうパッケージが一般的なので、これをインストールしてみよう！ [PR] WordPressで挫折しない学習方法を動画で公開中XAMPPのインストール方法ここからは、XAMPPのダウンロード・インストール方法をご紹介します。 (1)XAMPPパッケージをダウンロードまずは、Apache Friendsにアクセスします。上記画像赤枠の「Windows向け XAMPP8.0.2(PHP8.0.2)」をクリックしてください。 Macの場合は「OS X向け XAMPP8.0.2(PHP8.0.2)」をクリックしてください。なお、「8.0.2」の部分はバージョンです。執筆時点では「8.0.2」でしたが、パッケージの更新により変わる可能性があります。クリック後、下記画面に切り替わりインストーラーのダウンロードが開始されます。ダウンロードが完了するまで少々お待ちください。ここで、ダウンロードしたファイルは「xampp-windows-x64-8.0.2-0-VS16-installer.exe」です。このファイル名もパッケージのバージョンによって変わる可能性があります。 (2)XAMPPインストール先ほどダウンロードした、「xampp-windows-x64-8.0.2-0-VS16-installer.exe」をダブルクリックします。最初に以下の警告が表示されます。これは「C:￥Program Files にインストールするとユーザー権限の関係でXAMPPの動作が制限される」という意味です。別のフォルダにインストールするため、問題ありません。「OK」をクリックします。ここで下記画面が表示されますので、「Next」をクリックしてください。次にインストールするソフトウェアを選択する画面が表示されます。今回はすべてのソフトウェアをインストールするので、すべての項目にチェックを入れて「Next」をクリックしてください。 ※注意既にインストールされているソフトウェアは灰色になり、選択できません。つづいて、インストールするフォルダの選択です。デフォルトのインストール先は「C:xampp」になっているので、ここは変更せずに「Next」をクリックしてください。 ※注意インストール後、「C:xampp」は約740MBのフォルダになるので、Cドライブの容量にお気をつけください。次は言語の選択です。日本語は選択できないため「English」のまま「Next」をクリックしてください。ここで表示される画面は「Bitnami」という、オープンソースプロジェクトについての説明です。今回は「XAMPP」のインストールの紹介ですので、下記画面のチェックは外して「Next」をクリックしてください。 WordPressやRedmineに興味がある方は、別途「Bitnami」を確認してみてください。最後に「XAMPP」をインストールしていいか聞かれるので、今までと同様に「Next」をクリックしてください。クリック後、下記画面が表示されます。お使いのPCのスペックにもよりますが、インストールには1分～5分程度かかります。このように表示されたらインストール完了です。このあと、「XAMPP」の動作確認をするので、画面赤枠のチェックボックスにチェックを入れた状態で、「Finish」をクリックしてください。また、普段XAMPPを使う場合は「スタートボタン」→「XAMPP」→「XAMPP Control Panel」をクリックすると開きます。大石ゆかりインストールは、フォルダを選択するぐらいで、けっこう簡単ですねー。田島悠介パッケージになっていて便利だね。大石ゆかりただ、ちょっとソフトウェアが多いですね。田島悠介簡単に説明すると、ApacheがWebサーバで、基本的にはファイルとフォルダを返すんだ。 MySQLがデータベース、FTPサーバがFilleZilla、メールサーバがMercury、WebalizerはApacheのログを詳しく解析してくれて、TomCatはJavaで作られたWebサーバで、PHPとPerlはプログラミング言語なんだ。 XAMPPの使い方最後にXAMPPの簡単な使い方を紹介します。今回は、「Apache」と「MySQL」の実行方法について説明します。操作はいたって簡単で、下記画面の赤枠の「Start」をクリックするだけです。正常に「Apache」「MySQL」が起動すれば、下記画面のように、PID(s)、Port(s)に数字が表示されます。この時の注意点です。お使いのPCに「Skype」がインストールされている場合、「Apache」が起動できないことがあります。その場合は、Windowsのデスクトップの右下にあるインジケータでSkypeアイコンを右クリックし、「Skypeを終了」を選択してSkypeを終了させます。その後、改めて「XAMPP」を起動して、「Apache」を起動してください。おわりに XAMPPのインストール方法は以上です。インストールが完了したら、XAMPPの文字化けを直すためにphp.iniの設定を合わせて行いましょう。執筆してくれたメンター太田和樹（おおたかずき） ITベンチャー企業のPM兼エンジニア普段は主に、Web系アプリケーション開発のプロジェクトマネージャーとプログラミング講師を行っている。守備範囲はフロントエンド、モバイル、サーバサイド、データサイエンティストと幅広い。その幅広い知見を生かして、複数の領域を組み合わせた新しい提案をするのが得意。開発実績：画像認識技術を活用した駐車場混雑状況把握、音声認識を活用したヘルプデスク支援システム、ロボットアプリの開発、大規模基幹系システムの開発・導入マネジメント。著書「知識ゼロからの機械学習入門（技術評論社）」。地方在住。仕事のほとんどをリモートオフィスで行う。通勤で消耗する代わりに趣味のDIYや家庭菜園、家族との時間を楽しんでいる。大石ゆかり Skypeがポート番号を使っていることがあるんですねー。バッティングすると少し面倒なことになりそうですね。田島悠介そうだね。プログラムって、ポート番号を指定して立ち上げることも出来るんだよね。大石ゆかりプログラムがポート番号を使うんですか？何か実際の例はありますか？田島悠介例えばブラウザにhttps://www.yahoo.co.jp:443って接続するとわかりやすいかな。Webサーバプログラムに接続してるんだよね。他の番号を入力するとエラーになるから、443には何かプログラムが起動しているってわかるよね。テックアカデミーでは、初心者でもPHPやフレームワークのLaravelを使ってWebアプリケーション開発を習得できるオンラインブートキャンプPHP/Laravel講座を開催しています。挫折しない学習方法を知れる説明動画や、現役エンジニアとのビデオ通話とチャットサポート、学習用カリキュラムを体験できる無料体験も実施しているので、ぜひ参加してみてください。

PHP

WordPressの使い方！初心者でもサイト作成が簡単に｜現役エンジニアが解説

WordPressを使用するとデザインの変更や機能のカスタマイズ、データの管理を手軽に行える多機能なブログサービスを作成することができます。実際、このTechAcademyマガジンもWordPressを使って作られたサイトです。他にも企業のコーポレートサイトやブログサイトなどの多くはWordPressを使われているのです。サイト作成に便利なプラットフォームなので、ぜひ使えるように理解していきましょう。そもそもWordPressとは何なのかよく分からない方は、今さら聞けない！WordPressとは【初心者向け】をご覧ください。なお本記事は、TechAcademyのオンラインブートキャンプ、WordPress講座の内容をもとに紹介しています。大石ゆかり田島メンター！！WordPressのことはなんとかわかったんですけど、どうやって使うんですか〜？田島悠介 WordPressを使うにはインストールや初期設定が必要なんだ。大石ゆかりなんだか難しそうですね・・・。田島悠介きちんと手順に従えば簡単にできるよ。インストールさえしてしまえば、簡単に記事の作成とかサイトデザインとかもできるから。それじゃあ教えてあげるね。大石ゆかりよろしくお願いします！！！目次 WordPressのインストール手順初期設定とインストール WordPress管理画面の基本設定記事の投稿方法カテゴリーとタグの管理ユーザー管理パーマリンクの設定テーマの使い方プラグインの使い方 WordPressで知っておきたいその他の設定 WordPressのインストール手順用意するもの PHP・MySQLが使用できるサーバー(レンタルサーバーなど) 以下の条件があります。 PHP バージョン 7.4 以上 MySQL バージョン 5.6 以上または MariaDB バージョン 10.1 以上 HTTPS対応 (2020年6月時点) FTPクライアント(今回はFileZillaを使用します) 独自ドメイン(yahoo.co.jpのように自分のサイトを公開する場合に必要です) 独自ドメイン、レンタルサーバーについては別途記事内で比較しています。合わせてご覧ください。本体の入手とサーバーへのアップロードまずはWordPressの公式サイトのダウンロードページにアクセスしましょう。 WordPress – ダウンロード以下のボタンをクリックしてWordPress本体をダウンロードします。ダウンロードし、解凍した「wordpress」という名前のフォルダを任意の半角英数字の名前に変更します。ここではwpとしています。(変更せず、「wordpress」のままでもOKです) FTPクライアントを使用してサーバーに本体をアップロードします。今回はFileZillaを使用します。サーバーに接続し、WordPressを設置したい場所にフォルダごとアップロードします。アップロードしたフォルダのある場所にアクセスします。※ ※例えばhttp://xxxx.ne.jp/に「wp」と名前変更したWordPressフォルダをアップロードした場合、アクセスする場所はhttp://xxxx.ne.jp/wpとなります。また、これがそのサイトのアドレスになります。 [PR] WordPressで挫折しない学習方法を動画で公開中初期設定とインストールデータベースの設定を行います。「さあ、始めましょう！」のボタンをクリックします。データベース名・ユーザー名・パスワード・データベースのホスト名を入力し、「送信」ボタンをクリックします。これらは使用しているレンタルサーバーにより設定が異なります。以下は、レンタルサーバーのスターサーバーでの例です。(管理画面の「データベース設定」から見ることができます) パスワードはこのデータベースで設定したものを入力します。また、データベースの文字コードは「UTF-8」にしておきます。「インストールを実行」をクリックします。ここではWordPressサイトの基本的な設定を行います。また、これらの項目は全て後でいつでも変更できます。「検索エンジンがサイトをインデックスしないようにする」にチェックを入れるとサイトが検索エンジンに表示されない状態にしておくことができます。テスト導入時などにチェックします。入力後「WordPressをインストール」をクリックします。インストール完了のメッセージと、ログイン用のユーザー名とパスワードに関する情報が表示されます。続いてログイン画面が表示されます。設定したユーザー名とパスワードを入力し「ログイン」をクリックします。管理画面の基本設定ログインするとWordPressの管理画面が表示されます。記事の投稿やサイトデザインの変更、プラグインの追加や各種設定はこの画面から行います。サイトの基本情報変更左メニューの「外観」から「カスタマイズ」を選択します。「サイト基本情報」を選択します。サイトのタイトルとキャッチフレーズはここからいつでも変更できます。ログイン・ログアウト方法管理画面からログアウトする場合は上メニューのユーザー名から「ログアウト」を選択します。再び管理画面にログインするときはサイト上の「ログイン」(テーマにより表示されないものもあります)か、WordPressフォルダ内にあるwp-login.phpにアクセスすることでログイン画面に移行することができます。※ ※例えばhttp://xxxx.ne.jp/wpというサイトの場合はhttp://xxxx.ne.jp/wp/wp-login.phpがログイン画面へのアクセスになります。記事の投稿左メニューの「投稿」から「新規追加」を選択します。「タイトルを追加」の部分にタイトル、「文章を入力、または…」の欄に本文を入力します。なお、WordPressではバージョン5.0からエディタが「ブロックエディター」に変更になっています。この記事でもブロックエディターの説明を行っています。また、/ を入力するか、+ボタンを押すことで画像などのコンテンツを挿入することができます。入力が完了したら「公開」ボタンをクリックすると記事がサイトに反映されます。予約投稿の方法「公開」ボタンを押せば、その瞬間記事として公開されますが、中には決まった時間に公開したいと思う人も多くいるでしょう。公開ボタンを押した画面の下に表示されている「公開：今すぐ」をクリックします。カレンダーが表示され、日時を自由に決めることができます。トップページには出したくないから過去の記事として公開したい、明日の9時に公開したいので、予約投稿にする際に便利です。今より先の時間に設定すると、「公開」から「予約投稿」というボタン名に変わります。設定した時間になったら自動的に公開されるので、時間に合わせて手動で公開する必要がなく便利な機能でしょう。カテゴリとタグの管理 WordPressでは投稿した記事を分類するために、カテゴリーやタグを利用することが出来ます。一般的に、カテゴリーは、記事を大まかにグループ分けする場合に使われ、タグはさらに細かく分ける場合に用いられています。 WordPressで投稿する記事は、必ずカテゴリーを選択しなければなりませんが、タグは必ずしも設定しなくてもよいことになっています。新規カテゴリーの作成方法ログインした後、「投稿」から「カテゴリー」を選択すると、カテゴリー新規追加、既存のカテゴリー編集の画面が開きます。名前にカテゴリー名を書いて、下のほうにある新規カテゴリーを追加ボタンを押すと、新規カテゴリーが追加されます。スラッグというのは、カテゴリーのアドレスにつける別名みたいなものです。スラッグを設定しない状態で、未分類のカテゴリー一覧の記事を表示した場合、アドレスが以下のようになります。 http://あなたのHPのURL/category/%E6%9C%AA%E5%88%86%E9%A1%9E/ ブラウザのURLを見てみると、 http://あなたのHPのURL/category/未分類/ と表示されていますがそれはブラウザが気を利かせて、日本語に変換してくれただけで、本当はURLエンコードされた日本語文字列になっています。コピーしてテキストエディタや掲示板などの入力欄に貼り付けるとわかります。未分類のカテゴリーに対して、not-categoryなどのスラッグをつけると「http://あなたのHPのURL/category/not-category/」でアクセスできるようになります。また、カテゴリーに親カテゴリーを指定することで、カテゴリーに階層構造を持たせることも出来ます。新規タグの作成方法ログインした後、「投稿」から「タグ」を選択すると、タグの新規追加、既存のカテゴリー編集の画面が開きます。タグもカテゴリーと同じで、スラッグを利用することが出来ます。タグは、記事投稿時に複数設定することが出来るので、該当するものを設定しましょう。ユーザー管理 WordPressでは、複数人で管理することも出来て、それぞれ権限を設定することでセキュリティを向上させることが出来ます。管理画面のユーザーをクリックすると、新規登録・編集画面になります。権限グループごとに何ができるのか新規追加の前に、権限について見ていきます。権限には以下の5種類のグループがあります。購読者 WordPressにログインすることが可能。プロフィールの変更が出来る寄稿者記事を投稿できる。ただし、編集者や管理者が許可しない限り公開状態には出来ません投稿者記事を投稿できるが、他のユーザーが作成した記事は扱えないことと、固定ページ作成は出来ない編集者他のユーザーが作成した記事や固定ページなども扱えるが、デザインやプラグインなどWordPressの設定に関わるものは扱えない管理者全ての権限があるとなっています。寄稿者は記事を投稿できるものの、公開状態にするには編集者以上の権限を持つユーザーの許可が必要。投稿者は、記事を投稿できるものの、カテゴリーなどの作成や管理権限が必要なもの、他のユーザーが作成した記事の編集は行えません。編集者は、ほとんど全ての作業が可能ですが、設定にかかわるものは変更できないです。管理ユーザーに権限を設定することで、複数人の管理人がいてもセキュリティが守られるようになっています。新規ユーザーの登録方法管理画面の「ユーザー」をクリックすると、登録されているユーザー一覧が表示されます。ページトップに「新規追加」ボタンがあるので、こちらをクリックしましょう。必要な情報を設定した後、権限を決めて追加ボタンを押すと追加できます。権限を間違えると、全ての記事が削除されてしまう恐れもあるので注意が必要です。ユーザーの削除方法管理者の権限を持つユーザーでログインすると、削除することが出来ます。パーマリンクの設定パーマリンクでは、記事ページなどのURLをカスタマイズすることができます。「設定」から「パーマリンク設定」でパーマリンクの編集を行うことができるので、確認してみましょう。 URLとは、通常であれば、ファイルの場所を示しています。例えば、URLが http://ほにゃらら.com/aisatsu/ohayou.html だった場合「aisatsu」というフォルダの中の「ohayou.html」というファイルの情報が返されます。ところがWebサーバーの設定でこれを変更することが出来ます。WordPressのインストール先のフォルダに.htaccessファイルがあります。中身について詳細は解説しませんが、要求したファイルやフォルダがない場合、全てのアクセスを「index.php」というファイルに集める、という設定になっています。index.phpにアクセスを集めて、ブラウザのアドレスから判断して、プログラムでデータベースから検索して結果を表示しています。 WordPressのデフォルトの設定では、2020年6月24日に投稿した場合のURLは、 http://あなたのURL/2020/06/24/hello-world/ などのようになっています。この/2020/06/24/hello-world/の部分が、パーマリンクになります。デフォルトでは、日付と投稿名でデータベースから記事を取得しているようです。この部分をある程度自由に変更することが出来ます。パーマリンクの変更パーマリンクを変更した場合、どのようにURLが変わるのかを見てみます。パーマリンクの設定の変更画面は、管理画面から設定、パーマリンク設定をクリックします。デフォルトの状態は、日付と投稿名です。2020年の6月に投稿した記事であれば、 /2020/06/投稿した記事のタイトル/ というURLになります。基本に設定すると「/?p=123」という、記事に設定されている番号が付けられます。これはデータベース上で管理されている、その記事唯一の番号です。月と投稿名だと「/2020/06/投稿した記事のタイトル/」になります。数字ベースだと「/archives/123」といった形になります。投稿した記事のタイトルだけという設定もあり「/投稿した記事のタイトル/」というURLにすることも可能です。パーマリンクのカスタム構造パーマリンク設定では、自分でカスタマイズすることもできます。構造タグというものを使用します。詳しくは使い方を参照してください。カテゴリーベースを変更することも出来ます。カテゴリーベースのところを.(ドット)にすると「/category/カテゴリー名/」になるURLが「/カテゴリー名/」に短縮することも出来ます。ただし、その場合投稿記事のパーマリンクが「/記事のタイトル/」になっていた場合、重なる可能性があります。記事の投稿名がhello-worldで、カテゴリーにhello-worldがあった場合どうなるでしょうか？どちらも http://あなたのURL/hello-world/ でアクセスできてしまいます。この場合、投稿した記事が優先して表示されてしまい、カテゴリー一覧が表示されなくなるので注意が必要です。テーマ WordPressは「テーマ」という機能によりサイトのデザインを簡単に変更することができます。各種テーマは公式が作成したものやユーザーが公開しているものが使用できます。個人や企業でWordPressのテーマを作っているところも多いので、費用をかけなくても十分整ったサイトを作ることができるはずです。テーマの変更方法左メニューの「外観」から「テーマ」を選択します。インストール済みのテーマの一覧が表示されます。上の「新規追加」かテーマ一覧内の「新しいテーマを追加」をクリックします。テーマは新着や人気順から探せる他、右上の「テーマを検索」からキーワードを指定して見つけることができます。テーマをインストールし、一覧画面から「有効化」をクリックするとサイトに反映されます。テーマの例「WP Portfolio」テーマは、ポートフォリオ作成に適したテーマです。記事作成時にアイキャッチに指定した写真やイラストなどを一覧できるため作品を見せやすくなっています。おすすめのテーマ各シチュエーションで使えるWordPressのテーマを紹介します。国内ではブログサイトやコーポレートサイトをWordPressで利用している企業が多いですが、海外ではECサイトなどもテンプレートが用意されているので、ぜひ使ってみてください。以下では、ブログサイト、ECサイト、コーポレートサイトに分けてそれぞれ人気のテーマを紹介しています。ブログサイトアルバトロスかなり多くのブロガーが利用しているオープンケージのWordPressのテーマ。その中でも王道のアルバトロスをおすすめしたいと思います。有料ではありますが、技術的なスキルが全くない人でも簡単におしゃれなWebサイトを作れるのが大きな特徴です。カスタマイズもかなり自由に行えますし、一度買ってしまえばずっとサイトを運営できるので、多くのブロガーから人気なのでしょう。アルバトロス賢威 SEOに強いブログ・サイトを作りたい方におすすめのテーマです。ウェブライダーという様々な企業のSEOコンサルを担ってきた会社が開発を行っています。サイトのテーマだけでなく、SEOに関するマニュアルも載せているので、集客にも力を入れたい人にとっては一石二鳥なテーマになるはずです。賢威 Riba Lite 画像のサムネイルが大きくバックに表示されているタイプのサイトです。カメラでよく写真を撮ったり、トップページで写真を強調させたいときにおすすめのテーマです。ダウンロード / DEMO Hueman よく見るニュースサイトのような作りになっているテンプレートです。サイドメニューも充実しており、どこに何を置くか難しい技術を使わなくても選択するだけで設定することができます。個人のブログサイトとしても活用できるので、ぜひ活用してみてください。ダウンロード / DEMO ECサイト Shop Isle wordPressでECサイトを構築する際は、WooCommerceプラグインを使うのが定番です。WooCommereに特化したテーマの1つがShop Isleです。様々な効果を適用でき、ECサイトだけでなくビジネスサイトとしても活用できます。より高機能のPRO版も存在します。ダウンロード / DEMO YITH Proteo ファッションやアパレル系のECサイトにおすすめです。カテゴリも細かく設定できますし、洋服などを販売する際に写真にマウスオーバーすると他の写真も出てくるといった仕掛けもあります。スマホで見るとカートに入っているアイテム数、購入金額がトップで確認できるのでユーザーとしても使いやすいでしょう。ダウンロード / DEMO Fukasawa 白を基調としたデザインでより一層アイテムを引き立てるテンプレートでしょう。商品自体も白をバックに写真を撮っているので、シックな印象を与えますね。ブランディングとしての見せ方としても使えるのでおすすめです！ダウンロード / DEMO コーポレートサイト Zelle PRO WordPressのテンプレートの中でも非常に多機能で、出来ないことは無いんじゃないかというくらい多くのことを実現できるはずです。また、デザイン面でもスクロールすると横からフォームが出てくるパララックス仕様になっており、おしゃれにも見えるでしょう。ダウンロード / DEMO Sydney 画像がディスプレイいっぱいに表示されたインパクトの大きいテンプレートです。トップページに会社情報、事業内容、メンバー、SNSアカウント、ニュースなど多くの情報も載せられるのでスクロールしていて飽きが来ないでしょう。ダウンロード / DEMO 他にも初心者におすすめの無料で使えるWordPressのテーマを紹介しているので、合わせてご覧ください。プラグイン WordPressではプラグインという拡張機能を使うことによってサイトにさまざまなシステムを追加することができます。アクセス解析を行うものや問い合わせフォームを追加するもの、スライドショーを表示させるものなどさまざまなプラグインがあります。プラグインの検索とインストール左メニューの「プラグイン」から「新規追加」を選択します。テーマのときと同様に、新着順や人気順・キーワードでの検索でプラグインを探すことができます。「今すぐインストール」ボタンをクリックするとプラグインがWordPressにインストールされます。インストールされたらすぐに利用できるわけではなく、まず有効化をしなければなりません。プラグインの有効化左メニューの「プラグイン」から「インストール済みプラグイン」を選択します。インストールされているプラグインの一覧が表示されます。使用したいプラグインの「有効化」をクリックします。プラグインの例 SNSボタンのプラグイン「Social Media Feather | social media sharing」プラグインを使用すると、サイトの記事にFacebookやTwitterなどの共有用アイコンを追加することができます。利用するサービスやアイコンの大きさなども自由にカスタマイズが可能です。記事をシェアしてもらうためにもSNSボタンはぜひとも設置しておきましょう。記事編集で役立つプラグイン TinyMCE Advanced 記事作成をする前に必ず入れておきたいプラグインです。ビジュアルエディタに追加できる各機能を手軽に設定できます。 TinyMCE Advancedの使い方 WP Videos YouTubeやVimeoといった外部の動画を記事内に埋め込むことができるプラグインです。URLを入力するだけで追加できるので、簡単に設定できるはずです。 WP Videos SEO対策に役立つプラグイン All in One SEO Pack SEO対策全般の設定をまとめて行えるプラグインです。 FacebookやTwitterといったSNSとの連携、SEOにおいて欠かせないタイトルタグ・ディスクリプションタグの設定も行えるので、まず最初に入れておきましょう。 All in One SEO Packの使い方 Google XML Sitemaps XMLサイトマップを作成してGoogleに更新を通知させることができます。サイトマップがあることでサイトにどんなページが存在するのかGoogleに認識させることができるので、SEOの効果も見込めます。 Google

WordPress

今さら聞けない！WordPressとは【初心者向け】｜現役エンジニアが解説

WordPressをご存知でしょうか？最近ではホームページの制作をするときにも、よくWordPressを使う場面が多くなってきています。しかし、そもそもWordPressとは何か？と質問されたら説明するのは難しいものです。この記事では、WordPress初心者の方でも、そもそもWordPressとはどんなものであって、どんなメリットやデメリットがあるのかが分かるように解説したいと思います。ぜひ、WordPressの使い方を覚えましょう！なお本記事は、TechAcademyのオンラインブートキャンプ、WordPress講座の内容をもとに紹介しています。今回の記事の内容は動画でもご覧いただけます。テキストよりも動画の方が理解しやすいという場合はぜひご覧ください。大石ゆかり田島メンター！！あのちょっと聞きたいことがあるんですけど〜田島悠介ん？何がわからないの？大石ゆかりあの、WordPressってなんですか？田島悠介あぁ、WordPressかー。WordPressはCMSと呼ばれるものの一つで、プログラミングなんかをしなくても簡単にサイトを作ることができるものだよ。大石ゆかり CMS、ですか。具体的にどういうことができるんですか？田島悠介それじゃあ１つずつ説明していくね。大石ゆかりはい♪お願いします！！！目次 WordPressとは WordPressが人気な理由 WordPressでできること WordPressでサイト運営する上で必要なもの WordPressで作られた実際のサイト WordPressの学習方法 WordPressと一緒に使うと便利なツール WordPress利用時の注意点そもそもWordPressとは何か WordPressとは、いわゆるコンテンツマネジメントシステム（CMS）というものです。簡単にいうと、「ホームページの制作ができない人でも、簡単にコンテンツを管理できる仕組み」ということです。通常、ホームページに新たに記事を追加しようとすると、HTMLという言語を勉強して、自分でコードと記事の文章を書いていかなくてはなりません。それがWordPressの場合は、HTMLのコードがわからなくても、マイクロソフトのワードに文章を書いたり写真を挿入したりする感覚で、記事やニュースを更新していくことができます。 [PR] WordPressで挫折しない学習方法を動画で公開中WordPressが人気な理由プログラミングができなくてもWebサイトが作れる上記したように専門知識なくしてWebサイトの管理等ができますが、ここでの専門知識とは主にプログラミングに関することです。特別な機能を持たせる開発をするような場合を除き、情報発信ができるようなメディア立ち上げをする場合にはWordPressそのものの操作に慣れるだけで作ることができるのです。通常自分でゼロから作成しようとすると「HTML」や「CSS」、そしてもう少し華やかさや簡単な機能を加えるには、「JavaScript」や「PHP」等も知っておくと有利になりますが、WordPressを使えば全くこれらの知識がなくとも作れてしまいます。無料であるなにより、無料でこれらのシステムを使えることによって未経験者にも敷居が下がり使用者の増加に繋がっています。しかしながら、インターネット上に公開するにはWordPressの利用とは別に、ドメインの取得やレンタルサーバーなどが必要となりこれらには当然費用が必要となります。 WordPressでできること画像引用元：https://unsplash.com/photos/tZc3vjPCk-Q それでは、具体的にWordPressのメリットとデメリットをご紹介します。 WordPressのメリット HTMLがわからなくても自分でニュースを追加、更新できる WordPressは記事更新の管理画面が、わかりやすいインターフェースで設計されています。そのため、直感的に記事の追加や編集、画像や動画の挿入が可能です。HTMLの知識は不要です。 Webサイトの構築が簡単もし自分でWordPressのサイトを立ち上げたいと思った時でも、各サーバー会社が予め”かんたんインストール”という設定をしてくれている場合がほとんどです。 WordPressはデータベースという、記事のデータが入った箱から、ページの読み込みごとにそのデータを取ってくるという動きをするのですが、これらデータベースの設定も自動でサーバー会社が行ってくれます。拡張性が高くてお手軽たとえば、お問い合わせフォームを設置したいというときにHTMLであればCGIやPHPというものを勉強する必要がありますが、WordPressの場合はそれが不要です。プラグインという便利な拡張機能が無料で、豊富に用意されているので、そのプラグインを”インストールする”ボタンを押すだけで実装できてしまいます。 WordPressのデメリット HTMLのサイトより表示スピードが遅い HTMLは、ページごとにコードを書いたファイルをサーバーに置いてあるだけなので、ページの表示スピードが早いです。それに比べてWordPressは、ページの表示ごとにデータベースから、ページを構成するパーツをその都度呼び出してページを構築するため、HTMLに比べると表示スピードがどうしても遅くなってしまいます。セキュリティの心配 WordPressはPHPというプログラミング言語でできている関係上、不正な操作や攻撃を受けやすいというデメリットがあります。例えばログイン画面に、IDとパスワードをランダムに超高速に試されることで、不正ログインされてしまう可能性もあります。そのため、WordPressのバージョンは常に最新にしておく必要があります。この点は、Windows(ウィンドウズ)などのパソコンと同じです。常にバージョンは最新のものを利用しましょう。実際に自分でWordPressを運営したいという方は、WordPressをインストールする方法をご覧ください。 WordPressでサイト運営する上で必要なもの画像引用元：https://unsplash.com/photos/gcsNOsPEXfs 独自ドメイン自分のサイトを公開するには、ドメインというものを取得する必要があります。有名なところで言うと「お名前.com」「ムームードメイン」などがあります。初心者でもすぐ使える！ドメインが取得できるサイト10選レンタルサーバー誰がアクセスしてもサイトを公開させるためにはサーバーが必要です。サーバーを自作する人もいますが、基本的にはレンタルサーバーを月額1000円程度で利用します。レンタルサーバー比較・10選【Webサイト制作の初心者におすすめ】を参考に選んでみてください。「ロリポップ」や「さくらのレンタルサーバー」は初心者の方にも人気です。 Webサイトのデザインテンプレートサイトの見た目を整形するデザインを用意する必要があります。 WordPressの管理画面上に用意されているものもありますが、無料で利用できるおしゃれなテーマも多いので、そちらがおすすめです。初心者におすすめ！無料で使えるWordPressのテーマ20選【日本語対応のみ】 WordPressで作られた実際のWebサイト画像引用元：https://unsplash.com/photos/OGOWDVLbMSc それでは、実際にWordPressで動いているサイトを6つほど紹介していきます。 AdverTimes(アドタイ) 宣伝会議の運営している広告や宣伝に関するメディアです。記事だけでなく、FacebookやInstagramの写真を載せることもできます。田中直染料店オンラインショップ機能を追加しているWordPressサイトです。商品登録を、お店のスタッフの方が追加更新できるようにしているものと思われます。浦和レッドダイヤモンズ公式サイトスポーツチームの公式ホームページでもWordPressが使われている例はいくつかあります。過去の試合結果などを溜めておくことも、WordPressであれば簡単に行えます。イルカ交通名古屋の交通会社のホームページ。ニュースの定期発信にWordPressを役立てています。渋谷教育学園渋谷中学高等学校学校の発信するニュースを、複数のカテゴリに分割して管理しています。 TechAcademy magazine 実は、このサイトもWordPressで作られています。こういった記事を発信していくようなサイトとの相性は非常にいいでしょう。 WordPressの学習方法画像引用元：https://unsplash.com/photos/QklJV_Q0Pig 人気が高く利用者も多いWordPressなので、その分学習環境も整えられています。本も多く出版されていて、また学習サイトに関しても無料で多くのサイトが公開されています。学習サイトドットインストールドットインストールではWordPressの基本的な操作方法から細かい構築手順まで幅広く学ぶことができます。ドットインストールバズ部こちらの特徴はWordPressの使い方全般に加えて、サイト構築後の集客等についてもまとめられているというところです。バズ部 Webクリエイターボックス WordPressにおけるポイントやコツなどが多く紹介されており、オリジナルテーマの作り方といった中級者以上に向けられた内容も学ぶことができます。 Webクリエイターボックス書籍いちばんやさしいWordPressの教本プログラミングスキルがなくてもパソコンやスマートフォンに対応したWebサイトの完成ができるように丁寧に解説されています。本格ビジネスサイトを作りながら学ぶ　WordPressの教科書こちらは初級的な内容から発展的なことまで含まれており、本格的に使おうとする人に向いています。 WordPressと一緒に使うと便利なツール画像引用元：https://unsplash.com/photos/hpjSkU2UYSU WordPressにはプラグインというツールを導入して機能を拡張することができます。よく使われているプラグインを紹介します。 WP Social Bookmarking Light SNSへのリンクボタンを追加できるプラグインです。現在ではWebサイトの投稿をSNSでシェアしたり、逆にSNSの投稿をWebサイトで引用したりということが当たり前に行われています。Webサイトを構築した際、早い段階で必要になるのがSNSへのリンク機能でしょう。このプラグインは各SNSの公式のボタンを使った表示ができるのが特徴です。 WP Social Bookmarking Light Table of Contents Plus 投稿ページが増えてくると、目次ページ（サイトマップ）が欲しくなります。このプラグインは、長い固定ページ内の目次のほか、サイト全体の目次ページ（サイトマップ）の作成も可能です。手作業で目次ページを作成するのと比較して圧倒的に容易ですので試してみるといいでしょう。 Table of Contents Plus Contact Form 7 Webサイトにお問い合わせフォームを追加するプラグインです。鉄板中の鉄板プラグインであり、とても多く利用されています。導入が容易であり、広く利用されていることから設定方法などの情報も多く得られることができます。 Contact Form 7 WP-PageNavi ページナビゲーションを行うプラグインです。このプラグインを導入することで、分かりやすいページ送り機能を実装することができます。とても多く利用されているプラグインの１つです。 WP-PageNavi All-in-One WP Migration WordPressで構築したWebサイトの移設を行うためのプラグインです。 Webサイトの設定や投稿などを全て１まとまりのファイルにエクスポートすることができます。 Webサイトをリニューアルする際に別環境にサイトのコピーを立ち上げたり、自分のパソコンでWordPressを動作させる場合など、幅広く活用できます。またサイトのバックアップを取得するツールとしても有用です。 All-in-One WP Migration なお、プラグインを導入すると、その分WordPressの動作も少しずつ遅くなります。プラグインの導入は必要なものに限定し、多用しないようにしましょう。 WordPressの利用時の注意点 WordPressは便利な反面、利用する際にいくつか注意点があります。画像引用元：https://unsplash.com/photos/iEiUITs149M ページ構成を考えておく WordPressは自由度が高いため、かなり複雑なWebサイトも構築可能です。そのためページ構成を考えずに適当にWebサイトを構築してしまうと、収集がつかなくなってしまいます。通常の記事で投稿するのか、固定ページと呼ばれるページで作成するのか、ページ間のナビゲーションはどうするか等、ページ構成を考えながらサイトを構築するといいでしょう。動画や画像を多用しない前述のとおり、WordPressには表示がやや遅いという弱点があります。また一般的にユーザーがWebサイトのページ読み込みを待てる時間は約3秒程度と言われています。特にWebサイトのトップページで容量の大きい画像や動画を貼り付けることは表示を遅くする原因となるため、控えるようにしましょう。また素材自体を軽くするテクニックも様々ありますので活用するといいでしょう。具体的には写真であれば、カメラで撮った写真のファイルはそのままでは画像サイズとファイルの容量が大きいため、画像編集ソフトでサイズを縮小する、または減色処理を行うなどの方法があります。 Webサイトがレスポンスよく表示されるよう、心がけましょう。自動アップデートを有効にする WordPressは既定値で自動アップデートが有効になっています。以前はアップデートによりシステムの動作が不安定になるなどの事象が発生することがありましたが、最近では安定してきていますので、自動アップデートは有効にしていて問題ないでしょう。むしろアップデートによりセキュリティやバグ（不具合）への対応が行われますので常に最新版にしておくことが重要といえます。必要最低限のSEO対策を行う Googleなどの検索結果でWebサイトが上位に表示されるよう対策を行うことをSEO対策と呼びます。 SEO対策は専門の会社もあるぐらいで非常に奥が深い領域です。とはいえWebサイトの構成を整えるという意味でも、必要最低限の対策は行っておいたほうがいいでしょう。「WordPress SEO by Yoast」というプラグインを使うと、ガイダンスに従いながらSEO対策を行うことができます。試してみるといいでしょう。 WordPress SEO by Yoast 広告（アフェリエイト）の導入は慎重に Webサイトを構築するモチベーションの１つに広告収入（アフェリエイト）もあると思います。しかし最初は広告を入れず、投稿を増やすことに専念したほうがいいでしょう。広告の導入を考えているのであれば投稿のテーマや方向性を決めておくことが重要です。投稿数が増えてユーザーの流入数が増加傾向にあることを確認できるようになったら、AdSenseなどに接続して広告導入の手続きを行いましょう。 AdSenseヘルプ – コード導入ガイド A8.net – アフェリエイトの始め方！いかがだったでしょうか。普段皆さんがご覧になっているウェブサイトも、WordPressで作られているかもしれませんね。最後に、もし「WordPressって何？」と誰かに聞かれたら、「ホームページに自分で記事の追加や更新ができるツールだよ」と教えてあげましょう。実際、どんなWebサイトが作れるのかイメージするために無料で使えるWordPressのテーマ30選も合わせてご覧ください。執筆してくれたメンター太田和樹（おおたかずき） ITベンチャー企業のPM兼エンジニア普段は主に、Web系アプリケーション開発のプロジェクトマネージャーとプログラミング講師を行っている。守備範囲はフロントエンド、モバイル、サーバサイド、データサイエンティストと幅広い。その幅広い知見を生かして、複数の領域を組み合わせた新しい提案をするのが得意。開発実績：画像認識技術を活用した駐車場混雑状況把握（実証実験）、音声認識を活用したヘルプデスク支援システム、Pepperを遠隔操作するアプリの開発、大規模基幹系システムの開発・導入マネジメント地方在住。仕事のほとんどをリモートオフィスで行う。通勤で消耗する代わりに趣味のDIYや家庭菜園、家族との時間を楽しんでいる。大石ゆかりなるほど！！結構色々なサイトがWordPressを使って作られているんですね！！！田島悠介そうだね。1からコーディングしなくても簡単にデザインを作ったり記事を更新したりできるから、様々な場面で活用されているよ! 大石ゆかり私も今度使ってみます！！田島悠介うん、何かサイトを作ったら見せてね♪ 大石ゆかりはい！！頑張ります！！！ TechAcademyでは、WordPressを使ってカスタマイズしたオリジナルサイトを構築できるWordPressコースを開催しています。期間中は現役エンジニアのメンターが毎日学習をサポートするので、独学よりも効率的に学ぶことができます。オンラインの説明動画や無料体験も実施中です！まずはこちらからお気軽に試してみてくださいね。人事・研修担当の方は、WordPress研修も提供しているので、合わせてご覧ください。

WordPress

PythonをXAMPPで使う方法を現役エンジニアが解説【初心者向け】

PythonをXAMPPで使う方法について解説します。そもそもPythonについてよく分からないという方は、Pythonとは何なのか解説した記事を読むとさらに理解が深まります。なお本記事は、TechAcademyのオンラインブートキャンプPython講座の内容をもとに紹介しています。田島悠介今回は、Pythonに関する内容だね！大石ゆかりどういう内容でしょうか？田島悠介 PythonをXAMPPで使う方法について詳しく説明していくね！大石ゆかりお願いします！ XAMPPとは Webアプリケーションはクライアント（ブラウザ）とサーバーで構成されます。Webアプリケーションの開発に必要なサーバーのソフトウェアをまとめてインストールできるのがXAMPPです。 XAMPPには以下のソフトウェアが含まれます。WindowsやMac、Linux版などがあり、全て無償で利用できます。 Apache：Webサーバー MariaDB：データベース PHP：プログラミング言語 Perl：プログラミング言語 XAMPPと書いてザンプと読みます。「X」は複数のOSに対応していることを指し、「AMPP」は上記のソフトウェアの頭文字です。もともとはLinux専用で「LAMPP」と呼ばれていました。 PythonをXAMPPで使うメリット XAMPPには上記のようにPHPやPerlといったプログラミング言語が含まれていますが、設定をすることでPythonも利用できます。 PythonをXAMPPで使うとPythonで書いたプログラムをWebサーバー上で実行できます。 PHPやPerlよりPythonを使いたい場合にはお勧めです。なお、PythonのWebフレームワークであるFlaskやDjangoをApacheで動作させるためには、XAMPPに加えてWSGIという定義に準拠させるソフトウェアの導入と設定が必要になります。この記事ではフレームワークは使わずPython単体での利用方法を確認します。 [PR] WordPressで挫折しない学習方法を動画で公開中PythonをXAMPPで使う方法まずは公式サイトからXAMPPをダウンロードしてインストールしましょう。 XAMPP公式サイト同様にPythonもダウンロードとインストールを行います。 Python公式サイト Windowsの場合には、インストールした後で環境変数「PATH」の設定が必要となります。環境変数の設定については以下を参考にしてください。環境変数の設定インストールが終わったらPythonをXAMPPで利用する設定を行います。XAMPPのコントロールパネルを開き、Apacheの右側にあるConfigボタンをクリックし、一番上の「Apache(http.conf)」を選択します。 httpd.confファイルが開いたら、一番下に以下を追記して保存します。 AddHandler cgi-script .py ScriptInterpreterSource Registry-Strict 追記したらhttpd.confファイルを閉じ、XAMPPのコントロールパネルからApacheのStartボタンをクリックします。最後にPythonのプログラムを作成して動作確認を行いましょう。 XAMPPをインストールしたフォルダに以下のファイルを作成します。1行目にはPythonをインストールしたフォルダから指定します。 test.py #!C:Usersuser1Anaconda3python.exe # -*- coding: utf-8 -*- print("Content-Type: text/htmln") print("Hello Python!") ブラウザから「http://localhost/test.py」にアクセスし、以下のように表示されることを確認しましょう。監修してくれたメンター太田和樹（おおたかずき） ITベンチャー企業のPM兼エンジニア普段は主に、Web系アプリケーション開発のプロジェクトマネージャーとプログラミング講師を行っている。守備範囲はフロントエンド、モバイル、サーバサイド、データサイエンティストと幅広い。その幅広い知見を生かして、複数の領域を組み合わせた新しい提案をするのが得意。開発実績：画像認識技術を活用した駐車場混雑状況把握（実証実験）、音声認識を活用したヘルプデスク支援システム、Pepperを遠隔操作するアプリの開発、大規模基幹系システムの開発・導入マネジメント。地方在住。仕事のほとんどをリモートオフィスで行う。通勤で消耗する代わりに趣味のDIYや家庭菜園、家族との時間を楽しんでいる。大石ゆかり内容分かりやすくて良かったです！田島悠介ゆかりちゃんも分からないことがあったら質問してね！大石ゆかり分かりました。ありがとうございます！ TechAcademyでは、初心者でもPythonを使った人工知能（AI）や機械学習の基礎を習得できるオンラインブートキャンプPython講座を開催しています。挫折しない学習方法を知れる説明動画や、現役エンジニアとのビデオ通話とチャットサポート、学習用カリキュラムを体験できる無料体験も実施しているので、ぜひ参加してみてください。

Python

ゼロからの始め方！WordPressでブログサイトを作る手順とは【入門向け】

Webサイトを作成する上で人気が伸びているWordPress(ワードプレス)。今回は、WordPressを使ってブログサイトを作る手順についてTechAcademyの現役エンジニアが解説しています。 WordPressについてそもそもよく分からないという方は、WordPressとは何なのか解説した記事を読むとさらに理解が深まります。なお本記事は、TechAcademyのオンラインブートキャンプ、WordPress講座の内容をもとに紹介しています。目次 WordPressとはサイト作成に準備するものブログサイト公開までブログサイト公開後今回の登場人物田島悠介（29）あらゆる言語をマスターしている万能型エンジニアでTechAcademyのメンター。人の成長を見るのが一番のやりがい。好きな映画は『トスカーナの休日』大石ゆかり（24） TechAcademyの受講生。 Instagramには3つの写真加工アプリで編集してからアップするという。大石ゆかり田島メンター、私今アメブロでブログ書いてるんですけど、もっとおしゃれな感じにしたいんですっ！なんか良いサービス知らないですか？田島悠介ってか、ゆかりちゃんアメブロやってたんだ！教えてよ！笑大石ゆかりそれは秘密です♪（スッピン写真とか載せてるし、絶対見せられない）田島悠介ええー。。ブログやるなら「WordPress(ワードプレス)」っていうのがおすすめだけど知ってる？大石ゆかり Word(ワード)なら知ってますけどそれとは違うんですか？田島悠介 Wordでは無いんだけど、同じような使い方で自分のサイトを作れるんだよ！大石ゆかりへえ〜そんな便利なものがあるんですね！具体的に教えてくださいっ！田島悠介おっけ〜！教えたら今やってるブログも教えてね！大石ゆかりそれはダメです！！ WordPressとは WordPressとは、CMS(コンテンツマネジメントシステム)と呼ばれるサービスの一つで、無料で使えることで有名です。ちなみにCMSとは簡単にサイト上のコンテンツを管理することができる仕組みです。普通、サイトを作ろうと思ったらHTML/CSSといった言語を使いながらプログラミングの作業が必要になります。しかし、WordPressの場合は、プログラミングを一切することなく自分のサイトを作ることができるのです。下の画像は、当サイトのTechAcademy magazineですが、このサイトもWordPressを使って動いています。ブログのように記事配信を行っていくようなサイトにはWordPressが適していると言えるでしょう。最近では企業のコーポレートサイトもWordPressで作成されているサイトがどんどん増えてきています。大石ゆかりなんでWordPressってすごい人気なんですか？田島悠介やっぱり無料で手軽なのに機能が多く何でもできるところじゃないかな！大石ゆかり私アメブロしかやったことないんですが、大丈夫ですかね？笑田島悠介もちろん！特に専門スキルは必要ないよ！ [PR] WordPressで挫折しない学習方法を動画で公開中準備するもの WordPressを使い、実際にWebサイトとして動かしていく上で必要なものを紹介しています。とは言ってもWordPressを使えるレンタルサーバーを利用すれば、とても簡単に済みます。現在、ほとんどのレンタルサーバーでWordPressを利用できます。初心者にも人気なレンタルサーバーには以下のようなものがあります。さくらインターネットエックスサーバーロリポップ ConoHa WING レンタルサーバーを利用すれば月額500~1,000円程度でWebサイトを運営することができます。またレンタルサーバーではアドレスが「https://◯◯.sakura.ne.jp/」のようになりますが、「◯◯.com」や「◯◯.jp」のように自由にアドレスを決めたい場合、独自ドメインサービスも利用する必要があります。独自ドメインサービスには以下のようなものがあります。お名前.com ムームードメインそれでは、さくらインターネットを例に、WordPressを利用する手順を確認していきましょう。さくらインターネットでWordPressを利用する場合、スタンダードプラン以上で契約する必要があります。以下で紹介している手順は、さくらインターネットで公開されている手順「【新コントロールパネル：クイックインストール】WordPress(ブログ)のインストール」をもとにしています。【新コントロールパネル：クイックインストール】WordPress(ブログ)のインストール WordPressを利用する手順は以下のとおりです。 WordPressをクイックインストールする Webサイトのタイトルなどを決めるでは、一つずつ解説していきます。 1. WordPressをクイックインストールするさくらのレンタルサーバ「サーバコントロールパネル」にアクセスしてログインします。サーバコントロールパネルサーバコントロールパネルホームの左側のメニューから「Webサイト/データ>クイックインストール」を選択します。 WordPressの「新規追加」ボタンをクリックします。はじめてWordPressを導入する場合は、WordPressの設定や記事を格納するデータベースと呼ばれるものを作成する必要があります。「データベース作成」をクリックします。データベースや接続用パスワードを決めて入力します。データベース文字コードは「UTF-8」のままとします。入力が終わったら「同意する」にチェックを付けて「作成する」をクリックするとデータベースが作成されます。インストールURLには「blog」などとすると良いでしょう。その他は既定値のままでかまいません。「ライセンス・利用規約に同意する」にチェックを付けて「作成する」をクリックします。インストールが完了すると以下のように表示されます。簡単ですね！次に管理画面URLにアクセスしてWebサイトのタイトルなどを決めましょう。 2. Webサイトのタイトルなどを決めるブログサイトの「サイトのタイトル」、WordPressの管理画面にログインする際の「ユーザー名」「パスワード」「メールアドレス」を入力しましょう。あとで変更することも可能です。「検索エンジンがサイトをインデックスしないようにする」にチェックすると、ブログサイトが検索結果に出てこなくなります。通常はチェックしなくて大丈夫です。 WordPressをインストールし、「成功しました！」と表示されれば無事完了です。実際にログインしてみましょう。設定したユーザー名、パスワードでログインするとWordPressの管理画面に入ることができます。無事ログインできればWordPressの管理画面に入ることができるはずです。上記の画像がWordPressの管理画面になります。ブログを投稿したり、サイトの設計を編集したり、アカウントを追加するなどは基本的にこの管理画面上で行うことが可能です。サイドメニューに情報が多く、慣れるまで少し大変かもしれませんが毎日ログインして利用していればすぐ使えるようになるはずです。大石ゆかりわぁ、WordPressっていろんな機能があるんですね。田島悠介管理画面の使い方についてはこの後詳しく見ていくから付いてきてね！大石ゆかりは、はいっ（汗）ブログサイト公開まで実際にWordPressが利用できたらWebサイトのデザインや構成を編集していきます。これから作っていこうと思っているブログ記事やカテゴリなどデザインを整える必要があるでしょう。 Webサイトの構成(サイトマップ) テーマの選択公開するブログサイトの構成、つまりサイトマップを考える必要があります。作る前から細かく設定する必要はありませんが、サイト内にどんなページが必要なのか書き出しておくとテーマも選びやすくなります。簡単にブログサイトのサイトマップを作ってみました。テーマとは、簡単に言えばサイトのデザインです。 WordPressが人気な理由の一つとして最初にも紹介しましたが、HTMLやCSSなどデザインやプログラミングの作業をしなくてもテーマを選択するだけで一つのサイトにすることができます。何もしなければサイトデザインはデフォルトテーマ「Twenty Twenty」が適用されています。このテーマでも十分魅力的なWebサイトを作成することができますが、「もっとおしゃれなテーマにしたい」、「ヘッダーやフッターをつけたい」などサイトに合わせてテーマを選んでいきましょう。テーマを変更する際は、「外観」>「テーマ」で変更することが可能です。テーマ自体は、WordPressだけでなくいろんな企業や個人で提供しているので、調べてみることをおすすめします。無料で使えるWordPressのテーマ30選も合わせて紹介しておきます。大石ゆかりサイト上に大きく動画が流れるようなデザインとかもできますか？田島悠介もちろん動画が流れるテーマはたくさんあるよ！大石ゆかりおお、そうなんですね♪ 下から浮き上がったり横からスライドしたり動きのあるサイトとかも作れます？田島悠介パララックスっていうサイトかな。もちろんあるよ！WordPress自体世界中で使われてるからテーマを作る人も世界中にいて、種類に困ることは無いと思うよ！固定ページについて固定ページは更新することが少ないページで利用します。企業ページの場合、会社概要やお問い合わせページなどが該当します。また、デザインテーマによっては、固定ページで設定した内容を上部のナビゲーションメニューで自動的に表示してくれます。例えば、次のように、ニュース・インタビュー・テクノロジー・キャリア・お問い合わせという5つの固定ページを作成した場合、ページ上部にこの様に表示されるイメージになります。投稿ページについて WordPressは元々ブログを作成するために開発されたアプリケーションです。投稿ページでは日々のブログを投稿するイメージで、ページが作成されます。固定ページと異なり、デザインテーマの標準状態で、ページ上部のナビゲーションメニューに投稿ページの内容が表示されることは、ほぼありません。通常は、トップページに投稿日の新しい順に表示されます。ブログサイト公開後 WordPressが選ばれている理由の一つにカスタマイズの柔軟性がよく挙げられます。記事を追加、更新できるだけでなくWebサイトのSEO対策や会員機能の追加など簡単に行えるのです。せっかくブログサイトを作ったらより多くの人に見てもらいたいはずです。プラグインの導入ブログ記事の投稿プラグインの導入は「プラグイン>新規追加」から行います。キーワードなどで検索を行い、導入したいプラグインの「今すぐインストール」をクリックします。プラグインをインストールしたら「有効化」を行います。ちなみに以下のプラグイン「WooCommerce」はWordPressでECサイトを構築する定番中の定番のプラグインです。プラグインはいつでも設定できるので、必要に応じてインストールしましょう。 WordPressでまず最初に入れるべきプラグインを参考にしながらより本格的なサイトにしていきましょう。続いてブログ記事を実際に投稿してみましょう。新規でブログ記事を作成する場合は「投稿>新規追加」で新しく公開することができます。 WordPressはバージョン5.0からエディタがブロックエディタに変更されています。/か+ボタンで要素を選択しながら、ブロックを組み立てるように記事を作成していくのが特徴です。文章だけでなく画像や動画を記事内に挿入し、素敵な記事を作成すると良いでしょう。サイドメニューの「投稿」>「投稿一覧」で現在公開している、下書きの記事を一覧で見ることができます。サイトデザインはデフォルトテーマ「Twenty Twenty」が適用されていますが、以下のように「Hello world!」というタイトルのブログ記事を読むことができました。大石ゆかりついにブログ更新が始まるって感じですね♪ 田島悠介そうだね！ちなみにゆかりちゃんはどんな事書いていくの？大石ゆかりんー特に決めてないんですけど海外の映画とか見た感想をつらつらと書いていこうかなって思ってます♪ 田島悠介おお、いいね！じゃあ、僕の好きな「トスカーナの休日」もぜひ紹介してね！おさらい WordPressとは誰でも簡単にサイトを作れる便利なサービス！ WordPressはレンタルサーバーで簡単に始められる！サイトを作る上でサイトマップを作成しよう！ WordPressはテーマとプラグインが充実している！初めてWordPressでサイトを作る際、サーバーやドメインの契約、新しいツールの導入など慣れない作業が多いかもしれませんが、サイトを公開してしまえば後はどんどんブログ記事の作成に集中できます。 WordPressの使い方を覚えて、ぜひ自分だけのブログサイトを作ってみましょう。この記事を監修してくれた方中本賢吾（なかもとけんご）アジマッチ有限会社　代表取締役社長開発実績：PHPフレームワークを利用した会員制SNS・ネットショップ構築、AWSや専用サーバー下でLinuxを使用したセキュアな環境構築、人工知能を利用したシステム開発、店舗検索スマホアプリ開発など。その他にも地域の職業プログラマー育成活動を行い、2018年には小学生がUnityで開発したオリジナルAndroidアプリをGooglePlayでリリース。ゲームで遊ぶより作ろうぜ！を合言葉に、小学生でも起業できる技術力を育成可能で有ることを証明し続けている。 TechAcademyでは、WordPressを使ってカスタマイズしたオリジナルサイトを構築できるWordPressコースを開催しています。期間中は現役エンジニアのメンターが毎日学習をサポートするので、独学よりも効率的に学ぶことができます。オンラインの説明動画や無料体験も実施中です！まずはこちらからお気軽に試してみてくださいね。

WordPress

HTMLをブラウザで表示するXAMPPの使い方を現役エンジニアが解説【初心者向け】

HTMLをブラウザで表示するXAMPPの使い方について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。そもそも、HTMLの記述方法がわからない場合は、HTMLの書き方について解説した記事を読むとさらに理解が深まります。なお本記事は、TechAcademyのオンラインブートキャンプ、Webデザイン講座のHTMLカリキュラムをもとに執筆しています。田島悠介今回は、HTMLに関する内容だね！大石ゆかりどういう内容でしょうか？田島悠介 HTMLをブラウザで表示するXAMPPの使い方について詳しく説明していくね！大石ゆかりお願いします！目次 XAMPPとは XAMPPを使ってみよう使い方と各種設定方法まとめ XAMPPとはインターネット上でWebページを公開しているのがWebサーバーと呼ばれるコンピュータです。Webサーバーの中ではWebページを作るための様々なプログラムが動作している場合があります。例えばオンラインショッピングのWebページでは、データベースに保存してある商品データなどをもとにWebページを表示したり、注文情報の決済などを行うプログラムが動作しています。これらのプログラムはバックエンドと呼ばれています。またそれに対してユーザーが操作するWebページやそこで動作するプログラムはフロントエンドと呼ばれています。これらWebサーバーやデータベース、バックエンドのプログラミング言語であるPHPの実行環境などがセットになったソフトウェアが「XAMPP」です。 [PR] WordPressで挫折しない学習方法を動画で公開中XAMPPを使ってみよう XAMPPを使用するには、まず公式サイトからXAMPPをダウンロードします。 XAMPP公式サイトインストールは既定値のまま進めて良いでしょう。使い方と各種設定方法インストールが終わるとコントロールパネルが表示されます。ここから必要なソフトウェアをStartボタンを押して起動していきます。それぞれのソフトウェアの役割は以下のとおりです。 Apache：Webサーバー MySQL：データベース FileZilla：ファイル転送（FTP）を行うサーバー Mercury：メールの送受信を行うサーバー Tomcat：Javaなどのバックエンドプログラムを実行するためのソフトウェア以下はApacheだけを起動した例です。 Apacheを起動したら、以下のアドレスをブラウザで開きます。 http://localhost/dashboard/ 以下のような画面が表示されたら正常に起動しています。起動を確認したら、以下のHTMLファイルを作成し、XAMPPのインストール先のhtdocsフォルダに配置しましょう。 test.html <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <h1>こんにちは！XAMPP</h1> </body> </html> 以下のアドレスにアクセスします。 http://localhost/test.html 実行結果は以下のとおりです。作成したhtmlファイルが表示されたことが確認できました。まとめ今回の記事ではHTMLをブラウザで表示するXAMPPの使い方について学習しました。監修してくれたメンター太田和樹（おおたかずき） ITベンチャー企業のPM兼エンジニア普段は主に、Web系アプリケーション開発のプロジェクトマネージャーとプログラミング講師を行っている。守備範囲はフロントエンド、モバイル、サーバサイド、データサイエンティストと幅広い。その幅広い知見を生かして、複数の領域を組み合わせた新しい提案をするのが得意。開発実績：画像認識技術を活用した駐車場混雑状況把握、音声認識を活用したヘルプデスク支援システム、ロボットアプリの開発、大規模基幹系システムの開発・導入マネジメント。著書「知識ゼロからの機械学習入門（技術評論社）」。地方在住。仕事のほとんどをリモートオフィスで行う。通勤で消耗する代わりに趣味のDIYや家庭菜園、家族との時間を楽しんでいる。大石ゆかり内容分かりやすくて良かったです！田島悠介ゆかりちゃんも分からないことがあったら質問してね！大石ゆかり分かりました。ありがとうございます！ TechAcademyでは初心者でも、オリジナルWebサイトを公開できる、オンラインブートキャンプを開催しています。また、現役エンジニアから学べる無料体験も実施しているので、ぜひ参加してみてください。

HTML

記事を検索

ニュース

インタビュー

テクノロジー

キャリア

お問い合わせ

XAMPPを使ってWordPress用にローカル環境構築する方法【初心者向け】

XAMPPをダウンロード、インストール

XAMPPを起動

セキュリティ設定

WordPress用のデータベースをMySQLに作成

XAMPPにWordPressをインストール

ブラウザからログイン

関連するキーワード

あわせてよく読まれている記事

今さら聞けない！XAMPPをインストールする方法【超初心者向け】現役エンジニアが解説

WordPressの使い方！初心者でもサイト作成が簡単に｜現役エンジニアが解説

今さら聞けない！WordPressとは【初心者向け】｜現役エンジニアが解説

PythonをXAMPPで使う方法を現役エンジニアが解説【初心者向け】

ゼロからの始め方！WordPressでブログサイトを作る手順とは【入門向け】

HTMLをブラウザで表示するXAMPPの使い方を現役エンジニアが解説【初心者向け】

TechAcademyから
現役エンジニアの方へ
お知らせ

記事を検索

ニュース

インタビュー

テクノロジー

キャリア

お問い合わせ

XAMPPをダウンロード、インストール

XAMPPを起動

セキュリティ設定

WordPress用のデータベースをMySQLに作成

XAMPPにWordPressをインストール

ブラウザからログイン

記事を検索

関連するキーワード

関連する記事

あわせてよく読まれている記事

TechAcademyから 現役エンジニアの方へ お知らせ

TechAcademyから
現役エンジニアの方へ
お知らせ