تابعنا علي الفيسبوك

تابعنا علي مواقع التواصل الاجتماعي

تابعنا علي اليوتيوب

الأربعاء، 22 يونيو، 2016

الكود المثالي لصندوق التبادل الاعلاني ووضع الاعلانات

الكود المثالي لصندوق التبادل الاعلاني ووضع الاعلانات


يعد التبادل الاعلاني شئ مهم جدا بالنسبة للمدونين حيث يمكنك من خلال التبادل الاعلاني اكتساب المزيد من المشاهدات والقراْ الجدد في مدونتك ومع هذا الصندوق سوف تضع اكبر عدد ممكن من الصفحات الاعلانية ولن تاخذ منك مساحة كبيرة وهي فعلا اضافة مهمة ومفيدة جدا جدا والان وفي هذا الموضوع سوف نشرح طريقة التركيب والاعدادات المهمة 

طريقة التركيب

افتح مدونتك ثم اختر التخطيط
اختر اضافة اداة ثم اختر اداة الــ "HTML/JavaScript"
ثم قم بتسمية الاداة وضع هذا الكود بداخلها ثم قم بالحفظ
<style>
a.tip:hover:after { top: -15px;
    background: none repeat scroll 0% 0% rgba(232, 62, 59, 0.65);
    font-size: 14px;
    color: #FFF;
    content: attr(title);
    display: block;
    right: 7.5px;
    padding: 3px 3px;
    position: absolute;
    box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
    overflow: hidden;
    width: 86%;
    height: 100%;
}a.tip { position: relative; }
.i3lan-ProFessorPc {text-align:center;margin:0 auto;transition:all 1s ease-out;}
.i3lan-ProFessorPc .sidebar .widget-content,.i3lan-ProFessorPc .sidebar-two .widget-content{padding:0;border:0;}
.i3lan-ProFessorPc .sidebar .widget {margin-bottom:0;padding:0;}
.i3lan-ProFessorPc img {background: #fff; text-align: center; margin: 5px 5px; padding: 3px; border: 1px solid #E0E0E0; vertical-align: 0;}
.i3lan-ProFessorPc  img:hover {background:#fdfdfd;border:1px solid #ff0000;}
</style>
<div class="i3lan-ProFessorPc">

<a class="tip" href="#" target="_blank" title="مساحة اعلانية"><img src="http://c.top4top.net/p_168m54u1.png" alt=".." width="125" height="125" /></a>

<a class="tip" href="#" target="_blank" title="مساحة اعلانية"><img src="http://c.top4top.net/p_168m54u1.png" alt=".." width="125" height="125" /></a>

<a class="tip"#" target="_blank" title="مساحة اعلانية"><img src="http://c.top4top.net/p_168m54u1.png" alt=".." width="125" height="125" /></a> 

<a class="tip" href="#" target="_blank" title="مساحة اعلانية"><img src="http://c.top4top.net/p_168m54u1.png" alt=".." width="125" height="125" /></a> 
</div>

<div class="clear"></div>
<span class="widget-item-control">
<span class="item-control blog-admin">
<a class="quickedit" href="//www.blogger.com/rearrange?blogID=6109045480426282985&amp;widgetType=HTML&amp;widgetId=HTML5&amp;action=editWidget&amp;sectionId=sidebar1" onclick="return _WidgetManager._PopupConfig(document.getElementById(&quot;HTML5&quot;));" target="configHTML5" title="تحرير">
<img alt="" height="18" src="https://img1.blogblog.com/img/icon18_wrench_allbkg.png" width="18" />
</a>
</span>
</span>
<div class="clear"></div>

اهم الاعدادات

لتغيير الصورة قم بتغيير هذا الرابط : http://c.top4top.net/p_168m54u1.png
لوضع رابط صفحة المعلن "الصفحة المراد الانتقال اليها" : قم بوضعة بدلا عن #
غير كلمة مساحة اعلانية بما تريدة ان يظهر بعد وضع مؤشر الماوس

ملحوظة : لو حصل مشاكل في تصميم الكود داخل المدونة فقط قم بوضع رابط مدونتك في تعليق ثم ساضع لك الكود المناسب لمدونتك

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

إرسال تعليق

حجز السلع عبر الإنترنت

الشراء عبر الإنترنت - وطرق شحن معتمدة

شحن السلع مجاني