トップページに簡単なお知らせを設置

さくらインターネットさんでパーミッション設定無しで使える

PHP工房さんから新着情報・更新履歴CMS「PKOBO-News01」を使います。
マニュアルもPHPに書いてあるし、コピペで済むのはありがたい。

解凍してできたファイルは「index.html」と同じ階層に置く

注意：

動作確認はサーバーにアップした後でないと確認できないので

はじめにログイン用のIDとパスワードを設定

pkobo_news>admin>inclube>config.php をエディタで開く

※エディタはドリムウィバーでよい

中身は日本語説明があるので

IDとPASSを設定して必要ファイル全てをサーバーアップ

http://設置ディレクトリのURL/フォルダ名/pkobo_news/admin/

にアクセスしてログイン画面で先に設定したIDとPASSでログイン

記事を投稿して動作確認できれば一旦OK

トップページにお知らせを設置　本番

設置方法は2種類

設置したいページに直接タグを埋め込む

※SEOを考えるとタグを埋め込む方がよい

設置

「top-umekomi.php」をエディタで開き

説明されている必要部分を全て設置予定ページにコピペする

1.以下の部分を宣言文よりも上にコピペ↓↓↓↓↓↓↓↓

<?php //▼▼ 既存ページヘ埋め込み時はまるっとコピペ下さい（この行も含みページ最上部に）※.phpでかつUTF-8のページのみ可▼▼

//※このページに対して既存のページのhtmlを記述する形でももちろんOKです。

//----------------------------------------------------------------------

// トップページ表示用ページ

// 設定ファイルの読み込みとページ独自設定

//----------------------------------------------------------------------

include_once("./pkobo_news/admin/include/config.php");//（必要に応じてパスは適宜変更下さい）

$img_updir = './pkobo_news/upload';//画像保存パス（必要に応じてパスは適宜変更下さい）

@rssGen();//RSS配信用（このファイルのURLに「?feed=rss2」とパラメータを追加すればRSSフィードが表示されます）※不要な場合削除OK

/* ▽オプション設定▽ */

//表示件数

$config['dspNum'] = 10; 1桁のときは01,012,03でうまく動いた

//本文の抜粋を表示するかどうか（0=しない、1=する）

$commentDsp = 1;

//本文を抜粋表示する場合の表示文字数（単位はバイト。全角文字は「2バイト」で1文字となります。また末尾の文字「...」も含みます）

//※htmlタグは削除されます「0」にすれば全文をhtmlもそのままで表示します。（レイアウトに問題が出る可能性があるのでオススメしません）

$commentNum = 200;

//サムネイルを表示するか（0=しない、1=する）※アップファイルの1枚目が画像の場合のみ有効

$dspThumbNail = 0;

//表示するカテゴリを指定（指定なし（空）の場合は全件表示 ※デフォルト）

//このページで特定カテゴリのみ表示したい場合、0からの番号を指定下さい。（1番目が0，2番目が1になるので注意）

//要するに複数のカテゴリがある場合でそれぞれ別々のファイルで表示したい場合用です

//このファイルを複製すればOKです（カテゴリごとにデザインを変えたい場合など）

//例　$category = '1'; ※この場合カテゴリ番号「1」（設定ファイルでの2番目）の記事のみが表示されます

$category = '';

//またはURLのパラメータでも指定可能です。番号ルールは↑と同じです。例　URLに ?cat=0 や ?cat=1 を追加するだけです

//1ファイルでパラメータを変えるだけでそれぞれのカテゴリを表示できるので便利です。（全カテゴリでデザインは共通で良い場合）

//----------------------------------------------------------------------

// 設定ファイルの読み込みとページ独自設定

//----------------------------------------------------------------------

//▲▲ コピペここまで ▲▲（この行も含む）?>

2.以下の部分を<head></head>にコピペ↓↓↓↓↓↓↓↓

<!--

function openwin(url) {//詳細ページ用ポップアップ。ウインドウの幅、高さなど自由に編集できます（ポップアップで開く場合のみコピペ下さい）

wn = window.open(url, 'win','width=680,height=550,status=no,location=no,scrollbars=yes,directories=no,menubar=no,resizable=no,toolbar=no');wn.focus();

}

-->

</script>

3.以下の部分を<head></head>にコピペ↓↓↓↓↓↓↓↓

/* CSSは必要最低限しか指定してませんのでお好みで（もちろん外部化OK） */

/* clearfix */

.clearfix:after { content:"."; display:block; clear:both; height:0; visibility:hidden; }

.clearfix { display:inline-block; }

/* for macIE \*/

* html .clearfix { height:1%; }

.clearfix { display:block; }

ul#newsList{

margin:0 0 15px;

padding:0;

font-family:"メイリオ", Meiryo, Osaka, "ＭＳＰゴシック", "MS PGothic", sans-serif;

}

ul#newsList li{

color:#666;

font-size:12px;

margin:0;

padding:5px 0;

margin-bottom:3px;

border-bottom:1px dotted #ccc;

line-height:120%;

list-style-type:none;

}

a{color:#36F;text-decoration:underline;}

a:hover{color:#039;text-decoration:none;}

.catName{

display:inline-block;

padding:3px 8px;

border:1px solid #ccc;

border-radius:6px;

font-size:11px;

line-height:100%;

margin:0 2px;

}

#newsWrap {

width:550px;

}

.newMark{

display:inline-block;

border:1px solid #F00;

padding:1px 4px;

font-size:11px;

line-height:100%;

background:#F00;

color:#fff;

box-shadow:1px 1px 1px #999;

border-radius:8px;

font-style:italic;

}

.comment{

display:block;

padding:3px 0;

float:left;

overflow:hidden;

width:500px;/* 本文部分の幅。ここは特に設置ページ合わせて変更下さい */

}

.thumbNailWrap{

display:block;

width:100;

float:left;

height:80px;

overflow:hidden;

}

.title {

margin-left:30px;

}

</style>

4.以下の部分を<body></body>の設置したい場所へコピペ↓↓↓↓↓↓↓↓

<?php if(!$copyright){echo $warningMesse;exit;}else{$getFormatDataArr = getLines2DspData($file_path,$img_updir,$config,'',$category);foreach($getFormatDataArr as $key => $data){?>

<li id="postID_<?php echo $data['id'];?>" class="cat-<?php echo $data['categoryNum'];?> clearfix">

<?php if(!empty($data['category'])) echo '<span class="catName">'.$data['category'].'</span>';//カテゴリ名表示?>

<?php if($data['newmark'] == 1) echo ' <span class="newMark">New!</span>';//New表示。タグ変更可（表示期間は設定ファイルで）?>

</li>

<?php } ?>

</ul>

<?php echo $copyright;}//著作権表記削除不可?>

</div>

以上設置完了

今回カスタマイズしたところは

・画像表示が必要ないのでその部分のタグは全面カット