『牆上小記。。。』
『心』需要『境』的萃煉才會著壯

fB2

  今天又學會了一招,逛了別人的格子發現別人的家好帥哦!

忍不住我也要....(≧▽≦) 

去摸索了老半天~終於讓我也給搞出來嚕!(*-.-) 好累!

當然也要謝謝 米特,味玩待敘   没有他的分享我也不會哩!

想想我也來與大家分享我完成的喜悅

--------------------------------------------------------------

1. 首先你必須先下載一個FB的圖 下載  

請你一定要下載然後放到你自己的空間,要不然會害人家破圖

可參考 給圖片來個免費空間  一文 

下圖此位置就是要複製圖的網址 

光是這裡不知要選那一個就花費了我不少時間 

就一個一個貼來試試唄!累! 

imgur3

 

 

2.放的位置:管理後台→部落格→左側欄底端【自訂樣式】→CSS原使編輯碼

語法中的黃底字串請貼上自己上傳後的【圖片網址】  

 

------------  以下為貼在CSS原始編輯碼內的語法  --------------

 

.fbbox{background: url("請貼上自己上傳的【圖片網址】") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
.fbbox div{border:none;position:relative;display:block;}
.fbbox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.fbbox span a{color: #808080;text-decoration:none;}
.fbbox span a:hover{text-decoration:underline;}

 

fB3

fB1

 

3.在現有側邊欄位中自訂區塊內容的原語法後面加入修改後的CSS語法
位置:後台管理>部落格>左側欄位中的【側邊欄位設定】


*只要舊有欄位中有【自訂區塊內容】就可以插入自己的FB浮動粉絲團標籤CSS語法

 (如可在埋ga或側邊粉絲團likebox的自訂區塊內容中插入語法)

語法中的黃底字串請貼上自己粉絲團的【自訂短網址】
說明:
粉絲團網址:https://www.facebook.com/tacit200就將黃底字串改成tacit200
 

 ----------以下為要修改貼入的FB likebox CSS語法--------

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(".fbbox").hover(function(){
$(this).stop().animate({right: "0"}, "medium");
}, function(){
$(this).stop().animate({right: "-250"}, "medium");
}, 500);
});
</script>
<div class="fbbox" style="">
<div>
<iframe src="https://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Ffacebook.com%2F請貼上自己粉絲團的【自訂短網址】&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp; connections=9&amp;stream=false&amp;header=false&amp;height=270" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 270px; width: 245px;background:#fff;"></iframe>
</div>
</div>

 

 fB5

 完成...玩很久厚..累!有興趣你也可以試試看

 

  

 

 

創作者介紹
創作者 朵娜 的頭像
朵娜

蝸牛の深居簡出札記

朵娜 發表在 痞客邦 留言(3) 人氣()


留言列表 (3)

發表留言
  • 小仙
  • 小仙推
    好時用ㄚ
  • 不客氣

    朵娜 於 2013/10/19 21:20 回覆

  • 悄悄話
  • kelen7005
  • 謝謝你~

    不過 奇怪我第一次用時側邊的出現 但整個空白.

    我重用沒有側邊出現 是改原本放FB連結位置的下一格空白...

    我還是沒有成功...
  • 請問~貼在CSS原始編輯碼內的語法有貼嗎?
    側欄可使用FB同一個位置是對的

    朵娜 於 2013/12/28 22:44 回覆

您尚未登入,將以訪客身份留言。亦可以上方服務帳號登入留言

請輸入暱稱 ( 最多顯示 6 個中文字元 )

請輸入標題 ( 最多顯示 9 個中文字元 )

請輸入內容 ( 最多 140 個中文字元 )

請輸入左方認證碼:

看不懂,換張圖

請輸入驗證碼