>--> Search results for 関連記事 | クリボウの Blogger Tips

クリボウの Blogger Tips

Google Blogger の使い方、カスタマイズ方法、各種ツールなど、
Blogger 関連の役立つ情報を紹介しています。

Home > Search results for 関連記事

Search results for 関連記事

Blogger で「関連記事」リストを表示する 2 つの方法

Posted at: 2009-08-04 Label: , 17

ブログの投稿の最後に、その投稿に関連する投稿のリストを表示する方法です。
今回参考にさせてもらったのは、

の 2 ブログ。
Blogger カスタマイズサイトがいくつも出てきて、脅威を感じているところです(汗)。


ラベルごとの関連記事

最初は

で紹介されている方法。
写真日記にとりつけてみたところ、下の画像のようになりました。



記事単独のページにラベルごとに数件のリンクを表示します。
上の例では、この下に「Nikon D80」ラベル、「昆虫」ラベル、「蝉」ラベルの投稿へのリンクが表示されました。
ラベルやラベルごとのリンク数は、ユーザーが指定することが可能です。

導入方法

1.Blogger 管理画面「レイアウト > HTML の編集」ページで「ウィジェットのテンプレートを展開」にチェックを入れます。

2.テンプレートのテキストエリアから、
<b:includable id='main' var='top'>
を見つけ出し、その前の行に
<b:includable id='related-posts' var='posts'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='similiar'>
<div class='widget-content'>
<h3>Related Post:</h3>
<div id='data2007'/><br/>
   <script type='text/javascript'>

   var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
   var maxNumberOfPostsPerLabel = 6;
   var maxNumberOfLabels = 3;

   function listEntries10(json) {
   var ul = document.createElement(&#39;ul&#39;);
   var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ? 
                 json.feed.entry.length : maxNumberOfPostsPerLabel;
   for (var i = 0; i &lt; maxPosts; i++) {
   var entry = json.feed.entry[i];
   var alturl;

       for (var k = 0; k &lt; entry.link.length; k++) {
         if (entry.link[k].rel == &#39;alternate&#39;) {
           alturl = entry.link[k].href;
           break;
         }
       }
       var li = document.createElement(&#39;li&#39;);
       var a = document.createElement(&#39;a&#39;);
       a.href = alturl;

if(a.href!=location.href) {
   var txt = document.createTextNode(entry.title.$t); 
   a.appendChild(txt);
   li.appendChild(a);
   ul.appendChild(li); 
}
   }
     for (var l = 0; l &lt; json.feed.link.length; l++) {
       if (json.feed.link[l].rel == &#39;alternate&#39;) {
         var raw = json.feed.link[l].href;
         var label = decodeURIComponent(raw.substr(homeUrl3.length+13));
         var txt = document.createTextNode(label);
         var h = document.createElement(&#39;b&#39;);
         h.appendChild(txt);
         var div1 = document.createElement(&#39;div&#39;);
          div1.appendChild(h);
         div1.appendChild(ul);
         document.getElementById(&#39;data2007&#39;).appendChild(div1);
       }
     }
   }
   function search10(query, label) {

   var script = document.createElement(&#39;script&#39;);
   script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
    + label +
    &#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
   script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
   document.documentElement.firstChild.appendChild(script);
   }

   var labelArray = new Array();
   var numLabel = 0;

   <b:loop values='data:posts' var='post'>
     <b:loop values='data:post.labels' var='label'>
       textLabel = &quot;<data:label.name/>&quot;;
     
       var test = 0;
       for (var i = 0; i &lt; labelArray.length; i++)
       if (labelArray[i] == textLabel) test = 1;
       if (test == 0) { 
          labelArray.push(textLabel);
          var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ? 
                 labelArray.length : maxNumberOfLabels;
           if (numLabel &lt; maxLabels) {
             search10(homeUrl3, textLabel);
             numLabel++;
          }
       }
     </b:loop>
   </b:loop>
   </script>
</div>
</div>
</b:if>
</b:includable>
というコードを貼り付けます。コードを見つけるのにはブラウザの検索機能が便利です。赤字の部分は、上からタイトル、ラベルごとの投稿リンク数、表示ラベル数を表していて、ユーザーで変更が可能です。

3.次に、テキストエリアから
<div style='clear: both;'/> <!-- clear for photos floats -->
というコードを見つけ出し、その次の行に
<b:include data='posts' name='related-posts'/>
を挿入します。

これでおしまい。ちなみに

ラベルが日本語だと下の画像のようになり、正常に表示されません。
但し、最大の問題は日本語のラベルが文字化けすること。

という問題があったため、日本語ラベル名の URL エンコードをデコードするよう、コードを修正しています(青字部分)。なので、ブログの投稿に日本語ラベルをたくさんつけていても大丈夫。


3行コピペでできる方法

2つめは、

で紹介されている方法。
本家のプロジェクトページはこちらです。

それを写真日記にとりつけてみたのがこの画像です。



重複するラベルの多い順にリンクを並べているようで、元の投稿「蝉の抜け殻」に対して、かなり正確な関連記事が表示されています。

導入

1.Blogger 管理画面「レイアウト > HTML の編集」ページで「ウィジェットのテンプレートを展開」にチェックを入れます。

2.テンプレートのテキストエリアから、
<div style='clear: both;'/> <!-- clear for photos floats -->
を見つけ出し、その次の行に
<div id='related_posts'/>
というコードを挿入します。コードを見つけるのはやっぱりブラウザの検索機能で。

3.次にテキストエリアの最後の方から、
</body>
</html>
というコードを見つけ、その前の行に
<script type='text/javascript' src='http://www.google.com/jsapi' />
<script type='text/javascript' src='http://brps.appspot.com/brps.js' />
というコードを貼り付けます。

これでおしまい。簡単です。

またオプションとして、タイトルと投稿リンクの表示数を指定することもできます(標準は「Related Posts」で 10 件)。
その場合は、3で貼り付けるコードを
<script type='text/javascript' src='http://www.google.com/jsapi' />
<script type='text/javascript'>
window.brps_options = {"title": "<h3>関連記事</h3>", "max_results": 5}
</script>
<script type='text/javascript' src='http://brps.appspot.com/brps.js' />
という風に、書き換えてください。

Blogger 関連のつぶやき 2012-01

Posted at: 2012-01-31 Label: , 2

Google+ ページ「クリボウの Blogger Tips」で流した今月の Blogger 関連のつぶやきを、ここにまとめておきます。リアルタイムで読みたい!という人は、ぜひこの Google+ ページをサークルに追加してください。

先月から始まった取り組みですが、こうやって毎月、記事にしきれなかったニュースなどを載せていこうと思います。今年もこのブログ、Google+ ページともども、どうぞよろしくお願いいたします。

Blogger 関連のつぶやき 2012-06

Posted at: 2012-07-07 Label: 1

Google+ ページ「クリボウの Blogger Tips」および、Facebook ページ「クリボウの Blogger Tips」で流した先月の Blogger 関連のつぶやきを、ここにまとめておきます。

リアルタイムで読みたい!という人は、上記リンク先からぜひ、サークルに追加したり「いいね!」したりしてください。


このブログでは毎月一度、記事にしたネタや記事にしきれなかったニュースを載せています。最新のニュースについては、Google+ ページもしくは、Facebook ページでご確認ください。

Blogger 関連のつぶやき 2013-05、2013-06、2013-07、2013-08

Posted at: 2013-09-08 Label: 7



Google+ ページ「クリボウの Blogger Tips」および、Facebook ページ「クリボウの Blogger Tips」で流した 2013 年 5 月から 8 月までの Blogger 関連のつぶやきを、ここにまとめておきます。

(普段は 1、2 か月分でまとめて記事にしているんですが、前回まとめるのをすっかり忘れていました…。すみません。)

これらの Blogger 情報をリアルタイムで読みたい!という人は、上記リンク先からサークルに追加したり「いいね!」したりしてください。Twitter アカウントフィードも開設しているので、そちらもぜひご活用ください。



このブログでは毎月もしくは隔月で、記事にしたネタや記事にしきれなかった Blogger 関連ニュースを掲載しています。最新のニュースについては、Google+ ページFacebook ページTwitter アカウントフィードのうち、利用しやすいもので確認してください。

Blogger 関連のつぶやき 2012-05

Posted at: 2012-06-02 Label: 3

Google+ ページ「クリボウの Blogger Tips」および、Facebook ページ「クリボウの Blogger Tips」で流した先月の Blogger 関連のつぶやきを、ここにまとめておきます。

リアルタイムで読みたい!という人は、上記リンク先からぜひ、サークルに追加したり「いいね!」したりしてください。

先月は、他のブログサービスからの引っ越しネタが多かったですね。別途こちらにもまとめているので、参考してもらえたらと思います。

このブログでは毎月一度、記事にしたネタや記事にしきれなかったニュースを載せています。最新のニュースについては、Google+ ページもしくは、Facebook ページでご確認ください。

ブログランキングサイトを活用する

Posted at: 2006-01-06 10

今回は「ブログランキングサイト」について。結構この手のサイトがあるのでみなさん聞いたことがあると思います。クリボウ自身が参加しているのを(思い出しながら)ここに挙げてみると…。

  • Blog Ranking クリック型。サイト・記事検索。名称は「人気 blog ランキング」かも。185,629 件。
  • にほんブログ村 クリック型。サイト・記事検索。トラックバックテーマ。プロフィール。19,940 件。
  • くつろぐ クリック型。サイト検索。プロフィール。14,595 件。
  • 週刊 ブログ王 クリック型。サイト検索。14,022 件。停止しているような…。
  • ブログランキング ドット ネット スクリプト型。サイト・記事検索。トラックバックテーマ。???件
  • ranQ クリック型。サイト検索。プロフィール。更新通知メール。13,135 件。
  • blog-Navi クリック型。サイト検索。6,600 件。
結構ありますね…。数字は登録ブログ数です。

ランキング機能
どのサイトも名前のとおり、登録されているブログを人気順にランキングしてくれるんですが、どうやってランキングをつけているかというと、基本的には、各ブログからそのサイトにリンクで飛んできた人の数を数えるということをしています。上の項目にクリック型と書いたのが、その方法をとっているサイト。
スクリプト型と書いた「ブログランキングドットネット」はランキングのつけ方が他とは違って、指定されたスクリプトをブログに貼り付けておくことで、誰かがブログを見てくれたらそのユニークビジター数をそのままカウントしています。更新頻度もポイントに加算されるとか。結構おもしろい評価の仕方ですね。ランキングサイトを見に行かなくても、順位が画像でわかるので、クリボウのお気に入りです。

検索機能
上の項目で、検索機能についても記してみましたが、分かりますでしょうか?サイト検索というのは、自分が登録したブログ情報や順位が検索結果として出てくるものですが、記事検索は、ブログの発行している RSS(Blogger は ATOM)をランキングサイトで参照して、各記事の内容を検索結果として表示する機能です。サイト検索にせよ、記事検索にせよ、登録していないブログは検索結果には現れてきませんので、検索結果に載るためにブログランキングサイトに登録するという手もアリだと思います。Blog Ranking に関していえば、登録ブログだけで 18 万件、訪問者は…、ともかくバカにできない数字かと。
また、新しい記事を見つけるために、たいていのサイトで更新 PING を受け付けていますので、新しい記事を書いた際は積極的にこれらのサイトに PING を打つようにしましょう。

プロフィール機能
ブログのカテゴリーや人気ではなくて、ブログを書いている人をターゲットに検索したり、コミュニケーションをとることができるのがプロフィール機能。どこどこに住んでいる、何歳ぐらいのブロガーを探すということが出来たりするようですが、クリボウとしては、書いている人自体にはあまり興味が湧かないので、縁のない機能です。

トラックバックテーマ
ランキングサイトに登録されている人が自由にテーマを設定することの出来るトラックバックセンターです。そのテーマに関心があるブロガーが記事を書いてトラックバックしていくことで、関連性のあるブログ記事のタイトルがそこに並ぶことになります。ランキングサイトではありませんが、BlogPeople の トラックバックピープル(Blogger) を見てもらうと、どんなものかわかりやすいかと。
ランキングサイトでも同様の機能を備えているんですが、上記紹介したものの中には、トラックバックピープルのような、そのトラックバックたちを自分のブログに表示するための仕組みがないのが残念。せめて RSS を生成してくれれば表示できるんですがね…。

最後に
思いのほか長い記事になってきましたが、ブログランキングサイトでどんなことができるのか、イメージがつかめたでしょうか?クリボウ自身この記事を書いてきて再発見する部分がありましたが、結構色んな活用法があるので、ランキングサイトに登録しておいて損はナシ、だと思います。ぜひご活用下さいませ。

おまけ [読む]
実はこの記事は、@aka さんの記事を受けて書いたものなのです。
本当は、他のランキング・サイトと比べたりすべきだと思うのですが... クリボウさん、ランキング・サイトの紹介記事を書いてくれないかな..? (と振ってみる)
クリボウさんは、昔、いくつものランキング・サイトに入っていたけど、いつの間にかブログランキング ドット ネットだけになってる。もしよければ、そこら辺の裏事情などをエントリーにして下さらないかしらん > クリボウさん

たしかに、このブログでも上記ブログランキングサイトへのリンクを全て並べていた時期がありました。以下、クリボウのブログランキングサイト遍歴。

1.うじゃうじゃと、サイドバーにランキングサイトへのリンクを貼り付けている状態。バナーが中心。
2.「ランキングで上位に入るには、表示するサイトのリンクをどこか一つに絞った方がいいだろう」と、ブログランキングドットネットはブログの端っこに(クリック不要のため)、クリック型は一番登録者の多い Blog Ranking だけ残す。サイドバーがバナーで見づらくなっていたのもあり。
3.「どうしたらみんなリンクをクリックしてくれるのか」と、「役に立ったと思ったらクリック」「クリックありがとうございます」など、リンクに添えるテキストやバナーを色々工夫してみる。
4.結局クリック数も伸びず「ランキングが何だ、こんにゃろう」と開き直り、お願いしてクリックしてもらわなくてもいい気がしたりで、諦めてリンクをはずす。ブログランキングドットネットはそのまま。
5.テンプレートの記事フッターに少し余白が出来たので、リンク復活。あまり気張らずにのんびりリンクを置いておくのもいいかも知れない、などと。
6.@aka さんの記事発見、「にほんブログ村もよさそうだ」と参加。サイドバーにもリンクを2つ追加。現在に至る。

こんな感じだったと思います。ということでふり返ってみても、その時の気分気分で、つけたりはずしたりしているだけで、たいした理由はないようですね。

Blogger 関連のつぶやき 2011-12

Posted at: 2011-12-31 Label: , 11

Google+ ページ「クリボウの Blogger Tips」で流した今月の Blogger 関連のつぶやきを、ここにまとめておきます。リアルタイムで読みたい!という人は、ぜひこの Google+ ページをサークルに追加してください。

こうやって毎月、記事にしきれなかったニュースなどを載せていこうと思います。来年もどうぞよろしくお願いいたします。

Blogger 関連のつぶやき 2012-04

Posted at: 2012-04-30 Label: 3

Google+ ページ「クリボウの Blogger Tips」および、Facebook ページ「クリボウの Blogger Tips」で流した今月の Blogger 関連のつぶやきを、ここにまとめておきます。

リアルタイムで読みたい!という人は、上記リンク先からぜひ、サークルに追加したり「いいね!」したりしてください。

こうやって毎月一度、記事にしたネタや記事にしきれなかったニュースを載せています。Google+ ページFacebook ページともに、どうぞよろしくお願いします。

Blogger の robots.txt

Posted at: 2007-08-01 Label: 3

最近の Blogger 関連記事から

ちょっと気になった INTERNET Watch の記事。Google 運営の Blogger から SEO のヒントを得ようという内容です。

内容としては、色々とつっこみどころもあると思いますが(参考:kuroyagi さんのSEM酒場の記事)、クリボウが一番気になったのはこちら。
Bloggerではラベルという機能を使って記事をテーマごとに分類することができます。これもURLにはラベルの名前が反映されます。しかし、なんとSEOの基本と言われるtitleタグにはラベル名は表示されないのです。
「オーバーチューニングはマイナスですよ」というGoogleによる暗黙のメッセージが伝わってくるように感じられます。

タイトルにキーワードを含めるべきかどうかという以前に、このラベル別投稿一覧ページは Google のインデックスには載りません。Blogger ブログの robots.txt では、ラベル別投稿一覧ページは検索サイトのインデックスに追加しないようにと書かれていますので…。

Google のウェブマスターツールでもこの通り。



Blogger の仕様から Google の検索に対する考え方を読み取るとすれば、「オーバーチューニングはマイナスですよ」というより「同じ内容のページは要りませんよ」ということかなと思ったり。


Blogger ブログの robots.txt

あまり知られていないようなので、Blogger の robots.txt の内容の方も確認しておきます。このファイルはブログのルートディレクトリに置かれますが、Blogger が自動作成するもので、ユーザーは内容を編集することができません。その中身(クリボウの写真日記の場合)がこちら。

User-agent: *
Disallow: /search
Sitemap: http://kuribo-photo.blogspot.com/feeds/posts/default?orderby=updated


1.インデックス追加制限

全ての検索サイトクローラに対して 2 行目で、/search 以下のページをインデックスに追加しないように指定しています。これに該当する Blogger のページは、検索結果ページ、ラベル別投稿一覧ページ、年間投稿一覧ページ。つまり、メインページ、アーカイブページ、アイテムページ(記事単独ページ)以外のページということ。それらのページは検索サイトの結果には出てきません。

2.サイトマップファイルの通知

全ての検索サイトクローラに対して 3 行目で、ブログのサイトマップファイルを通知しています。指定されているのはおなじみの Blogger ブログのフィード(ATOM)ですね。Google 以外にも Yahoo!、Live Search、Ask.com といった検索サービスが、robots.txt からサイトマップファイルを見つけてインデックスに利用しているみたいです。

…ということで、Blogger の robots.txt についてクリボウが知っているのはこんなところです。他にも知っているという方はぜひ教えて下さいね。


参考記事:

Blogger の blogspot.jp リダイレクトに関していろいろ

前回、カスタムドメイン以外の Blogger ブログ(blogpot.com)が日本からのアクセスで blogspot.jp へリダイレクトされるようになった件について、記事にしました。

記事では、「大々的に blogspot.jp に URL が変わったことを知らせてしまった方がいいのかも」とか「各サービスで設定の変更が必要になりそう」と書きました。

が、その一方で、Blogger に国別リダイレクトが導入されて、閲覧者の国によってブログがリダイレクトされてしまうとはいえ、Blogger ブログの基本のドメインはあくまで blogspot.com だという思いもあり…。

blogspot.jp、blogspot.com のいずれかを取るべきか、またはうまく共存させていくべきなのか、まだ迷っている最中なんですが、この記事ではとにかく、これまでに得た情報をご紹介したいと思います。


data:post.canonicalUrl

まずは、外部サービスとの連携についてです。リダイレクトで URL が変わることによって、はてブ件数や Facebook のいいね!件数がリセットされる問題が各所で起きています。

そんな中、いろんなブログを見て回っているうちに、

という記事を見つけ、data:post.canonicalUrl という Blogger のテンプレート内で使える特別な情報タグ(データタグ)の存在を知りました。data:post.canonicalUrl は投稿ガジェット内で使える、投稿ページ URL を示すデータタグ。同様の data:post.url と異なるのは、必ず基本ドメインの URL を表示する点です。なのでたとえば、

のカスタマイズでいうと、はてなからデータを得るために使用している data:post.urldata:post.canonicalUrl に置き換えて使うことで、これまで blogspot.com で溜めたはてブ件数をリセットせずに表示したり、引き続き blogspot.com ドメインの投稿ページをブックマークしてもらったりすることができます。


data:blog.canonicalUrl、data:blog.canonicalHomepageUrl

もしやと思って調べてみると、ほかに data:blog.canonicalUrl というデータタグもありました。Blogger には data:blog.url という、現在見ているページの URL を示すデータタグがありますが、data:blog.canonicalUrl はその基本ドメイン版。

たとえば、クリボウの写真日記: 京阪電車の分岐
http://kuribo-photo.blogspot.jp/2012/02/blog-post.html
というページを見ている場合、data:blog.url はそのままの URL を示しますが、

data:blog.canonicalUrl
http://kuribo-photo.blogspot.com/2012/02/blog-post.html
を示します。

さらにさらに、ブログのトップページを表す data:blog.homepageUrl に対応するデータタグとして data:blog.CanonicalHomepageUrl というものも発見。これらのタグは、閲覧しているページの blogspot.com 版を「+1」してもらいたいとか、とにかくトップページの blogspot.com 版をブックマークしてほしいという場合に重宝するかと。


JavaScript でリダイレクト

先日のリダイレクトの説明記事に、コメントで教えてもらったのが次の記事です。

これは、「Disable Blogger Country Specific Domain Redirection」を翻訳し、blogspot.jp 用にスクリプトを書き直したものだと思います。読者が blogspot.com を開くと Blogger によって blogspot.jp へリダイレクトされますが、それを再び blogspot.com/ncr へリダイレクトするためのスクリプトになっています。/ncr をつけて blogspot.com に移動すると、一時的にリダイレクト機能が停止されるため、blogspot.com 上でブログを見てもらうことができます。

リダイレクトのリダイレクトについては Blogger(Google)の方針にそぐわないため、もしかするとなんらかのおとがめがあるかもしれません。導入はよって自己判断で。手順については、リンク先に丁寧に書かれているので、そちらを確認してください。

もし、上記スクリプトで問題がある場合は、クリボウもスクリプトを書いているので参考にしてもらえたらうれしいです。


Google Analytics でどちらもトラッキング

アクセス解析の Google Analytics では、blogspot.com、blogspot.jp どちらも同じアカウントでトラッキングできるようになっています。情報元はこちら。



Google Analytics サイトを「アカウント管理 > トラッキングコード」と進み「何をトラッキングしますか?」の項目で「複数のトップレベルドメイン」にチェックを入れて「保存」ボタンを押すと、blogspot.com も blogspot.jp も同じアカウントとして集計してもらえるとのこと。これはいいですね。


Zenback は blogspot.jp 用に

ブログに関連記事・キーワード、twitter・はてブでの言及などの情報欄を設置できるサービス Zenback では、スクリプトを blopspot.jp で取得し直して貼り付けることを推奨しています。

Bloggerのドメインが.comから.jpに変わって、Zenbackが動かなくなってしまった(「読込中」で止まる)方がいらっしゃるようです。

その場合、お手数ですが、http://zenback.jp/ にログインして再度新しいURLでスクリプトを取得しなおし、張り替えてくださいませ。

貼りなおすと、blogspot.com の情報も引き継げる模様です。というより、blospot.jp 用のスクリプトに変えても、はてブや twitter への問い合わせ自体は blogspot.com 対象で行っている(?)みたいです。


とりあえず、クリボウの現時点で知っている事柄はこれだけです。他にも情報をお持ちの方は、コメントなどで知らせてもらえるとうれしいです。


追記(2012-03-24):

Zenback サポートからリプライあり、

@kurikuribo 「.jp 用に変えても、.com 対象で行っているみたいです。 http://goo.gl/hwHib」の件、Zenbackはcanonicalタグを見ているので、canonicalに.comが指定されていれば、そちらのURLへの反応を表示しています。

だそうです。テンプレートから
<link href='...' rel='canonical'/>
みたいなコードを外したら、blogspot.jp 対象データが得られるのでは?と思いましたが、テンプレートのこの部分は、テンプレートタグ
<b:include data='blog' name='all-head-content'/>
によって Blogger 内部のデータが呼び出されているため、編集不可でした。


Grow! も blogspot.jp 用に

Grow! ボタンも Zenback と同様、
Bloggerのブログに設置したGrow!ボタンが、正しく表示されない不具合が発生しています。

Bloggerをお使いのユーザー様で Grow!ボタンが正しく表示されない場合は、Grow!のセッティングページから当該ボタンのドメインの値を 「●●●●●.blogspot.com」 から 「●●●●●.blogspot.jp」 に修正していただくことで、正常に表示されるようになります。

という風に、blogspot.jp 用コードへの貼り換えを推奨しているようです。

Blogger 関連のつぶやき 2012-07

Posted at: 2012-08-04 Label: 2

Google+ ページ「クリボウの Blogger Tips」および、Facebook ページ「クリボウの Blogger Tips」で流した先月の Blogger 関連のつぶやきを、ここにまとめておきます。

リアルタイムで読みたい!という人は、上記リンク先からぜひ、サークルに追加したり「いいね!」したりしてください。


このブログでは毎月一度、記事にしたネタや記事にしきれなかったニュースを載せています。最新のニュースについては、Google+ ページもしくは、Facebook ページでご確認ください。

Blogger 関連のつぶやき 2012-08

Posted at: 2012-09-02 Label: 2

Google+ ページ「クリボウの Blogger Tips」および、Facebook ページ「クリボウの Blogger Tips」で流した先月の Blogger 関連のつぶやきを、ここにまとめておきます。

リアルタイムで読みたい!という人は、上記リンク先からぜひ、サークルに追加したり「いいね!」したりしてください。


ちなみに、今回一番多く紹介したのがすなふ(梨音) さんの Sunabox というブログです。

thumbnailSunabox  

PC、Chrome、bloggerネタを中心にしながら、全然離れたところまで、何も気にせず書いていくブログです!!

Blogger のカスタマイズにとどまらず、インターネット、パソコン、書籍、日常雑感と、話題が多岐にわたります。かき氷の記事は圧巻。最近のお気に入りブログです。


このブログでは毎月一度、記事にしたネタや記事にしきれなかったニュースを載せています。最新のニュースについては、Google+ ページもしくは、Facebook ページでご確認ください。

Blogger にも「続きを読む」機能

Posted at: 2006-03-02 10

追記: Blogger の「続きを読む」機能については、
クリボウの Blogger 入門: Blogger にも「続きを読む」機能
にまとめてあります。最新の情報はそちらをご覧下さい。

ご好評いただいている「Blogger にも…」「Blogger でも…」シリーズなんですが、今回はトップページやアーカイブページに各記事の冒頭部分だけを載せて、記事の全文は記事単独ページで読んでもらう、いわゆる「続きを読む」「Read More」機能の導入方法を解説したいと思います。

この「続きを読む」機能は、Blogger の標準の機能ではありませんが、Blogger Help にちゃんと導入の仕方が書いてあります。 けれど内容がやはり「上級者向け」ということで少し難解なので(タイトルからして難しいですね…)、このブログであらためて紹介しようというわけなのです。


テンプレートの設定

1.表示切り替えスタイルシート
Blogger 管理画面「テンプレート」から、テンプレート head 要素内(<head></head> の間)に、次のコードを貼り付けます。他のスタイルシートとのかねあいもあるので、</head> の直前がいいかと。
<style type="text/css">
  <MainOrArchivePage>
    span.fullpost {display:none;}
  </MainOrArchivePage>
  <ItemPage>
    span.fullpost {display:inline;}
  </ItemPage>
</style>

2.「続きを読む」リンク
同じく「テンプレート」から <$BlogItemBody> を見つけ出し、その直後に次のコードを貼り付けます。
<MainOrArchivePage>
  <br />
  <a href="<$BlogItemPermalinkURL$>">[続きを読む]</a>
</MainOrArchivePage>
赤字の部分は「Read More!」など、好きな言葉でかまいません。テンプレートが設定できたら、ブログ全体を再構築してください。


記事を投稿するときにすること

投稿本文中の、トップやアーカイブページでは省略したい部分を <span class="fullpost"></span> ではさんで投稿します。はさむ部分は記事の途中から最後までになると思います。こんな感じ↓。
今回はトップページに各記事の冒頭だけ載せて、全文は記事単独ページで読んでもらう、いわゆる「続きを読む」「Read More」機能を解説したいと思います。
<span class="fullpost">この「続きを読む」機能は、Blogger の標準の機能ではありませんが、Blogger Help にちゃんと導入の仕方が書いてあります。……</span>


ちなみに

以上の手順で「続きを読む」機能が Blogger でも使えるようになると思います。ご不明な点はコメント欄にお願いします。
この「続きを読む」機能を導入すると、以降は投稿の際に省略する部分を意識する必要が出てくると思います。そこでお勧めなのが投稿フォーマットの編集。
新記事を投稿する際に最初から <span class="fullpost"></span> というコードが書いてあれば、省略部分の設定を忘れることもないし、コード入力の手間も省けるというわけ。
投稿テンプレートの設定は Blogger 管理画面「設定 > フォーマット」の「投稿テンプレート」欄で行えるので、上記のコードを入力しておくといいと思います。

参考:コンディショナルタグとスタイルシート
関連:投稿に表示/非表示のリンクを設定するにはどうすればよいですか

Blogger 関連のつぶやき 2013-01、2013-02

Posted at: 2013-03-03 Label: 4

Blogger Christmas Logo
(cc) tayzar44


Google+ ページ「クリボウの Blogger Tips」および、Facebook ページ「クリボウの Blogger Tips」で流した先々月と先月の Blogger 関連のつぶやきを、ここにまとめておきます。

リアルタイムで読みたい!という人は、上記リンク先からサークルに追加したり「いいね!」したりしてください。1 月からは、Twitter アカウントフィードも新設しています。そちらもぜひご利用ください。


このブログでは毎月か隔月で、記事にしたネタや記事にしきれなかった Blogger 関連ニュースを載せています。最新のニュースについては、Google+ ページFacebook ページTwitter アカウントフィードのいずれか利用しやすいもので確認してください。

© 2005-2014 Kuribo. Powered by Blogger.