اداة قائمة الأصدقاء على بلوجر للتبادل الإعلاني

آلُـۜسـۨــِۖلُأمٌ ؏ـليۜـكـۜم وݛحـٍّْـٍّْـٍّْمهہ الًـًٍۖـٍـٍۖـًٍٍٍّـًٍلۖهًٍۖۂ وبـۗـۗـۗـۗـۗـۗركۧۧــۧۧۧۧۧـۗــۗـۗاتهۂ، كيف حالكم؟ في درس اليوم ساريكم طريقة اضافة اداة تبادل الإعلاني للزيادة الزوار اقصد باك لينك وايضا انا نشرت هذه الاداة لانني وفرت صفحة تبادل اعلاني ان اردت ان تصبح من اصدقاءنا وفر الشروط الموجودة ثم اطلب التبادل الإعلاني. 

التبادل الإعلاني

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

  /* Friend Sites */
#friend-link{padding:0;margin:0;list-style:none}
.friendLink{display: flex;flex-wrap: wrap;list-style: none;margin: 0;padding: 0;position: relative;width: calc(100% + 10px);left: -5px;right: -5px;font-size: 13px;}
.friendLink li{width: calc(50% - 10px);margin: 0 5px 10px;}
.friendLink a{background: #f6f6f6;display:block;color:inherit;width:100%; padding:8px 10px;border-radius:4px;line-height:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.friendLink a:hover{color:var(--linkC)}
.darkMode .friendLink a{background:rgba(0,0,0,.15);color:inherit}
.darkMode .friendLink a:hover{color:var(--darkU)}
.friendsRules {margin:0;padding:0;line-height:normal;display:block;float:left;background-color:#f6f6f6;font-size:13px;margin-top:-1px;margin: 0 0 8px 0;padding:7px 10px;border-radius: 6px}
.darkMode .friendsRules {background-color:rgba(0,0,0,.15)}
/* Rung rinh */
.rung {animation: rung-lac 2s ease infinite;}
@-webkit-keyframes rung-lac {0% {-webkit-transform: rotate(0) scale(1) skew(1deg);}
10% {-webkit-transform: rotate(-25deg) scale(1) skew(1deg);}
20% {-webkit-transform: rotate(25deg) scale(1) skew(1deg);}
30% {-webkit-transform: rotate(-25deg) scale(1) skew(1deg);}
40% {-webkit-transform: rotate(25deg) scale(1) skew(1deg);}
50% {-webkit-transform: rotate(0) scale(1) skew(1deg);}
100% {-webkit-transform: rotate(0) scale(1) skew(1deg);}}

<div id="friend-link">
  <div class="friendLink">
    <li><a href="friend-link" target="_blank" title="friend-title">Friend Name</a></li>
    <li><a href="friend-link" target="_blank" title="friend-title">Friend Name</a></li>
    <li><a href="friend-link" target="_blank" title="friend-title">Friend Name</a></li>
    <li><a href="friend-link" target="_blank" title="friend-title">Friend Name</a></li>
    <li><a href="friend-link" target="_blank" title="friend-title">Friend Name</a></li>
    <li><a href="friend-link" target="_blank" title="friend-title">Friend Name</a></li>
    <li><a href="friend-link" target="_blank" title="friend-title">Friend Name</a></li>
    <li><a href="friend-link" target="_blank" title="friend-title">Friend Name</a></li>
    <li style="width: 100%;"><a href="link-articles" style="display: block; text-align: center;" target="_blank" title=" Submit Your Blogs/Website"><i class="fad fa-hands-helping rung"></i> Submit Your Blogs/Website</a></li>
  </div>
<div class="friendsRules"> <i class="fad fa-bullhorn rung"></i>We will <u>unlink</u> for blogs/websites that violate our policies &amp; general rules for linking.</div>
</div>

والى هنا نكون قد انتهينا من درس اليوم وكالعادة الاكواد مبرمجة بhtml وان اردتم ان اجعلها تستطيع تعديل روابطها من اداة الروابط اخبروني لأطورها وان اردتم طريقة تطويرها في فيديو ومقال اخبروني