أداة وصف التطبيق لمدونات بلوجر

  السلام عليكم، في هذه التدوينة القصيرة سأشارك معكم أداة معلومات التطبيق أو وصف التطبيق عبر html و css.

ذا كنت صاحب موقع ويب متخصص في نشر التطبيقات أو البرامج وغيرها فإنك ستحتاج هذه الأداة بالتأكيد،ستساعدك في إعطاء معلومات عن التطبيق او البرنامج وإضافة لمسة جمالية عليها.

لقد قمت سابقا بتضمين هذه الأداة في إحدى المواضيع، اذ كنت قرأتها فلا بد أنك شاهدت الأداة.

معاينة

إضافة أداة وصف التطبيق:

هناك خطوتين فقط لإضافة الأداة، أولا اذهب إلى المظهر وقم بتحرير html لقالبكا، انسخ كود css التالي وضعه مباشرة فوق الرمز ]]></b: skin>بعد هذا انقر فوق "حفظ ".

إذا كنت تريد تغيير اللون الرئيسي للأداة قم بتغيير ff0000

/* widget deskripsi application by Tikniya arabic*/
.wc-app-wrap{position:relative;color:#00;background-color:transparent;font-size:14px;}
.wc-app-wrap img{width:100px;border-radius:10px;background-color:#fefefe;box-shadow:0 10px 8px -8px rgb(0 0 0 / 12%);padding:10px;border:1px solid #ff0000}
.wc-apknm{position:absolute;top:5px;right:120px;font-size:24px;font-weight:bold}
.wc-apkvs,.wc-apkpb{position:absolute;right:120px;top:40px}.wc-apkpb{top:70px}
.wc-apkvb,.wcapkdtl,.wc-apkvl{margin-top:20px;font-size:17px;font-weight:bold;border-bottom:1px solid #ff0000;padding-bottom:10px}.wc-apkvl{border:0}
.wcapkdtl{font-size:14px;font-weight:normal}.wcapkdtl b{margin-left:50px}
.wc-apk-btn{position:relative;display:flex;justify-content:center;align-items:center;text-align:center;margin:30px auto;padding:10px 25px;border-radius:30px;line-height:20px;color:#fefefe;background-color:#DE1500;font-size:14px;font-weight:bold;width:calc(100% - 40px)}.wc-apk-btn:hover{opacity:.8}
.darkMode .wc-app-wrap{background-color:#1e1e1e;color:#fefefe}
.darkMode .wc-apk-btn{color:#fefefe}
.darkMode ul.wc-appv-str li .wc-app-dtl,.darkMode .wc-apkvb,.darkMode .wcapkdtl{border-color:rgba(255,255,255,.1)}
.drkM .asdesc b{background-color:#ff0000}
.asdesc{position:relative;display:inline-block;width:320px;margin:0 3px 30px;padding:20px; border:1px solid #eceff1; font-size:14px;line-height:1.8em;border-radius:15px;} .asdesc h3, .asdesc h4, .asdesc b{font-size:13px;font-weight:400; margin:0;padding:2px 14px;background-color:#ff0000;border:1px solid #ff0000;border-radius:15px; position:absolute;top:-15.5px;left:20px;color:#ff0000;}

 الخطوة الثانية انسخ كود html التالي وضعه في الصفحة او المقالة التي تريد وذالك بعد تحرير وضع HTML ، لاتنسى تغيير # بالرابط التي تريد وقم بتغيير المعلومات الملونة في الكود بما يناسبك.

<!-----by Ti9niya arabic---->

<div class="asdesc">

<div class="wc-app-wrap">

<!--[icon application]-->

<img alt="wendy code" src="ضع هنا رابط الصورة" title="tikniya ar" />

<!--[icon application and]-->

<div class="wc-apknm">teste apk</div> 

<div class="wc-apkvs">version 1.0.5</div>

<div class="wc-apkpb">بواسطة: TIKNIYA ARABEC</div>

  

<div class="wc-apkvb"><i class="fa fa-question-circle" aria-hidden="true"></i>&nbsp; معلومات اكثر:</div>

<div class="wcapkdtl"><span style="font-size: medium;">الحالة:</span>تم تعديل التطبيق وتهكيره</div>

<div class="wcapkdtl"><span style="font-size: medium;">الترخيص:</span>مجانا</div>

<div class="wcapkdtl"><span style="font-size: medium;">التقييم:</span>

<i aria-hidden="true" class="fa fa-star-o"></i>

<i aria-hidden="true" class="fa fa-star-half-o"></i>

<i aria-hidden="true" class="fa fa-star"></i>

<i aria-hidden="true" class="fa fa-star"></i>

<i aria-hidden="true" class="fa fa-star"></i>

</div>

<!--[btn dwonload]-->

<a class="wc-apk-btn" href="#" rel="noopener noreferrer" target="_blank">
<i class="fa fa-cloud-download" aria-hidden="true"></i>
&nbsp;تحميل التطببق 15MG APK&nbsp;
</a>

<!--[btn dwonload and]-->

</div>
</div>

 حسنًا ، هذا كل شيء لهذا اليوم وكالعادة أتمنى أن تعجبكم الأداة، اذا واجهت اي مشكلة ضعها في التعليقات، ولا تنسى دعمنا ولو بكلمة لطيفة لنستمر في نشر المزيد.