こんにちは。
ITサポート 加藤あつし です。

 

 

 

 

今日は上矢印上矢印上矢印
ホームページ更新情報
(アメーバオウンド)
カスタマイズ&設置してましょう!!

 


RSSインクルードさん

アメーバオウンドの更新情報をアメブロで
表示させる方法として

僕が利用させて頂きました。

 

設定はいたって簡単。

 

 

 

|設置タグの文字数は?

プラグインは3800文字が
使用可能なテキストの数

少しでも節約したいところです。

 

RSSインクルードは
更新情報を複数取得することが可能。

 

その為に1個でも10個でも

設置する基本タグは変わりません。

そこで必要ない部分を削除・修正しました。

 

枠のタイトル部分のHTMLも
追加してみました。

文字数は「553」文字でした。

 

<div class="rssfeeds_">ホームページ更新情報</div> <script type="text/javascript" src="https://www.google.com/jsapi"></script> <script type="text/javascript" src="http://sp.wdeco.jp/rssi/jsapi/ ?wdecoSPrssiDisplayID=1 &wdecoSPrssiType=img &wdecoSPrssiTarget=undefined &wdecoSPrssiData=ON &wdecoSPrssiImgx= &wdecoSPrssiFavicon=ON &wdecoSPrssiColumn=1 &wdecoSPrssiHeight=150px &wdecoSPrssiBorder=5px &wdecoSPrssiBordercol=#1a1aff &wdecoSPrssiResults=1 &wdecoSPrssiResults1=1&wdecoSPrssiFeed1=http://ownd.smilefactoryten.com/rss.xml?categoryId=380772 " charset="utf-8"></script>

 

 

 

|貴方用にデザインカスタマイズするには?

RSSインクルードさんのタグを

カスタマイズすると何ができるか?

 

  1. 枠のタイトルと背景のカラー変更
  2. 枠の高さの変更
  3. 枠の太さの変更
  4. 枠の色の変更
  5. 更新情報の表示数の変更

5箇所カスタマイズできます。

 

 

 

|カスタマイズする箇所は?

赤のテキストの部分です。

上から順に

  1. 枠のタイトル =ホームページ更新情報
  2. 枠の高さ =150px
  3. 枠の太さの変更 =5px
  4. 枠のカラーの変更 =#1a1aff
  5. 更新情報の表示数 =1(2箇所修正)

僕の設定です。

 

設置するときには
下のタグをメモ帳などの
テキストエディタにコピペし
修正後フリープラグインに
ペースト(貼り付ける)してください。

 

<div class="rssfeeds_">タイトル</div> <script type="text/javascript" src="https://www.google.com/jsapi"></script> <script type="text/javascript" src="http://sp.wdeco.jp/rssi/jsapi/ ?wdecoSPrssiDisplayID=1 &wdecoSPrssiType=img &wdecoSPrssiTarget=undefined &wdecoSPrssiData=ON &wdecoSPrssiImgx= &wdecoSPrssiFavicon=ON &wdecoSPrssiColumn=1 &wdecoSPrssiHeight=枠の高さpx &wdecoSPrssiBorder=枠の太さpx &wdecoSPrssiBordercol=#色
&wdecoSPrssiResults=更新情報表示数
&wdecoSPrssiResults1=更新情報表示数&wdecoSPrssiFeed1=http://貴方のOWNDアドレス/rss.xml?categoryId=380772 " charset="utf-8"></script>

 

 

 

|枠のCSSを設置

枠のタイトル部分は僕オリジナルで
追加したパーツです。

 

タイトル背景の色
(枠線と同じカラーに合わせるといいですね)
テキストの色

2箇所、カスタマイズ可能です。

 

.rssfeeds_{
margin-bottom: -10px;
text-align: center;
background-color: #1a1aff;/*タイトル背景の色*/
color: #fff;/*テキストの色*/
line-height: 2;
font-weight: bold; }

 

 

同じくメモ帳などの
テキストエディタにコピペし
修正後にCSSの一番最後に
ペースト(貼り付ける)してください。

 

 

 


ではまた。
ITサポート かとうあつし でした。


私のアメーバオウンド(AmebaOwnd)はこちらでーす!!
かとうあつしのアメーバオウンド

 

 

 

 

 

 

 

AD