2012年7月12日木曜日

Bloggerのラベルをカテゴリ別に整理する(ラベルの階層化)

Bloggerでカテゴリ別にラベルを管理したいと思い、暇に任せて自前でやってみた。
 jQuery?何それ?美味しいの?状態なので見苦しい事になってる気がするけど気にしない。^^;

仕様としては、ラベルの文字列が
  • カテゴリ/ラベルA
  • カテゴリ/ラベルB

こんな感になっていれば、文字列を/で分割してカテゴリ単位にまとめてしまおう、というもの。
こんな感じに。
  • カテゴリ
    • ラベルA
    • ラベルB
ついでにツリービューっぽくする。

テンプレート>HTML編集で、ウィジェットのテンプレートを展開にチェックを入れて、ラベルのウィジェットの箇所を探し出し、下記のソースと差し替える。
 #jQueryを導入すること
(2013/10/29)選択中のラベルのノードを開くように修正
(2014/06/18)フッターのラベルをサブカテゴリのみ表示するように修正
(2014/06/22)ラベルクラウドのラベルをサブカテゴリのみ表示するように修正
(2018/03/07)階層化されない場合の対応方法の記事を追加

<b:widget id='Label1' locked='false' title='カテゴリ' type='Label'>
<b:includable id='main'>
  <b:if cond='data:title'>
    <h2><data:title/></h2>
  </b:if>
  <div id='Label1Cover' style='display:none;z-order:-1;'>
  <div expr:class='"widget-content " + data:display + "-label-widget-content"'>
    <b:if cond='data:display == "list"'>
      <ul>
      <b:loop values='data:labels' var='label'>
        <li>
          <b:if cond='data:blog.url == data:label.url'>
            <span expr:dir='data:blog.languageDirection'><data:label.name/></span>
          <b:else/>
            <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
          </b:if>
          <b:if cond='data:showFreqNumbers'>
            <span dir='ltr'>(<data:label.count/>)</span>
          </b:if>
        </li>
      </b:loop>
      </ul>
    <b:else/>
      <b:loop values='data:labels' var='label'>
        <span expr:class='"label-size label-size-" + data:label.cssSize'>
          <b:if cond='data:blog.url == data:label.url'>
            <span expr:dir='data:blog.languageDirection'><data:label.name/></span>
          <b:else/>
            <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
          </b:if>
          <b:if cond='data:showFreqNumbers'>
            <span class='label-count' dir='ltr'>(<data:label.count/>)</span>
          </b:if>
        </span>
      </b:loop>
    </b:if>
    <b:include name='quickedit'/>
  </div>
  </div>
