おすすめサービス

ポートフォリオを公開するならConoHa WINGが簡単でおすすめ【HTMLからWordPressまで】

ConoHa WINGでとても簡単にHTML・WordPressサイトを公開する【最短10分】

こんにちは、現在Web制作フリーランスとして3年ほど活動しているしょーごと申します。

今回は『HTML、WordPressサイトの世界一簡単な構築方法』をお教えします。

今回紹介する「ConoHa WING 」を使用してこの記事通りに進めていただければ、10分でWebサイトを構築するところまでいけます。

  • サイト制作の勉強をしていて、ポートフォリオを公開する方法を探している
  • 自分でブログを開設したい
  • めんどくさいのは嫌

こんな方におすすめの方法になります。

しょーご
しょーご
WordPressは今回関係ない場合は、インストールや設定箇所は飛ばしてもらえればと思います。

自分でサーバーを持つといいこと
  • クライアントワークで頻出のサーバー契約の練習になる
  • WordPressサイトだけでなく、静的サイト(HTML)も公開できるので、ポートフォリオ公開に最適
  • テスト環境にもなる
  • ブログも当然できる
この記事の対象読者
  • 過去に無料サーバーしか使ったことが無い方
  • 初めてサーバーを触る方

これを解説している私は3年以上Web業界で活動しており、勉強開始一ヶ月目からレンタルサーバーを契約し、使用しています(このブログ含め)

ConoHa WING現在セール中!!

ConoHa WING お得 セール

今回の記事でも紹介するWINGパック「ベーシックプラン」 が対象で、現在かなりお得になっています!

この記事の反響

前提:Web制作とレンタルサーバーの関係

プログラミングおすすめ動画教材 udemy

この記事をお読みの方は「Web制作学習中の方」が多いと思います。

Web制作物というのは、最終的に大半が「レンタルサーバーへ公開」されることになり、その公開作業を往々にして我々「コーダー」が担うことになります。

なのに、コーディングしか練習機会が無いので、結果的に「実務で詰まる場所No.1」となっているのが「サーバー・ドメイン」の部分になります。

自分で練習しておくのに越したことはないです。

しょーご
しょーご
私はこのブログ構築を経てWordPressサイトの公開・運用方法を学びました。

HTMLサイトを公開するのに必要なもの

  1. ドメイン
  2. サーバー

今回紹介する『ConoHa WING 』で両方揃います。

先程から出ているHTMLサイトとは、例えば私のコーディング練習課題で言えば「初級」「初級Ex」「中級」「中級Ex」「Photoshop編」になります。
HTML.CSS.JavaScript(jQuery)で構築されたサイトです。

WordPressサイトを公開するのに必要なもの

WordPressを始める際に必要なのは以下の3つです。

  1. ドメイン
  2. サーバー
  3. テーマ

しょーご
しょーご
WordPressの場合も、ConoHa WING なら最初からすべて揃っています。

①ドメインとは?

ドメインというのは、例えばこのサイトのshogo-log.comというものです。

サイトの住所を示すもので、ユニークなものにしたい場合のみ、独自ドメインが必要になります。

ちなみに今回紹介する『ConoHa WING 』の場合は、〇〇.conohawing.comという、〇〇部分を自由に設定できるドメインを初期ドメインとして2つも取得できるので、必ず必要なものではありません。shogo-logのようなユニークでシンプルなドメインが欲しい場合はお名前.comで自分で取得してあとからConoHa WINGに連携させればOKです。

ブログやクライアントサイト構築の場合は、大抵独自ドメインになります。

しょーご
しょーご
今回は初期ドメインでサイトを開設するところまでやります!

②サーバーとは?

サーバーとは、簡単に言えばWebサイトの置き場所です。

自分で構築することも可能ですが、専門知識が必要であるほか、セキュリティ対策などもすべて自分自身で行わなければいけません。

また極端に安いものだとWordPressに対応していないサーバーも存在します。

今回紹介する『ConoHa WING 』はすべてオールインワンで備えているので、WordPress環境含め手軽に用意することができます。

しょーご
しょーご
昔はWordPressサイトも用意が大変だったらしいので、今回の簡単さは技術革新の賜物です。

