POPSブログ

includeでhtmlを取り込む

26

  Category:  basercms2012/02/17 pops 

BaserCMSでincludeでhtmlを取り込む方法です。ブログ記事内ではjqueryを使用します。


includeでhtmlを取り込む


includeでhtmlを取り込む方法です

BaserCMSではほとんどのページが ctp ファイルですから簡単に include で html を取り込むことが可能です。
但し、ブログ記事の中で はphp の記述が出来ないようになっていますので、この部分は jquery を使用して読み込むことにします。
便利な機能ですが。少し複雑になりすぎますので、使用者の好みの問題ですね。


ctpページでinclude

非常に簡単ですが、HTMLを呼ぶ時のパスの記述が、BaserCMSのパス記述とは異なりますので注意ください。
今あなたが見ている「このページ」は、実際には webroot階層の index.php なのです。
読み出す html は 同じwebroot階層の htmlフォルダに収納してあると仮定しますと、パスの記述は下記のようになります。



<div>
<?php include_once("html/pops-kousin.html"); ?>
</div>

BaserCMSでキャッシュ機能が有効な場合はキャッシュされます

読み出さない場合はパスを確認ください。


● 実際のinclude表示

ここは「ブログページの記事の中」のため php を直接実行表示できません。実際にはTOPページで特集記事の「更新記録」で使用しています。そちらをご覧下さい。
ブログ付属のエデッタが自動で php スクリプトを削除するため実行できない構造になっています。

[実際の使用状況] ●TOPページに進む



ブログ記事内でhtmlを取り込む

この部分は jquery を使用して html を読み込むことにします。jqueryのload() 命令を使用します。
読み出 すhtml は webroot階層の htmlフォルダに収納してあると仮定します。
HTMLを呼ぶ時のパスの記述が、BaserCMSのパス記述となります。php の場合と違いますので注意。


#include という 収納用div要素を作りその下に script を記述します
BaserCMSのエデッタで変に整形されるのを防止するため
(スペースが無いと段落なども勝手に入れるので表示が乱れる時がある)、
div要素の中には「1個スペース」を入れてください
スペース &nbs;
/main は当方のサブフォルダ

<div id="include"> </div>
<script type="text/javascript"> 
	$(function(){
		$('#include').load('/main/html/blog0020.html');
	});
</script>

html(php) ページを表示してから、jqueryの処理ですからキャッシュはされません

読み出さない場合はパスを確認ください。


● 実際のjqueryのload()テスト表示


 

以上です。



[ この記事のURL ]


タグ:memo , basercms , php , jquery

 

ブログ記事一覧



[1]