<script type='text/javascript'>
//ラベル階層化
$(function(){
    // 選択中のラベルを取得
    var selLabel = ""; 
    if($('.status-msg-body').length > 0)
    {
      selLabel = $('.status-msg-body').children('b').text();
    }
    var list = $('div#Label1 div ul > li');
    var dest = $("<ul style='display: none;'/>");
    var nodes = new Array();
    $(list).each(function(){
        var work;
        var selected = false;
        var targetText = "";
        if($(this).children('a').length>0){
            targetText = $(this).children('a').text();
            work = targetText.split("/");
            $(this).children('a').text(work[work.length-1]);
        }else{
            targetText = $(this).children('span:first').text();
            work = targetText.split("/");
            $(this).children('span:first').text(work[work.length-1]);
        }
        if(selLabel==targetText)
        {
            selected = true;
        }

        var key="";
        $(this).addClass("categoryLabel");
        var target=$(this);
        $(work).each(function(i){
            if (i == work.length-1){
                 if (key == ""){
                      dest.append($(target).clone(true));
                 }else{
                      nodes[key].append($(target).clone(true));
                 }
                 $(target).remove();
            }else{
                 var parent = null;
                 if (i>0){
                     parent = nodes[key];
                     key = key + "/";
                 }
                 key = key + work[i];
                 if (nodes[key] == null){
                      var item = $("<li class='categoryLabel'>" + work[i] + "</li>");
                      var temp = $("<ul style='display: none;'/>");                      
                      item.append(temp);
                      nodes[key] = temp;
                      if (parent == null){
                          dest.append(item);
                      }else{
                          parent.append(item);
                      }
                 }
            }
        });
        // ラベルを選択中の場合、該当ノードを表示する
        if(selected)
        {
            work = selLabel.split("/");
            key = "";
            $(work).each(function(i){
                if (i>0){
                    parent = nodes[key];
                    key = key + "/";
                }
                key = key + work[i];
                $(nodes[key]).css('display','block');
            });
        }
    });
    $('div#Label1 div ul').html($(dest).html());
});
//トグル処理
$(function(){
    var open = 'data:image/gif;base64,'+
        'R0lGODlhCQAJAJEAAP7+/oKCggICAgAAACwAAAAACQAJAAACEYyPoAvG614LQFg7ZZbxoR8UADs=';
    var close = 'data:image/gif;base64,'+
        'R0lGODlhCQAJAJEAAP7+/oKCggICAgAAACwAAAAACQAJAAACFIyPoAu2spyCyol7W3hxz850CFIA'+
        'ADs=';
    $('.categoryLabel:has(ul)')  
      .click(function(event){  
        if (this == event.target) {  
          $(this).children().toggle();  
          $(this).css('list-style-image',  
            ($(this).children().is(':hidden')) ?  
              'url(' + close + ')' : 'url(' + open + ')');  
        }  
      })  
      .css('cursor','pointer');
    $('.categoryLabel:has(ul)').css('cursor','pointer'); 
    // 子ノードの表示状態で初期表示アイコンを変更する
    var list = $('.categoryLabel:has(ul)');
    $(list).each(function(){
        if($(this).children().css('display') == 'none')
        {
            $(this).css('list-style-image','url(' + close + ')');
        }else{
            $(this).css('list-style-image','url(' + open + ')');
        }
    });
    $('.categoryLabel:not(:has(ul))').css({  
      cursor: 'pointer',  
      'list-style-image':'url(' + open + ')'  
    });  
    $('#Label1Cover').show();
});
// フッタの表示ラベルをサブカテゴリのみにする
$('.post-labels').children("a").each(function(){
    var work = $(this).text().split("/");
    $(this).text(work[work.length -1]);
});
// ラベルクラウドの表示ラベルをサブカテゴリのみにする
$(function(){
    $('.widget-content.cloud-label-widget-content').children().each(function(){
        $(this).children().each(function(){
            var work = $(this).text().split('/');
            $(this).text(work[work.length -1]);
        });
    });
});
</script>
</b:includable>
</b:widget>

