簡単ホームページ作成CGI2の使い方(ブログ風、ニュースサイト風、小説投稿用など)
【説明編】
ここでは【
簡単ホームページ作成CGI2完成版】でダウンロードできるCGIスクリプトの設置方法や使い方の説明をします。
まずこのスクリプトの説明です。
このスクリプトは、簡単にブログ風のホームページ、或いはニュースサイトや小説投稿サイトを作れるものです。
設置が完了すれば、後はブログを投稿するようにホームページが作れます。
ニュースサイトや小説投稿なら、ジャンルを分けて投稿したり、機能を限定すれば、普通のブログサイトとしての利用も可能です。
ただし、トラックバックとコメント投稿機能はありません。
あくまでホームページを作る為のものですので、コメントが必要ならば、別に掲示板をつけたりして対応してください。
固定コンテンツを重視していますので、あまりに多い記事には対応していません。
サーバーに負担にならない程度にご利用ください。
後別に、アフィリエイト広告を追加しやすくなっています。
軽めなアフィサイトを作りたい人仕様のビジュアルになっています。
【設置編】
まずは【
簡単ホームページ作成CGI2完成版】からダウンロードします。
ダウンロードしたアーカイブ(ZIPファイル)を解凍してください。
readme.txtの手順に従って、CGIスクリプトをサイトにアップしてください。
こちら【
CGIスクリプトの使い方!フリーのCGIはどうやって使うの?】も参考にしてください。
ここではやる事だけ話します。
まず、「.cgi」ファイルを全てメモ帳で開き、1行目にあるパールパスを書き換えます。
#! /usr/bin/perl
こんなやつです。
サーバーのパールバスを、サイトのヘルプなどから調べて、そのサーバーのものに書き換えてください。
#! /usr/local/bin/perl
大概はこれらどちらかである可能性が高いと思います。
次に、重要初期設定を変更します。
index.cgiに、以下のような場所がすぐに見つかるはずです。
##重要初期設定##########################################################
$pass = "1234567890abcdefgHIJK";
$idname = "yamada";
$psword = "taro";
上から、利用パスワード、ログインID、ログインパスワードとなっています。
一番上のこの部分「1234567890abcdefgHIJK」を、適当に半角英数で変更してください。
覚える必要はありませんので、適当でかまいません。
以下の「yamada」「taro」の部分も半角英数で変更してください。
こちらはログイン時に使用しますので、記録しておいてください。
他にも分かる方は変更していただいてかまいませんが、よく分からない人はこれだけでかまいません。
次に、readme.txt以外のファイル、フォルダ(ディレクトリ)全てをそのままの状態でサーバーにアップします。
そして、「.cgi」ファイルの属性を705、或いは755に変更してください。
「.dat」ファイルの属性を、606、或いは666に変更してください。
これで動かない場合は、サーバーサイトのヘルプ等を調べて、動かせる数字を調べてください。
「.dat」ファイルの属性が606で正常に動かない場合は、index.cgiの706行目の「0606」の数字を変更してください。
666で動くなら、index.cgiをメモ帳で開いて、706行目の「0606」を「0666」に変更し、上書き保存します。
実際に正しく動くかどうかは、実際に使ってみないとわかりませんので、以下で記述します。
設置が終わると、まずはlog.cgiにブラウザでアクセスしてください。
この時、クッキーは必ず受け入れるようにしておいてください。
そしてその後そのクッキーを削除しないように設定、或いは削除しないでください。
それ自体がユーザーを認証する為のカギになります。
http://syuka.comがホームページスペースのアドレスなら、http://syuka.com/log.cgiがアドレスになります。
アクセスすると、「このページにはアクセスできません」と表示されます。
もしもこの表示ではなくエラーや「.cgi」ファイルの記述テキストが表示されるようだと、属性が機能していませんので、別の属性を指定ください。
その後もう一度アクセスすると、ログ管理ページに入る事ができるはずです。
この時、うまく入れない場合は、クッキー設定がおかしいか、「.dat」ファイルの属性が機能していませんので、別の属性を指定ください。
ログ管理画面に入れたら、準備は完了です。
クッキーでは、2000000の数字が、一番最初にアクセスした管理者に与えられています。
管理者を増やす場合、或いは別のブラウザでもアクセスを可能にする場合は、別のブラウザで同じようにアクセスしてクッキーを与えた後、その数字をフォームに書きいれて、管理者ID送信ボタンを押してください。
それで別のクッキーでもアクセスが可能になります。
【使い方編】
まずはトップページにアクセスしてください。
初期の状態だと、index.cgiです。
すると右側に固定窓と記事タイトルを表示するリンク、下部にはグーグル検索が表示されているはずです。
左側には、メインのエリアが表示されています。
これがこのスクリプトの基本表示です。
私の好みですので、もしも普通のビジュアルが良ければ、このスクリプトはお勧めできません。
或いは自分でHTMLやCSS、そしてperlの基礎を勉強して、自分で書き換えてください。
このビジュアルにしたのには意味があります。
一つは、各種ボタンや広告など、常に表示したいものが表示できる事。
他に画面の小さなスマートフォン等に対応する為です。
常にメインエリアだけはしっかり表示させたいので、640ピクセル以上の幅があれば、メインエリアを確実に表示できます。
メインエリアは640以上、右のエリアは250以上で変更する事も可能です。
後に初期設定を説明しますが、そこで変更が可能です。
話を進めます。
メインエリアの右上に、管理と書かれたリンクがあります。
そこをクリックすると、ログイン画面が表示されます。
そこに、設置編で設定したIDとパスワードを入れてログインしてください。
初期値は「yamada」と「taro」です。
ログインが成功すると、管理画面が表示されます。
基本的な使い方は画面下に書かれていますが、とりあえず此処では、通常利用するところまでを説明したいと思います。
まずは、バックグラウンドイメージを利用するなら画像を用意し、アップする事になります。
バックグラウンドイメージは、背景とヘッダ、二か所に表示できます。
画像を用意したら、管理画面の左上で画像を選び、【D:画像送信】ボタンを押してアップしてください。
そしたら/gif/フォルダ(ディレクトリ)内にアップされます。
後の設定で、このファイルを指定しますので、ファイル名は覚えておいてください。
右上にあるセレクトにも出ていますのですぐに調べられます。
名前を変更したい場合は、そのセレクトでアップしたファイルを選び、その左に新しいファイル名を書き、拡張子を選んで【E:名前変更/ファイル削除】ボタンを押してください。
新しい名前を入れず空白で【E:名前変更/ファイル削除】ボタンを押すと削除されますのでご注意ください。
【初期設定編】
まず、ただのブログとして利用するのか、ブログ+コンテンツで利用するのかを決めます。
ブログとして利用した場合は、常に右側のタイトルはブログタイトルが表示され、そこから選んだページが表示されるだけのブログ風ホームページとして使えます。
それプラスコンテンツだと、それ以外にコンテンツメニューページ、そしてそこからコンテンツページへと下層階層を増やせます。
たとえばタブバー(初期画面だと薄い紫色のバー)に、「社会」、「経済」、「世界」などの項目を付けて、それをクリックすると、それぞれのメニュー(トップページ)に飛ぶようにできます。
小説だと、「ファンタジー」「ノンフィクション」「ラブコメ学園」などになりますね。
ブログ付きホームページと考えても良いですし、ブログをあくまでホームページ更新情報を表示する場所として使う事も可能です。
それを頭にいれて初期設定をします。
管理画面左側に「F2」と書かれた場所があり、その右側のセレクトから9番、初期設定を選びます。
そしてその右側の【C1:タイトル選択】をクリックします。
C1~C5までのボタンは、全て同じボタンです。
選んだ近くに有った方が使いやすい、或いはビジュアルの為に多く設置しているだけですので、今後は【C】ボタンと記述します。
すると【C1】ボタンの右側のセレクトに、初期設定項目が出ますので、その全てを設定していきます。
1~66まであります。(CGIスクリプトVer.5.00の場合)
今後バージョンアップがあれば項目が増える可能性もありますが、今のところバージョンアップの意思はありません。
■設定項目の説明■
@1 HPタイトル
ブラウザの上部に表示される、トップページのタイトルです。
@2 キーワード
サイトのキーワードです。
@3 HPの説明
ホームページがどんなコンテンツを提供しているページなのか説明します。
@4 上部タイトル
ホームページメインエリアのヘッダに表示される、ホームページのタイトルです。
@5 サイト全体のタイトル
タイトル統一を設定した場合、こちらがホームページのタイトルとして使用されます。
@6 ヘッダ下部の説明
ヘッダタイトルの下に書かれる補足説明です。
@7 近況報告
ホームページメインエリアの近況報告上部に表示されるタイトルです。
@8 ホットリンク
ホームページメインエリアのホットリンク上部に表示されるタイトルです。
@9 メニューバーのトップ
タブメニュー(メニューバー)の右端、トップに戻るボタンの文字です。
@10 テキスト色
テキストの色です。
@11 リンク色
リンクの色です。
@12 既リンク色
既に訪れた事のあるリンクの色です。
@13 選択リンク色
マウスカーソルを合わせた時、或いはクリック中に表示される色です。
@14 メニューバー色1
タブメニュー(メニューバー)の基本色です。
@15 メニューバー色2
マウスカーソルを合わせた時のタブメニューの色です。
@16 メニューバー色3
タブメニューのアクティブな場所を色を変えて表示するので、その色です。
@17 メニューバー色4
メニューバーの背景色です。
@18 メニューバー文字色1
通常時のメニューバーの文字色です。
@19 メニューバー文字色2
マウスカーソルを合わせた時の、メニューバーの文字色です。
@20 背景色1
ホームページの背景色です。
@21 背景色2
記事や記事タイトルが表示される場所の背景色です。
@22 トップバー色
トップバーの色です。
@23 メニュータイトルバー色
右の記事タイトルの上にあるバーの色です。
@24 タイトルバー色
メイン記事の上にあるバーの色です。
@25 HP上下色
ホームページのヘッダーとフッターの色です。
@26 タイトル色
タイトルの色です。
@27 ラインの色
ホームページの枠のライン色です。
@28 装飾記号色1
初期では★の色です。
@29 装飾記号色2
初期では■の色です。
@30 装飾記号1
タイトルを飾る記号です。
@31 装飾記号2
記事タイトルを分けるたりする記号です。
@32 アーカイブタイトル
右側の記事タイトルのタイトルです。
@33 コンテンツタイトル
下層コンテンツの右側のタイトルのタイトルです。
@34 各トップのタイトル
メニューページのメニュータイトルのタイトルです。
@35 アーカイブ記事タイトル
過去記事リンクへのリンクタイトルです。
@36 リンクルームタイトル
リンクルームのタイトルです。
@37 リンクルームの説明
リンクルームのページの説明です。
@38 ホームページ幅
メインエリアの幅です。最小が640で、ラインを引いた638が実質の幅になります。
@39 ヘッダの高さ
ヘッダにプラスする高さを調整できます。「0」にしても最低限の幅は確保されます。
@40 固定スペースの大きさ
右側メニューの上にある自由スペースの大きさです。これで幅も指定します。最低250で、300未満だとはてぶボタンは表示されません。
@41 タイトル文字の大きさ
タイトルの文字の大きさを指定します。
@42 記事の順番
下層コンテンツ記事の順番を指定します。あくまで投稿した時のデフォルトです。移動は可能です。
@43 ログ数
データファイルで保存できる記事の数です。1000以上の数字は指定しない方がいいです。
@44 文字数
投稿文字数の上限です。
@45 コンテンツ日付表示
下層コンテンツ記事のタイトルの下に、日付をつけるかどうかです。
@46 メニューバーの表示
タブメニューを利用しない場合、消す事ができます。
@47 タイトル統一
コンテンツによって、別のホームページのように、表示タイトルなどを変える事ができます。
@48 ピックアップ表示数
各コンテンツトップのメニューページで、いくつの記事タイトルを表示するか決められます。小説ならトップだけ表示するなどの使い方ができます。
@49 RSS表示数
RSSとXMLで送信するタイトル数です。
@50 RSS文字数
RSSとXMLで送信する文字数を制限できます。
@51 HPアドレス1
ホームページトップのアドレスです。
@52 HPアドレス2
ホームページのindex.cgiが置かれているディレクトリを指定します。
@53 ヘッダ画像
ヘッダ画像を使う場合、指定します。
@54 バックイメージ
バックグラウンド画像を使う場合、指定します。
@55 関連付け画像アドレス
ホームページに関連付ける画像があるなら指定します。
@56 RSSアドレス
rss.cgiのアドレスです。
@57 XMLアイコン画像アドレス
XML表示時に表示される画像を指定できます。
@58 検索ドメイン
グーグル検索で、サイト検索を設定できます。
@59 HPカテゴリ
ホームページのカテゴリです。XMLで使います。
@60 サイトのカテゴリ
基本websiteで問題ありません。
@61 コンテンツのカテゴリ
下層コンテンツ記事のカテゴリです。記事ごとに変更できます。
@62 雑記のカテゴリ
トップのブログ利用の記事カテゴリです。記事ごとに変更できます。
@63 ツイッターID
ツイッターIDを指定します。
@64 メールアドレス
メールアドレスを指定できます。
@65 連絡先電話番号
電話番号を指定できます。
@66 管理者指名
名前を指定できます。
以上が初期設定です。
他にもセレクトから、インデックス4番の自由スペース1番を編集し、右側の表示枠に表示するものを変更してください。
もちろんそのままでもかまいません。
ブログサイトのように使うなら、後はセレクトインデックス0の通常投稿で、投稿を繰り返す事になります。
タイトルはコンテンツセレクトにあります。
編集削除はそちらから選べます。
【下層コンテンツの設定】
下層コンテンツを使うには、少し手順があります。
まず、セレクトインデックスから3番の記事フォルダ登録を選び【C】ボタンをクリックします。
そこに、たとえばニュースなら、タイトルに「スポーツ」フォルダ名に「sports」サイトの説明に「スポーツニュースです」などと書いて【C】ボタンをクリックします。
すると、articleフォルダの中に、sportsフォルダが作成されます。
それが下層コンテンツ記事を保存する場所になります。
次にそこに投稿する為の記事を保存する「.dat」ファイルを作成します。
【A:新規作成】の左側に、たとえば「野球」と書いて、【A:新規作成】ボタンをクリックします。
タイトルは、後で変更できますので、とりあえず【A:新規作成】ボタンをクリックします。
すると右側の【B:タイトル変更】の左側のセレクトに、新規追加インデックスが作成されます。
「野球」といれていたら、野球というのがあるはずです。
それを選んで、ここで再び「タイトル(既に野球と入れていて変更不要なら空白)」と「設定したいフォルダ」を指定します。
先ほど作った「sports」を指定し、【B:タイトル変更】をクリックすると、そのフォルダに関連付けられて、今後の投稿はそのフォルダ内に出力される事になります。
たとえば今回の場合は、複数のスポーツを設定する事も可能です。
サッカーやバレーを作って、sportsに関連付ければ、全てがsportsフォルダにページが作成され、メニューページでは、各ジャンルごとにリンクが作られる事になります。
これで準備ができましたが、このままではどこからも記事へのリンクが存在しません。
インデックスセレクトの5番、タブメニュー登録を選び、【C】ボタンをクリックしてください。
タイトルには「スポーツ」、URL又はフォルダ名は「sports」と書いて、【C】ボタンをクリックしてください。
これで全てのページから、スポーツページのトップメニューページへのリンクができます。
さてこれでいよいよ記事の投稿です。
「F2」の横のチェックボックスにチェックを入れて下さい。
そして【C】ボタンをクリックします。
すると、下層コンテンツ投稿用になります。
セレクトインデックスに、「野球」が追加されているはずです。
それを選び、再び【C】ボタンをクリックしてください。
これで、ジャンル「野球」での投稿準備ができました。
後はタイトル、記事サイトのカテゴリ、記事本文を書いて投稿するだけです。
記事サイトのカテゴリは、最初から初期設定で設定したものが出ていますが、変更が可能です。
【その他編】
サイトは、サイト全体に影響するものを変更した際には、再構築が必要になります。
通常、記事を投稿しているだけなら必要ありませんが、ホットリンク、告知、タブメニュー登録、自由スペース、トップバーリンクなどを変更した場合、必ず再構築します。
再構築の方法は再構築左のチェックボックスにチェックを入れて【C】ボタンをクリックするだけです。
インデックスセレクトの8番は、トップページに表示するものを投稿しておきます。
これはいつでも変更できるし、再構築の必要はありません。
7番のトップバーリンク登録は、トップバーへのリンクと、リンクページへのリンクを登録します。
通常コメントまで書けばリンクページからのリンクになります。
article/index.htmlにリンクページが存在します。
コメントを空白にすれば、トップバー(メインエリアの一番上のスペース)にリンクが作られます。
リンクページへの変更や追加だけなら、再構築は必要ありません。
6番のping送信先登録は、そのままpingの送信先を登録します。
記事を新規に投稿した時にだけpingが送信できます。
以上で基本的な使い方は終了です。
他にも細かい使い方は、管理画面下を読んで色々試してみてください。
利用していてわからない事があれば、Google+やツイッターで聞いていただけば、余裕があれば答えます。
ただサポートはありませんので、気が向かない場合は答えません。
独自で使い方を研究してください。