操作マニュアル - WordPress
日常的な作業は、I.【動画投稿の方法】だけで大丈夫です。
0.【サイトの情報など】
1. Google Analytics Googleのアクセス解析のページです。Googleアカウントにログインした状態でアクセスしてください。
2. Webサーバのアクセス解析(毎夜00:00更新) 前日00:00までのログが集計されます。閲覧ははやいです。当月分が表示されます。必要のないアクセス(botや/task、/administratorへのアクセスなど)はカウントしていません。事務所など特定の場所からしかアクセスできません。
3. Webサーバのアクセス解析(リアルタイム更新) リアルタイムのログが集計されます。閲覧まで多少時間がかかります。過去をさかのぼって表示できます。 事務所のWebサーバに多少負荷がかかります。必要のないアクセス(botや/task、/administratorへのアクセスなど)はカウントしていません。 事務所など特定の場所からしかアクセスできません。
4. 掲示板(タスク、バグ管理) 要望やバグ管理のための掲示板です。システムを修正するための情報はここに集約しています。
I.【動画投稿の方法】
1. WordPressへログインします。
2. 左サイドメニューから[投稿]-[新規投稿]を選択
3. タイトル欄に記事のタイトルを入れる。
4. [スラッグ]に数字で日付を入れる。スラッグはURLの一部になります。 ex. 「110401」 英字でなく「sunshine60」などでも大丈夫ですが、同日同カテゴリの他の記事とURLがぶつかる可能性があるので、「110401sunshine60」などとするほうがいいです。 「スラッグ」設定欄が表示されていない場合は、画面右上の「表示オプション」をクリックするとドロップダウンしますので、「スラッグ」のチェックをオンしてください。
5. [カテゴリ]を選ぶ。 ex.「池袋ぶらり散歩道」。 [親カテゴリ](ex.「スポット」)は選択しないでください。 新しいカテゴリを作成する場合は、IIを参照してください。
6. トップページの「オススメ動画」に表示したい場合は[オススメ動画]で[はい]にチェックを入れる。
7. タイトル下の大きなテキストボックスにYouTube動画の挿入コードと説明テキストを入力します。具体的には、下記7-1~7-6のようにします。
※ブロックで「クラシック」従来のWordPressエディタを使用します、となっていることの確認をする。でないと動画ページに小さなサムネイルが表示されてしまう。
7-1. 下記のコードをコピペ (今後YouTubeの埋め込みコードが変更になったときコードも変わる可能性があります)
---------------------- ↓この下から ----------------------------
<p><img border="0" src="https://img.youtube.com/vi/XXXXXXXXXXX/0.jpg" /></p><!--more--> <p><iframe title="YouTube video player" height="390" src="https://www.youtube.com/embed/XXXXXXXXXXX?wmode=transparent" frameborder="0" width="640" allowfullscreen></iframe></p> <div class="movie_text"> <p>説明テキスト説明テキスト説明テキスト説明テキスト説明テキスト説明テキスト説明テキスト説明テキスト説明テキスト</p> </div>
---------------------- ↑この上まで ----------------------------
7-2. XXXXXXXXXXXの部分にYouTubeの動画のID(11ケタの半角英数字文字列)をコピー&ペーストする。
7-3-1. 1行目の0.jpgがサムネイルなので、1~3までの数字を入れる。
7-3-2. または、img src=以下に、アップロードしたサムネイルのURLを入れる。ex. img src="https://ikebukurotv.com/images/thumbnails/XXXX.jpg"(詳しくは下記I-2を参考にしてください)
7-4. 説明テキストを上書き入力。
7-5. 画像を入れたい場合は、挿入したい位置にマウスカーソルを確定した状態で、タイトル下にある「メディアを追加」ボタンをクリックします。「メディアを挿入」画面が表示されますので[ファイルをアップロード]タブをクリックして画像をドロップします。右下の「投稿に挿入」ボタンをクリックすると、記事中に画像タグが挿入されます。既存の画像を挿入する場合は、「メディアを挿入」画面の「メディアライブラリ」タブをクリックし、目的の画像をクリックして選択状態とし、右下の「投稿に挿入」ボタンをクリックすると記事中に画像タグが挿入されます。WordPressでは画像をアップロードすると、サムネイル、中サイズ、大サイズ、フルサイズの4種類の画像に加工して保持します。これらの画像の選択は「メディアを挿入」画面の右サイドの「添付ファイルの詳細」の下に「添付ファイルの表示設定」→「サイズ」で操作します。
ここまでで、メインのコンテンツは作成されますが、検索エンジン対策が必要になります。続いて、
8. 画面下方の[All in One SEO Pack]をみます。
9. 説明に動画の説明文を入力します。または、7-5で入力した説明テキストをコピペします。入力しない場合は自動的に本文中のテキストが適当に適用されます。 Googleなどの検索結果のテキストに利用されます。
10. キーワードに、動画のキーワードを半角カンマ「,」で区切って列挙します。ex. 「池袋駅,東口,殺人,事件,女性,15歳, 」。 Googleなどの検索エンジンがキーワードをチェックします。詳しくは下記I-1。 記入しない場合は自動的にカテゴリが設定されます。
11. すべて入力が終わったら[更新]を押します。 公開したくない場合は以下のように操作します。 ・「下書き」 [ステータス]→[編集]で表示されるドロップダウンで選択 ・「非公開」 [公開状態]→[編集]で表示されるラジオボタンで選択します。
I-1. 【動画のメタキーワード登録の注意】
I.の9.~11.で入力するキーワードは、ページごとに独立してソースコード上に表示されます。 このため、あまりに動画に固有のキーワードにした場合、「池袋テレビ」などでヒットされにくくなる可能性があります。 また、あまり多くのキーワードを設定すると、検索エンジンの評価が低くなると言われております。 以下のような文字列を雛形にして、動画固有のキーワードを追加していくかたちがいいと思います。
---------------------- ↓この下から ----------------------------
池袋テレビ, 動画,インターネットテレビ, ikebukurotv, (以下、カンマ区切りでキーワードを登録していく)
---------------------- ↑この上まで ----------------------------
WordPress化して以降は、関連動画はキーワードの関連性を加味しておりません。
I-2. 【動画サムネイルの作成、アップロード方法】
I.の7-3-2.のサムネイルについては、以下のようにして作成、アップロードしてください。
1. キャプチャ画像の幅を 300pxに縮小する。 これより小さいと「オススメ動画」などで自動的に拡大表示され汚くなり、これより大きいと画像の容量が大きくなり、サイトの読み込み速度が遅くなります。 サイズが100KBを超えないくらいが目安です。 300x180で圧縮率低めでjpg保存するとだいたい50~60KBです。
2. .jpgや.pngで保存する。photoshopのpsd形式などをアップしても、ブラウザで表示されません。また、bmpは結構サイズが大きいので使わないほうがいいです。
3. WordPressにログインして、左メニュー[投稿]-[投稿一覧]を選択。
4. 「投稿」一覧画面が表示されますので、該当する記事のタイトル部分にマウスを乗せ、[編集]をクリック。
5. 本文の左上[メディアを追加]をクリック。
6. 「メディアを挿入」画面が表示されますので[ファイルをアップロード]タブをクリックして、1.~2.で作った画像をドロップしてください。
7. アップされた画像をクリックして、右サイドの「URL」をコピーする。
8. I.の7-3-2.にあるように、URLをペーストして下さい。
9. 記事を保存。
サムネイルを作るときは、Photoshopなどで[ファイル]-[Web用に保存]などとすると楽です。画像を軽くしたり、表示しやすいかたちに処理してくれます。
I-3. 【動画サムネイル 「アイキャッチ画像」を利用】
WordPressの「アイキャッチ画像」を利用して動画サムネイルを設定することが可能になりました。 画像の作成は上記I-2の1.~2.の手順と同じです。
1. WordPressにログインして、左メニュー[投稿]-[投稿一覧]を選択。
2. 「投稿」一覧画面が表示されますので、タイトル部分にマウスを乗せ、[編集]をクリック。
3. 画面右下の[アイキャッチ画像]-[アイキャッチ画像を設定]をクリック。既に設定済みの場合は[アイキャッチ画像を削除]を実行してください。
4. 「アイキャッチ画像」画面が表示されますので[ファイルをアップロード]タブをクリックして画像をドロップしてください。[メディアライブラリ]タブをクリックして、既存画像を使用することも可能です。
5. 画面右下の[アイキャッチ画像を設定]ボタンをクリックします。
6. 編集画面の[更新]ボタンをクリックして記事を保存して完了です。
「アイキャッチ画像」を利用すると、記事本文の以下の部分が不要になります。
---------------------- ↓この下から ----------------------------
<p><img border="0" src="https://img.youtube.com/vi/XXXXXXXXXXX/0.jpg" /></p><!--more-->
---------------------- ↑この上まで ----------------------------
II.【カテゴリの作成、登録方法】
各動画は、カテゴリに属している必要があります。新しいカテゴリは、以下のようにして作成、登録します。 カテゴリは親(Joomlaでは「ジャンル」)と子(同「サブジャンル」)で構成されます。作成できるのは子カテゴリーです。親カテゴリーはページの追加が必要になりますので、制作会社に申し付けてください。
まず名前を登録します。
1. メニューから[投稿]-[カテゴリー]を選択
2. 「カテゴリー」画面が表示されます。ここでは追加したり各カテゴリーを編集したりはできますが、カテゴリー間の表示順番を変更することはできません。
3. [名前]にカテゴリの名前を入れる。 ex. 「散歩道」
4. [スラッグ]に英数字で名前を入れる。スラッグはURLの一部になります。 ex. 「sanpomichi」
5. [親]を選ぶ。ex. 「スポット」
6. [説明]にテキストを入力します。改行はそのまま反映されます。htmlタグは除去されます。
(いずれ説明テキストは画像にする予定です。画像にすると、上記の作業は不要になります。)
7. 左下の「新規カテゴリーを追加」を押す。
カテゴリーの表示順番を設定するには以下の手順で行います。
8. 左メニューから[投稿]-[Taxonomy Order]を選択
9. カテゴリーの一覧リストが親子関係で表示されます。
10. 子項目のドラッグで任意の位置に変更できます。各カテゴリページのカテゴリ枠表示位置に反映されます。
11. 親ごと変更できます。トップページのカテゴリ枠の位置に反映されます。
12. ページ下の[更新]をクリックしてください。
これで、該当するカテゴリページの子カテゴリに1つ以上の記事があると、動画が自動的に新着順で表示されるようになります(記事が1つもないとカテゴリ枠は表示されません)。
III. 【子カテゴリの画像見出しの作成方法】
子カテゴリの見出し部分は画像になっているので、子カテゴリを新規作成するごとにその画像を作成して、アップロードしておく必要があります。以下のようにして作成、アップロードします。
1. Photoshopで指定ファイル(渡してあります。掲示板にもアップしておきます)を開いて、文字を編集。
2. ファイルネームを 「cat_top_xxxx.jpg」にして保存。 xxxxは子カテゴリスラッグです。 ex. 「cat_top_sanpomichi.jpg」
3. 画像のアップロードはFTPかさくらサーバーの管理画面「ファイルマネージャー」から行ってください。
4. サーバーのディレクトリは「/images/subgenre/」です。
5. 作成した子カテゴリが属する親カテゴリを選択。ex. ニュースなら「news」、カルチャーなら「cul」。
6. 1.~2.で作った画像を選択してアップロードを実行してください。
以上で、サイトの表示順に沿って、自動的に見出し画像が割り振られるようになります。IIで表示の順番を変更しても自動的に反映されます。また子カテゴリーの個数に上限はありません。
VI. 【バナーの作成方法】
トップページの「協賛企業」とサイドバーの「動画ランキング」の上のバナー設置が可能です。
1. バナー広告の画像を作る
Photoshopなどで210x90 pixelの大きさで作ります。名前はそれとわかるように「banner210x90.jpg」などとします。
2. WordPressにログインし [固定ページ] - [固定ページ一覧]を選択します。
3. 「【設定】 – サイドバナー」と「【設定】 – 協賛企業」がありますので、設定するほうのタイトルにマウスを乗せ[編集]をクリックします。設定手順は両者とも全く同じです。
4. [バナー]枠の下の[バナーアイテム追加]をクリックすると[ループ行]が追加されます。
5. [名前]を入力します。これはサイトページへは反映されません。設定ページのバナーアイテム上に表示されるのみです。
6. [バナー画像]-[ファイルを追加]をクリックすると「メディアを挿入」画面が表示されますので[ファイルをアップロード]タブをクリックして1.で作成した画像をドロップします。
7. [リンク先URL]を入力します。当サイト内のページのURLを確認したい場合は、記事一覧画面の右上に「投稿の検索」がありますので、任意のテキストを入力して探すことができます。タイトルにマウスを乗せ「表示」をクリックしますとページが表示されます。ブラウザのアドレスバーでURLを確認できます。当サイト内のページのURLを指定する場合は、ドメインを除いた部分で指定できます。ex. 「https://ikebukurotv.com/category/cul/farm」→「/category/cul/farm」。
8. [ターゲット]は、別ウィンドウで表示させたい場合にチェックを入れてください。
9. [追加テキスト]を入力すると、バナー画像の下に表示されます。ex. 「↑ 台湾友好ページ こちらからどうぞ☆ ↑」
10. ページ右の[更新]をクリックして完了です。
11. バナーアイテムをドラッグして順番を変更すると、ウェブページ上の表示位置に反映されます。ページ右の[更新]クリックは忘れすに!
Ⅴ. 【季節ヘッダー画像の差し替え方法】
ページ最上部の季節を表現している画像を差し替えることができます。
サーバーへのアップロードやファイル操作は、FTPソフトかさくらサーバーの管理画面「ファイルマネージャー」から行います。
1. 季節ヘッダー画像を作る
Photoshopなどで400x90 pixelの大きさで作ります。
2. 表示中画像名称変更
サイトの「/home/ikebukurotv/www/images/header/」フォルダに「image.jpg」という画像ファイルがありますので、ファイル名を「image-201707.jpg」などとします。
3. 差し替え
1.で作成した画像を、サイトの「/home/ikebukurotv/www/images/header/」フォルダにアップロードします。名前は必ず「image.jpg」とします。
差し変わったことを確認して完了です。
Ⅵ. 【サイドバートップのサイトディスクリプション】
サイドバーの最上段のサイトの説明書きを編集できます。
1. WordPressへログインします。
2. メニュー「外観」-「ウィジェット」でウィジェット管理画面が表示されます。
3. ウィジェット管理画面の「Scitech Sidebar(サイテック用)」-上段の「テキスト ▼」をクリックします。
4. サイトの説明書きに該当する文章がありますので、その部分を修正してください。