http://flowplayer.org/download/
フリーのflowplayer3.2.8をダウンロード
flowplayer-3.2.8.zipを解凍
flowplayer-3.2.8.min.js
flowplayer-3.2.8.swf
をred5サーバーの
/opt/red5/webapps/rootへコピーする。
http://releases.flowplayer.org/swf/flowplayer.rtmp-3.2.8.swfもダウンロード
同じく/opt/red5/webapps/rootへコピーする。

xoops、picoの一般設定で「コンテンツ毎のHTMLヘッダを許可する」を「はい」にする。

HTMLヘッダーに下記を書き込む
<script type="text/javascript" src="http://example.com:5080/flowplayer-3.2.8.min.js"></script>
<!-- some minimal styling, can be removed -->
<link rel="stylesheet" type="text/css" href="http://example.com:5080/VideoStyle.css">

本文ソースは下記
<p style="color: rgb(0, 0, 0);"><strong><font size="3">Flash Playerでストリーミング画像を再生しています</font></strong></p>
<div id="page">
<h1>モモとシュピ in 山中湖</h1>
<p>横浜に戻るときに山中湖に寄りました。寒かったけれどみんな元気でした</p>
<!-- this A tag is where your Flowplayer will be placed. it can be anywhere -->
<a style='display:block;width:424px;height:262px'
id='player'>
</a>
<!-- this will install flowplayer inside previous A- tag. -->????? <script>
????? flowplayer("player", "http://example.com:5080/flowplayer-3.2.8.swf", {
?
??? clip: {
??????? url: 'title.flv',
??????? // configure clip to use influxis as our provider, it uses our rtmp plugin
??????? provider: 'rtmp'
??? },
?
??? // streaming plugins are configured under the plugins node
??? plugins: {
?
??????? // here is our rtpm plugin configuration
??????? rtmp: {
??????????? url: 'http://example.com:5080/flowplayer.rtmp-3.2.8.swf',
?
??????????? // netConnectionUrl defines where the streams are found
??????????? netConnectionUrl: 'rtmp://example.com/oflaDemo'
??????? }
??? }
});
</script>
</div>

VideoStyle.css
body {
??? background-color:#fff;???
??? font-family:"Lucida Grande","bitstream vera sans","trebuchet ms",verdana,arial;
??? /* 2012.03.04 */
??? /*text-align:center;*/
}

#page {
??? background-color:#333333;
/*??? margin:50px auto; */
??? padding:20px 50px 20px 50px;
/*??? min-height:600px; */
/*??? border:2px solid #fff; */
/*??? outline:1px solid #ccc; */
??? text-align:left;
}

#page_wiget {
??? background-color:#efefef;
??? width:180px;
??? margin: auto;
??? padding:2px 2px 2px 2px;
??? min-height:144px;
/*??? border:2px solid #fff;
??? outline:1px solid #ccc; */
??? text-align:left;
}

h1, h2, h3 {
??? letter-spacing:-1px;???
??? margin-bottom:-10px;
}

h1 {
??? color:#f0e68c;
??? font-weight:bold;
??? font-size:22px;
}

h2 {
??? color:#ffffff;
??? font-weight:bold;
??? font-size:18px;
}

h3 {
??? color:#ffffff;
??? font-weight:bold;
??? font-size:15px;
}

.less {
??? color:#999;
??? font-size:12px;
}

a {
??? color:#295c72;??? ???
}

p {
??? color:#98fb98;??? ???
}

サンプルはこちらです。
http://www.sisj.net/modules/VideoDist/embed_test_flash.html

参考: flowplayer.org
http://flowplayer.org/

Xoops bulletin(ニュース)にfacebook「いいね」ボタンをつける
D3Blogに続いてbulletin(ニュース)にfacebook「いいね」ボタンをつけてみた


***********************************************************************
テンプレートファイル bulletin_article.html に赤字部分を挿入
文中「xxxxxxxxxxxxxxx」は書き換えが必要
***********************************************************************
<{if $pagenav}>
? <div style="text-align: left;">Page <{$pagenav}></div>
<{/if}>

