5月30日(火)-サーバー移行・ロリポップ操作・サイト模写

メモ

◆FFFTP使用時、接続先を切り替える場合は、必ず切断後に接続する

繋いだままにすると勝手にログが溜まっていき、繋げられなくなることがあるためとのこと。

◆練習のための模写サイトを作るとき

検索に引っかからないよう、できればURLを入れても表示できないようにするのがベスト
「検索避け html」等で検索して、METAタグ入れるとよい
+METAのディスクリプションに「模写サイトです」など注釈を入れる

WordPressのサーバー引越し(移行)

1.元Wordpress管理画面→プラグイン新規追加で「All-in-One WP Migration」→有効化
All-in-One WP Migration→エクスポート
【エクスポート先 横の≡】→ファイルをクリック
→成功した場合、デスクトップにDLされる
→失敗した場合は2へ

2.DLできなかった場合は、直接サーバーからデータをDLする
FFFTPで元Wordpressのサーバーへ接続
「wp-content」→「ai1wm-backups」フォルダ内の最新のエクスポートデータ(拡張子.wpress)をデスクトップ等へDL

3.新しいサーバーで、新規Wordpressをインストールしておく
インストールしたWPの管理画面をブックマークしておくと楽
※ロリポップの場合は、下記↓【トップページではなく、下階層フォルダにWPサイトをインポート(引っ越し)する場合】
を参照!

4.新Wordpress管理画面→プラグイン→新規追加「All-in-One WP Migration」→有効化
All-in-One WP Migration→インポート
【インポート元 横の≡】→ファイルをクリック
引っ越し元からエクスポートしておいたバックアップデータを指定
(バックアップデータはインポート後も念のためしばらく保管しておく)
インポート100%後、開始していいかのメッセージが表示→「開始」
しばらく待ち「サイトをインポートしました。」と出たら「完了」

5.移行したWPを動作、リンク先等確認し、問題なければOK
たまに、自HP内リンク先やアンカーリンクがおかしくなっていることがあるとのこと
(URLが変わる影響のため、影響のない外部リンクは問題ない)

※ロリポップを初期化する方法

※今回の例)ロリポップは借りた直後でWPの引っ越しだけしたが、
間違えてトップページ設定にしたくないのにトップに指定し引っ越してしまい、ホームページがWPとして表示されてしまった。

WP部分だけ消す方法もあるが、手順が難しいので、一度ロリポップを初期化し空にする場合の方法。

1.(ロリポップ)サーバーの管理・設定→データベース
下部の「×データベース削除」クリック
色々出るが「はい」→消えたらOK

2.FFFTPまたは、ロリポップ→サーバーの管理・設定→「ロリポップ!FTP」
(大浜先生より、ロリポップFTPの方が早いかも?とのこと)

【.htaccess】のみ残して全データ削除
※【.htaccess】は重要なので絶対に消さない!!

Xfreeの場合、他に「default_page.png」「index.html」の2点はサーバーになにもデータがないときに表示される文言のファイルなので、これもできれば残しておく

(ロリポップ)トップページではなく、
下階層フォルダにWPサイトをインポート(移行)する場合

1.FFFTPまたは、ロリポップ→サーバーの管理・設定→「ロリポップ!FTP」
新規フォルダ作成(実際のWPを表示する際のURLになり、あとから変更は面倒なので名前は慎重に考える)
※ロリポップFTPだとフォルダの権限など表示されるので、FFFTPでやった方がいいかも…?

【FFFTPの場合の接続設定】
新規ホスト→ホストの設定
(以下、ロリポップ→ユーザー情報→アカウント情報の内容参照)
・ホストの設定名:わかりやすい名前(完全に自分の管理用なので日本語でOK)
・ホスト名(アドレス):ftp.lolipop.jp
・ユーザー名:FTP・WebDAVアカウント情報
・パスワード:同じパスワード情報
その他はそのままでいいのでOKで接続

2.(ロリポップ)サイト作成ツール→WordPress簡単インストール
下部のWordPressインストール履歴→履歴を削除でOK

※以下忘れない!!間違えるとまた初期化しないといけないので注意
★インストール先→サイトURL→上部のhttp://~【入力は任意です】
の欄に、作成したフォルダ名を入力
・利用データベース→新規自動作成
・サイトのタイトル以下を入力
・ユーザー名、パスワードは新規で入力でOK
・WordPressテーマを選択→デフォルトテーマでOKそう(あとで上書きされるので)

入力内容確認→インストール

インストール完了したらOK、管理画面URLとかメモしておく

3.インストールした新WPの管理画面
ブックマークしておくと楽
プラグイン→新規追加「All-in-One WP Migration」→有効化
All-in-One WP Migration→インポート
【インポート元 横の≡】→ファイルをクリック
引っ越し元からエクスポートしておいたバックアップデータを指定
(バックアップデータはインポート後も念のためしばらく保管しておく)
インポート100%後、開始していいかのメッセージが表示→「開始」
しばらく待ち「サイトをインポートしました。」と出たら「完了」

