إضافة مواصفات الهاتف في مدونة بلوجر

إذا كنت مدونًا على الإنترنت أو لديك مدونة تقنية ، فلا شك أنك على دارياً جيدة بإضافة مواصفات الهواتف المحمولة الشهيرة إلى مواقع WordPress ، فإن المكون الإضافي رائع ، والذي يتضمن العديد من الرموز مع شرح بسيط لمواصفات الهواتف ، مثل: البطارية ، التخزين ، ذاكرة الوصول العشوائي ، نظام الهاتف ، الكاميرا ، مما يسهل على الزائرين معرفة مواصفات الهاتف الذي يرغبون في شرائه.

تعد إضافة مواصفات الهاتف أمرًا ضروريًا لأصحاب المواقع الفنية ، خاصة أولئك الذين يقدمون مقالات عن مراجعات الهاتف أو مواصفات الهاتف وأسعاره ، هذه الوظيفة الإضافية لمواقع WordPress وهي مدفوعة ، وليست مجانية ، لكن هل تعلم أنه يمكنك الآن التثبيت من أجل إضافات Blogger المجانية؟ نعم يا صديقي ، من خلال هذا المقال سنتعرف على كيفية تثبيت إضافة مواصفات الهاتف على بلوجر. تابعنا

على الرغم من أن منصة blogger تنتمي إلى شركة Google العملاقة ، إلا أن Google نادرًا ما تهتم بتحديثات المدون !! لكي تكون منشئ محتوى ناجحًا في Blogger ، يجب أن تتعلم HTML ، حيث يعلم الجميع أن أي مدونة Blogger تعتمد بشكل أساسي على أكواد البرمجة.

شرح تركيب إضافة مواصفات الهاتف لبلوجر

أولاً ، يجب أن تعلم أن الامتداد هو أكواد css و html ، لذلك يتطلب تركيزًا جيدًا حتى يعمل الامتداد بشكل صحيح في مقالاتك وبدون أخطاء.

كود الإضافة داخل المقال

قم بالدخول بلوجر "مشاركة جديدة" ثم تغيير مربع النصوص من تأليف الى html، ثم تقوم بنسخ الكود التالي واضافتة داخل مربع النصوص html، ثم تنتقل الى وضع الكتابة وتغيير ماتريده في المقال

كود الإضافة داخل المقال:

<div class="aps-shortcode clearfix">
<ul class="aps-features-list">
<li>
  
<div class="aps-feature-anim">
<span class="aps-list-icon"> 
<img hight="20px" src="https://image.flaticon.com/icons/svg/1383/1383655.svg" width="20px" />
</span>
<br />
<div class="aps-feature-info">
<strong>المعالج</strong>: Qualcomm Snapdragon 665</div>
</div>
</li>
  
<li>
<div class="aps-feature-anim">
<span class="aps-list-icon ">
<img hight="20px" src="https://image.flaticon.com/icons/svg/543/543320.svg" width="20px" />
</span><br />
<div class="aps-feature-info">
<strong>الرام</strong>: 3/4  غيغابايت</div>
</div>
</li>
  <li>
<div class="aps-feature-anim">
<span class="aps-list-icon ">
<img hight="20px" src="https://image.flaticon.com/icons/svg/100/100323.svg" width="20px" />
</span><br />
<div class="aps-feature-info">
<strong>الذاكرة</strong>:32/64/128 غيغابايت</div>
</div>
</li>
  
<li>
<div class="aps-feature-anim">
<span class="aps-list-icon ">
<img hight="20px" src="https://image.flaticon.com/icons/svg/149/149388.svg" width="20px" />
</span>
<br />
<div class="aps-feature-info">
<strong>الشاشة</strong>: حجم 6.5 إنش IPS LCD</div>
</div>
</li>
  
<li>
<div class="aps-feature-anim">
<span class="aps-list-icon ">
<img hight="20px" src="https://image.flaticon.com/icons/svg/2965/2965705.svg" width="20px" />
</span>
<br />
<div class="aps-feature-info">
<strong>الكاميرا</strong>: 12 + 8 + 2 + 2 ميغابكسل</div>
</div>
</li>
  
<li>
<div class="aps-feature-anim">
<span class="aps-list-icon ">
<img hight="20px" src="https://image.flaticon.com/icons/svg/263/263073.svg" width="20px" />
</span>
<br />
<div class="aps-feature-info">
<strong>البطاريه</strong>:4000مللى امبير</div>
</div>
</li>
  
<li>
<div class="aps-feature-anim">
<span class="aps-list-icon">
<img hight="20px" src="https://image.flaticon.com/icons/svg/689/689399.svg" width="20px" />
</span>
<br />
<div class="aps-feature-info">
<strong>النظام</strong>: Android 10.0</div>
</div>
</li>
</ul>
  </div>

شرح تركيب كود مواصفات الهاتف

الخطوة الثانية والأخيرة تبحث عن الكلمة ]]></b:skin> وتضع الكود التالي فوقها:

.clearfix:before, .clearfix:after {content: "";display: table;}
.aps-shortcode ul {list-style: none;}
.aps-features-list li{ background: linear-gradient(45deg,#480048,#000000);height: 50px;margin-bottom: 10px;position: relative;width: 50%;max-width: 50%;}
  .aps-features-list li:hover{background:#d09f0d}
.aps-shortcode *{line-height: 1.5;padding: 0;margin: 0;list-style: none!important;box-sizing: border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;}
.aps-container ul, .aps-container ol {padding-right: 0;padding-left: 0;list-style: none;border-bottom: none;border-right: none;border-left: none;}
.aps-feature-anim {z-index: 1 !important;}
.aps-feature-anim{height: 100%;width: 100%;padding: 0px 40px 15px 10px;margin-bottom: 10px;color: #fff;line-height: 15px;position: absolute;top: 0;right: 0;}
.aps-list-icon{background: #f9bd09;}
.aps-list-icon {height: 50px;padding: 12px 5px 5px;color: #fff;font-size: 24px;line-height: 24px;position: absolute;top: 0;right: 0;z-index: 99;width: 36px;}
.aps-icon-cpu:before {content: '\e893';}
.aps-feature-info {height: 20px;position: relative;z-index: 83;overflow: hidden;font-size: 11px;font-family: tajawal;}.aps-feature-info strong {display: inline-block;}
.aps-main-features, .aps-video-col {float:right;width: 50%;margin-right: 10px;}
.aps-product-pic {max-width: 45%;width: 45%;float:left; border: 1px solid #52525217;margin-top: 20px;}

@media screen and (max-width : 480px) {
  .aps-features-list li{width:100%;max-width:100%}
  }
  @media screen and (max-width : 320px){
  .aps-features-list li{width:100%;max-width:100%}
  }

وأخيرًا ، إذا لم ينجح الأمر معك ، يمكنك كتابة أي سؤال في التعليقات أدناه وسأرد عليك على الفور لمساعدتك :) شكرًا لك

إضافات بلوجر

تركيب إضافة مواصفات الهاتف لبلوجر

إضافة مواصفات الهاتف في مدونة بلوجر