さて早速ですが、このサイトを開設するまでの手順や設定などの備忘録をメモしていきます。
かなりweb寄りな話なので、単純にワーホリ関係の記事を読みたい方は飛ばしてください。
事前に行っていた準備など
基本的に1日でがっとテーマをインストールして設定・この記事を書くまでやったのですが(疲れた・・)何点か事前準備が必要なものもあります。
ドメイン(URL)・サーバー設定
元々、さくらのサーバー・スタンダートプランを持っていたので、サーバーはさくら、ドメイン(URL)はエックスドメインで取得しておきました。サーバーもエックスサーバーに乗り換えようか悩んだのですが、そんなにアクセスもないのでひとまず・・ひとまずさくらの安い方で。
<ドメインの不可思議>
お名前ドットコムだと、megworld.comがプレミアドメインで買えそうだったのですが、他のところでは取得不可だったのはなんだったんだろう。。もう少しひねりを加えたサイト名・URLを使いたかったのですが、結局単純にmegu+world → meguworld.comにしました。
サイトで使う画像
この記事のトップに出ている画像です。これは楽しいので気持ちが先走りながら結構前に作成していました。
スペイン好きな方や・旅行が好きな方が見て楽しくなるような、そして可愛い画像を作りたいと思い、カラフルな写真に白一色のロゴ+旅行に関わるイラストを散りばめました。ブログはコンテンツ(記事)が一番大切だとは思いつつ。
ちなみにファビコンは、設定をしていく途中で作りました。トップ画像から「M」のアルファベットだけ残し、白地に黒だとすごくシックになってしまってので、スペインのイメージ…太陽・オレンジ・明るいイメージでオレンジ背景に白文字にしました。もうちょっと余裕があれば遊び心ある感じの作りたいな。
小さいですが、この画像です。⬇︎
基本的な土台・環境作り
- 最初に持ち込みドメイン(URL)でさくらサーバーでワードプレス自体のダウンロード→ SSL認証の申し込み&プラグインでSSLの設定。(httpsが有効になるまでは数十分かかりました)
- SSLが有効になるまで待っている間にコンテンツを考えてみる。
ざっくりしたカテゴリの構想をこんな感じ⬇︎でテキストエディットに打っておく。こういう設計も最初のうちにしておくのが大切!
コンテンツ
- ワーホリ
- ワーホリ準備
- 現地での手続き
- 日々のつぶやき
- スペイン生活
- アート・デザイン
- まち歩き
- 旅行
- 文化
- Web・テクノロジー
- 語学
- 勉強
ワードプレスのテーマ
自分でオリジナルテーマのサイトを構築したこともあるのですが、今回はCocoonを使わせていただきました。
Cocoo設定で行ったこと。
- ヘッダー画像の設定やソーシャルシェアアイコンなどのデザイン。
- キーカラーを一部編集。決める時の参考。よくお世話になるページ
- フォントサイズなど
- すぐ記事を書きたいですが、最初の設定が大切なので、こちらのブログを参考に上から順に設定。そのままプラグインも参考にして設定
- 参考:【ワードプレス無料テーマ】Cocoon初期設定でやったこと一覧
- 参考:Cocoonに入れるべきおすすめプラグイン7選【ワードプレス】
- カテゴリの設定など投稿周りとhttps&wwwもリダイレクトの参考に
- 参考: Cocoonをインストールしたのなら、今すぐ行うべき13個の設定
入れたプラグイン
- Akismet Anti-Spam(スパム対策。デフォルトで入ってるので有効にするだけ
- EWWW Image Optimizer(画像をアップする時に自動で圧縮してくれるらしい。それは楽だ、と思って試してみる)
- Google XML Sitemaps(グーグルコンソールと連携)
- 設定は全てこちらのサイトの設定を参考に
- SAKURA RS WP SSL(http→https のSSL認証のため)でも.htaccess直接編集できたから不要だったのかも?
Google・SEO周り
最初の3つ、GTM, GA, サーチコンソールはIDとかを入れる欄がCocoonあって、すごく簡単だった。Cocoonさまさまです。
- GTM 初めて使うのですが、仕事柄よくきいているものだったので導入。
- Google Analytics 登録
- Google search console 登録
- 【大まかな流れ】グーグルサーチコンソールでこのサイトを登録→HTMLタグを発行→Cocoonのheadタグにソースを入れられるとこにmetaタグを設置。ここでなぜかverifyできない問題が!→記事が一つも登録されていないことが問題だったので急いで1記事作成→サーチコンソールで確認したらちゃんと認識されてました。
- 参考:WordPressで「Google Search Console」を設置・埋め込む方法
- こちらも前半は参考に:初心者向け!サーチコンソールの設置・初期設定方法!
- meta タグ設定
- OGP画像の設定
使わなかったけど、参考
httpをhttpsに転送して、かつ、www付きをwwwなしのURLへにリダイレクトしたくて、下記のサイトを参考にhtaccesをいじってたんですが、結局さくら公式のSSLプラグインでhttpsは完了。wwwについてもさくらのドメイン設定画面から「マルチドメインを使用する」に変えたらどっちもちゃんとリダイレクトされてました。
いつもいろいろ調べながら作業する時って、仕事でも下⬇︎のような状態になるんですが笑、このタブを一つずつ消していきながら今日の記憶をたどって書いてみました。
本当はビザ申請時のことや書類などみなさんの役に立つ情報を早く書きたいですが、記憶力に限界を感じたのでこんなweb屋さんブログみたいな記事を失礼しました。
ざっくりブログ開設の全体のプロセスを知りたい方には参考になったかな。。と祈りつつ。
コメント