4.移行した新WPを動作・リンク先等確認し、問題なければOK
たまに、自HP内リンク先やアンカーリンクがおかしくなっていることがあるとのこと
(URLが変わる影響のため、影響のない外部リンクは問題ない)

ロリポップに複数サイトを作るとき

・トップディレクトリ(階層)は基本的にトップページ用のindex.htmlやcss、imgフォルダを置く
・その他サイトを置く場合は、トップディレクトリにURLになる名称でフォルダを作り、その中にindex.html等を格納すればOK

4月28日(金)-CMS構築実習・サーバー引越し

WordPressサイト移行手順を確認しましょう。

WordPressサイトのフォルダ構成について

WordPressのフォルダで移行に関連するフォルダは、以下の通りです。投稿ページや固定ページなどのコンテンツデータは、ファイルではなくデータベースに格納されているためファイルとして確認することはできません。

  • テーマフォルダ:/wp-content/themes
  • プラグインフォルダ:/wp-content/plugins
  • メディアライブラリィフォルダ:/wp-content/uploads

また、WordPressサイトの移行にAll-in-One WP Migrationプラグインを使用した場合は、以下のフォルダに移行用データが作成されます。

  • 移行データフォルダ:/wp-content/ai1wm-backups

WordPressサイト移行時の対象物について

WordPressサイトを移行する場合には、以下の対象物の移行が必要になります。

  • WordPressサイト環境(テーマ、プラグインなど)
  • 設定情報、投稿データ、固定ページデータ
  • メディアデータ
  • ドメイン移行(必要に応じて)

WordPressサイトの移行手順について

WordPressサイトの移行の行うためには、以下の手順があります。

  • レンタルサーバーが提供する簡単引越し機能(Xfreeはなし、ロリポップはある)
  • プラグインを使用した移行(Xfreeの場合ノート参照)

【参考サイト】

4月27日(木)-CMS構築基礎⑥

【要参考】
・【STEP4】Webページの制作「Wordpress活用法の教科書⑧.pdf」参考
WordPress テーマ作成入門 | HTML-CSS 入門講座 | 情報デザイン工房 濱屋

基本機能を保有したテーマを理解しましょう。

WordPressテーマの基本機能とは

基本機能を持ったWordPressテーマを作成するためには、以下の機能を実装する必要があります。

  • 投稿一覧の表示
  • 投稿ページの表示
  • 固定ページの表示
  • メニューの表示

メモ

・大浜先生より(WordPress テーマ作成入門 | HTML-CSS 入門講座 | 情報デザイン工房 濱屋 「A4.5 テーマのカスタマイズ」参照)

テーマのカスタマイズ方法は、複数ありますので以下の順でカスタマイズ可否を確認してください。

  1. テーマが提供するカスタマイズ機能でのカスタマイズ
  2. プラグインを利用したカスタマイズ
  3. 追加 CSS を利用したカスタマイズ
  4. 子テーマを利用したカスタマイズ
  5. カスタマイズをあきらめましょう!(他のテーマを探すかオリジナルテーマを作成することを検討しましょう)

4月25日(火)-CMS構築基礎⑤

【要参考】
・【STEP4】Webページの制作「Wordpress活用法の教科書⑦.pdf」参考
WordPress テーマ作成入門 | HTML-CSS 入門講座 | 情報デザイン工房 濱屋

WordPressのテーマの仕組みを確認しましょう。

WordPressについて

WordPress(ワードプレス)は、ブログやサイト(ホームページ)を作成できるソフトです。今や、世界中のサイトの約3分の1はWordPressで作られていると言われています。日本国内でも、個人ブログだけでなく、企業や公共機関のサイトなどに幅広く利用されています。

【参考サイト】

WordPressのテーマとは

WordPressのテーマは、Webサイトのデザインを決定するものですが、デザインに加えてサイト全体の構成や表示される機能にも影響します。単純に見た目のデザインだけで選ぶと操作がしにくかったりメンテナンスが大変だったりする場合もあります。
テーマの入手方法は、以下の種類があります。無料のテーマの中には、機能制限有りが無料で制限を解除する場合は、有料になる場合もあります。

  • 無料のテーマ(WordPress公式テーマ)
  • 無料のテーマ(WordPress非公式テーマ)
  • 有料のテーマ
  • 制作会社に発注
  • 自分で作成

【参考サイト】

HTML・CSSからオリジナルテーマを作成

WordPressのオリジナルテーマを作成する手順を理解しましょう。

【参考サイト】

メモ

・WordPressのテーマはPHPも関わってくるのでかなり難しいので、業務内容に応じて不要であればあまり覚えなくてもいい(けど、覚えられると幅が広がる)