「XOOPS作業内容」の版間の差分
編集の要約なし |
編集の要約なし |
||
| (同じ利用者による、間の12版が非表示) | |||
| 1行目: | 1行目: | ||
==エコ・エコ あざらし== | |||
===新規ユーザ登録用=== | エコ・エコ あざらしとは、バンダイナムコゲームスの環境活動に関する情報交換や交流を行なうための社内ポータルサイトのことです。<br> | ||
「エコ・エコ あざらし」から「エコ・エコ」をとって通称、「あざらし」と呼ばれることが多いです。<br> | |||
サイト自体はxoopsを元に構築されており、サイトの更新は専用の管理画面から行います。(※一部、静的もあり) | |||
===作業上の注意点=== | |||
管理画面から更新を行う関係上、通常はローカルでの作業・確認はできません(静的は可能)。ですので、「作業用htmlファイル」と呼ばれるhtmlファイルを使って<br> | |||
ローカルで作業・確認を行い、作業した内容を管理画面から登録してデモに反映させます。なお、画像やCSSファイル等はFTPでアップします。<br> | |||
<div style="font-weight:bold;color:#f00;">(注意)Firefoxでは管理画面がうまく開けない場合があります。正常に表示できない場合はIE7等で開いてください。</div> | |||
<hr /> | |||
===テーマファイル・JSファイル=== | |||
動的ページのレイアウトを構成するテーマファイルやJSファイルには以下のものがあります。<br> | |||
なお、あざらしのTOPページは各テーマファイルを修正しても反映されませんので、直接TOPページのファイルを修正してください。 | |||
<div style="border:1px dashed #666666;padding:0 10px 10px;margin-bottom:10px;"> | |||
====theme.html(動的ページレイアウト用)==== | |||
<div style="border:1px dashed #666666;padding:10px;margin-bottom:10px;"> | |||
[ファイル保存場所]<br> | |||
works\themes\bng<br> | |||
</div> | |||
動的ページのヘッダーやフッターなどを変更する場合には「theme.html」を修正してください。修正後はFTPで「theme.html」を「/themes/bng/」にアップすれば反映されます。 | |||
</div> | |||
<div style="border:1px dashed #666666;padding:0 10px 10px;margin-bottom:10px;"> | |||
====leftmenu_for_マルチメニュー.html(共通左メニュー用)==== | |||
<div style="border:1px dashed #666666;padding:10px;margin-bottom:10px;"> | |||
[ファイル保存場所]<br> | |||
works\themes\bng<br> | |||
</div> | |||
動的ページの左エリアを変更する場合には「leftmenu_for_マルチメニュー.html」を修正してください。修正後は管理画面から「leftmenu_for_マルチメニュー.html」内のソースを丸ごと貼り付けて反映させます。<br> | |||
管理画面については、下記の共通左メニューの修正を参照してください。 | |||
</div> | |||
<div style="border:1px dashed #666666;padding:0 10px 10px;margin-bottom:10px;"> | |||
====script.js(上部のバナー用・左メニューマウスオーバー用)==== | |||
<div style="border:1px dashed #666666;padding:10px;margin-bottom:10px;"> | |||
[ファイル保存場所]<br> | |||
works\themes\bng\common(デモ用JS保存)<br> | |||
works\themes\bng\common\本番用script(本番用JS保存)<br> | |||
</div> | |||
各ページの上部に表示されているバナーと、共通左メニューのマウスオーバー用のJSです。worksにはデモ用と本番用のJSファイルが保存されています。デモ用で確認を行い、その内容を本番用に記述してuploadに保存してください。(※デモ用のJSファイルはuploadには不要)<br> | |||
なお、本番用のJSファイルを修正する際、デモ用の内容を本番用に丸ごと上書きしないように注意してください。(※本番用のJS内に記述されているパスがデモ用と異なっているため) | |||
</div> | |||
<div style="border:1px dashed #666666;padding:0 10px 10px;margin-bottom:10px;"> | |||
====index-template.php(wordpress用テンプレート用)==== | |||
<div style="border:1px dashed #666666;padding:10px;margin-bottom:10px;"> | |||
[ファイル保存場所]<br> | |||
works\modules\wordpress(番号)\themes\bng | |||
</div> | |||
wordpressのレイアウトを修正するには各wordpressの「index-template.php」を修正してください。修正後はFTPでアップすれば反映されます。 | |||
</div> | |||
<hr /> | |||
===管理画面=== | |||
管理画面の左側の「管理メニュー」には、各コンテンツ管理ページへ飛ぶボタンがあり、それぞれコンテンツ名とモジュール名が記載されています。 | |||
====SYSTEM ADMIN==== | |||
XOOPSのシステムに関する管理モジュール。この管理モジュールを触ることはあまりありません。 | |||
====ALT.SYSTEM==== | |||
テンプレートに関する管理モジュール。 | |||
=====共通左メニューの修正===== | |||
「ALT.SYSTEM」→「テンプレート管理」→「マルチメニュー」→テンプレート名「multimenu_block.html link menu」を修正。<br> | |||
ただし、あざらしのTOPページで使われている左メニューはテンプレート管理では修正できないので、直接TOPページ用のファイルを修正すること。 | |||
====MULTI-MENU==== | |||
「BLOG投稿メニュー」に関する管理モジュール。「BLOG投稿メニュー」とは、共通左メニューの一番下に表示されているブログ編集用のリンク先一覧のこと。<br> | |||
設定項目が8個ありますが、主に使用するのは「マルチメニュー3(設定:メニュー03)」です。 | |||
=====メニューの修正===== | |||
「マルチメニュー3(設定:メニュー03)」を開くと、各コンテンツのタイトルが表示されます。画面右側の「編集」から修正を行うことが可能です。<br> | |||
メニューのタイトルを変更したり、ユーザーのグループによってメニューの表示・非表示を切り替えたりできます。 | |||
====WordPress1~WordPress8==== | |||
バンダイナムコの中の人が更新するコンテンツが「WordPress1~WordPress8」です。更新を行う機会は非常に少ないですが、たまに更新が入ります。 | |||
=====WordPressオプション===== | |||
・ユーザー設定<br> | |||
記事の投稿や編集に関わるユーザーレベルをアカウントごとに個別設定することができます。ここはほとんどいじりません。<br> | |||
・オプション設定(いじったことがあるもののみ抜粋)<br> | |||
====TINY0~TINY13(tinyd0~tinyd13)==== | |||
こちら側で新規追加・修正を行う必要があるものが「TINY0~TINY13(tinyd0~tinyd13)」です。作業用htmlファイルを使って作業を行い、その内容を管理画面からアップします。(一部、作業用htmlファイルがないものもあり。)<br> | |||
現在使われていないモジュールもあります。<br> | |||
<hr /> | |||
===定例更新=== | |||
金曜日の18時に更新があります。内容は、毎週更新の「エコ・コラム」、2週間に1回更新の「エコ・クイズ」と「注目!エコ商品情報用」です。<br> | |||
<div style="border:1px dashed #666666;padding:0 10px 10px;margin-bottom:10px;"> | |||
====【エコ・コラム】==== | |||
<div style="border:1px dashed #666666;padding:10px;margin-bottom:10px;"> | |||
[作業用htmlファイル保存場所]<br> | |||
works\html_contents\tinyd2\エコ・コラム_(コラムタイトル).html<br> | |||
[画像保存場所]<br> | |||
works\html_contents\tinyd2\img<br> | |||
</div> | |||
<div style="font-weight:bold;"><作業内容[1]/TINY2(tinyd2)への登録></div> | |||
※前準備として、必要な画像をスライスしてデモにアップしておく。<br><br> | |||
(1)前回の[作業用htmlファイル]を同じディレクトリ内にコピーし、ファイル名を新しいコラムの<div style="color:#f00;font-weight:bold;display:inline;">タイトル</div>と同じものに変える。<br>例:エコ・コラム_話題の「環境税」、あなたは賛成?それとも反対?.html<br> | |||
※このファイルは作業用のファイルなのでuploadには置かなくてもよい。<br><br> | |||
(2)作業用htmlファイル内の「tynyD用静的コンテンツ」から「/tynyD用静的コンテンツ/」までが作業範囲。前回のコラムの内容を削除し、新しいコラムの内容を追加する。<br><br> | |||
(3)ソースの追加が完了したら、作業用htmlファイルをブラウザで開き、正常に表示されるかを確認する。<br><br> | |||
(4)xoopsにログイン→「管理メニュー」→「エコ・コラム」→「コンテンツの追加」を選択。「タイトル」の中にコラムタイトルを入れ、「コンテンツ」の中にhtmlファイル内の「tynyD用静的コンテンツ」から「/tynyD用静的コンテンツ/」までを入れ、「送信」を押す。<br><br> | |||
(5)確認して終了。<br><br> | |||
<div style="font-weight:bold;"><作業内容[2]/TOPページ更新></div> | |||
(1)index.php内の「エコ・コラム」から「/ エコ・コラム /」までが作業範囲。コラムのテキストは途中で切り、「……」を入れる。テキストの長さは適当に。<br><br> | |||
(2)アップして確認して終了。<br> | |||
</div> | |||
<div style="border:1px dashed #666666;padding:0 10px 10px;margin-bottom:10px;"> | |||
====【エコ・クイズ】==== | |||
<div style="border:1px dashed #666666;padding:10px;margin-bottom:10px;"> | |||
[修正ファイル]<br> | |||
<クイズの答え用><br> | |||
works\html_contents\eguide\answer\answer.html<br> | |||
[画像保存場所]<br> | |||
<クイズ用><br> | |||
works\modules\eguide\img<br> | |||
<クイズの答え用><br> | |||
works\html_contents\eguide\answer\common\img<br> | |||
</div> | |||
<div style="font-weight:bold;"><作業内容[1]/クイズモジュールへの登録></div> | |||
※前準備として、必要な画像をスライスしてデモにアップしておく。<br><br> | |||
(1)[http://192.168.200.60:16080/kds_tko/hide_script/tool_k/azarashi/quiz/index.php エコ・エコ・アザラシ クイズ作成くん]を使って、クイズに必要なHTMLソースを作成する。<br><br> | |||
(2)xoopsにログイン→「管理メニュー」→「エコクイズ」を選択。<br><br> | |||
(3)前回のクイズの「解答」のチェックを外し、画面一番下の「送信」を押す。次に、前回のクイズの「状態」を選択し、状態を「掲載中」から「削除」に変え「更新」ボタンを押す。<br><br> | |||
(4)クイズの管理画面の一番上にある「新規クイズの登録」を選択。入力するものは下記の5項目。<br> | |||
1. 表題(入力例:エコ・エコグッズプレゼント(第26回))<br> | |||
2. クイズ日時(「カレンダ」のボタンを押して、クイズの掲載を終了する日時を入れる。)<br> | |||
3. 詳細本文(新しいクイズのソース(※ツールで生成→「・クイズ(module)用」)を貼り付ける。貼り付ける場所は「詳細本文」と書かれているすぐ上のテキストエリア)<br> | |||
4. 出力の編集形式(プルダウンから「xoopsタグのみ変換」を選択し、「定員になったら受付中止」のチェックを外す。あとはそのまま。)<br> | |||
5. 追加項目(新しいクイズの答えのソース(※ツールで生成→「・クイズの答え(module)用」)を貼り付ける。貼り付ける場所は「追加項目」と書かれているすぐ下のテキストエリア)<br> | |||
(5)「保存」ボタンを押して確認して終了。<br> | |||
<div style="font-weight:bold;"><作業内容[2]/クイズの答えページ更新></div> | |||
(1)クイズの答えで使用する画像を各自で作成する。画像の作成については特に決まりはないが、必ず枠線(#c9c9c9)で囲うこと。画像名は「例:img_present_081205_01.jpg(img_present_[日付]_[景品の数].jpg)」<br><br> | |||
(2)クイズの答え用のhtmlファイルを開き、前回のクイズのソースを確認。divタグについている「class="answer-warp first"」を「class="answer-warp"」にする。<br><br> | |||
(3)新しいクイズの答えのソース(※ツールで生成→「・クイズの答え(静的)用」)を貼り付ける。<br><br> | |||
(4)デモにアップして確認して終了。<br> | |||
※クイズの答えページ更新についての注意点<br> | |||
クイズの答えを本アップするのはそのクイズが終了する日時になるので、新しいクイズと同時にアップすることがないようにuploadに注意する。<br> | |||
<div style="font-weight:bold;"><作業内容[3]/TOPページ更新></div> | |||
(1)index.php内の「今週のエコ商品プレゼント!」から「/ 今週のエコ商品プレゼント! /」までが作業範囲。<br><br> | |||
(2)更新してデモにアップして確認して終了。 | |||
</div> | |||
<div style="border:1px dashed #666666;padding:0 10px 10px;margin-bottom:10px;"> | |||
====【注目!エコ商品情報用】==== | |||
「注目!エコ商品情報」には、クイズで使用した景品を掲載します。テキストはクイズで使用したものを流用し、画像は各自で作ります。 | |||
<div style="border:1px dashed #666666;padding:10px;margin-bottom:10px;"> | |||
[作業用htmlファイル]<br> | |||
works\html_contents\tinyd4\注目!エコ商品情報○.html<br> | |||
[画像保存場所]<br> | |||
works\html_contents\tinyd4\img<br> | |||
</div> | |||
<div style="font-weight:bold;"><作業内容/TINY4(tinyd4)への登録></div> | |||
(1)クイズ用のPSDを元に「注目!エコ商品情報」で使う画像を各自で作成し、デモにアップする。画像のサイズは150×150、必ず枠線(#e7e7e7)で囲うこと。画像名は「例:item_081205_01.jpg(item_[日付]_[商品の数].jpg)」<br><br> | |||
(2)作業用htmlファイル(注目!エコ商品情報○.html)をエディタで開き、新しいソース(※ツールで生成→「・注目!エコ商品情報用」)を貼り付ける。なお、商品は8個を目安に新しい作業用htmlファイルを作ってください。<br><br> | |||
※このファイルは作業用のファイルなのでuploadには置かなくてもよい。<br><br> | |||
(3)作業用htmlファイルをブラウザで開き、正常に表示されるかを確認する。<br><br> | |||
(4)xoopsにログイン→「管理メニュー」→「注目!商品情報」→作業用htmlファイルと同じ名前の項目の「編集」を選択。作業用htmlファイルを新しく作った場合は、「注目!エコ商品情報」の管理画面の上部に表示されている「コンテンツの追加」から新しい項目を追加する。<br><br> | |||
(5)作業用htmlファイル内の「tynyD用静的コンテンツ」から「/tynyD用静的コンテンツ/」までをコピーして貼り付け、「送信」を押す。<br><br> | |||
(6)確認して終了。 | |||
</div> | |||
<hr /> | |||
===衣替え=== | |||
数ヶ月ごとに衣替えをします。 | |||
<div style="border:1px dashed #666666;padding:0 10px 10px;margin-bottom:10px;"> | |||
<div style="border:1px dashed #666666;padding:10px;margin-bottom:10px;"> | |||
[修正ファイル]<br> | |||
<TOPページ(Flash)><br> | |||
works\index.php<br><br> | |||
<共通JS><br> | |||
works\themes\bng\common\script.js(デモ用)<br> | |||
works\themes\bng\common\本番用script\script.js(本番用)<br><br> | |||
<共通CSS><br> | |||
works\themes\bng\common\contents_base.css<br><br> | |||
<テーマファイル><br> | |||
works\themes\bng\theme.html<br><br> | |||
<Liveカメラ用静的ページ><br> | |||
works\html_contents\tinyd13\live.html | |||
</div> | |||
<div style="font-weight:bold;"><作業内容></div> | |||
<TOPページ(Flash)>は、index.phpファイル内のFlashの名前を変更。<br> | |||
<共通JS>は、デモ用と本番用のscript.js内のFlashの名前を変更。uploadには本番用のファイルのみ用意する。<br> | |||
<共通CSS>は、ページ全体の背景を変更。<br> | |||
<テーマファイル>と<Liveカメラ用静的ページ>のそれぞれの上部画像を変更。<br> | |||
</div> | |||
<hr /> | |||
===ファイル(修正したもの)=== | |||
====XOOPS構築の際にいじったモジュールとファイル名(テーマファイルやテンプレを除く)==== | |||
=====新規ユーザ登録用===== | |||
XOOPS自身が持っているファイル<br> | XOOPS自身が持っているファイル<br> | ||
/modules/wordpress/blocks/<br> | /modules/wordpress/blocks/<br> | ||
/include/registerform. | /include/registerform.php(メールアドレスや会社名の変更などで使用)<br> | ||
===iDiary=== | =====iDiary===== | ||
/modules/iDiary/blocks/block.php | /modules/iDiary/blocks/block.php | ||
===mailbbs=== | =====mailbbs===== | ||
/modules/mailbbs/blocks/newmail.php | /modules/mailbbs/blocks/newmail.php | ||
===wordpress=== | =====wordpress===== | ||
/modules/wordpress/blocks/wp_recent_posts.php<br> | /modules/wordpress/blocks/wp_recent_posts.php<br> | ||
/modules/wordpress/themes/default/wp-blocks.css.php | /modules/wordpress/themes/default/wp-blocks.css.php | ||
====運用開始後にいじったモジュールとファイル名==== | |||
=====wordpress===== | |||
/modules/wordpress2/themes/bng/index-template.php<br> | |||
/modules/wordpress2/themes/bng/common/blog_base.css | |||
<hr /> | |||
===モジュールのインストール方法(仮)=== | |||
====tinyDの増やし方==== | |||
(1)デモサーバー内の「/modules/」の中にある「tinyD○←数字」をフォルダごとローカルに落とす。<br> | |||
(2)ローカルに落とした「tinyD○←数字」フォルダををリネームする。(例:tinyD15としたい場合はフォルダ名を「tinyD15」とする。以下、「tinyD15」で説明。)<br> | |||
(3)「tinyD15/templates」内にある適当な「tinycontent○_index.html」と「tinycontent○_print.html」を同フォルダ内でコピーし、「○」を「15」に変える。<br> | |||
(4)「tinyD15/templates/blocks」内にある適当な「tinycontent○_nav_block.html」を同フォルダ内でコピーし、「○」を「15」に変える。<br> | |||
(5)「tinyD15/sql」内にある適当な「tinycontent○.sql」を同フォルダ内でコピーし、「○」を「15」に変える。<br> | |||
(6)「tinycontent15.sql」をエディタで開き、「CREATE TABLE tinycontent○ (」の「○」を「15」に変える。<br> | |||
(7)管理画面用のボタンを作り、「tinyd15/images」に保存する。ファイル名は「tinycontent○.png」にすること。(○は数字)<br> | |||
(8)デモサーバー「/modules/」の中にローカルの「tinyD15」をフォルダごとアップする。<br> | |||
(9)管理画面内の左メニュー一番上にあるシステム管理から、「モジュール管理」を選択。「モジュール管理」の画面一番下の方にftpでアップした「tinyD15」が表示されているはずなので、「tinyD15」が表示されているすぐ右側にある「操作」からボタンを押してインストールを行う。<br> | |||
(10)再度「モジュール管理」を開き、インストールした「tinyD15」の操作からアップデートを行って完了。 | |||
<hr /> | |||
===コメント機能の追加方法=== | |||
wordpressのモジュールにコメント機能を付ける方法は以下の通りです。<br> | |||
====upするファイル==== | |||
modules/wordpress○/themes/bng/index-template.php(※書き換えが必要。注意点は下記参照)<br> | |||
modules/wordpress○/themes/bng/comments-template.php<br> | |||
modules/wordpress○/themes/bng/content_block-template.php<br> | |||
modules/wordpress○/themes/bng/wp-admin.css<br> | |||
modules/wordpress○/themes/bng/wp-blocks.css.php<br> | |||
modules/wordpress○/themes/bng/wp-config-custom.php<br> | |||
modules/wordpress○/themes/bng/common/blog_base.css(※必ずしもupする必要はありません。index-template.phpの内容にあわせてupしてください。)<br> | |||
<br> | |||
modules/wordpress○/wp-admin/edit.php<br> | |||
modules/wordpress○/wp-admin/edit-form.php<br> | |||
modules/wordpress○/wp-admin/edit-form-advanced.php<br> | |||
modules/wordpress○/wp-admin/post.php<br> | |||
※「○」には各モジュールにあわせて数字が入ります。<br> | |||
※各ファイルは、コメント機能が付いているモジュールから(works内に保存されています)流用してください。<br> | |||
【upするファイルの注意点】<br> | |||
・index-template.php<br> | |||
index-template.php内の<div class="entry">から</div>を、以下の内容に書き換える。<br> | |||
<pre> | |||
<div class="entry"> | |||
<div class="entry-wrap"> | |||
<div class="entry-header clearfix"> | |||
<!--投稿日--> | |||
<?php the_date('','<p class="date">[',']</p>'); ?> | |||
<!-- /投稿日/ --> | |||
<!--エントリー タイトル--> | |||
<div class="entry-ttl clearfix"> | |||
<h3><a name="post-<?php the_ID(); ?>" id="post-<?php the_ID(); ?>"><?php the_title(); ?></a></h3> | |||
<!--p>投稿者:<?php the_author(); ?></p--> | |||
</div> | |||
<!-- /エントリー タイトル/ --> | |||
</div> | |||
<div class="entry-body clearfix"> | |||
<div class="clearfix"> | |||
<?php the_content(); ?> | |||
</div> | |||
<!--コメント--> | |||
<p class="comment-num"><?php link_pages('<br />Pages: ', '<br />', 'number'); ?> <?php comments_popup_link(_WP_TPL_COMMENT0, _WP_TPL_COMMENT1, _WP_TPL_COMMENTS); ?> </p> | |||
<?php //trackback_rdf(); ?> | |||
<?php include(dirname(dirname(dirname(__FILE__))) . '/wp-comments.php'); ?> | |||
<!-- /コメント/ --> | |||
</div> | |||
</div> | |||
</div> | |||
</pre> | |||
====wordpressオプション管理==== | |||
コメント機能を有効にするためには、wordpressの設定も変更する必要があります。以下に変更箇所を記載します。<br> | |||
※wordpressオプション管理の場所<br> | |||
管理画面⇒wordpressのモジュール⇒wordpressオプション<br> | |||
[General blog settings]<br> | |||
■use_smilies ⇒falseに変更<br> | |||
■require_name_email ⇒falseに変更<br> | |||
■comments_notify ⇒falseに変更<br> | |||
■comment_moderation ⇒Noneに変更<br> | |||
■moderation_notify ⇒falseに変更<br> | |||
[Default post options]<br> | |||
■default_comment_status ⇒Openに変更<br> | |||
====コメント機能を付ける際の注意点==== | |||
上記の設定を行っても、「投稿したメニュー」→「編集」→「コメント設定」で「オープン」になっていないとコメントは受け付けられません。<br> | |||
コメント機能を付ける前に投稿された内容は「コメント設定」が「クローズ」になっているので、「オープン」に変更する必要があります。<br> | |||
<hr /> | |||
<!-- | |||
<h4>■共通左メニュー</h4> | <h4>■共通左メニュー</h4> | ||
xoopsログイン→「ALT.SYSTEM」→「テンプレート管理」→「マルチメニュー」→テンプレート名「multimenu_block.html link menu」を修正する。 | xoopsログイン→「ALT.SYSTEM」→「テンプレート管理」→「マルチメニュー」→テンプレート名「multimenu_block.html link menu」を修正する。 | ||
| 26行目: | 343行目: | ||
works\themes\bng\common\script.js(デモ用) | works\themes\bng\common\script.js(デモ用) | ||
※デモ用と本サーバー用では、ファイル内に記述されているリンクのパスがそれぞれ違っているので、修正時にはデモ用と本サーバー用の「script.js」を用意してください。 | |||
<hr /> | |||
<h4>■エコ・コラム(毎週更新 金曜日の18時up)</h4> | <h4>■エコ・コラム(毎週更新 金曜日の18時up)</h4> | ||
[ | [作業用htmlファイル]<br> | ||
works\html_contents\tinyd2\エコ・コラム_(コラムタイトル).html<br> | works\html_contents\tinyd2\エコ・コラム_(コラムタイトル).html<br> | ||
[画像]<br> | [画像]<br> | ||
| 37行目: | 355行目: | ||
<作業内容><br> | <作業内容><br> | ||
(1)前回の[作業用htmlファイル]をコピーし、ファイル名を新しいコラムのタイトルと同じものにする。例:エコ・コラム_話題の「環境税」、あなたは賛成?それとも反対?.html<br> | |||
※このファイルは作業用のファイルなのでuploadには置かなくてもよい。<br> | ※このファイルは作業用のファイルなのでuploadには置かなくてもよい。<br> | ||
(2)htmlファイル内の「tynyD用静的コンテンツ」から「/tynyD用静的コンテンツ/」までが作業範囲。前回のコラムの内容を削除し、新しいコラムの内容を追加する。<br> | |||
(3)htmlファイルでの作業が完了したら、画像をデモサーバーにアップ。<br> | |||
(4)xoopsにログイン→「エコ・コラム」→「コンテンツの追加」を選択。「タイトル」の中にコラムタイトルを入れ、「コンテンツ」の中にhtmlファイル内の「tynyD用静的コンテンツ」から「/tynyD用静的コンテンツ/」までを入れ、「送信」を押す。<br> | |||
(5)確認して終了。 | |||
<hr /> | |||
<h4>■クイズ(2週間に1回更新、金曜日の18時up)</h4> | <h4>■クイズ(2週間に1回更新、金曜日の18時up)</h4> | ||
※クイズ更新の際には、クイズの他に「クイズの答え」と「お得@エコ」の2つもあわせて更新します。<br> | ※クイズ更新の際には、クイズの他に「クイズの答え」と「お得@エコ」の2つもあわせて更新します。<br> | ||
※新しいクイズの原稿と景品画像は、メーリングリストで配信されます。<br> | |||
<作業の流れ ※詳細は下記参照><br> | |||
(1)[http://192.168.200.60:16080/kds_tko/hide_script/tool_k/azarashi/quiz/index.php エコ・エコ・アザラシ クイズ作成くん]を使って、クイズに必要な4項目のHTMLソースを作成する。<br> | |||
(2)クイズの答え(静的ページ)の作成。クイズ用のPSDファイルからクイズの答え用の画像を各自で作成する。<br> | |||
(3)お得@エコ用画像の作成。クイズの答え用の画像と同様に、クイズ用のPSDファイルからお得@エコ用画像を各自で作成する。<br> | |||
(4)クイズの答え(静的ページ)、クイズ用画像・クイズの答え用画像・お得@エコ用画像をデモにアップする。<br> | |||
(5)あざらしの管理画面を開き、クイズとお得@エコに新たな項目を作成(追加)する。<br> | |||
<div style="font-weight:bold;color:#f00;">(注意)Firefoxでは管理画面がうまく開けない場合があります。正常に表示できない場合はIE7等で開いてください。</div> | |||
< | <div style="border:1px dashed #666666;padding:10px;"> | ||
<div style="font-weight:bold;">【クイズの答え(静的ページ)と画像の作成】</div> | |||
<div style="border:1px dashed #666666;padding:10px;margin-bottom:10px;"> | |||
[修正ファイル]<br> | [修正ファイル]<br> | ||
works\html_contents\eguide\answer\answer.html<br> | works\html_contents\eguide\answer\answer.html<br> | ||
[ | [画像保存場所]<br> | ||
works\html_contents\eguide\answer\common\img<br> | works\html_contents\eguide\answer\common\img<br> | ||
</div> | |||
<作業内容><br> | |||
(1)クイズ用のpsdファイルを元に、「クイズの答え」用の画像を各自で作成する。画像のサイズ等は前回のものを参考にしてください。(注)枠線(#c9c9c9)で囲った画像を作成すること。<br> | |||
(2)ツールで作成した「クイズの答え(静的)用」のソースを「answer.html」に貼り付ける。貼り付ける箇所はanswer.html内の「id="answer"」のすぐ下になります。<br> | |||
※当選者が確認されるまでは、当選者の項目はコメントアウトで消しておく。<br> | |||
※「answer.html」内の前回のクイズの答えのソースを確認し、「class="answer-warp first"」を「class="answer-warp"」に変更すること。<br> | |||
(3)デモにアップして確認する。 | |||
</div> | |||
<div style="border:1px dashed #666666;padding:10px 10px 0;margin-top:10px;"> | |||
<div style="font-weight:bold;">【クイズの作成】</div> | |||
<div style="border:1px dashed #666666;padding:10px;margin-bottom:10px;"> | |||
[画像保存場所]<br> | |||
works\modules\eguide\img<br> | |||
</div> | |||
<作業内容><br> | <作業内容><br> | ||
[画像の作成]<br> | |||
(1)クイズ用のpsdから景品の画像を書き出す。<br> | |||
< | [前回のクイズの削除]<br> | ||
(1)xoopsにログイン→画面左側にある「エコクイズ」を開き、前回のクイズの「解答」のチェックを外して「更新」を押す。<br> | |||
(2)前回のクイズの「状態」の項目を開き、状態を「掲載中」から「削除」に変更して「更新」を押す。<br> | |||
[ | [新規クイズの登録]<br> | ||
(1)管理画面「エコクイズ」の上部にある「新規クイズの登録」を開き、まず「表題」「クイズ日時」を入力。「出力の編集形式」を「XOOPSタグのみ変換」にしておき、「定員になったら受付中止」のチェックを外しておく。<br> | |||
※「クイズ日時」にはクイズが終了する日時を指定する。例:2月29日の18時に終了するクイズ→「2008-02-29 18:00」<br> | |||
(2)「詳細本文」と記載されている所のすぐ上にあるテキストエリアに、ツールで作成した「クイズ(module)用」のソースを貼り付ける。<br> | |||
(3)「追加項目」の中に、ツールで作成した「クイズの答え(module)用」のソースを貼り付ける。<br> | |||
(4)「保存」ボタンを押して、確認する。 | |||
</div> | |||
<div style="border:1px dashed #666666;padding:10px 10px 0;"> | |||
<div style="font-weight:bold;">【お得@エコの更新】</div> | |||
<div style="border:1px dashed #666666;padding:10px;margin-bottom:10px;"> | |||
[作業用htmlファイル]<br> | |||
works\html_contents\tinyd4\注目!エコ商品情報○○.html<br> | works\html_contents\tinyd4\注目!エコ商品情報○○.html<br> | ||
[画像]<br> | [画像]<br> | ||
works\html_contents\tinyd4\img<br> | works\html_contents\tinyd4\img<br> | ||
</div> | |||
<作業内容><br> | |||
[画像の作成]<br> | |||
(1)クイズの作成時に使用したpsdファイルを元に、「お得@エコ」用の画像を作成する。<br> | |||
※画像のサイズは150×150。(注)枠線(#e7e7e7)で囲った画像を作成。<br> | |||
※フォントはMS ゴシック、10px、アンチエイリアス:シャープ、カラー:#333<br> | |||
[追加(新規)登録作業]<br> | |||
(1)ツールで作成した「注目!エコ商品情報用」のソースを「注目!エコ商品情報○○.html」に貼り付ける。作業範囲は、「tynyD用静的コンテンツ」から「/tynyD用静的コンテンツ/」まで。作業用htmlファイルをブラウザで開き、正常に表示されるかを確認する。<br> | |||
※8商品を目安に新しいファイルを作成してください。「作業用htmlファイル」は作業するためのだけのファイルなので、uploadに上げる必要はありません。<br> | |||
(2)xoopsにログイン→「注目!商品情報」→「編集」を開き、作業した「注目!エコ商品情報○○.html」ファイル内の「tynyD用静的コンテンツ」から「/tynyD用静的コンテンツ/」までのソースを「コンテンツ」の欄に貼り付ける。<br> | |||
※新しい作業用htmlファイルを作成した場合は、「注目!エコ商品情報」の管理画面上部にある「コンテンツの追加」から新規コンテンツを作り、そこにソースを貼り付けてください。<br> | |||
(3)「送信」を押し、デモに反映されていることを確認して終了。 | |||
</div> | |||
--> | |||
2009年7月30日 (木) 11:07時点における最新版
エコ・エコ あざらし
エコ・エコ あざらしとは、バンダイナムコゲームスの環境活動に関する情報交換や交流を行なうための社内ポータルサイトのことです。
「エコ・エコ あざらし」から「エコ・エコ」をとって通称、「あざらし」と呼ばれることが多いです。
サイト自体はxoopsを元に構築されており、サイトの更新は専用の管理画面から行います。(※一部、静的もあり)
作業上の注意点
管理画面から更新を行う関係上、通常はローカルでの作業・確認はできません(静的は可能)。ですので、「作業用htmlファイル」と呼ばれるhtmlファイルを使って
ローカルで作業・確認を行い、作業した内容を管理画面から登録してデモに反映させます。なお、画像やCSSファイル等はFTPでアップします。
テーマファイル・JSファイル
動的ページのレイアウトを構成するテーマファイルやJSファイルには以下のものがあります。
なお、あざらしのTOPページは各テーマファイルを修正しても反映されませんので、直接TOPページのファイルを修正してください。
theme.html(動的ページレイアウト用)
[ファイル保存場所]
works\themes\bng
動的ページのヘッダーやフッターなどを変更する場合には「theme.html」を修正してください。修正後はFTPで「theme.html」を「/themes/bng/」にアップすれば反映されます。
[ファイル保存場所]
works\themes\bng
動的ページの左エリアを変更する場合には「leftmenu_for_マルチメニュー.html」を修正してください。修正後は管理画面から「leftmenu_for_マルチメニュー.html」内のソースを丸ごと貼り付けて反映させます。
管理画面については、下記の共通左メニューの修正を参照してください。
script.js(上部のバナー用・左メニューマウスオーバー用)
[ファイル保存場所]
works\themes\bng\common(デモ用JS保存)
works\themes\bng\common\本番用script(本番用JS保存)
各ページの上部に表示されているバナーと、共通左メニューのマウスオーバー用のJSです。worksにはデモ用と本番用のJSファイルが保存されています。デモ用で確認を行い、その内容を本番用に記述してuploadに保存してください。(※デモ用のJSファイルはuploadには不要)
なお、本番用のJSファイルを修正する際、デモ用の内容を本番用に丸ごと上書きしないように注意してください。(※本番用のJS内に記述されているパスがデモ用と異なっているため)
index-template.php(wordpress用テンプレート用)
[ファイル保存場所]
works\modules\wordpress(番号)\themes\bng
wordpressのレイアウトを修正するには各wordpressの「index-template.php」を修正してください。修正後はFTPでアップすれば反映されます。
管理画面
管理画面の左側の「管理メニュー」には、各コンテンツ管理ページへ飛ぶボタンがあり、それぞれコンテンツ名とモジュール名が記載されています。
SYSTEM ADMIN
XOOPSのシステムに関する管理モジュール。この管理モジュールを触ることはあまりありません。
ALT.SYSTEM
テンプレートに関する管理モジュール。
共通左メニューの修正
「ALT.SYSTEM」→「テンプレート管理」→「マルチメニュー」→テンプレート名「multimenu_block.html link menu」を修正。
ただし、あざらしのTOPページで使われている左メニューはテンプレート管理では修正できないので、直接TOPページ用のファイルを修正すること。
MULTI-MENU
「BLOG投稿メニュー」に関する管理モジュール。「BLOG投稿メニュー」とは、共通左メニューの一番下に表示されているブログ編集用のリンク先一覧のこと。
設定項目が8個ありますが、主に使用するのは「マルチメニュー3(設定:メニュー03)」です。
メニューの修正
「マルチメニュー3(設定:メニュー03)」を開くと、各コンテンツのタイトルが表示されます。画面右側の「編集」から修正を行うことが可能です。
メニューのタイトルを変更したり、ユーザーのグループによってメニューの表示・非表示を切り替えたりできます。
WordPress1~WordPress8
バンダイナムコの中の人が更新するコンテンツが「WordPress1~WordPress8」です。更新を行う機会は非常に少ないですが、たまに更新が入ります。
WordPressオプション
・ユーザー設定
記事の投稿や編集に関わるユーザーレベルをアカウントごとに個別設定することができます。ここはほとんどいじりません。
・オプション設定(いじったことがあるもののみ抜粋)
TINY0~TINY13(tinyd0~tinyd13)
こちら側で新規追加・修正を行う必要があるものが「TINY0~TINY13(tinyd0~tinyd13)」です。作業用htmlファイルを使って作業を行い、その内容を管理画面からアップします。(一部、作業用htmlファイルがないものもあり。)
現在使われていないモジュールもあります。
定例更新
金曜日の18時に更新があります。内容は、毎週更新の「エコ・コラム」、2週間に1回更新の「エコ・クイズ」と「注目!エコ商品情報用」です。
【エコ・コラム】
[作業用htmlファイル保存場所]
works\html_contents\tinyd2\エコ・コラム_(コラムタイトル).html
[画像保存場所]
works\html_contents\tinyd2\img
※前準備として、必要な画像をスライスしてデモにアップしておく。
例:エコ・コラム_話題の「環境税」、あなたは賛成?それとも反対?.html
※このファイルは作業用のファイルなのでuploadには置かなくてもよい。
(2)作業用htmlファイル内の「tynyD用静的コンテンツ」から「/tynyD用静的コンテンツ/」までが作業範囲。前回のコラムの内容を削除し、新しいコラムの内容を追加する。
(3)ソースの追加が完了したら、作業用htmlファイルをブラウザで開き、正常に表示されるかを確認する。
(4)xoopsにログイン→「管理メニュー」→「エコ・コラム」→「コンテンツの追加」を選択。「タイトル」の中にコラムタイトルを入れ、「コンテンツ」の中にhtmlファイル内の「tynyD用静的コンテンツ」から「/tynyD用静的コンテンツ/」までを入れ、「送信」を押す。
(5)確認して終了。
(1)index.php内の「エコ・コラム」から「/ エコ・コラム /」までが作業範囲。コラムのテキストは途中で切り、「……」を入れる。テキストの長さは適当に。
(2)アップして確認して終了。
【エコ・クイズ】
[修正ファイル]
<クイズの答え用>
works\html_contents\eguide\answer\answer.html
[画像保存場所]
<クイズ用>
works\modules\eguide\img
<クイズの答え用>
works\html_contents\eguide\answer\common\img
※前準備として、必要な画像をスライスしてデモにアップしておく。
(1)エコ・エコ・アザラシ クイズ作成くんを使って、クイズに必要なHTMLソースを作成する。
(2)xoopsにログイン→「管理メニュー」→「エコクイズ」を選択。
(3)前回のクイズの「解答」のチェックを外し、画面一番下の「送信」を押す。次に、前回のクイズの「状態」を選択し、状態を「掲載中」から「削除」に変え「更新」ボタンを押す。
(4)クイズの管理画面の一番上にある「新規クイズの登録」を選択。入力するものは下記の5項目。
1. 表題(入力例:エコ・エコグッズプレゼント(第26回))
2. クイズ日時(「カレンダ」のボタンを押して、クイズの掲載を終了する日時を入れる。)
3. 詳細本文(新しいクイズのソース(※ツールで生成→「・クイズ(module)用」)を貼り付ける。貼り付ける場所は「詳細本文」と書かれているすぐ上のテキストエリア)
4. 出力の編集形式(プルダウンから「xoopsタグのみ変換」を選択し、「定員になったら受付中止」のチェックを外す。あとはそのまま。)
5. 追加項目(新しいクイズの答えのソース(※ツールで生成→「・クイズの答え(module)用」)を貼り付ける。貼り付ける場所は「追加項目」と書かれているすぐ下のテキストエリア)
(5)「保存」ボタンを押して確認して終了。
(1)クイズの答えで使用する画像を各自で作成する。画像の作成については特に決まりはないが、必ず枠線(#c9c9c9)で囲うこと。画像名は「例:img_present_081205_01.jpg(img_present_[日付]_[景品の数].jpg)」
(2)クイズの答え用のhtmlファイルを開き、前回のクイズのソースを確認。divタグについている「class="answer-warp first"」を「class="answer-warp"」にする。
(3)新しいクイズの答えのソース(※ツールで生成→「・クイズの答え(静的)用」)を貼り付ける。
(4)デモにアップして確認して終了。
※クイズの答えページ更新についての注意点
クイズの答えを本アップするのはそのクイズが終了する日時になるので、新しいクイズと同時にアップすることがないようにuploadに注意する。
(1)index.php内の「今週のエコ商品プレゼント!」から「/ 今週のエコ商品プレゼント! /」までが作業範囲。
(2)更新してデモにアップして確認して終了。
【注目!エコ商品情報用】
「注目!エコ商品情報」には、クイズで使用した景品を掲載します。テキストはクイズで使用したものを流用し、画像は各自で作ります。
[作業用htmlファイル]
works\html_contents\tinyd4\注目!エコ商品情報○.html
[画像保存場所]
works\html_contents\tinyd4\img
(1)クイズ用のPSDを元に「注目!エコ商品情報」で使う画像を各自で作成し、デモにアップする。画像のサイズは150×150、必ず枠線(#e7e7e7)で囲うこと。画像名は「例:item_081205_01.jpg(item_[日付]_[商品の数].jpg)」
(2)作業用htmlファイル(注目!エコ商品情報○.html)をエディタで開き、新しいソース(※ツールで生成→「・注目!エコ商品情報用」)を貼り付ける。なお、商品は8個を目安に新しい作業用htmlファイルを作ってください。
※このファイルは作業用のファイルなのでuploadには置かなくてもよい。
(3)作業用htmlファイルをブラウザで開き、正常に表示されるかを確認する。
(4)xoopsにログイン→「管理メニュー」→「注目!商品情報」→作業用htmlファイルと同じ名前の項目の「編集」を選択。作業用htmlファイルを新しく作った場合は、「注目!エコ商品情報」の管理画面の上部に表示されている「コンテンツの追加」から新しい項目を追加する。
(5)作業用htmlファイル内の「tynyD用静的コンテンツ」から「/tynyD用静的コンテンツ/」までをコピーして貼り付け、「送信」を押す。
(6)確認して終了。
衣替え
数ヶ月ごとに衣替えをします。
[修正ファイル]
<TOPページ(Flash)>
works\index.php
<共通JS>
works\themes\bng\common\script.js(デモ用)
works\themes\bng\common\本番用script\script.js(本番用)
<共通CSS>
works\themes\bng\common\contents_base.css
<テーマファイル>
works\themes\bng\theme.html
<Liveカメラ用静的ページ>
works\html_contents\tinyd13\live.html
<TOPページ(Flash)>は、index.phpファイル内のFlashの名前を変更。
<共通JS>は、デモ用と本番用のscript.js内のFlashの名前を変更。uploadには本番用のファイルのみ用意する。
<共通CSS>は、ページ全体の背景を変更。
<テーマファイル>と<Liveカメラ用静的ページ>のそれぞれの上部画像を変更。
ファイル(修正したもの)
XOOPS構築の際にいじったモジュールとファイル名(テーマファイルやテンプレを除く)
新規ユーザ登録用
XOOPS自身が持っているファイル
/modules/wordpress/blocks/
/include/registerform.php(メールアドレスや会社名の変更などで使用)
iDiary
/modules/iDiary/blocks/block.php
mailbbs
/modules/mailbbs/blocks/newmail.php
wordpress
/modules/wordpress/blocks/wp_recent_posts.php
/modules/wordpress/themes/default/wp-blocks.css.php
運用開始後にいじったモジュールとファイル名
wordpress
/modules/wordpress2/themes/bng/index-template.php
/modules/wordpress2/themes/bng/common/blog_base.css
モジュールのインストール方法(仮)
tinyDの増やし方
(1)デモサーバー内の「/modules/」の中にある「tinyD○←数字」をフォルダごとローカルに落とす。
(2)ローカルに落とした「tinyD○←数字」フォルダををリネームする。(例:tinyD15としたい場合はフォルダ名を「tinyD15」とする。以下、「tinyD15」で説明。)
(3)「tinyD15/templates」内にある適当な「tinycontent○_index.html」と「tinycontent○_print.html」を同フォルダ内でコピーし、「○」を「15」に変える。
(4)「tinyD15/templates/blocks」内にある適当な「tinycontent○_nav_block.html」を同フォルダ内でコピーし、「○」を「15」に変える。
(5)「tinyD15/sql」内にある適当な「tinycontent○.sql」を同フォルダ内でコピーし、「○」を「15」に変える。
(6)「tinycontent15.sql」をエディタで開き、「CREATE TABLE tinycontent○ (」の「○」を「15」に変える。
(7)管理画面用のボタンを作り、「tinyd15/images」に保存する。ファイル名は「tinycontent○.png」にすること。(○は数字)
(8)デモサーバー「/modules/」の中にローカルの「tinyD15」をフォルダごとアップする。
(9)管理画面内の左メニュー一番上にあるシステム管理から、「モジュール管理」を選択。「モジュール管理」の画面一番下の方にftpでアップした「tinyD15」が表示されているはずなので、「tinyD15」が表示されているすぐ右側にある「操作」からボタンを押してインストールを行う。
(10)再度「モジュール管理」を開き、インストールした「tinyD15」の操作からアップデートを行って完了。
コメント機能の追加方法
wordpressのモジュールにコメント機能を付ける方法は以下の通りです。
upするファイル
modules/wordpress○/themes/bng/index-template.php(※書き換えが必要。注意点は下記参照)
modules/wordpress○/themes/bng/comments-template.php
modules/wordpress○/themes/bng/content_block-template.php
modules/wordpress○/themes/bng/wp-admin.css
modules/wordpress○/themes/bng/wp-blocks.css.php
modules/wordpress○/themes/bng/wp-config-custom.php
modules/wordpress○/themes/bng/common/blog_base.css(※必ずしもupする必要はありません。index-template.phpの内容にあわせてupしてください。)
modules/wordpress○/wp-admin/edit.php
modules/wordpress○/wp-admin/edit-form.php
modules/wordpress○/wp-admin/edit-form-advanced.php
modules/wordpress○/wp-admin/post.php
※「○」には各モジュールにあわせて数字が入ります。
※各ファイルは、コメント機能が付いているモジュールから(works内に保存されています)流用してください。
【upするファイルの注意点】
・index-template.php
index-template.php内の<div class="entry">から</div>を、以下の内容に書き換える。
<div class="entry">
<div class="entry-wrap">
<div class="entry-header clearfix">
<!--投稿日-->
<?php the_date('','<p class="date">[',']</p>'); ?>
<!-- /投稿日/ -->
<!--エントリー タイトル-->
<div class="entry-ttl clearfix">
<h3><a name="post-<?php the_ID(); ?>" id="post-<?php the_ID(); ?>"><?php the_title(); ?></a></h3>
<!--p>投稿者:<?php the_author(); ?></p-->
</div>
<!-- /エントリー タイトル/ -->
</div>
<div class="entry-body clearfix">
<div class="clearfix">
<?php the_content(); ?>
</div>
<!--コメント-->
<p class="comment-num"><?php link_pages('<br />Pages: ', '<br />', 'number'); ?> <?php comments_popup_link(_WP_TPL_COMMENT0, _WP_TPL_COMMENT1, _WP_TPL_COMMENTS); ?> </p>
<?php //trackback_rdf(); ?>
<?php include(dirname(dirname(dirname(__FILE__))) . '/wp-comments.php'); ?>
<!-- /コメント/ -->
</div>
</div>
</div>
wordpressオプション管理
コメント機能を有効にするためには、wordpressの設定も変更する必要があります。以下に変更箇所を記載します。
※wordpressオプション管理の場所
管理画面⇒wordpressのモジュール⇒wordpressオプション
[General blog settings]
■use_smilies ⇒falseに変更
■require_name_email ⇒falseに変更
■comments_notify ⇒falseに変更
■comment_moderation ⇒Noneに変更
■moderation_notify ⇒falseに変更
[Default post options]
■default_comment_status ⇒Openに変更
コメント機能を付ける際の注意点
上記の設定を行っても、「投稿したメニュー」→「編集」→「コメント設定」で「オープン」になっていないとコメントは受け付けられません。
コメント機能を付ける前に投稿された内容は「コメント設定」が「クローズ」になっているので、「オープン」に変更する必要があります。