« コインランドリー店にゆく | トップページ | 秋ですか »

ココログ・プロでサイドにモブログ表示

今更ですが、モブログやりたくなりまして。
でも他社のサービスはロゴ表示とかが何となく……。
せっかくプロ使ってるんだから何とかうまくできないかなあ、と
あちこちググってみたのですが、結局ココログでのうまい方法は
見つけられずにいたのですよ。

したら、MTのほうでいい方法が見つかりまして、これを
ココログで応用したらうまくいったのでメモしときます。
既出でしたら無視してやってくださいませ。

参考にしたのは
dh's memorandaさんのところのmoblog template samplesです。
感謝感謝でございます。

手順としては、

1.モブログ専用の新しいウェブログを作る。
2.新しいウェブログで呼び出し用テンプレートを作る。
3.メインサイトで呼び出す。

以上です。
テンプレートを作るので、プロ限定になってしまいますが…m(_ _)m
あと、メインサイトも上級者向けテンプレートを使用している必要があります。
なお、dh's memorandaさんが紹介してくださってるメインページの書き換えは、見た目をどうするかということだと思うので省略させていただきます。
ここでは単純に別のウェブログの最新画像をサイドに載せる、ということだけに特化させてます。


1.モブログ専用の新しいウェブログを作る。

これは簡単にできますよね。私は

http://sigure.cocolog-nifty.com/moblog

というウェブログフォルダを作って「更新通知をしない」に設定しました。
(テスト中恥ずかしいですからね^^;)
で、「コントロールパネル」の【プロフィール】-【モバイル設定】でデフォルトの投稿先を新しいウェブログに変更して保存します。
 ※モブログ設定について詳しくはココログヘルプをどうぞ。

できたら実際にモブログができるかどうか試してみてください。
うまくできたら次へ。

2.新しいウェブログで呼び出し用テンプレートを作る。

まず、新しいウェブログのデザインを「上級者向けテンプレートセット」に変更します。
で、編集画面で「新しいインデックステンプレートを作成する」をクリック。
テンプレート名は「MoblogNow」とか適当に、
出力ファイルは「now.html」というように拡張子をつけてください。
「インデックステンプレートを公開する際~」云々はチェックしたまま。
テンプレートの内容には、下記を記入します。

<MTEntries lastn="1">
   <div class="photobody">
      <div class="phototitle">
           <a href="<$MTEntryLink$>"><$MTEntryTitle$>
      </div>
      <$MTEntryBody$></a>
      <div class="photodate">
          <$MTEntryDate format="%b %e, %Y"$> 
          <$MTEntryDate format="%H:%M"$>
      </div>
   </div>
</MTEntries>

で、保存・反映させます。

3.メインサイトで呼び出す。

メインのウェブログのデザイン編集に移ります。
テンプレート「sidebar」を開き、任意の場所に

<!--#include virtual="呼び出しテンプレートの相対パス" -->

を記入します。相対パスは、先ほど作った例の場合、

<!--#include virtual="/moblog/now.html" -->

というようになります。

で、保存・反映させます。
モブログのタイトル・本文・画像・投稿日時が表示されたらOKです。
まだ表示がぐちゃぐちゃだと思いますので、スタイルシートで制御します。
以下のような感じでCSSファイルに追加します。

.photobody {
	font-size: x-small;
	color: #000000;
	padding-left: 30px;
	margin-bottom: 10px;
	}
.photobody img {
	border-top: solid 1px #C0C0C0;
	border-left: solid 1px #C0C0C0;
	border-bottom: solid 1px #808080;
	border-right: solid 1px #808080;
	background-color: #FFFFFF;
	padding: 4px;
	}

この辺の仕様はお好みで。
呼び出しテンプレートのほうでタイトルや投稿日時にclass属性をつけているので、それを使ってもいいと思います。

さらに、私のように「サイドバーには本文は表示させたくない」という場合、投稿時がちょっと面倒なんですが以下の方法を。

投稿文作成の際(携帯送信時)に、

<div class="caption">本文</div>

というように(クラス名は任意です)タグを入れるようにします。
携帯の辞書とかテキストメモとかでタグを登録しておくと便利です。
で、メインサイトのスタイルシートに、

.photobody .caption {
	display: none;
	}

という風に追加すれば、メインサイトのサイドバーでは本文は消えて表示されます。
(もちろん、携帯送信時に本文なしのタイトル勝負! てのも当然アリだと思いますがw)

以上です。結構簡単ですよね。
簡単すぎてホントにいいのかいまいち不安なのですが(おい)。
<!--#include virtual=""-->は、マイリストの呼び出しにも使われてるので問題ないかなと思ってますが、重くなったら外す方向で(^_^;)。
あと、サイドバーへの表示は、いずれココログが機能強化されたら実装されると思うので、それまでのつなぎということでやってこうと思います。

例のごとく、変なところがありましたら教えてやってください。
また他に便利な方法をご存じの方がいらしたら、どうぞご教示くださいませませm(_ _)m。

|

« コインランドリー店にゆく | トップページ | 秋ですか »

カスタマイズ」カテゴリの記事

コメント

コメントを書く



(ウェブ上には掲載しません)


コメントは記事投稿者が公開するまで表示されません。



トラックバック

この記事のトラックバックURL:
http://app.cocolog-nifty.com/t/trackback/1109/1652152

この記事へのトラックバック一覧です: ココログ・プロでサイドにモブログ表示:

« コインランドリー店にゆく | トップページ | 秋ですか »