③テーマとは?(WordPressのみ)

WordPressの見た目の部分で、導入するだけで既に完成したブログサイトを手に入れることができます。

最近はコーポレートサイトまで構築できるテーマも増えています。

無料・有料、様々なものがあります。

ConoHa WING 』では無料・有料のものから一つ選ぶことになります。

ちなみにこのサイトではテーマは『JIN』を利用しています。

Webサイト公開にはConoHa WINGがおすすめ

ConoHa WINGでとても簡単にWordPressサイトを作る【最短10分】

ConoHa WING は、最新の高性能サーバー・超高速SSD・高速化技術を導入した国内最速のレンタルサーバーです。

また、サーバー、ドメイン、テーマがパックになった「WordPressかんたんセットアップ」機能が搭載されています。

WordPress開設のひとつひとつの作業はそこまで複雑なものではありませんが、初心者の方は時間がかかってしまうことも。

しかしConoHa WINGの「WordPressかんたんセットアップ」を使えば、10分程度で誰でも簡単にWordPressを始められます

しょーご
しょーご
現状国内で最も手軽に WordPressサイトを構築できるサーバーです。

なお、普通のHTMLサイトも公開できます。

既存のファイルマネージャーを使えば簡単に公開できます。

https://support.conoha.jp/w/filemanager/

HTMLサイト(非WordPress)を公開する場合はこのあと紹介する『WordPress簡単インストール』は飛ばしてOKです。

特典:無料ドメイン2個が永久についてくる!

ConoHa WINGでとても簡単にWordPressサイトを作る【最短10分】

WINGパックでは、なんとドメインが2つ永久無料でついてくるようです。

これは他のサーバー会社では見たことないですね。

すごすぎますw

ドメインが2つあれば、片方は HTMLサイト用、もう片方はWordPressサイト用に活用することができます。

ポートフォリオを公開したい人にはもってこいですね!

ポートフォリオ公開方法
ディレクトリを分ければ、一つにドメインで複数作品を載せられます。

しょーご
しょーご
この構成でポートフォリオとか公開できますね!

ConoHa Wing公式サイト

https://www.conoha.jp/wing/

料金

料金は『ベーシックで月額1000円前後』になります。

基本的にサーバーって、一度サイトを構築したら放棄することなってほぼないので、最安の『36ヶ月』で問題ないのではと思います。

私はそうしてます。

ConoHa WINGでとても簡単にWordPressサイトを作る【最短10分】

更に詳しくは公式サイトを御覧ください。

ConoHa Wing公式サイト

https://www.conoha.jp/wing/

ConoHa WINGでのWordPress立ち上げ手順

WordPressサイトを始める手順
  1. レンタルサーバーと初期ドメインの設定
  2. WordPressかんたんインストール
  3. WordPress初期設定、テーマの導入

この手順で見ていきましょう。

ConoHa WING利用開始手順

①申し込む

ConoHa WINGでとても簡単にWordPressサイトを作る【最短10分】

まずはトップページより、「いますぐお申し込み」のボタンを押します。

ConoHa WINGでとても簡単にWordPressサイトを作る【最短10分】
初めて利用する場合はメールアドレスとパスワードの設定を
ConoHa WINGでとても簡単にWordPressサイトを作る【最短10分】

料金タイプはお得な「WINGパック」にしましょう(ドメイン2つもWINGパックについてきます)

プランベーシックで問題ありません。

おすすめプラン

WINGパックのベーシック

初期ドメインは『サイトのURL』更には『メールアドレスのドメイン』として利用可能です(仕事のメールアドレスなど)

サーバー名は、特別な目的がない場合、設定し直す必要はありません。

②WordPressかんたんセットアップを行う(任意)

プラン選択画面の下部に「WordPressかんたんセットアップ」という項目があります。

今回は「WordPressかんたんセットアップ」を使って開設を進めていきます。

とりあえず静的HTMLサイトを公開したい場合は飛ばしてもらってOKです。

作成サイト名は、あなたのWordPressサイトのサイト名を入力します。あとから変更も可能です。

「WordPressかんたんセットアップ」では独自ドメインが1つ無料でプレゼントされるので、