<div>
<{include file="db:`$mydirname`_item.html" story=$story}>
</div>

<div id="fb-root"></div>
<script>(function(d, s, id) {
? var js, fjs = d.getElementsByTagName(s)[0];
? if (d.getElementById(id)) return;
? js = d.createElement(s); js.id = id;
? js.src = "//connect.facebook.net/ja_JP/all.js#xfbml=1&appId=xxxxxxxxxxxxxxx";
? fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<{capture assign="mypage_url"}>http://www.domain.com/modules/bulletin/index.php?page=article&storyid=<{$story.id}><{/capture}>
<fb:like href="/<{$mypage_url|urlencode}>" data-send="true" data-layout="button_count" width="450" show_faces="true"></fb:like>


<div style="text-align: left;">
<{if $pagenav}>Page <{$pagenav}><{/if}></div>

<{* RELATED ARTICLES *}>
<{include file="db:`$mydirname`_relations.html"}>

***********************************************************************
theme.htmlに赤字部分を挿入
***********************************************************************
<head>
<meta http-equiv="content-type" content="text/html; charset=<{$xoops_charset}>" />
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="content-script-type" content="text/javascript" />
<meta http-equiv="content-language" content="<{$xoops_langcode}>" />
<meta name="robots" content="<{$xoops_meta_robots}>" />
<meta name="keywords" content="<{$xoops_meta_keywords}>" />
<meta name="description" content="<{$xoops_meta_description}>" />
<meta name="rating" content="<{$xoops_meta_rating}>" />
<meta name="author" content="<{$xoops_meta_author}>" />
<meta name="copyright" content="<{$xoops_meta_copyright}>" />
<meta name="generator" content="XOOPS" />
<meta property="og:type" content="blog" />
<meta property="og:title" content="<{$story.title}>" />
<meta property="og:url" content="http://www.domain.com/modules/bulletin/index.php?page=article&storyid=<{$story.id}>>" />
<meta property="og:description" content="<{$story.text|strip_tags|mb_truncate:140:"..."}>" />
<meta property="og:site_name" content="
My site_name" />
<meta property="fb:app_id" content="
xxxxxxxxxxxxxxx" />
<meta property="og:locale" content="ja_JP" />
<{xoops_og_img post_content=$story.text}>
<link rel="shortcut icon" href="/<{$xoops_url}>/favicon.ico" />
<link rel="stylesheet" type="text/css" media="screen" href="/<{$xoops_url}>/xoops.css" />
<link rel="stylesheet" type="text/css" media="screen" href="/<{$xoops_themecss}>" />

***********************************************************************
OGP中の「og:image:」を取得するのに苦労したが、下記サイトから不要部分を割愛させて使わせてもらうことにした。
ありがとうございました。
http://webgyo.stsuji.com/2010/01/smarty-4.html

***********************************************************************
「XOOPS_PATH/class/smarty/plugins/」に下記を作成、配置する。
function.xoops_og_img.php
***********************************************************************
<?php
function smarty_function_xoops_og_img($params, &$smarty)
{
??? $post_content = $params['post_content'];

??? $ImgRegPat = "/\<img([^\>]*)src=\"?([\-_\.\!\~\*\'\(\)a-z0-9\;\/\?\:@&=\+\$\,\%\#]+(jpg|jpeg|gif|png|bmp))/i";

??? if ($params['post_content']) {

??????? if (preg_match($ImgRegPat, $post_content, $matches)) {
??????????? $the_image = $matches[2];//get imgurl
??????? }
??? echo "<meta property=\"og:image\" content=\"$the_image\">";
??? }
}
?>

***********************************************************************

xoopsの「いいね」キャッシュは下記で簡単に更新されます。
http://developers.facebook.com/tools/debug/

参考サイト
本文中の画像をサムネイル表示するsmartyプラグイン
http://webgyo.stsuji.com/2010/01/smarty-4.html
?

WordPressに続いてXoops D3Blogにもfacebook「いいね」ボタンをつけてみた。



「d3blogにfacebookのいいね機能をつけたいと思います。どのようにすればよいでしょうか。」

http://www.xugj.org/modules/QandA/index.php?topic_id=1999

こちらの記事を参考に始め、さらにOGPを付け加えてみた。以下はその記録である。
***********************************************************************
テンプレートファイル「d3blog_inc_entry.html」に赤字部分を挿入
文中「xxxxxxxxxxxxxxx」は書き換えが必要
***********************************************************************
??? <p class="readMore"><{$smarty.const._MD_D3BLOG_LANG_CANT_READ_FARTHER}></p>
??? <{/if}>
<{/if}>
</div>

<{php}>
$url = $_SERVER["SCRIPT_NAME"];
$url_pattern = '/modules/d3blog/details.php';
if ( preg_match( '{' . $url_pattern . '}' , $url )) {
??? // いいねを表示
<{/php}>
<div id="fb-root"></div>
<script>(function(d, s, id) {
? var js, fjs = d.getElementsByTagName(s)[0];
? if (d.getElementById(id)) return;
? js = d.createElement(s); js.id = id;
? js.src = "//connect.facebook.net/ja_JP/all.js#xfbml=1&appId=
xxxxxxxxxxxxxxx";
? fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<{capture assign="mypage_url"}><{$smarty.const.XOOPS_MODULE_URL}>/<{$xoops_dirname}>/details.php?bid=<{$entry.bid}><{/capture}>
<fb:like href="/<{$mypage_url|urlencode}>" data-send="true" data-layout="button_count" width="450" show_faces="true"></fb:like>
<{php}>
}
<{/php}>

<ul class="d3blogFooter clearFix">
??? <{if !$entry.approved}><li class="unapproved"><{$smarty.const._MD_D3BLOG_LANG_UNAPPROVED}></li><{/if}>
??? <{if $bloggers > 1}><li><a href="/<{$mod_url}>/index.php?uid=<{$entry.uid}>" title="<{$smarty.const._MD_D3BLOG_LANG_READ_BLOGGER_ENTRIES|replace:'%s':$entry.blogger.uname}>"><{$smarty.const._MD_D3BLOG_LANG_READ_BLOGGER_ENTRIES|replace:'%s':$entry.blogger.uname}></a></li><{/if}>

***********************************************************************
theme.htmlに赤字部分を挿入
***********************************************************************
<head>
<meta http-equiv="content-type" content="text/html; charset=<{$xoops_charset}>" />
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="content-script-type" content="text/javascript" />
<meta http-equiv="content-language" content="<{$xoops_langcode}>" />
<meta name="robots" content="<{$xoops_meta_robots}>" />
<meta name="keywords" content="<{$xoops_meta_keywords}>" />
<meta name="description" content="<{$xoops_meta_description}>" />
<meta name="rating" content="<{$xoops_meta_rating}>" />
<meta name="author" content="<{$xoops_meta_author}>" />
<meta name="copyright" content="<{$xoops_meta_copyright}>" />
<meta name="generator" content="XOOPS" />
<meta property="og:type" content="blog" />
<meta property="og:title" content="<{$entry.title}>" />
<meta property="og:url" content="<{$smarty.const.XOOPS_MODULE_URL}>/<{$xoops_dirname}>/details.php?bid=<{$entry.bid}>" />
<meta property="og:description" content="<{$entry.pingExcerpt|mb_truncate:140:"..."}>" />
<meta property="og:site_name" content="Studio ImageHouse" />
<meta property="fb:app_id" content="xxxxxxxxxxxxxxx" />
<meta property="og:locale" content="ja_JP" />
<{xoops_og_img post_content=$entry.excerpt}>
<link rel="shortcut icon" href="/<{$xoops_url}>/favicon.ico" />
<link rel="stylesheet" type="text/css" media="screen" href="/<{$xoops_url}>/xoops.css" />
<link rel="stylesheet" type="text/css" media="screen" href="/<{$xoops_themecss}>" />

***********************************************************************
OGP中の「og:image:」を取得するのに苦労したが、下記サイトから不要部分を割愛させて使わせてもらうことにした。
ありがとうございました。
http://webgyo.stsuji.com/2010/01/smarty-4.html

***********************************************************************
「XOOPS_PATH/class/smarty/plugins/」に下記を作成、配置する。
function.xoops_og_img.php
***********************************************************************
<?php
function smarty_function_xoops_og_img($params, &$smarty)
{
??? $post_content = $params['post_content'];

??? $ImgRegPat = "/\<img([^\>]*)src=\"?([\-_\.\!\~\*\'\(\)a-z0-9\;\/\?\:@&=\+\$\,\%\#]+(jpg|jpeg|gif|png|bmp))/i";

??? if ($params['post_content']) {

??????? if (preg_match($ImgRegPat, $post_content, $matches)) {
??????????? $the_image = $matches[2];//get imgurl
??????? }
??? echo "<meta property=\"og:image\" content=\"$the_image\">";
??? }
}
?>

***********************************************************************

xoopsの「いいね」キャッシュは下記で簡単に更新されます。
http://developers.facebook.com/tools/debug/

参考サイト
本文中の画像をサムネイル表示するsmartyプラグイン
http://webgyo.stsuji.com/2010/01/smarty-4.html
?

xoopsメインメニュータイトルの前に個別画像を設置する方法を探していたが、なかなかうまくいかなかった。偶然に下記を発見してやってみた。cssのこともあまり詳しくなかったので試行錯誤になった。

http://www.xugj.org/modules/QandA/index.php?post_id=5428
Re: メインメニュータイトル冒頭に画像を設置したい

*********************************************************************
legacy_block_mainmenu.html

<table cellspacing="0">
<tr>
<td id="mainmenu">
<{cycle values="0" assign="count"}><a class="menuTop menuBG<{$count}>" href="/<{$xoops_url}>/"><{$smarty.const._MB_LEGACY_HOME}></a>
<{foreach item=module from=$block.modules}>
<{cycle values="1,2,3,4,5,6,7,8,9,10" assign="count"}>
<a class="menuMain menuBG<{$count}>" href="/<{$xoops_url}>/modules/<{$module.directory}>/"><{$module.name}></a>
<{foreach item=sublink from=$module.sublinks}>
<a class="menuSub" href="/<{$sublink.url}>"><{$sublink.name}></a>
<{/foreach}>
<{/foreach}>
</td>
</tr>
</table>

*********************************************************************
style.css

td#mainmenu a.menuMain {
??? background: #ffffff;
/*??? background-image: url(images/folder_c.gif); */
??? background-repeat: no-repeat;
??? background-position: left center;
??? padding-left: 18px;
??? border-top-width: 1px;
??? border-top-style: dotted;
??? border-top-color: #999999;
??? padding-top: 5px;
}

td#mainmenu a.menuBG0 {
??? background-image: url(images/menu_icon/home.png);?
}
td#mainmenu a.menuBG1 {
??? background-image: url(images/menu_icon/news.png);?
}
td#mainmenu a.menuBG2 {
??? background-image: url(images/menu_icon/ITconsul.png);
}
td#mainmenu a.menuBG3 {
??? background-image: url(images/menu_icon/marketing.png);
}
td#mainmenu a.menuBG4 {
??? background-image: url(images/menu_icon/strategy.png);
}
td#mainmenu a.menuBG5 {
??? background-image: url(images/menu_icon/printing.png);
}
td#mainmenu a.menuBG6 {
??? background-image: url(images/menu_icon/price.png);
}
td#mainmenu a.menuBG7 {
??? background-image: url(images/menu_icon/forum.png);
}
td#mainmenu a.menuBG8 {
??? background-image: url(images/menu_icon/download.png);
}
td#mainmenu a.menuBG9 {
??? background-image: url(images/menu_icon/RSS.png);
}
td#mainmenu a.menuBG10 {
??? background-image: url(images/menu_icon/touhyou.png);
}

*********************************************************************

完成はこちら
http://www.sisj.net/
?