ベータ版2-2

戻る

カスタムトピック

画像は予めご変更ください。

使い方がどうしても解らないという方は使用しないで下さい＞＜；

白+茶verですが、別の色に変更したい時は#ffffff以外の場所を好きな色に変更して下さい。
解る方は白(#ffffff)の部分を変更されても大丈夫です。
またリンクは普通に<a href=""></a>で指定しています。リンク先を増やしたいときはコピペで増やしてください。
bodyタグ以下の手ブロ説明の所が不要な方は文字を削除してください。

自己責任でお使い下さい。明らかなエラーについては対応します。
メールフォームか手ブロメッセージよりご連絡下さい。
改変はご自由に。色などは変更して下さい。変更の目安については下に。
※再配布はご遠慮下さい。原型を留めない改変後の再配布についてはこの限りではありません。
※【Type-2 Brown】に変更後、htmlを変更して下さい。

保存はコピー&ペーストでお願いします。

サーバー移転に伴い、クリップボードにコピーできるようにしました。
なので、一旦メモ帳かTeraPadなどの余分なものが入らないテキストエディッターなどに貼り付けて下さい。
そのまま手ブロベータのフォームに貼り付けても多分、大丈夫です。(一応実験済み)
※コピーされない！という場合はCtrl+Cでやってみてください。全選択(Ctrl+A)にしかならない場合があります。

ボーダーと丸角混合一覧

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<?xml version="1.0" encoding="UTF-8" ?>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
$headerPart

<title>$user.nicknameさんの手書きブログ</title>

/* 共通設定 ------------------------------------------------------------------------------------------------------------------------- */

body {
font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,Verdana,Osaka,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
font-size:11px;margin: 0;color: #47301c;background-color: #e3dbdb;}

a:link, a:active{color:#47301c;text-decoration: none;}

a:visited{color:#47301c;text-decoration: none;}

a:hover{color:#47301c;text-decoration: none;background-color:#eeeeee;}

#Wrapper {width: 930px;margin:15px auto 15px auto;padding: 30px 1px 0px 1px;background-color:#fff;-moz-border-radius: 20px;/* Firefox */
-webkit-border-radius: 20px;/* Safari,Chrome */ border-radius: 20px;/* CSS3 */}

/* 共通設定 ------------------------------------------------------------------------------------------------------------------------- */

/* 広告 ----------------------------------------------------------------------------------------------------------------------------- */

#Ad300x250 {float: left;width: 300px;height: 250px;margin:40px 5px 5px auto;}

/* 広告 ----------------------------------------------------------------------------------------------------------------------------- */

/* ページナビゲーションバー --------------------------------------------------------------------------------------------------------- */

.PageBar{text-align: center;float: left;width: 100%;font-size: 10px;margin: 5px 0px 5px 0px;}

.PageBar span{float: left;padding: 10px;width: 10px;height: 10px;
text-align:center;white-space: nowrap;overflow: hidden;line-height: 10px;padding: 10px;}

.PageBar span:hover {color:#47301c;text-decoration: underline;}

.PageBar .Selected {font-weight: bold;}

/* ページナビゲーションバー --------------------------------------------------------------------------------------------------------- */

/* ヘッダペイン --------------------------------------------------------------------------------------------------------------------- */

#Header {float: left;margin-top:0px;width: 850px;height: 80px;}

#HeaderTitle {font-weight: bold;text-decoration: none;font-size:25px;float: left;width: 160px;height: 30px;margin-left:30px;}

#HeaderSubTitle{float: left;display:block;font-size:11px;width: 850px;height: 30px;margin:10px auto auto 30px;}

#MenuBar {display: none !important;}

#MenuBarLeft {display: none !important;}

#MenuBarRight {display: none !important;}

/* ヘッダペイン --------------------------------------------------------------------------------------------------------------------- */

/* コンテンツペイン ----------------------------------------------------------------------------------------------------------------- */

#Contents {float: left;width: 620px;height: auto;}

.ContentsList {float: left;width: 620px;padding: 0px;margin-bottom: 20px;border: 0;}

/* サムネイル設定 ------------------------------------------------------------------------------------------------------------------- */

.BlogThumb {font-size: x-small;text-align: center;float: left;width: 120px;height: 160px;margin: 2px 2px 60px 2px;color:#47301c;}

.BlogThumb .BlogImg {float: left;width: 120px;height: 160px;border: 1px solid #dddddd;}

.BlogThumb .BlogInfo{float: left;width: 100%;}

.BlogTitle {clear: both;float: left;width: 100%;height: 15px;line-height: 15px;font-size: 11px;overflow: hidden;white-space: nowrap;}

.BlogThumb .BlogInfo .BlogDate {float: left;width: 100%;height: 15px;line-height: 10px;font-size: 9px;overflow: yes;margin:5px 0 0 0;}

#CategoryName {margin: 0 0 5px 10px;}

#mypage {width:930px;margin: 0px 0px 10px 0px;padding: 5px 0px 5px 0px;font-size:10px;color:#47301c;text-align:center;border-bottom:2px dotted #47301c;}

/* コンテンツペイン ----------------------------------------------------------------------------------------------------------------- */

/* サイドペイン --------------------------------------------------------------------------------------------------------------------- */

#SideBar {float: right;width: 310px;}

#SideBarTitle {float: left;width: 310px;height: 10px;padding: 0px 20px 0px 7px;}

#SideBarBody {float: left;width: 310px;height: auto;border: 0px;padding: 0px 20px 0px 7px;}

#SideBarEnd {float: left;width: 310px;height: 20px;padding: 0px 20px 0px 7px;}

.SideBarItem {float: left;width: 100%;padding: 0px 0px 10px 0px;text-align: center;}

.SideBarItem .SideBarItemTitleProfile {float: left;width: 300px;height: 10px;margin-top:10px;}

.SideBarItem .SideBarItemTitleLink {float: left;width: 100%;height: 5px;}

/* ---------------------------------------------------------------------------------------------------------------------------------- */

.SideBarItem .MyNickname {float: left;width: 100%;font-size: 20px;font-weight: bold;margin:0;}

/* ---------------------------------------------------------------------------------------------------------------------------------- */

.SideBarItem .MyImg {float: left;width: 100%;}

.SideBarItem .MyImg img {border: none;margin-left: auto;margin-right: auto;}

/* ---------------------------------------------------------------------------------------------------------------------------------- */

/* プロフィール画像下の設定 --------------------------------------------------------------------------------------------------------- */

.SideBarItem .MyProfileCmd {float: left;width: 300px;padding: 5px 0px 5px 0px;}

.SideBarItem .MyProfileCmd .CmdButton {border: solid 1px #2f4f4f;-moz-border-radius: 4px;/* Firefox */
-webkit-border-radius: 4px;/* Safari,Chrome */ border-radius: 4px;/* CSS3 */text-decoration: none;background-color: #ffffff;}

.SideBarItem .MyProfileCmd .CmdButton:HOVER {background-color: #eeeeee;color:#47301c;}

.SideBarItem .MyProfileCmd .CmdButtonDisable {border: solid 1px #47301c;-moz-border-radius: 4px;/* Firefox */
-webkit-border-radius: 4px;/* Safari,Chrome */ border-radius: 4px;/* CSS3 */color: #ffffff;background-color: #47301c;text-decoration: none;}

.SideBarItem .MyProfileCmd .BlogParts {width:68px;height:9px;border:none;}

#border{border-bottom:2px dotted #47301c;width:300px;margin:2px;}

/* ウィジェットペイン --------------------------------------------------------------------------------------------------------------- */

.WidgetPane {float: left;width: 246px;height: auto;margin: 15px 27px 20px 27px;background-color: #ffffff;color: #47301c;}

.WidgetTitle {width: 244px;background-color:#ffffff;color: #47301c;border:1px solid #47301c;-moz-border-radius: 4px;/* Firefox */
-webkit-border-radius: 4px;/* Safari,Chrome */ border-radius: 4px;/* CSS3 */}

.WidgetItemList {float: left;width: 244px;height: auto;text-align: left;background-color: #ffffff;}

.WidgetItemList a {color: #47301c;text-decoration: none;}

.WidgetItemList a:hover {color:#47301c;text-decoration: underline;}

.WidgetItemList .BlogTag {float: left;width: 60px;height: 60px;color: #47301c;text-decoration: none;margin-top:3px;border:1px solid #47301c;}

.WidgetItemList .BlogTag .BlogNum {width: 60px;height: 20px;margin: 40px 0 0 0;color: #ffffff;text-align: center;
filter: alpha(opacity=35);-moz-opacity:0.35;opacity:0.35;background-color: #47301c;}

.WidgetPane .ReadMore {float: left;width: 100%;text-align: right;padding: 4px 0 0 0;font-size: 85%;}

.WidgetItemList .BlogThumb {text-decoration: none;width: 60px;height: 80px;border-top: 1px solid #ffffff;border-right: 1px solid #ffffff;}

.WidgetItemList .Category {width: 100%;text-align: left;padding: 2px 0 2px 5px;}

p{margin:1px 0px 1px 5px;color:#47301c;}

/* サイドペイン --------------------------------------------------------------------------------------------------------------------- */

/* フッタペイン---------------------------------------------------------------------------------------------------------------------- */

#Footer {clear: both;width: 100%;text-align: center;padding: 20px 0px 20px 0px;font-size: 10px;}

/* フッタペイン---------------------------------------------------------------------------------------------------------------------- */

-->
</style>
</head>

<body>

$VBlogListHeaderPart
<div id="Wrapper">
$menuBar

<div id="Header">
<a href="../$user.userId/" id="HeaderTitle" title="$user.nicknameの手書きブログトップ">
Tagaki blog
</a><br>

<div id="HeaderSubTitle">
ここにコメント　ここにコメント　ここにコメント　ここにコメント　ここにコメント　ここにコメント　ここにコメント
ここにコメント　ここにコメント　ここにコメント　ここにコメント　ここにコメント　ここにコメント　ここにコメント
ここにコメント　ここにコメント　ここにコメント　ここにコメント　ここにコメント　
</div>

</div>

<div id="Contents">

<div id="mypage">
<a href="http://tegaki.pipa.jp/">手書きブログトップ</a>
　<a href="../VMyPageS.jsp">マイページ</a>
　<a href="http://sites.google.com/site/teburohelp/">ヘルプ</a>
</div>

<div class="PageBar">$pageMenu</div>
<div class="ContentsList">
#foreach($tegaki in $tegakiList)
<div class="BlogThumb">
<div class="BlogTitle">$tegaki.title</div>
#if($tegaki.tegakiId!=-1)
<a href="../$user.userId/${tegaki.tegakiId}.html" class="BlogImg" title="$tegaki.title" alt="$tegaki.title" style="background-image: url('$tegaki.fileNameMedium');">
</a>
#else
<div class="BlogImg" style="background-image: url('$tegaki.fileNameMedium');">
</div>
#end
<div class="BlogInfo">
<div class="BlogDate">
$tegaki.uploadDateText　　
<font title="コメント$tegaki.commentNum件">コメント$tegaki.commentNum件</font>
</div>
</div>
</div>
#end

<div class="PageBar">$pageMenu</div>
</div>
</div>

<div id="Ad300x250"> $ad300x250 </div>

<div class="SideBarItem">
<div class="SideBarItemTitleProfile"></div>
<div class="MyNickname">
$user.nickname
</div>

<div class="MyProfileCmd">
#if($thisPage.isMyPage == false)
#if($thisPage.isMyFriendPage == false)
<a href="$requestFrinedURL" class="CmdButton">お友達</a>
#else
<span class="CmdButtonDisable">お友達</span>
#end

#if($thisPage.isMyFavoritePage == false)
<a href="$addFavoriteURL" class="CmdButton">お気に入り</a>
#else
<span class="CmdButtonDisable">お気に入り</span>
#end

<a href="$sendMessageURL" class="CmdButton">メッセージ</a>

#else
<span class="CmdButtonDisable">お友達</span>
<span class="CmdButtonDisable">お気に入り</span>
<span class="CmdButtonDisable">メッセージ</span>

#end
</div>

<div class="WidgetPane">
<div class="WidgetTitle">リンク</div>
<div class="WidgetItemList"><p>
テキストリンク<br>
<a href="http://" title="リンク先についての説明とか" target="_blank">リンク先</a><br>
<br>
画像リンク<br>
画像リンクの場合は、srcの所にimgのurlを入れてください。<br>
手ブロ内に画像upする場合は＄user.image001～＄user.image010までの数字に直してください。<br>
見本画像はデフォパレの上から順に塗って作ってます。
<a href="http://" title="リンク先についての説明とか" target="_blank"><img src="$user.image001" border="0" alt="リンク先についての説明とか"></a><br>
<a href="http://" title="リンク先についての説明とか" target="_blank"><img src="$user.image002" border="0" alt="リンク先についての説明とか"></a><br>
<a href="http://" title="リンク先についての説明とか" target="_blank"><img src="$user.image003" border="0" alt="リンク先についての説明とか"></a><br>

</p></div>
</div>

<div class="WidgetPane">
<div class="WidgetTitle">about</div>
<div class="WidgetItemList"><p>
ブログのジャンル説明やFOについてなどご自由に。
タイトルを変えたい場合はaboutと入っている部分を削除して文字を入れてください。<br>
ある程度長めに文字を入れても、width指定の幅で折り返されます。
</p></div>
</div>

<div class="WidgetPane">
<div class="WidgetTitle">参加企画</div>
<div class="WidgetItemList"><p>
参加企画がない場合は別の説明を入れるか、タグごと削除してください。<br>
改行したい場合はしたい位置に<br>を入れて下さい。<br>
(公開記事を見ながら編集している方に見えやすいように< >を入れてます)
<br>こんなふうに先頭にいれても前の行から改行されます。
<br>
※タグごと削除する場合は、から開始してまでさくっり削除でOK。
その場合ボーダー設定の部分<div id="border"><font color="#ffffff">.</font></div>も1つ削除してください。
<div id="border">　</div>火狐だとこれだけでもボーダーが表示できますが、IE対策として<font color="#ffffff">.</font>を入れています。
</p></font>
</div>
</div>

<div class="WidgetPane">
<div class="WidgetTitle">ブログカテゴリ</div>
<div class="WidgetItemList">$categoryList</div>
</div>

<div class="WidgetPane">
<div class="WidgetTitle">よく使うタグ</div>
<div class="WidgetItemList">$blogNumByTag</div>
</div>

</div>

</div>
<div id="SideBarEnd"></div>
</div>

$wrapperFooterPart
</div>

$bodyFooterPart
</body>
</html>

ボーダーと丸角混合詳細

<title>
#if ($tegaki.title != "")
『$tegaki.title』-
#end
$user.nicknameさんの手書きブログ
</title>

body {font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,Verdana,Osaka,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
font-size:11px;margin: 0;color: #47301c;background-color: #e3dbdb;}

a:link, a:active{color:#47301c;text-decoration: none;}

a:visited{color:#47301c;text-decoration: none;}

a:hover{color:#47301c;text-decoration: none;background-color:#eeeeee;}

#Wrapper {width: 968px;margin:15px auto 25px auto;padding: 30px 1px 0px 1px;background-color:#fff;-moz-border-radius: 20px;/* Firefox */
-webkit-border-radius: 20px;/* Safari,Chrome */ border-radius: 20px;/* CSS3 */}

/* 共通設定 ------------------------------------------------------------------------------------------------------------------------- */

/* 広告 ----------------------------------------------------------------------------------------------------------------------------- */

#Ad300x250 {float: left;width: 300px;height: 250px;margin:5px 5px 5px auto;}

/* 広告 ----------------------------------------------------------------------------------------------------------------------------- */

/* ヘッダペイン --------------------------------------------------------------------------------------------------------------------- */

#Header {float: left;margin-top:0px;width: 620px;height: 30px;}

#HeaderTitle {float: left;font-weight: bold;text-decoration: none;font-size:25px;width: 160px;height: 30px;margin-left:30px;}

#HeaderSubTitle{font-size:11px;float: left;width: 620px;height: 30px;margin:10px auto auto 30px;}

#MenuBar {display: none !important;}

#MenuBarLeft {display: none !important;}

#MenuBarRight {display: none !important;}

/* ヘッダペイン --------------------------------------------------------------------------------------------------------------------- */

/* フッタペイン---------------------------------------------------------------------------------------------------------------------- */

#Footer {clear: both;width: 100%;text-align: center;padding: 20px 0px 20px 0px;font-size: 10px;}

/* フッタペイン---------------------------------------------------------------------------------------------------------------------- */

/* サイドペイン --------------------------------------------------------------------------------------------------------------------- */

#SideBar {float: right;width: 310px;}

#SideBarTitle {float: left;width: 310px;height: 10px;padding: 0px 20px 0px 7px;}

#SideBarBody {float: left;width: 310px;height: auto;border: 0px;padding: 0px 20px 0px 7px;}

#SideBarEnd {float: left;width: 310px;height: 20px;padding: 0px 20px 0px 7px;}

.SideBarItem {float: left;width: 100%;padding: 0px 0px 10px 0px;text-align: center;}

.SideBarItem .SideBarItemTitleProfile {float: left;width: 300px;height: 10px;}

.SideBarItem .SideBarItemTitleLink {float: left;width: 100%;height: 5px;}

#border{border-bottom:2px dotted #47301c;width:300px;}

/* サイドペイン --------------------------------------------------------------------------------------------------------------------- */

/* プロフ画像、アカ名 --------------------------------------------------------------------------------------------------------------- */

.SideBarItem .MyNickname {width: 100%;font-size: 20px;font-weight: bold;margin:auto;}

.SideBarItem .MyImg {float: left;width: 100%;}

.SideBarItem .MyImg img {border: none;margin-left: auto;margin-right: auto;}

/* プロフ画像、アカ名 --------------------------------------------------------------------------------------------------------------- */

/* プロフィール画像下の設定 --------------------------------------------------------------------------------------------------------- */

.SideBarItem .MyProfileCmd {font-size:10px;float: left;width: 300px;padding: 5px 0px 5px 0px;}

.SideBarItem .MyProfileCmd .CmdButton {font-size:10px;border: solid 1px #47301c;-moz-border-radius: 4px;/* Firefox */
-webkit-border-radius: 4px;/* Safari,Chrome */ border-radius: 4px;/* CSS3 */text-decoration: none;background-color: #ffffff;}

.SideBarItem .MyProfileCmd .CmdButton:HOVER {font-size:10px;background-color: #e3dbdb;color:#47301c;}

.SideBarItem .MyProfileCmd .CmdButtonDisable {font-size:10px;border: solid 1px #47301c;-moz-border-radius: 4px;/* Firefox */
-webkit-border-radius: 4px;/* Safari,Chrome */ border-radius: 4px;/* CSS3 */
color: #ffffff;background-color: #47301c;text-decoration: none;}

.SideBarItem .MyProfileCmd .BlogParts {font-size:10px;width:68px;height:9px;border:none;}

/* プロフィール画像下の設定 --------------------------------------------------------------------------------------------------------- */

/* ウィジェットペイン --------------------------------------------------------------------------------------------------------------- */

.WidgetPane {float: left;width: 246px;height: auto;margin: 15px 27px 20px 27px;background-color: #ffffff;color: #47301c;}

.WidgetTitle {width: 244px;background-color:#ffffff;color: #47301c;border: solid 1px #47301c;-moz-border-radius: 4px;/* Firefox */
-webkit-border-radius: 4px;/* Safari,Chrome */ border-radius: 4px;/* CSS3 */text-decoration: none;background-color: #ffffff;}

.WidgetItemList {float: left;width: 244px;height: auto;text-align: left;background-color: #ffffff;}

.WidgetItemList a {color: #47301c;text-decoration: none;}

.WidgetItemList a:hover {color: #47301c;text-decoration: underline;}

.WidgetItemList .BlogTag {float: left;width: 60px;height: 60px;color: #47301c;text-decoration: none;margin-top:4px;margin-left:3px;border: 1px solid #47301c;}

.WidgetItemList .BlogTag .BlogNum {width: 60px;height: 20px;margin: 40px 0 0 0;color: #ffffff;text-align: center;
filter: alpha(opacity=35);-moz-opacity:0.35;opacity:0.35;background-color: #47301c;}

.WidgetPane .ReadMore {float: left;width: 100%;text-align: right;padding: 4px 0 0 0;font-size: 85%;}

.WidgetItemList .BlogThumb {text-decoration: none;width: 60px;height: 80px;border-top: 1px solid #ffffff;border-right: 1px solid #ffffff;}

.WidgetItemList .Category {width: 100%;text-align: left;padding: 2px 0 2px 5px;}

p{margin:1px 0px 1px 5px;}

#mypage {width:968px;margin: 0px 0px 10px 0px;padding: 5px 0px 5px 0px;font-size:10px;color:#47301c;text-align:center;border-bottom:2px dotted #47301c;}

/* ウィジェットペイン --------------------------------------------------------------------------------------------------------------- */

/* コンテンツペイン ----------------------------------------------------------------------------------------------------------------- */

#Contents {float: right;width: 651px;height: auto;}

.ContentsList {float: left;width: 651px;padding: 0px;margin-bottom: 20px;border: 0px solid #ffffff;}

.ContentsListTitle {float: left;width: 631px;height: 40px;padding: 0 10px 0 10px;text-align: left;color:#47301c;}

.ContentsListTitle .Date {font-size: 10px;}

.ContentsListTitle .Title {float: left;width: 460px;height: 38px;padding: 2px 0 0 0;color:#47301c;
font-size: 16px;font-weight: bold;background-color: #ffffff;overflow: hidden;white-space: nowrap;border: 0px solid #47301c;}

.ContentsListTitle .Category {float: right;text-align: left;width: 150px;height: 35px;padding: 5px 0 0 0;
color:#2f4f4f;font-size: 12px;font-weight: normal;padding: 5px 0 0 0;border: 0px solid #fff;}

.ContentsListTitle .Title .Date a{color: #47301c;}

.ContentsListTitle a:hover {color: #47301c;background-color: #eeeeee;}

/* コンテンツペイン ----------------------------------------------------------------------------------------------------------------- */

/* ブログディテール ----------------------------------------------------------------------------------------------------------------- */

.BlogThumbFull {float: left;width: 100%;text-align: center;}

.BlogThumbFull .BlogThumbFullTitle {float: left;width: 624px;height: 10px;padding: 0px 20px 0px 7px;background-color: #ffffff;}

.BlogThumbFull .BlogThumbFullBody {float: left;width: 600px;padding: 0px 30px 0px 21px;background-color: #ffffff;}

.BlogThumbFull .BlogThumbFullEnd {float: left;width: 624px;height: 20px;padding: 0px 20px 0px 7px;background-color: #ffffff;}

.BlogThumbFull .NaviBar {width: 100%;margin: 5px 0px 5px 0px;}

.BlogThumbFull .NaviBar .Navi_P,.BlogThumbFull .NaviBar .Navi_C,.BlogThumbFull .NaviBar .Navi_N {width: 33%;}

.BlogThumbFull .BlogInfoFull {width: 100%;margin: 5px 0px 0px 0px;text-align: left;}

.BlogThumbFull .BlogInfoFull .BlogCmd {text-align: right;font-size: 0px;font-size: 0em;}

.BlogThumbFull .BlogInfoFull .BlogCmd .EditHeartIcon {text-decoration: none;margin-left: 5px;}

.BlogThumbFull .BlogInfoFull .BlogDate {font-size: 11px;}

.BlogThumbFull .BlogInfoFull .BlogTitle {font-size: 26px;font-weight: bold;}

.BlogThumbFull .BlogInfoFull .BlogTag {width: 80px;text-align: center;}

.BlogThumbFull .BlogInfoFull .BlogTag img {border: solid 1px #dddddd;}

.BlogThumbFull .BlogInfoFull .BlogTemplate {width: 45px;height: 60px;text-align: center;}

.BlogThumbFull .BlogInfoFull .BlogTemplate img {height: 60px;border: solid 1px #dddddd;}

.BlogThumbFull .BlogDetail img{border: solid 1px #dddddd;}

.BlogDetail .blogtitle{margin-left:60px;text-align:center;width: 480px;font-size: 26px;font-weight: bold;word-break:break-all;}

.BlogCommentTop{height: 15px;text-align:left;margin-left:60px;}

.BlogTitleComment{text-align:right;}

.BlogButton{text-align:right;}

/* ブログディテール ----------------------------------------------------------------------------------------------------------------- */

/* コメント ------------------------------------------------------------------------------------------------------------------------- */

.CommentDetail {text-align:center;}

.CommentDetail .CmtImg {text-align: center;border:1px solid #dddddd;width: 480px;height: 160px;margin: 0px auto 0px auto;}

.CommentName {height: 15px;text-align:left;margin-left:60px;}

/* コメント ------------------------------------------------------------------------------------------------------------------------- */

/* コメントパレット ----------------------------------------------------------------------------------------------------------------- */

#PalletPaneH {text-align: center;width: 484px;background-color:#ffffff;margin: 0px auto 0px auto;}

table#PalletPaneH {border:1px solid #dddddd;}

#PalletPaneH .PalletButtonTitle {font-size: x-small;text-align: center;background-color: #dddddd;}

#PalletPaneH #ColorButton,#PalletPaneH #PenButton {border-collapse:collapse;border:0px;}

#PalletPaneH #ColorButton td,#PalletPaneH #PenButton td {border:none;padding:0px;text-align:center;
background-color:#ffffff;cursor: pointer;}

#PalletPaneH #PenButton td {width: 15px;}

#PalletPaneH #ColorButton td:hover,#PalletPaneH #PenButton td:hover {background-color: #bbccff;}

#PalletPaneH .PalleteCommand {text-align: center;}

#PalletPaneH .PalleteCommand select {font-size: x-small;}

#PalletPaneH #ColorButton .Color {width:14px;height:28px;border: solid 1px #eeeeee;margin:3px 1px 3px 1px;}

#PalletPaneH #ColorButton .ColorRainbow {width:14px;height:15px;border: solid 1px #eeeeee;margin:3px 1px 3px 1px;}

#PalletPaneH #ColorButton .ColorRainbow .ColorRainbowPart {border: none;width:14px;height:3px;font-size: 0em;}

#PalletPaneH #PenButton .PenWidth{font-size: 1px;border: solid 1px #eeeeee;background-color:#000000;margin:3px 1px 3px 1px;margin-left: auto;margin-right: auto;height: 28px;}

#PalletPaneH #UndoButton {float:left;color:#666666;font-size:xx-small;text-align:center;height:38px;width:34px;
background: white url("http://img01.pipa.jp/tegaki/img/UndoV.png") no-repeat bottom center;margin: 0 auto;}

#PalletPaneH #UndoButton:hover {background-color: #bbccff;}

#UploadCmd {width: 100%;border-collapse:collapse;text-align: center;border: 0px;margin: 2px 0px 15px 0px;}

#UploadCmd .UploadButton {width: 56px;height: 23px;border: none;
background: url(http://img01.pipa.jp/tegaki/img/UploadButton3.png) no-repeat 0 0;font-size: 0em;color: #ffffff;vertical-align: top;}

#PalletPaneH #RedoButton {float:left;color:#666666;font-size:xx-small;text-align:center;
height:38px;width:34px;background: white url("http://img01.pipa.jp/tegaki/img/RedoV.png") no-repeat bottom center;margin: 0 auto;}

#PalletPaneH #RedoButton:hover {background-color: #bbccff;}

/* コメントパレット ----------------------------------------------------------------------------------------------------------------- */
-->
</style>
</head>

<body>
$VBlogHeaderPart

<div id="Wrapper">
$menuBar

<div id="Header">
<div id="mypage">
<a href="http://tegaki.pipa.jp/">手書きブログトップ</a>
　<a href="../VMyPageS.jsp">マイページ</a>
　<a href="../VCreateDotS4.jsp?M=2&ID=$user.userId&TD=$tegaki.tegakiId" class="Text">マイハート送信</a>
　<a href="../VCreateDotS4.jsp?M=0&ID=$user.userId&TD=$tegaki.tegakiId" class="EditHeartIconHeader cboxElement">[編集]</a>
　　<a href="http://sites.google.com/site/teburohelp/">ヘルプ</a>
</div>

</div>

<div id="Contents">

<div class="ContentsList">
<div class="BlogThumbFull">
<div class="BlogThumbFullTitle"></div>
<div class="BlogThumbFullBody">
<table class="NaviBar">
<tr>
<td class="Navi_N">
#if($tegakiNext.tegakiId > 0)
<a href="${tegakiNext.tegakiId}.html">< New</a>
#end
</td>
<td class="Navi_C">
<a href="index.html">Blog list</a>
</td>
<td class="Navi_P">
#if($tegakiPrev.tegakiId > 0)
<a href="${tegakiPrev.tegakiId}.html">Old ></a>
#end
</td>
</tr>
</table>

<div class="BlogInfoFull">
<div class="BlogTitle">
<div class="BlogDate">$tegaki.uploadDateText</div>
</div>
<div class="BlogTitleComment">
<img src="http://img01.pipa.jp/tegaki/img04/CommentIcon.gif" alt="コメント" />x$tegaki.commentNum
</div>
<div class="BlogButton">
$bookmarkButton
</div>
</div>

#if($tegaki.getImg(0).template.fileName != "")
#if(${tegaki.getImg(0).template.templateId} > 0)
<a href="../VSearchBlogByTemplateS2.jsp?PD=${tegaki.getImg(0).template.templateId}">
<img class="Template" src="${tegaki.getImg(0).template.fileName}_60.jpg" onerror="this.onerror=null;this.src='http://img01.pipa.jp/tegaki/img/DefaultTemplateNotFound.png_45.jpg'" /></a>
#end
#end

#foreach($tag in $tegaki.tagList)
<a href="../VSearchBlogByTagS.jsp?GD=${tag.tagId}">
<img class="Tag" src="${tag.fileName}" onerror="this.onerror=null;this.src='http://img01.pipa.jp/tegaki/img06/DefaultTag.gif'" /></a>
#end

</div>
<div class="BlogCmd">
#if($tegaki.themeId==6 || $tegaki.themeId==7)
<a class="Quote" href="../VEditBlogS4.jsp?QD=$tegaki.tegakiId">引用してブログをかく</a>
#end

<a class="EditHeartIconHeader cboxElement" href="../VCreateDotS4.jsp?M=0&ID=$user.userId&TD=$tegaki.tegakiId">
<img src="http://img01.pipa.jp/tegaki/img/EditHeartIcon.gif" border="0" /></a>
#foreach($heart in $heartList)
<a href="../VBlogDotListS.jsp?PG=0&ID=$user.userId&TD=$tegaki.tegakiId" target="_blank">
<img class="BlogCmdHeartIcon" src="$heart" border="0" /></a>
#end
</div>
</div>

<div class="BlogDetail">
<div class="blogtitle">
$tegaki.title
</div>
<img src="${tegaki.getImg(0).fileName}" class="BlogImgFull" alt="$tegaki.title" />
</div>

</div>
<div class="CommentNameCmd"></div>

$comments

<table class="NaviBar">
<tr>
<td class="Navi_N">
#if($tegakiNext.tegakiId > 0)
<a href="${tegakiNext.tegakiId}.html">< New</a>
#end
</td>
<td class="Navi_C">
<a href="index.html">Blog list</a>
</td>
<td class="Navi_P">
#if($tegakiPrev.tegakiId > 0)
<a href="${tegakiPrev.tegakiId}.html">Old ></a>
#end
</td>
</tr>
</table>
</div>
<div class="BlogThumbFullEnd"></div>
</div>
</div>
</div>

<div id="SideBar">
<div id="SideBarTitle"></div>

<div class="SideBarItem">
<div class="MyNickname">
<a href="../$user.userId/">$user.nickname</a>
</div>

<div class="MyProfileCmd">
#if($thisPage.isMyPage == false)
#if($thisPage.isMyFavoritePage == false)
<a href="$addFavoriteURL" class="CmdButton">お気に入り</a>
#else
<span class="CmdButtonDisable">お気に入り中</span>
#end
#if($thisPage.isMyFriendPage == false)
<a href="$requestFrinedURL" class="CmdButton">友達申請</a>
#else
<span class="CmdButtonDisable">友達申請済</span>
#end
<a href="$sendMessageURL" class="CmdButton">メッセージ</a>

#else
<span class="CmdButtonDisable">お気に入り</span>
<span class="CmdButtonDisable">友達申請</span>
<span class="CmdButtonDisable">メッセージ</span>

#end
</div>

<div class="WidgetPane">
<div class="WidgetTitle">ブログカテゴリ</div>
<div class="WidgetItemList">$categoryList</div>
</div>

<div class="WidgetPane">
<div class="WidgetTitle">よく使うタグ</div>
<div class="WidgetItemList">$blogNumByTag</div>
</div>

<div class="WidgetPane">
<div class="WidgetTitle">リンク</div>
<div class="WidgetItemList">
<a href="#" title="リンク1">リンク1</a><br>
<a href="#" title="リンク2">リンク2</a><br>
<a href="#" title="リンク3">リンク3</a><br>
</div>
</div>

</div>

</div>

</div>

$wrapperFooterPart
</div>
$bodyFooterPart
</body>
</html>