[楽天]店長の部屋Plus ウィジェットについて２（カスタマイズ）

公開日：  最終更新日：2015/12/18

[楽天]店長の部屋Plus ウィジェットについて２（カスタマイズ）
先日に引き続き楽天の店長の部屋Plus（店長ブログ）について

ネットショップ運営の気になる備忘録
[楽天]店長の部屋Plus ウィジェットについて１

では、店長の部屋Plus ウィジェットについて書きました。

楽天店長の部屋Plusウィジェットのカスタマイズ方法について

前回のの実行結果
34-2.png
見た目について調整してみました。
前回のソースから一部、表示する情報等削ってます。
（ブログタイトル、更新年など）

サンプルその１

サンプル１
35-1.png
↑↑は画像です。

サンプル１ソース

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
<span id="diary_error"></span>
  
<table id="myblog">
  
 
<tbody><tr>
<td>
 <span class="date">
   [<span id="diary_month_0"></span>/<span id="diary_day_0"></span> <span id="diary_hour_0"></span>:<span id="diary_minute_0"></span>]
    </span>
</td>
<td>
  <span id="diary_title_0"></span>
</td>
</tr>
 
  
 
<tr>
<td>
   <span class="date">
   [<span id="diary_month_1"></span>/<span id="diary_day_1"></span> <span id="diary_hour_1"></span>:<span id="diary_minute_1"></span>]
    </span>
</td>
<td>
  <span id="diary_title_1"></span>
</td>
</tr>
 
  
 
<tr>
<td>
   <span class="date">
   [<span id="diary_month_2"></span>/<span id="diary_day_2"></span> <span id="diary_hour_2"></span>:<span id="diary_minute_2"></span>]
    </span>
</td>
<td>
  <span id="diary_title_2"></span>
</td>
</tr>
 
  
 
<tr>
<td>
   <span class="date">
   [<span id="diary_month_3"></span>/<span id="diary_day_3"></span> <span id="diary_hour_3"></span>:<span id="diary_minute_3"></span>]
    </span>
</td>
<td>
  <span id="diary_title_3"></span>
</td>
</tr>
 
  
 
<tr>
<td>
   <span class="date">
   [<span id="diary_month_4"></span>/<span id="diary_day_4"></span> <span id="diary_hour_4"></span>:<span id="diary_minute_4"></span>]
    </span>
</td>
<td>
  <span id="diary_title_4"></span>
</td>
</tr>
 
  
</tbody></table> <script src="http://api.shop.plaza.rakuten.co.jp/js/LatestDiary.js?base_url=★★★&num=■" type="text/javascript" charset="EUC-JP"></script>

サンプルその２

サンプル２
35-2.png

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
<span id="diary_error"></span>
  
<div id="myblog">
<ul id="js-news" class="js-hiddena">
 
<li>
<span class="date">
[<span id="diary_month_0"></span>/<span id="diary_day_0"></span> <span id="diary_hour_0"></span>:<span id="diary_minute_0"></span>]
</span>
<span id="diary_title_0"></span>
</li>
 
  
 
<li>
<span class="date">
[<span id="diary_month_1"></span>/<span id="diary_day_1"></span> <span id="diary_hour_1"></span>:<span id="diary_minute_1"></span>]
</span>
<span id="diary_title_1"></span>
</li>
 
  
 
<li>
<span class="date">
[<span id="diary_month_2"></span>/<span id="diary_day_2"></span> <span id="diary_hour_2"></span>:<span id="diary_minute_2"></span>]
<span id="diary_title_2"></span>
</span>
</li>
 
  
 
<li>
<span class="date">
[<span id="diary_month_3"></span>/<span id="diary_day_3"></span> <span id="diary_hour_3"></span>:<span id="diary_minute_3"></span>]
<span id="diary_title_3"></span>
</span>
</li>
 
  
 
<li>
<span class="date">
[<span id="diary_month_4"></span>/<span id="diary_day_4"></span> <span id="diary_hour_4"></span>:<span id="diary_minute_4"></span>]
<span id="diary_title_4"></span>
</span>
</li>
 
  
</ul>
  
</div> <script src="http://api.shop.plaza.rakuten.co.jp/js/LatestDiary.js?base_url=★★★&num=■" type="text/javascript" charset="EUC-JP"></script>

jQueryのニュースティッカープラグインと合わせて表示

