الان أضف صندوق الاعجاب بتصميم جديد معدل

بسم الله الرحمان الرحيم السلام عليكم ورحمة الله وبركاته 

الان اصبح بالامكان التعديل الشامل على صندوق الاعجاب الخاص بالفيسبوك فمثلا لديك صفحة مخصصة لموقعك لممونتك او غير ذلك وتضع بها صندوق الاعجاب الان يمكنك تعديله ليصبح بشكل جديد وجد انيق صورة عن التعديل : 

الان لنبدأ على بركة الله 

أولا نبحث عن السطر التالي ثم نلصق كود css فوقه

]]></b:skin> 

كود css

/* ------ Custom Like Box ----- */

    .fan_box a:hover{
      text-decoration: none;
    }


    .fan_box .full_widget{
      height: 200px;
      border: 0 !important;
      background: none !important;
      position: relative;
    }


    .fan_box .connect_top{
      background: none !important;
      padding: 0 !important;
    }


    .fan_box .profileimage, .fan_box .name_block{
      display: none;
    }


    .fan_box .connect_action{
      padding: 0 !important;
    }


    .fan_box .connections{
      padding: 4px !important;
      margin:3px 0px 5px 0px!important;
      border: 0 !important;
      font-family: Arial, Helvetica, sans-serif;
      font-size: 11px;
      font-weight: bold;
      color: #666;
    }


    span.total{
      color: #365899;
      font-weight: bold;
      background:#ECEEF5;
      padding:4px !important;
      margin:3px 0px 5px 0px!important;
      border:1px solid #E1E4ED;
     -moz-border-radius:3px;
     -webkit-border-radius:3px;
    }

span.total:hover{
     border:1px solid #6383C1;
    }

    .fan_box .connections .connections_grid {
      padding-top: 10px !important;
    }


    .fan_box .connections_grid .grid_item{
      padding: 0 10px 10px 0 !important;
    }


    .fan_box .connections_grid .grid_item .name{
      font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
      font-weight: normal;
      color: #289728 !important;
      padding-top: 1px !important;
    }


    .fan_box .connect_widget{
    position: absolute;
    bottom: 0;
    left: 0px;
    margin: 0 !important;
    }


    .fan_box .connect_widget .connect_widget_interactive_area {
    margin: 0 !important;
    }


    .fan_box .connect_widget td.connect_widget_vertical_center {
    padding: 0 !important;
    }


    /*--------------- Custom Like Box End--------------*/ 

في حالة اردت تغيير لون اسم البروفايل من اللون الاخضر الى اي لون تريد غير الكود التالي : 289728

الان يمكنك وضعه الصندوق اي شئت في القالب او عن طريق اضافة أداة بوضع الكود الموالي :

<style>
        #mbtlikebox{
          color: #365899;
          font: bold 11px arial;
          background:#ECEEF5;
          padding:3px !important;
          margin:5px 0px!important;
          border:1px solid #E1E4ED;
         -moz-border-radius:3px;
         -webkit-border-radius:3px;
          width:290px;
        }

    #mbtlikebox:hover{
         border:1px solid #6383C1;
        }
    </style>
    <script type="text/javascript" src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/en_US"></script>
        <script type="text/javascript">FB.init("");</script>
        <fb:fan profile_id="128605887189860" stream="0" connections="8" width="300px" height="200px" header="0" logobar="0"   css="https://sites.google.com/site/3alymni/css/3.css"></fb:fan>
    <div id="mbtlikebox"><a rel="nofollow" target="_blank" style="text-decoration:none; color:#365899;" href="ضع هنا رابط الصفحة">Visit the Like Page »</a></div>

== غيره برقم id الخاص بصفحتك

== عرض الصندوق 

== طول الصندوق 

== رابط الصفحة 

والان استمتع بالتصميم الجديد لصنوق الاعجاب الخاص بصفحتك وكما يمكنك التعديل عليه ايضا عبر التعديل على كود css 

تم بحمد الله