toggle
2017-01-16

WordPress童貞がWebサイトを完成させるまで<前編>

プログラミングされているPC

自サイトを作ろうと思ったら、

避けては通れないのがWordPress

 

いや、別に避けれるんだけど本気で運営したけりゃ

無料のサービスを使うよりも断然WordPressとの事。

 

俺自身、ライターの仕事で記事更新くらいはちょこっと触った事あったけど、

はっきり言って爬虫類の性癖くらい謎に包まれてる状態。

 

絶賛Wordpress童貞。笑

 

「ほなプロに頼めばええやないかい~」って意見もあるやろうけど、個人的には月額万円とか払うのがアホらしすぎるんで、自分でやったれと。根性じゃいと。

 

先に結論から言うと、プログラミングの知識はゼロでも、これくらいのWebサイトは立ち上げる事はできた。ググる能力と、根気さえあれば可能やったね。それは保証する。

 

その結果、このサイトが出来上がった訳なんですが、その道中にあった問題をいかに解決してきたかを、これから始めたいと思ってる同志たちの為に綴っていきたいと思う。

 

 

WordPressを始める上で必要なものは?

まずはここから。はっきり言って、自分はそれすらも分かってなかった。

なんかノリで「ポン!」と始めれるものやと思ってたけど、多少の下準備が必要らしい。

 

・独自ドメインの取得

・レンタルサーバーの確保

 

主にこの2つかな。

独自ドメインの取得は「お名前.comで確保した。お名前.com

手順は、ドメイン検索ドメインの選択登録支払いって流れで完了って流れ。

ここはかんなり簡単で、すんなりいった。よしよし。

 

次にレンタルサーバーの確保。

これは色々考えた結果「エックスサーバー」に。エックスサーバー

 

理由は俺は映像を貼り付ける機会が多いと思うんで、200GBと容量が豊富な点。あと、WordPressの簡単インストールがあるってので決定。しかも値段も安い。ここもすんなり。ええぞええぞー。

 

WordPressのインストールもエックスサーバーのマニュアルの通りにすれば簡単にインストールできたぜ。さすがエックスサーバー。何がエックスか分からんけど優秀や。君に決めてよかった。

エックスサーバー WordPress簡単インストール設定手順

 

そのあと、お名前.comにサーバーアドレスを登録。

エックスサーバーにも取得したドメインを登録して、船出の準備は完了。

ここまでは順調順調。→お名前.com&エックササーバー設定手順

 

この時点で、月額費用は1200くらいかな。

自分で本気で運営したかったらそれくらいは余裕やね。

 

テーマ選び

そんな流れでWordpressという船には乗れたが、まだ何にもない状態。
このまま船出をすれば、いかにルフィと言えどグランドラインにまでたどり着けないレベル。ワンピースが2話で終わる。それは避けたい。

 

ここでWordpressの本領発揮。テーマってのがあって、サイトの仕様をガラッと変えてくれる、すんばらしい機能があるとの事。着せ替えサイトみたいなイメージかな。

 

 

やり方は簡単。

ダッシュボード→外観→テーマ

って流れで簡単にダウンロードできる。

 

しかし、ここで俺のダメーな所が顕著に表れた。
「え、選べない。。」という事態に。笑

 

全部ええ感じやん。どうしよかなー。で数時間経ってた。笑

これはマジで避けた方がいい。時間は有限なのを忘れたらあきまへん。笑

 

結局「sydney」っていう、海外のWordPressの無料テーマに決定した。

理由は、自分のイメージにそこそこあったテーマだったのと、直感的にカスタマイズできるっていう所。さらに日本語対応もしてる。(ただし、マニュアルとかはほぼ全部英語だから、Google翻訳を活用。日本語のフォントが崩れたりしないのが日本語対応という事らしい。)

 

テーマ選びは

・自分の作りたいイメージにあったテーマ

・日本語対応している

・レスポンシブ対応(スマホ・タブレット対応)

 

この3点さえ満たしていたら、速攻で決めるのがベストかな。

「もっと良いものを」なんか考えてたらいつまで経っても始められへんからね。

 

子テーマを作ろう

ようやくカスタマイズする所まで来ましたぜ。

いやはや、なかなか時間がかかった。慣れない作業は疲れるなー。笑

 

と思いきや、、、、 

色々とググってるうちに、カスタマイズするには子テーマというものが必要らしい。理由は、利用しているテーマをそのままカスタマイズすると、テーマ製作者がそのテーマの内容を更新したりした時に、そのカスタマイズしたデータが飛んでしまうからだとさ。

 

なんつーややこしい事してくれてんの。。笑

 

しかも、その「子テーマ」を作るためには

「style.css」「function.php」とか言う謎の言語を自分で用意せなアカンという。笑

 

マジかよ。ついに来たよと。

でも、ここまで来たらやるしかない。

 

子テーマ作成のために必要なモノ

・Style.css

・Function.php

 

最低限必要なものはこれだけ。

なぜ必要なのかは、各々ググってくださいな。

なぜなら俺もよく分かってないから。笑

 

「いい加減な事言うなよ」って意見もあるかもしれないけど、

こんなよく分かってないような奴にでも出来るんだなと思ってもらえれば有難い。笑

 

1、新規フォルダ作成

ここはめちゃくちゃ簡単。

俺はMacユーザーだから、デスクトップで二本指でクリックして「新規フォルダ作成」するか、右クリックで「新規フォルダ作成」を押せば簡単に作れる。

 

名前は分かりやすく「sydney-child」でOK。

 

2、style.cssの作成

 

「sydney」を使ってる場合は、このコードをテキストエディタにコピペすればOK。

(テーマがバージョンアップされてる場合は変更しておく。そして、テキストエディタのエンコードを環境設定で「UTF-8」に変更しておく)

 

それ以外のテーマを使ってる人は、Thema Name、Thema URLとかの部分を、それぞれのテーマの仕様に適宜変更してくれたらいいかなと。ダッシュボード→外観→テーマ編集→スタイルシートで確認できる。

 

3、function.phpの作成

 

同じく「Sydney」をテーマで使ってる人は、これをテキストエディタに貼り付ければ完了。

 

それ以外のテーマを使用してる人は

これをコピペすれば問題なく作成できるはず。

 

4、テーマにアップロード

ここまできたらあと少し。こんな感じのフォルダが手元にはあるはず

 

俺はフッターもカスタマイズするから「footer.php」も追加しておいた。

でも、ここは必要な人だけで問題ないらしい。しかも、必要になったら後から追加することも可能だから、とりあえず無視でもいいかなと。

 

で。

このファイルを「ダッシュボード→外観→テーマ→新規追加→テーマのアップロード」って流れでアップロードして、最後に有効化すれば、、、

 

 

「子テーマ」作成完了!!

 

 

なかなか、難しい戦いやったけど、

有効化出来た時は最高に嬉しかったな。笑

 

最後に

こんな流れで、ようやく名実ともにカスタマイズできる所まできたね。

プログラミング・Wordpress初心者でも、ググる能力と、根性があればそこそこ戦えるって事を示せたはず。笑

 

次回は、その後のカスタマイズについて話していきたいと思う。

 





関連記事