作成サイト用新規ドメインの欄に、お好みの文字列を入力・選択してください。

しょーご
しょーご
このサイトで言うshogo-logの部分ですね。

ユーザー名パスワードは、WordPressの管理画面にログインするために必要となります。

後ほど必要になるので忘れないように注意してください。

ConoHa WINGでとても簡単にWordPressサイトを作る【最短10分】
数分後にこういう画面で入力することになります

しょーご
しょーご
よく慣習的に『root』『admin』とかにする人いますが、速攻ハッキングされるのでユニークなものにしたほうがいいですよ

最後にテーマを選択します。

テーマはデザインテンプレートのようなもので、あなたのWordPressサイトのデザインやレイアウトの根幹を決めるものです。

しょーご
しょーご
テーマって 、サイトが大きくなると変えるのめんどくさいのですが、Cocoonは無料テーマの中で一番カスタマイズ性に富んでいるのでとりあえずCocoonでいいかなと思います。

お客様情報の入力

ConoHa WINGでとても簡単にWordPressサイトを作る【最短10分】

本人確認

ConoHa WINGでとても簡単にWordPressサイトを作る【最短10分】

レンタルサーバー代の支払い

ConoHa WINGでとても簡単にWordPressサイトを作る【最短10分】

これにて

  • レンタルサーバー申し込み
  • ドメイン取得
  • WordPressインストール
  • テーマのインストール

すべてが終了しました。

HTMLサイトを公開したい人はここまでで大丈夫です。
この後はファイルマネージャーかFTPでサイトを公開しましょう!

WordPress情報は控えておく

お申し込み完了後WordPressのURL、データベース情報が表示されます。データベースのパスワードについては後からの確認は出来ませんので、

控えておきましょう。

WordPress初期設定

管理画面のURLにアクセスしてください。

〇〇.com/wp-adminとなっているはずです。

ConoHa WINGでとても簡単にWordPressサイトを作る【最短10分】

ここに先程のWordPressの『ユーザー名』『パスワード』を入力します。

基本設定

これが『ダッシュボード』になります。

ここからWordPressの各種設定を行っていきます。

ConoHa WINGでとても簡単にWordPressサイトを作る【最短10分】

まず日本語しましょう。

ConoHa WINGでとても簡単にWordPressサイトを作る【最短10分
Settings→Generalへ
ConoHa WINGでとても簡単にWordPressサイトを作る【最短10分
Site Languageを『日本語』へ
ConoHa WINGでとても簡単にWordPressサイトを作る【最短10分
時間帯を日本時間にする、UTC+9で

テーマを変更

ConoHa WINGでとても簡単にWordPressサイトを作る【最短10分

『外観』からテーマを変更することができます。

サイトの表示を確認する

サイトを見るには画面左上『サイトを表示』から確認することができます。

しょーご
しょーご
これはデフォルトの『Twenty Twenty-One』ですね。なんともシンプル笑

ちなみにダッシュボードに戻る時も左上のバーから戻れます。

基本はこれで終わり

これでWordPressサイトの構築と超基本設定は終わりました。

ここからやることは以下のとおりです。

  • テーマのカスタマイズ
  • プラグインの導入
  • 『投稿』からブログ記事を投稿
  • 常時SSL化
  • 独自ドメインと紐付けたい場合は独自ドメインをお名前.comなどで別途取得して紐付ける
  • ブログとして運用する場合は『Google Analytics』『サーチコンソール』との紐付け

ぞれぞれについてはここでは割愛させていただきます。

超簡単にWordPressサイトを構築

ConoHa WING を利用することで、簡単にWordPressサイトを構築することができます。

ブログをされたい方も、サイト構築を仕事にしたいかたも、できるだけ独自ドメインと紐付けられることをおすすめします。サイトが大きくなってからだとリスキーなのと、実案件でもドメイン・サーバーの連携作業はよくあるからです。

しょーご
しょーご
今回の記事でWordPressサイトを立ち上げたい人のお役に立てたなら嬉しいです、まだの人は早速登録から!

ConoHa Wing公式サイト

https://www.conoha.jp/wing/

あなたに是非読んでほしい記事です!