42 件のコメント:

  1. はじめまして。
    こちらのソースを使わせていただきましてとても重宝しております。
    一つ質問がございます。
    上記をコピペして利用しておりますが、親から1階層下のラベルたちが親と同列に並んでしまいます。
    貴殿のHPのように、親の下の子が1段下がるように表示するには何か書き足すことが必要でしょうか?

    返信削除
  2. はじめまして。

    貴殿のブログのスタイルで、ul li のマージンを無くすような記述はありませんか?φ(^_^;)

    下記のサイトを参考にスタイルを見直してみて下さい。
    http://www.tagindex.com/stylesheet/list/margin_padding2.html

    返信削除
  3. ツリーの開閉機能をなくして、全階層を表示させる方法はないですか?
    教えていただければ幸いです。

    返信削除
    返信
    1. naocoさん、はじめまして。

      75行目の
      var temp = $("<ul style='display: none;'/>");

      var temp = $("<ul />");
      にすれば、全部展開された状態で表示されます。

      更にクリックで開閉を止めるのであれば、
      97行目から104行目を削除してみて下さい。

      削除
    2. とってもピンチさん

      お礼が遅くなり申し訳ありません。

      教えていただき、ありがとうございます!!
      嬉しいです。助かります。

      今からやってみますね。

      削除
  4. こんにちは

    もしお分かりになれば教えて頂きたいのですが、
    階層を開いてラベルをクリックしてそのページに行ったら、
    開いた階層が閉じてしまいますよね。
    ラベルクリックでそのページに飛んでも、飛ぶ前の
    階層の開いた状態と同じ状態に保つ事はできないのでしょうか?

    返信削除
  5. たびたびすみません。

    ラベルガジェットを2つ以上運用するする場合、階層化するソースを2つコピペしても1つしか動作しませんでした。もう1つはトグルが開かない状態になります。
    もし複数でも上手く動作するようなやり方をご存知でしたらお教え頂けると大変助かります!

    返信削除
    返信
    1. いおさん、こんにちは。

      ラベルを選択中のノードを開くようにソースを修正しました。
      既に反映してありますので動作を確認してみて下さい。

      2つ以上設置する場合、試してませんが、ソース中に出てくる、cssのcategoryLabelというクラス名を変更してみて下さい。

      削除
    2. とってもピンチさん

      教えてくださりありがとうございます!
      ページ移動後も直前のラベルの開閉が再現されたままなのは実現できました。

      ラベルガジェット2つ運用の方ですが、一方のラベルガジェットに含まれるcategoryLabel(6箇所)を適当な文字列に変えてみましたが、うまく行きませんでした。ラベルタイトルだけ残って中身が消えてしまいました。

      やっぱり無理なんですかね・・・^^;

      削除
    3. いおさん、こんばんは。

      テキトーなコメントをして申し訳ありませんでした。^^;
      時間がとれたので2つ設置する方法を確認しました。
      記事のソース中に5箇所あるLabe1をLabel2に全て置き換えて設置すれば正常に動作します。
      (5箇所のうち2つはLabel1Coverなので注意して下さい)
      テキストエディタなどで一括置換すればOKです。

      削除
    4. とってもピンチさん

      え・・・テキトーだったんですか!
      でも私も唐突に質問しているので・・・^^;
      答えて頂けるだけありがたいと思っています。

      2つめのラベルガジェットのLabe1(5箇所)をLabel2に変えるのは、実は最初に質問する前に、怪しそうなので自分で試していたのですが駄目でした。今回新しいソースを貼付けた上で、再度試してみましたがやはり駄目でした。ラベル2の方は正常動作しますが、ラベル1はトグルをクリックしても何の反応もない状態です。

      とってもピンチさんは正常動作しているということは、使用しているテンプレートの違いが原因なのでしょうかね・・・

      結局、categoryLabelは関係ないのですよね?

      削除
    5. いおさん、こんばんは。

      あ、確かに1つ目がダメですね。。。
      で、Label1をLabel2に変えるのと、categoryLabelをcategoryLabel2に変えれば正常に動作します。
      # 今、このブログも2つ貼り付けてあります。

      削除
    6. とってもピンチさん

      教えて頂いた通り、2つの項目の名前を変えたら正常に動作しました。ありがとうございます!今更ですみませんが、使わせて頂いてもよいのでしょうか?

      削除
    7. 全然OKですよー。
      ただ記事にしてソースとか載せるなら、この記事へのリンクをしておいて下さい。
      単純にご自身のブログに適用するだけならリンクは不要です。

      削除
  6. とってもピンチさん

    寛大なお返事ありがとうございます!ソースを載せるとかそういうサイトではないのでご安心ください。実は階層化について色々調べている時、とってもピンチさんが無断転載で嘆かれているサイトも訪問していました。でもどこも転載っぽくて、質問しても駄目だろうなぁと思っていたのですが、唯一、とってもピンチはご自身でソースを書かれているのが明らかだったので、この人しかいない!と思い質問してしまった次第です。結果、とてもご親切に対応して下さり、本当に助って感謝してます。この度は貴重なお時間を割いて頂き、本当にありがとうございました。

    返信削除
    返信
    1. すみません。上記返信でお名前をコピペしてたら一部「さん」が抜けて呼び捨てになってしまいました。失礼しました。

      削除
    2. 度々すみません。まだ2つ以上のラベルガジェットの運用はしていませんが、使わせて頂いてるサイトをお伝えいたします(名前リンク)。
      運営者の名前違いますが気にしないでください^^;

      削除
  7. Very Pinch様
    非常に参考になる記事、ありがとうございます!

    ただ、さっそくソースを自分のブログに適応してみたのですが、
    なぜか親子それぞれのカテゴリの先頭にプラス、マイナスアイコンが表示されません。
    いろいろ調べてみたのですが、分からず。。

    もし解決方法をご存知であれば、
    ご面倒ではございますが、ご教授いただきたいです。

    宜しくお願い致します。

    返信削除
    返信
    1. 拝見したところ、 リストのインデントも無くなっているので他のCSSでul li に対して指定しているスタイルがあるはずなので、それを外してみて下さい。

      削除
    2. 恐らく、このQ&Aが参考になると思います。
      http://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q1378188793

      削除
    3. Very Pinch様
      ご返信が遅くなってしまい、大変申し訳ございません。。
      回答いただき、誠にありがとうございます!

      なるほど、知恵袋の方も参考にしながら修正してみます。
      ありがとうございました!

      削除
  8. ブログ初心者です。
    左に+や−などの記号がありますが、これらを消したい場合はどうすればいいでしょうか?また罫線に変える場合にはどうしたらよいか教えて下さい。

    返信削除
    返信
    1. cssでlist-style-imageを変更している箇所を全て削除すれば、+や-は表示されなくなります。
      +や-の代わりに罫線(たぶん、├ これの事だと思いますが)にするなら、そのような画像を作ってbase64でエンコードしたものをopen や close の変数に入れておけば良いと思います。
      が、どちらにしてもjQueryを使ったjavascriptやcssの知識が必要になります。

      削除
    2. お忙しい所貴重な時間を割いて頂き、有難うございます。
      何分知識が乏しいので教えて頂き感謝します。
      教えられた箇所を削除してみます。有難うございました。

      削除
  9. ピンチ様、はじめまして。

    サイト拝見させていただきました。

    14ステラは世界最高補だそうであのシルキーさは他とは比べられませんね。

    店頭でしかさわったことはないですが….

    メーカーメンテで3週間以内だと早いほうですかね?1ヶ月以上なんて話もよくききます。


    サイトへはbloggerのラベルの階層化について調べている内にたどりつきました。

    私も釣行記をつけようと思うのですが、ラベルについて2.3お伺いしたいことがございます。

    カテゴリーの構造としては

    カテゴリー
    (親)東京/(子)隅田川 東京/荒川 東京/江戸川 
    (親)千葉/(子)外房 千葉/内房
    (親)タックル/(子)ロッド タックル/リール タックル/ルアー
    (親)その他

    のようにしたいと思っております。


    ・ 基本的にはピンチ様のサイトの階層をそのまま利用させていただけたらと思っているのですが、この設定にした場合に親ラベル自体にリンクをつけることは可能でしょうか?上記だと東京自体にもリンクがあり、親ラベルが東京のもの(隅田川・荒川・江戸川)すべてを表示させる。展開は横の+にて実行というように。
    これは難しいなら 東京/東京 というラベルを作成して対応したいと思っています。

    ・ ピンチ様のソースは記事に設定したすべてのラベルに適応されるのでしょうか?
    一部に適応させることは可能でしょうか?
    タックルの紹介にて記事にタックル/ルアー,シマノなどのラベルをつけカテゴリ階層にはルアーのみを表示。他にラベルクラウドを設置し記事の下とクラウドにはタックル/ルアー・シマノ共に表示するようにしたいと思っております。

    ・ 記事に”/”で区切らないラベルを設定した場合は親ラベルとなるのでしょうか?

    利用させていただく立場でありながら質問などと厚かましい限りですが、知識がなく困っています。

    気が向いたときにでもお返事、ご教授頂ければ幸いで御座います。

    何卒宜しくお願い致します。

    返信削除
    返信
    1. boroさん

      コメントに今日気が付きました。(^_^;)

      カテゴリっぽく表示させてますが、正体?はただのラベルですので、親カテゴリを選択して全て表示させるような機能はありません。
      表示させたい単位でラベルを設定して下さい。

      ですので、東京/東京とするか、生き別れになってしまいますが、東京,東京/隅田川 のように東京というラベルを設定するしか方法がありません。

      またBloggerのウィジットのLabel1で表示されるラベル全てが対象になります。
      (ウィジットにLabel2を追加した場合は、そちらは対象にはなりません。)
      特定のラベルのみを非表示にする場合、ソースの修正が必要です。

      ラベルに区切り文字の/が存在しない場合は、そのラベルがそのまま表示されます。

      それと、記事の末尾に表示される ラベル一覧でサブカテゴリのみを表示するように処理を追加しておきました。

      削除
    2. Very Pinch様

      ご回答いただきありがとう御座います。

      修正版使わせていただきました。
      今回の修正によりフッター周りもスッキリしてほぼ理想どおりのものがつくれそうです。

      表示対象についてはレアウトで選択できますね。
      試してみれば分かることを聞いてしまい申し訳ありませんでした。


      重ねての質問で申し訳ないのですが
      このソースでラベルを”/”で左右に分け、表示・非表示を指定しているのはどの部分になるのでしょうか?

      ラベルクラウドも設置しており、今回修正部分のフッターのようにサブカテゴリのみを表示したいと思っております。

      ラベルクラウドウィジェットの最後にピンチ様のソースの40.58行目のスクリプト?を入れ、その間に今回追加分の153-156行目(post-label を labelに変更)を入れてみたのですが上手くいきません。

      調べてみるとsplitにより”/”で分けているが表示する部分・しない部分の指定が抜けているのかな…..と。

      ココかと思う部分を追加してみてはいるのですが、、、

      ズブの素人ですのでまったくの見当違いのことをしているのかもしれません……

      ダラダラと作成しており、急ぐものでは御座いませんので、こちらについても気が向いた際にご教授頂けないでしょうか?

      削除
  10. boroさん
    ラベルクラウドの表示ラベルをサブカテリのみ表示するようにしてみましたので参考にして下さい。

    >post-label を labelに変更

    HTMLの構成や割り当てられているスタイルのクラスが違うので、出来ません。
    詳しくは「jQuery セレクタ」でgoogle先生に問い合わせてみて下さい。
    またHTML構成やどんなスタイルが適用されているかを確認するには、Webページを右クリックして「ソースを表示」で確認するか、IEならF12を押して開発者ツールを表示するかFirefoxならFireBugなどの開発者用のプラグインを使うと幸せになれます。

    返信削除
    返信
    1. Very Pinch様 こんばんは。

      なんと、ラベルクラウドにも対応したものを作成していただきなんとお礼を申上げてよいやら......

      完全に思い通りのラベルにすることができました。

      ありがとうございます。


      ソースを表示って面白いですね。

      デザインなど面白いと思っていたサイトなどで試すとイロイロなことがわかります。

      まだまだ読み取れる情報は少ないのですが、要素の検証と合わせて使うととても勉強になりそうです。

      セレクタについては私にはまだ難し過ぎますが。


      カテゴリが上手くいって俄然やる気がでてきました。

      ....まだ移転の準備もしていないのですが....


      デザインセンスなんて皆無なので自分の使いやすいように作っていこうと思います。

      本当にありがとうございました。

      削除
  11. Very Pinch様

    はじめまして。
    bloggerでは諦めるしかないと思っていたラベルの整理でしたが、Very Pinch様のおかげで希望を見いだせました。さっそく適用させて頂きました。

    ところが、トグルスイッチとツリー構造は上手く表示出来ましたが(凄い!)いざラベルをクリックして該当ページに入ると、階層が閉じてしまいます。確か昨年この症状でお尋ねの方がいらして、現在は改良済みだと拝見しました。

    もしテンプレートにより何らかの変更が必要なのなら、是非ご教授頂ければと思います。お手数ですが、宜しくお願い致します。

    返信削除
    返信
    1. mugibosiさん

      貴殿のブログを拝見しました。
      このブログと適用しているテーマが異なるため、開いてるラベルに適用されているスタイルのクラス名が違うためだと思います。

      ソースの45行目と47行目にある
      $('.status-msg-body')

      $('.page-title')
      に変更してみて下さい。

      削除
  12. Very Pinch様

    一般的ではない個別の案件にもかかわらず、早々に診て頂いてのお返事、
    誠にありがとうございます。
    早速ご指示のとおりの処置を行い、見事に解決致しました!
    「なぜ私だけ・・・」としぼんでいましたので、大感激です!

    素晴らしいソースの制作ご提供とご親切な診断に、心から感謝致します。
    本当にありがとうございました。

    返信削除
  13. Very Pinch様 はじめまして。

    こちらのソースコードをお借りしてカテゴリを分けさせていただいております。大変見栄え良くなり、このようなコードを作っていただき誠に感謝しております。

    しかしながら導入後ですが、一番上の質問の方と同様に展開後も一階層下のラベルが親と同列に並んでしまいます。CSS部とにらめっこしましたがいかんせんまだまだ初心者でどこが原因か皆目見当がつきません。

    お手透きの際にでもご教示いただけますと幸甚です。

    返信削除
    返信
    1. Taro Yさん、はじめまして。
      貴殿のサイトを拝見させて頂いたのですが、ul liのPaddingを0にするテーマが適用されているのが原因です。

      上手く行くか分かりませんが、テーマの上の方にあるCSSを定義している場所に下記のスタイルを追加して下さい。
      このブログで試したところ、想定した結果になったので上手く行くとは思います。

      .widget2{line-height:1.4}
      .widget2{margin:30px 0;_margin:0 0 10px}
      div.widget2 > h2, div.widget2 h2.title {
      margin: 0 0 1em 0;
      font: normal bold 11px 'Trebuchet MS',Trebuchet,Verdana,sans-serif;
      color: #000000;
      }
      .section:first-child .widget2:first-child {
      margin-top: 0;
      }
      .widget2 ul {
      padding: 0 0 0 1.25em;
      margin: 0;
      line-height: 1.2;
      }
      .widget2 li {
      padding: .25em 0;
      margin: 0;
      text-indent: 0;
      }

      で、階層化するソースの42行目と43行目の間に下記を追加して下さい。

      $("#Label1").removeClass('widget');
      $("#Label1").addClass('widget2');

      要は従来の適用されているスタイルを削除して新しいスタイルの適用をしようと言うコードです。

      もし上手くいかない場合は、またコメントを下さい。
      その状態で、再確認します。

      削除
    2. このコメントは投稿者によって削除されました。

      削除
    3. Very Pinch様 お返事大変遅くなり申し訳ありません。

      上記、コードまで作っていただいて誠に恐縮です。
      ありがとうございます。

      早速本日上記コードを導入してみたのですが、どうも私の挿入する場所が悪いのかうまく機能していない様です。

      1191行よりいただいたコードを入れたのですが2つ目の下部のコードの入力先がイマイチつかめません。

      知識も浅く、手探りでやっておりますので全く見当違いでしたら申し訳ありません。

      よろしくお願い申し上げます。

      削除
    4. 挿入する場所をキャプチャ付きで新しい記事を書きました。

      削除
    5. ありがとうございます、参考にさせていただきます!

      削除
  14. こんにちは。ブロガーでのツリー構造化のコードのシェア、本当にありがとうございました。美しいし、使い勝手も最高です。5年以上お世話になっていると思います。ただ、最近ホームタブからみたツリー構造におかしな空白行が入るようになってしまいました。修正しようとここ2か月程悩んでいますが、改善できません。ホームタブ以外は以前のツリー構造の状態で表示できています。

    心当たりとしては2点あって、LinuxとWindowsの両OSからpostの書き込みをしたこと、もしくは、最近新しくなったプロガーのナビゲーションに変更したことです。自分では、何が変わってしまったのか見当を付けることができませんでした。


    もしお時間があれば、助言頂けると助かります。突然お邪魔して申し訳ありません。よろしくお願い致します。

    以下、私のブログです。
    https://monkeyworkmemo2.blogspot.com/

    返信削除
  15. monkyeworkさん、はじめまして。
    今、貴殿のブログを拝見してデバッグモードで適用されているスタイルを確認しましたが、
    p,liに対してwhite-space:pre-wrap;を指定しているためでは無いでしょうか?
    デバックモードで適用をオフにしたところ妙な改行はなくなりました。
    このスタイルが新しくなったブロガーのナビゲーションによる影響かどうか分かりませんが、ひとまずliに適用されているスタイルを無効にするために以下のcssクラスを追加してみて下さい。
    テーマからHTMLの編集をクリックすると、割とすぐのところにcssを定義しているブロックがありますので、どこでも良いので

    .categoryLabel{
    white-space:normal!important;
    }

    とすれば妙な改行はなくなると思います。
    もし試して駄目だったら、その状態のままで良いので連絡して下さい。

    返信削除
    返信
    1. 返信ありがとうございます。修正できました!問題解決できて、うわー!という感じです。もはや、1つずつPostを新規のブログに移動させるしかないと思ってました。本当に助かりました。ありがとうございました!

      おかしくなっていた場所、再度確認してみます。ちなみに、確認したところ2007年からとってもピンチさんのコードにお世話になってます。今後ともよろしくお願いいたします。
      1代目:https://monkeyworkmemo.blogspot.com/
      2代目:https://monkeyworkmemo2.blogspot.com/

      削除
    2. すみませぬ、コロっと忘れてましたでござる。
      上手くいって良かったです。
      また何かあったらお気軽にどうぞ。

      削除