サンプル１、サンプル２と見てきましたが、どちらも基本的にはCSSで見た目を調整しているだけです。もう少し動きなどつけてみたいという場合は、jQueryプラグインと組み合わせてみるのはいかがでしょうか。

先日紹介した

ネットショップ運営の気になる備忘録
 
省スペースでお知らせを流すニュースティッカー[jQuery.ticker.js]

を組み合わせることで↓↓↓のような表示も可能です。

表示サンプル３

サンプル３

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
<script src="jquery.min.js" type="text/javascript"></script> <script src="jquery_ticker.js" type="text/javascript"></script>
  
 
  
 
  
<span id="diary_error"></span>
  
 
  
<ul id="js-news" class="js-hiddena">
  
 
<li>
<span class="date">
[<span id="diary_month_0"></span>/<span id="diary_day_0"></span> <span id="diary_hour_0"></span>:<span id="diary_minute_0"></span>]
</span>
<span id="diary_title_0"></span>
</li>
 
  
 
<li>
<span class="date">
[<span id="diary_month_1"></span>/<span id="diary_day_1"></span> <span id="diary_hour_1"></span>:<span id="diary_minute_1"></span>]
</span>
<span id="diary_title_1"></span>
</li>
 
  
 
<li>
<span class="date">
[<span id="diary_month_2"></span>/<span id="diary_day_2"></span> <span id="diary_hour_2"></span>:<span id="diary_minute_2"></span>]
</span>
<span id="diary_title_2"></span>
</li>
 
  
 
<li>
<span class="date">
[<span id="diary_month_3"></span>/<span id="diary_day_3"></span> <span id="diary_hour_3"></span>:<span id="diary_minute_3"></span>]
</span>
<span id="diary_title_3"></span>
</li>
 
  
 
<li>
<span class="date">
[<span id="diary_month_4"></span>/<span id="diary_day_4"></span> <span id="diary_hour_4"></span>:<span id="diary_minute_4"></span>]
</span>
<span id="diary_title_4"></span>
</li>
 
  
</ul> <script src="http://api.shop.plaza.rakuten.co.jp/js/LatestDiary.js?base_url=★★★&num=■" type="text/javascript" charset="EUC-JP"></script>  <script type="text/javascript">function setNews(){$(function(){$('#js-news').ticker({speed:0.10,titleText:'店長ブログ',displayType:'reveal',direction:'ltr',pauseOnItems:5000});});}</script>

設置して、ブログ更新すれば自動的にページ上での表示にも反映されるのがうれしいですね。ぜひ、活用してみてください。




