الجمعة، مارس 08، 2013

إضافة كود التبادل الإعلاني إلى مدونتك مع تأثيرات Css على الصور

فكرة التبادل الإعلاني هي من بيين الأساليب المميزة لتقوية البيج رانك لموقعك وجلب المزيد من الزوار المستهدفين وتحسين ترتيب مدونتك الصغيرة عبر محركات البحث.





ولهاته الإضافة مزايا عدة من بينها :

  • مصدر اضافي لجلب الزوار 
  • تحسين ترتيب موقعك بمحركات البحث 
  • رفع البيج رانك لموقعك


طريقة اضافة الأداة لمدونتك 



  • توجه إلى » لوحة التحكم الخاصة بمدونتك ثم » تصميم ثم » إضافة أداة و من النافذة المنبثقة اختر أداة HTML/Javascript

  • الآن قم بنسخ ثم لصق الكود التالي داخل الأداة


  • <!--CSS Hover Effects To 125x125 Advertisement Banners-->
    <style>
    .Mohamed-Ads ul{
    list-style-type:none;
    margin: 0px auto;
    padding: 10px 0px 10px 0px;
    width:300px;
    overflow:hidden;
    }
    .Mohamed-Ads ul li{
    list-style-type:none;
    margin: 0px 5px 10px 5px;
    float:left;
    display:inline;
    background:orange;
    -webkit-transition:all 0.2s ease;
    -moz-transition:all 0.2s ease;
    -o-transition:all 0.2s ease;
    border-radius:100%;
    -webkit-border-radius:100%;
    -moz-border-radius:100%;
    -o-border-radius:100%;
    }
    .Mohamed-Ads ul li:hover {
    -webkit-transition:all 0.3s ease;
    -moz-transition:all 0.3s ease;
    -o-transition:all 0.3s ease;
    -o-border-radius:15%;
    -webkit-border-radius:15%;
    -moz-border-radius:15%;
    border-radius:15%;
    }
    .Mohamed-Ads ul li:active {
    -webkit-transition:all 0.2s ease;
    -moz-transition:all 0.2s ease;
    -o-transition:all 0.2s ease;
    -o-border-radius:50%;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    border-radius:50%;
    }
    .Mohamed-Ads ul li a img{
    -webkit-box-shadow:0 0 8px rgba(0,0,0,0.5);
    -moz-box-shadow:0 0 8px rgba(0,0,0,0.5);
    box-shadow:0 0 8px rgba(0,0,0,0.5);
    padding:3px;
    }
    </style>
    <div class="Mohamed-Ads">
    <ul>
    <li style="background:#e42b2b !important;">
    <a href="رابط المعلن" rel="nofollow">
    <img height="125" src="رابط صورة المعلن" width="125" />
    </a></li>
    <li style="background:#FFE500 !important;">
    <a href="رابط المعلن" rel="nofollow">
    <img height="125" src=" رابط صورة المعلن" width="125" />
    </a></li>
    <li style="background:#a800ff !important;">
    <a href="رابط المعلن" rel="nofollow">
    <img height="125" src=" رابط صورة المعلن" width="125" />
    </a></li>
    <li style="background:#41d05f !important;">
    <a href="رابط المعلن" rel="nofollow">
    <img height="125" src=" رابط صورة المعلن" width="125" />
    </a></li>
    </ul>
    </div>
    <!--CSS Hover Effects To 125x125 Advertisement Banners—>




    تعديل الكود بما يتناسب مع مدونتك 


    • رابط المعلن : رابط الموقع المعلن في مدونتك.

    • رابط صورة المعلن : رابط صورة الموقع المعلن في مدونتك


      بقلــــــــــــم 


      المـــــــــدون  فهد لافي

    ليست هناك تعليقات:

    إرسال تعليق