Comment

  1. peacepopo より:
    2013年10月11日 00:46

    OPOPさんコメントありがとうございます。
    ＞店長の部屋plus+ウィジェットを利用しているのですが、新規投稿をすると、
    ＞時間の取得ができない（[://]）とでたり、2件目のタイトルが取得できず空欄になったりします。
    上記の現象は、新規投稿をした際に必ず起こるのでしょうか？
    時間が取得できないのは新規投稿をしたものだけでしょうか？
    タイトルが取得できないのは必ず２件目でしょうか？
    その後しばらくすれば正常に表示されますか？
    質問ばかりになりますが、ソース側の問題かブログ投稿の問題なのかまずは切り分けされるのが良いかと思います。
    試しに現在のソースで他のショップをいくつか指定した場合、正常に表示されるか確認してみてください。

    返信
  2. OPOP より:
    2013年10月11日 09:57

    peacepopo様、お返事ありがとうございます。
    たくさん質問をさせてしまって申し訳ありませんでした。
    現象については今のところ「必ず」発生します。
    ティッカータイプのものを使っているのですが、ベーシックなタイプ（[楽天]店長の部屋Plus ウィジェットについて１でご紹介頂いているもの）でも、同じ現象（過去の投稿分が表示されない）になってしまいます。
    新規投稿を行うと･･･
    1件目「[//:]タイトルテキスト」
    2件目「[//:]」
    3件目「[//:]」
    となり、全ての投稿時間が取得できません。
    タイトルが取得できないのは2件目以降全てです。
    また、しばらく待つと更新されます（時間も表示され、全てのタイトルテキストも表示されます）
    ちなみに反映されるまでの時間を計ったところ、1時間ジャスト経過すると表示されるようです。
    ↓問題なく表示されます。
    1件目「[10/11 08:33]タイトルテキスト」
    2件目「[10/10 03:44]タイトルテキスト」
    3件目「[10/09 01:55]タイトルテキスト」
    楽天の問題でしょうか？でも･･･、同じソースを使って試しに他ショップのアドレスを入れると、問題なく動作しました･･･＾＾；※ikebeさんのところのアドレスを使わせて頂きました。
    あと気になる点は、表示させる投稿件数を増やしても同様の現象になります。
    件数を増やしたときに書き換えるソースは、確実に直しているのですが･･･。

    返信
  3. peacepopo より:
    2013年10月11日 21:59

    OPOPさん
    詳細についてありがとうございます。
    こちらでも
    http://shop.plaza.rakuten.co.jp/
    から、いくつかのショップで試してみました。
    件数を多めの７件に指定してみたのですが、
    ほとんどのショップが問題なく７件表示されてましたが、
    ３件までしか表示されないショップ、６件までしか表示されないショップ等を確認できました。
    おそらくですが、楽天側の問題な感じがします。ソース内のjavascriptでブログデータを取得して
    画面上に書き込むような処理になっているのですが、取得できてないショップで確認するとデータ取得をした時点で指定件数より少ないようです。
    データ取得部分についてこちらでは確認できないので楽天に問合せをするしかないかもしれません。
    RMS内のヘルプに設置について記述がありますが、
    https://mainmenu.rms.rakuten.co.jp/auth/index.phtml?params=service/tenchonoheya/1-8.html&s=&param2=0
    （要RMSログイン）
    設置に関するサポートはしないと書かれているので微妙ですね・・・

    返信
  4. OPOP より:
    2013年10月12日 13:54

    peacepopo様
    お返事ありがとうございます。検証もしていただき、本当にありがとうございました。
    お店によって表示件数がバラバラとは思いもよりませんでした。
    ちなみに当店は2件しか表示できません・・・。
    ダメ元でＲＭＳサポートに電話してみましたが、土日はＲＭＳの操作以外のサポートは受け付けていないようでしたので、週明けに再度連絡してみようと思います。何か分かりましたら、またコメントさせていただきますね。
    今回は相談にのっていただけて本当に心強かったです。
    ありがとうございました、重ねてお礼申し上げます。

    返信
  5. OPOP より:
    2013年10月21日 18:18

    peacepopo様
    OPOPです、こんばんは。RMSサポートに事情を説明したところ、サポート窓口ではフォローしきれない問題ということで、技術部へお話を繋いでもらい、先ほど「システムの不具合でした」という回答を頂き、現在は復旧した模様です。23日に正式に修正版をリリースしますとのこと。
    商品説明と商品リンクを貼っただけの記事に問題があるとは思えないのですが、当初は記事のひとつに書き方の問題がある可能性があります！と言われてしまいましたが、結果的にHTMLにも記事内容にも問題はありませんでした･･･。解決してよかったです＾＾；

    返信
  6. peacepopo より:
    2013年10月22日 00:06

    OPOPさん
    経過についてのコメントありがとうございます。
    やはり、楽天側の不具合でしたか＾＾；
    OPOPさんの行動力お見事です♪
    楽天側にも迅速な対応をしていただけたようで、解決出来て良かったです。

    返信

peacepopo へ返信する コメントをキャンセル

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

日本語が含まれない投稿は無視されますのでご注意ください。（スパム対策）

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください。

PREV：
[楽天]店長の部屋Plus ウィジェットについて１
NEXT：
無料でネットショップ開業 いま話題のBASE（ベイス）に登録してみた
Home > 楽天 > [楽天]店長の部屋Plus ウィジェットについて２（カスタマイズ）
スポンサードリンク

最新記事

HTML秒数指定で別ページへリダイレクトさせる方法
HTML秒数指定で別ページへリダイレクトさせる方法
越境ECにShopify無料ツール(QRコード/バーコード/ロゴ作成)が便利
越境ECにShopify無料ツール(QRコード/バーコード/ロゴ作成)が便利
ブラウザ操作自動化できるiMacrosを使ってメルカリの出品作業を時短する方法
ブラウザ操作自動化できるiMacrosを使ってメルカリの出品作業を時短する方法
越境ECに強い海外発のShopifyでネットショップ開業
越境ECに強い海外発のShopifyでネットショップ開業
ネットショップで安心して購入できる決済方法「後払い決済」
ネットショップで安心して購入できる決済方法「後払い決済」

記事が気に入ったらシェアお願いします

PAGE TOP ↑