هل تعلم أن إضافات بلوجر يمكنها تحويل مدونتك من مجرد موقع بسيط إلى منصة احترافية تجذب الزوار وتحسّن تجربة المستخدم؟ إذا كنت تشعر أن مدونتك تفتقد لبعض الميزات التفاعلية أو أن أداءها يحتاج إلى تحسين، فأنت في المكان الصحيح.
أفضل 7 إضافات بلوجر لتحسين واجهة مدونتك الأمامية |
إضافات بلوجر ليست مجرد كماليات، بل هي أدوات ضرورية تساعدك على تحسين مضهر الموقع، تعزيز تفاعل الزوار، وتحقيق ترتيب أعلى في محركات البحث. سواء كنت ترغب في إضافة أزرار مشاركة اجتماعية، صناديق اشتراك، أو تحسين تجربة التصفح، فهناك العديد من الإضافات التي يمكن أن تمنح مدونتك لمسة احترافية.
في هذا الدليل، سنستعرض أفضل إضافات بلوجر للواجهة الأمامية، وكيف يمكن لكل واحدة منها تحسين مدونتك بشكل عملي وفعال. تابع القراءة لاكتشاف الأدوات التي ستأخذ موقعك إلى المستوى التالي!.
ما هي إضافات بلوجر ولماذا تحتاجها؟
هل تشعر أن موقعك على بلوجر ينقصه شيء ما؟ ربما تجد أن تجربة المستخدم ليست سلسة بالشكل الذي تريده، أو أن الزوار لا يتفاعلون مع المحتوى كما ينبغي. هنا يأتي دور إضافات بلوجر التي تمنح مدونتك ميزات احترافية تجعلها أكثر جذبًا وسرعة وتفاعلية.
إضافات بلوجر ليست مجرد كماليات، بل هي أدوات أساسية يمكنها تحسين أداء موقعك، تعزيز تجربة المستخدم، ورفع ترتيبه في محركات البحث. لكن السؤال الأهم: ما هي أفضل الإضافات التي يجب عليك استخدامها؟
كيف تحسن إضافات بلوجر تجربة المستخدم؟
قبل أن نغوص في قائمة أفضل الإضافات، دعونا نوضح تأثيرها المباشر على مدونتك:
- زيادة سرعة الموقع: بعض الإضافات تقلل حجم الصور وتحسن وقت تحميل الصفحات.
- تحسين التفاعل: أزرار المشاركة، التعليقات المحسنة، ونماذج الاشتراك تعزز التفاعل مع الزوار.
- رفع ترتيب موقعك في محركات البحث: إضافات SEO تساعد في تحسين العناوين والوصف وإدارة الروابط الداخلية.
- إضفاء لمسة احترافية على التصميم: عبر الخطوط الاحترافية، الوضع الليلي، وأدوات التخصيص.
أفضل إضافات بلوجر لواجهة المستخدم الأمامية
إضافة أيقونة لعرض الإشعارات يدوي
<!doctype html>
<style>
/* زر الإشعارات */
.notification-icon {
position: fixed;
bottom: 70px; /* رفع الموقع بنسبة 6% تقريباً */
right: 15px;
font-size: 18px;
cursor: pointer;
background: linear-gradient(45deg, #fff9f2, #fff7f8);
color: #fff;
padding: -10px;
border-radius: 90%;
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
transition: transform 0.3s, background-color 0.3s;
z-index: 1000;
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
}
.notification-icon:hover {
transform: scale(1.1);
background: linear-gradient(45deg, #f57c00, #ffa726);
}
/* شارة التنبيه */
.notification-badge {
position: absolute;
top: -2px; /* وضع الشعار فوق الأيقونة */
right: -5px;
background-color: #f44336;
color: #fff;
font-size: 12px;
font-weight: bold;
padding: 2px 6px;
border-radius: 50%;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
/* نافذة الإشعارات */
.notification-popup {
display: none;
position: fixed;
bottom: 60px;
right: 20px;
width: 270px;
background-color: #fff;
border: 1px solid #ccc;
border-radius: 10px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
padding: 10px;
z-index: 1000;
}
.notification-popup .title {
text-align: center;
font-size: 18px;
font-weight: bold;
color: #ff9800;
}
.notification-item {
margin-bottom: 10px;
border: 1px solid #ddd;
border-radius: 5px;
overflow: hidden;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.notification-item img {
width: 100%;
height: auto;
}
.notification-item a {
display: block;
padding: 8px;
font-weight: bold;
color: #333;
text-decoration: none;
}
.notification-item a:hover {
text-decoration: underline;
}
</style>
<!-- زر الإشعارات -->
<div class="notification-icon" id="notificationIcon">
<!-- أيقونة التنبيه -->
<svg width="456px" height="456px" viewbox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" fill="#000000"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <defs> <style>.cls-1{fill:#8c9eff;}.cls-2{fill:#5f7cf9;}</style> </defs> <g id="Bell"> <path class="cls-1" d="M19,28H13a1,1,0,0,0,0,2h6a1,1,0,0,0,0-2Z"></path> <path class="cls-1" d="M28.08,19.42l-2.08-1V12A10,10,0,0,0,6,12v6.38l-2.08,1A3.47,3.47,0,0,0,5.47,26H26.53a3.47,3.47,0,0,0,1.55-6.58Z"></path> <path class="cls-2" d="M19,28H16v2h3a1,1,0,0,0,0-2Z"></path> <path class="cls-2" d="M26.53,26a3.47,3.47,0,0,0,1.55-6.58l-2.08-1V12A10,10,0,0,0,16,2V26Z"></path> </g> </g></svg>
<!-- شارة التنبيه -->
<div class="notification-badge" id="notificationBadge">2</div>
</div>
<!-- نافذة الإشعارات -->
<div class="notification-popup" id="notificationPopup">
<div class="title">مواضيع رائجة</div>
<div class="notification-item">
<a href="https://www.asltk1.com/2024/12/winxvideo-ai-free-download.html">
<img alt="برنامج WinXVideo AI: وفر 69.95$ واحصل عليه بـ 0.0$ اليوم!" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjv5Of16YOwxyfIHIJ_cOWdXF56pm1JBcacAyiASxTqkv2F4ued8s7GSPVqnK4PHL01u2Cx-sJQWwUyzb94C_FJndb6HdTCPquDTJl4nyOnfQuNqumIdOI4T4YBieHscAqxFY5vQ7vO6YPFRQ385PdOnqA8-MmKzv3WImk5Hmw6sG9kRGzKA1K5rTJ77rQ/s16000/1000135754.jpg" />
<div class="pTtl aTtl">برنامج WinXVideo AI: وفر 69.95$ واحصل عليه بـ 0.0$ اليوم!</div>
</a>
</div>
<div class="notification-item">
<a href="https://www.asltk1.com/2024/12/seo-plus.html">
<img alt="احصل على قالب SEO Plus V8 المدفوع مجانا لتحسين مدونتك الآن" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVsK_YhkJN8UaiZ5JcR0XEAWUslnnIgV7DbrRLJX7BhMIIXy7ge2iSM6O3D3mijLpHbnUnHIRsmHHFgXni5lcrDBpAMDqlrlLUNQ3XJAoBXux0RqZP_w0ntF_Gxr2MnGlPlLoHYY5fHZe-r2V8dFivcEow9eDeHPV6c0bw906ejvdrV62Km8jKj5J9lYg/s16000/1000135835.jpg" />
<div class="pTtl aTtl">احصل على قالب SEO Plus V8 المدفوع مجانا لتحسين مدونتك الآن</div>
</a>
</div>
</div>
<script>
// دالة التبديل بين العرض والإخفاء
function toggleNotification() {
var popup = document.getElementById("notificationPopup");
var badge = document.getElementById("notificationBadge");
if (popup.style.display === "block") {
popup.style.display = "none";
} else {
popup.style.display = "block";
badge.style.display = "none"; // إخفاء الشارة عند عرض النافذة
}
}
// إضافة مستمع الحدث للزر
document.getElementById("notificationIcon").addEventListener("click", function (event) {
event.stopPropagation();
toggleNotification();
});
// إغلاق النافذة عند النقر خارجها
window.addEventListener("click", function () {
var popup = document.getElementById("notificationPopup");
popup.style.display = "none";
});
</script>
</!doctype>
إضافة صندوق مخصص للمواضيع
إضافة صندوق مخصص للمواضيع يمكن أن يحظى بشعبية كبيرة ويجذب الزوار. يساعد هذا على تنظيم وتنظيم المعلومات بشكل أسهل للفهم. يمكن للقراء الوصول بسرعة إلى المواضيع التي تهمهم. كما تنتج تجربة المستخدم، مما يزيد من احتمالية العودة للموقع. استخدام هذا وتتطلب تخطيطاً جيداً وفعالاً.
كود الإضافة:
<p style="--tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-ring-color: #3b82f680; --tw-ring-offset-color: #fff; --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-offset-width: 0px; --tw-ring-shadow: 0 0 #0000; --tw-rotate: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-scroll-snap-strictness: proximity; --tw-shadow-colored: 0 0 #0000; --tw-shadow: 0 0 #0000; --tw-skew-x: 0; --tw-skew-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; align-items: center; background-color: white; border-color: rgb(252, 140, 29) rgb(229, 231, 235) rgb(229, 231, 235); border-image: initial; border-radius: 10px; border-style: solid; border-width: 6px 0px 0px; box-shadow: rgba(100, 50, 30, 0.07) -3px 4px 18px 10px; box-sizing: inherit; display: flex; flex-direction: column; justify-content: center; line-height: 36px; margin: 60px 0px; padding: 22px; text-align: center; width: 350px;"><span class="ca-header" face=""IBM Plex Sans Arabic", sans-serif" style="--tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-ring-color: #3b82f680; --tw-ring-offset-color: #fff; --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-offset-width: 0px; --tw-ring-shadow: 0 0 #0000; --tw-rotate: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-scroll-snap-strictness: proximity; --tw-shadow-colored: 0 0 #0000; --tw-shadow: 0 0 #0000; --tw-skew-x: 0; --tw-skew-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; border: 0px solid rgb(229, 231, 235); box-sizing: inherit; color: #222222; font-weight: 700; margin-bottom: 15px; text-align: center;"><span style="font-size: medium;">مقالات في مجال صناعة المحتوى</span></span><span class="ca-paragraph" face=""IBM Plex Sans Arabic", sans-serif" style="--tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-ring-color: #3b82f680; --tw-ring-offset-color: #fff; --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-offset-width: 0px; --tw-ring-shadow: 0 0 #0000; --tw-rotate: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-scroll-snap-strictness: proximity; --tw-shadow-colored: 0 0 #0000; --tw-shadow: 0 0 #0000; --tw-skew-x: 0; --tw-skew-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; border: 0px solid rgb(229, 231, 235); box-sizing: inherit; color: #222222; line-height: 33px; text-align: center;"><span style="font-size: medium;">طوّر مهاراتك في صناعة المحتوى والتسويق الرقمي، واحترف استراتيجيات تحسين محركات البحث من خلال مقالاتنا المميزة</span></span><a class="goto" href="/search/label/صناعة المحتوى" rel="noopener noreferrer" style="--tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-ring-color: #3b82f680; --tw-ring-offset-color: #fff; --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-offset-width: 0px; --tw-ring-shadow: 0 0 #0000; --tw-rotate: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-scroll-snap-strictness: proximity; --tw-shadow-colored: 0 0 #0000; --tw-shadow: 0 0 #0000; --tw-skew-x: 0; --tw-skew-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; background: linear-gradient(270deg, rgb(252, 140, 29) 0.01%, rgb(251, 171, 24)); border-radius: 1.6rem; border: 0px solid rgb(240, 150, 84); box-sizing: inherit; color: white; cursor: pointer; font-family: "IBM Plex Sans Arabic", sans-serif; font-weight: 600; margin-top: 22px; min-width: 170px; outline: 0px; padding: 0.5rem 0.8rem; text-align: center; text-decoration-line: none; transition: 0.3s;" target="_blank"><span style="font-size: medium;">اقرأ المقالات الآن</span></a></p><div style="text-align: center;"><span face=""IBM Plex Sans Arabic", sans-serif" style="color: #222222;"><br /></span></div><p></p>
إضافة صندوق اشترك في الواتساب
<style>
*{box-sizing: border-box;}
.whatsapp-ayman:hover{background-color: rgb(14, 192, 34);color: aliceblue;
z-index: 0;
}
.whatsapp-ayman:hover .h333{color: aliceblue; transition: 1s;}
.whatsapp-ayman:hover .ayman-w{color: rgb(14, 192, 34);background-color: white !important;}
.whatsapp-ayman:hover .ooo{background-color:rgb(250, 250, 250);}
.whatsapp-ayman:hover .fa-whatsapp{color: rgb(14, 192, 34);background-color: white;}
.whatsapp-ayman{transition: 1s;border: 2px solid rgb(14, 192, 34);
position: relative;
overflow: hidden;
border-radius: 35px;
display: flex;
flex-direction: column;
align-content: center;
justify-content: center;
align-items: center;
padding: 10px;
margin:10px;
box-shadow: 0px 5px 5px rgb(14, 192, 34);}
.fa{ font-size: 40px !important;
}
.fa-whatsapp{transition: 1s;
color: beige;background-color: rgb(14, 192, 34);
border-radius: 25px;
padding: 10px;
font-size: 50px !important;
width: 100px;
height: 100px;
display: flex !important;
flex-direction: column;
align-content: center;
justify-content: center;
align-items: center;
margin: 10px 10px 30px 10px;
}
.ayman-w{transition: 1s;
color: beige ;background-color: rgb(14, 192, 34);
border-radius: 20px;
padding: 10px;
width: 150px;
display: flex !important;
flex-direction: column;
align-content: center;
justify-content: center;
align-items: center;
margin: 10px 10px 30px 10px;
text-decoration:none;
}
.ooo{background-color: rgb(14, 192, 34);width: 130px;height: 130px;border-radius: 100%;
position:absolute;
transition: 1s;
opacity: 0.8;
z-index: -1;
}
.or{
top: -30px;
left: -40px;
}
.ol{
bottom: -40px;
right: -50px;
}
</style>
<div class="whatsapp-ayman">
<div class="ooo or"></div>
<i class="fa fa-whatsapp" aria-hidden="true"></i>
<h3 class="h333">قناتنا على واتساب</h3>
<p><b>اشترك في قناتنا على واتساب</b></p>
<a class="ayman-w" href="https://whatsapp.com/channel/0029ValA7Dq6rsQrY05e1r01"><b>اشتراك</b></a>
<div class="ooo ol"></div>
</div>
إضافة ايقونات مواقع التواصل الاجتماعية
ما فائدة المحتوى الرائع إذا لم ينتشر؟ إضافة ايقونات مواقع التواصل الاجتماعية لمتابعة المقالات على فيسبوك، تويتر، واتساب، وإنستجرام بسهولة، مما يزيد من انتشار مدونتك.
كود الإضافة:
<!-- رابط مكتبة Font Awesome -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" />
<div class="item-post-inner" style="color: #757575; font-family: Tajawal, Arial, sans-serif; font-size: 0px; width: 100%; max-width: 400px;">
<div class="post-share" style="margin-top: 25px;">
<ul class="social-links" style="display: flex; flex-wrap: wrap; list-style: none; margin: 0; padding: 0;">
<!-- Facebook -->
<li style="padding: 5px;">
<a href="https://www.facebook.com/Sadamm49?mibextid=ZbWKwL" rel="nofollow" target="_blank" style="align-items: center; background-color: #3b5998; border-radius: 50%; color: white; display: flex; width: 42px; height: 42px; justify-content: center; text-decoration: none; box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);">
<i class="fab fa-facebook-f" style="font-size: 24px;"></i>
</a>
</li>
<!-- Twitter -->
<li style="padding: 5px;">
<a href="https://x.com/asltk_1?t=OVuQBZVrMVfI8kCzkFe1AQ&s=09" rel="nofollow" target="_blank" style="align-items: center; background-color: #1da1f2; border-radius: 50%; color: white; display: flex; width: 42px; height: 42px; justify-content: center; text-decoration: none; box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);">
<i class="fab fa-twitter" style="font-size: 24px;"></i>
</a>
</li>
<!-- Telegram -->
<li style="padding: 5px;">
<a href="https://t.me/asltk1" rel="nofollow" target="_blank" style="align-items: center; background-color: #0088cc; border-radius: 60%; color: white; display: flex; width: 42px; height: 42px; justify-content: center; text-decoration: none; box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);">
<i class="fab fa-telegram-plane" style="font-size: 24px;"></i>
</a>
</li>
<!-- Pinterest -->
<li style="padding: 5px;">
<a href="https://pin.it/68MM1cmcR" rel="nofollow" target="_blank" style="align-items: center; background-color: #bd081c; border-radius: 50%; color: white; display: flex; width: 42px; height: 42px; justify-content: center; text-decoration: none; box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);">
<i class="fab fa-pinterest-p" style="font-size: 24px;"></i>
</a>
</li>
<!-- WhatsApp -->
<li style="padding: 5px;">
<a href="https://whatsapp.com/channel/0029ValA7Dq6rsQrY05e1r01" rel="nofollow" target="_blank" style="align-items: center; background-color: #25d366; border-radius: 60%; color: white; display: flex; width: 42px; height: 42px; justify-content: center; text-decoration: none; box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);">
<i class="fab fa-whatsapp" style="font-size: 24px;"></i>
</a>
</li>
<!-- YouTube -->
<li style="padding: 5px;">
<a href="https://youtube.com/@asltk1?si=ogxFhw4sKLcsu9Hx" rel="nofollow" target="_blank" style="align-items: center; background-color: #ff0000; border-radius: 50%; color: white; display: flex; width: 42px; height: 42px; justify-content: center; text-decoration: none; box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);">
<i class="fab fa-youtube" style="font-size: 24px;"></i>
</a>
</li>
</ul>
</div>
</div>
إضافة صندوق اشتراك للموقع
إضافة صندوق اشتراك للموقع أمر ضروري لجذب الزوار وتحفيزهم على التفاعل. هذا البناء على المستخدمين التسجيل على التحديثات والمحتوى الجديد. يمكن أن تساعد في بناء قاعدة بيانات ذات جودة تمكنك من التواصل مع الجمهور بشكل أفضل. يبرز وضوح وضوحه ويساهم في إنتاج زوار اشتراك محتملين. استخدم عبارات تحفيزية بسيطة وتهدف إلى الاشتراك، مثل "اشترك الآن لتصلك آخر الأخبار". بوتيرة، يمكنك توجيه رسائل مخصصة للتعامل مع العملاء.
كود الإضافة:
<div class="fow-zn" style="color: #fff;">
<br />
<p style="text-align:center;">
<a class="mtec-btn" target="_blank" rel="noopener nofollow" href="5019987899649789899" style="color: #fff;" >
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhb5KqgvLJy2CfcAPqEZK8U9dfXfcSqBZK6iktG9abOyIBXlGvE8onlaSuOswaXcrV06WnLvelNUUKfnNmDRmrRqGvUkvf-aAScl239HUTXbBJbJxiWJOmrXIF3NGMYY2So8lWvUJRD_p8/s1600/69880002_2388725801390323_5503680644825219072_n.gif" style="
position: absolute;
width: 80px;
margin-left: auto;
margin-right: -36px;
margin-top: -50px;
z-index: 0;
" />
<br />
<b>إنضم إلى العائلة</b></a></p> <i class="fa fa-heart"></i>
<style>
.fow-zn{background:linear-gradient(to left,#3de3fe,#3d5afe);border:4px solid #0d30f1;border-radius:8px;padding:15px;}
.mtec-btn {
margin: 10px auto;
text-align: center;
text-decoration: none;
width: 171px;
cursor: pointer!important;
overflow: hidden;
text-decoration: none;
display: inline-block;
-webkit-appearance: none;
font-size: 1em;
border-radius: 4px;
color: rgba(255,255,255,0.8);
font-weight: 300;
padding: 5px 20px 20px 20px;
margin: 0 15px;
box-shadow: 0 2px 2px 1px rgb(0 0 0 / 10%);
transition: all 0.3s;
background: #3d5afe;
}
</style>
</div>
إضافة صندوق لعرض التطبيقات والالعاب
إضافة صندوق لعرض التطبيقات والألعاب هي فكرة لتحسين تجربة المستخدم. يوفر هذا إمكانية الوصول السريع للبرامج المختلفة مما يشكل اختيارها. يساعد على تنظيم المحتوى وجعله أكثر وضوحًا. كما يمكن أن يؤدي إلى زيادة استخدام التطبيقات والألعاب. من المهم تصميمها بشكل جذاب ليقصد الزوار. يجب أن تتضمن معلومات بسيطة عن كل تطبيق أو لعبة، مثل الصور والتقييمات، لتكون أكثر فائدة.
كود الإضافة:
<p><br /></p><div><div class="program-box row align-items-center justify-content-evenly" style="--bs-gutter-x: 1.5rem; --bs-gutter-y: 0; align-items: center; background: rgb(250, 250, 250); border-radius: 13px; border: 1px solid rgb(228, 228, 228); box-sizing: border-box; display: flex; flex-wrap: wrap; justify-content: space-evenly; margin: 25px auto; max-width: 835px; padding: 40px 20px;"><div class="image col-md-5 col-12" style="box-sizing: border-box; flex: 0 0 auto; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: var(--bs-gutter-y); max-width: 100%; padding-bottom: 0px; padding-left: calc(var(--bs-gutter-x)/ 2); padding-right: calc(var(--bs-gutter-x)/ 2); padding-top: 0px; perspective: 600px; width: 325.636px;"><img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOh3bo4Idz2hNKUNIOG2sLe32TrHCUYSnHjddfM2F3j6ZDbG3wUzKGr02UOxseLevOcYqwoIkHQiC5ToeYcF973sAV_t3ZA5sTX_3E1e1YsNW7dWnnwK-S14tETi9Z3el4nnYh9gAQFRwAk6M8x6XzC3CneTxSdWgGzarONOKXSR3jmvyYa4rt2Z5NMt8/s1007/1000130436.png" style="aspect-ratio: auto; border-radius: 7px; box-shadow: rgba(0, 0, 0, 0.05) -10px 11px 15px; box-sizing: border-box; display: block; height: 80px; margin: auto; max-width: 100%; padding: 0px; position: absolute; vertical-align: middle; width: 80px;" /></div><div class="program-details col-md-7 col-12" style="box-sizing: border-box; flex: 0 0 auto; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: var(--bs-gutter-y); max-width: 100%; padding-bottom: 0px; padding-left: calc(var(--bs-gutter-x)/ 2); padding-right: calc(var(--bs-gutter-x)/ 2); padding-top: 0px; width: 325.636px;"><ul class="program-title d-md-flex d-block align-items-center" style="align-items: center; box-sizing: border-box; list-style: none; margin: 0px 95px 0px 0px; padding: 15px 0px;"><li class="program-details-title col-12 col-sm-4 col-sm-3 col-lg-3" style="box-sizing: border-box; flex: 0 0 auto; margin: 0px; padding: 0px; width: 206.636px;"><img alt="" src="https://www.mutaz.pro/bootstrap/images/program_title_icon.svg" style="aspect-ratio: auto; box-sizing: border-box; display: inline-block; margin: 0px; max-width: 100%; padding: 0px; vertical-align: middle;" /><span class="ms-1" style="box-sizing: border-box; color: #1c6d8f; margin-bottom: 0px; margin-left: 0px; margin-right: 0.25rem !important; margin-top: 0px; margin: 0px 0.25rem 0px 0px; padding: 0px;">الإسم:</span></li><li class="program-details-content col-12 col-sm-8 col-sm-9 col-lg-9" style="box-sizing: border-box; flex: 0 0 auto; margin: 0px; padding: 0px; width: 206.636px;"><b><span style="color: #2b00fe;">أصل للمعلوميات ASLTK</span></b></li></ul><ul class="program-desc align-items-center mb-4 mt-3" style="align-items: center; box-sizing: border-box; list-style: none; margin-bottom: 1.5rem !important; margin-left: 0px; margin-right: 0px; margin-top: 35px !important; margin: 35px 0px 1.5rem; padding: 0px;"><li class="program-details-title mb-3" style="box-sizing: border-box; margin-bottom: 1rem !important; margin-left: 0px; margin-right: 0px; margin-top: 0px; margin: 0px 0px 1rem; padding: 0px;"><img alt="" src="https://www.mutaz.pro/bootstrap/images/program_desc_icon.svg" style="aspect-ratio: auto; box-sizing: border-box; display: inline-block; margin: 0px; max-width: 100%; padding: 0px; vertical-align: middle;" /><span class="ms-1" style="box-sizing: border-box; color: #1c6d8f; margin-bottom: 0px; margin-left: 0px; margin-right: 0.25rem !important; margin-top: 0px; margin: 0px 0.25rem 0px 0px; padding: 0px;">الوصف:</span></li><li class="program-details-content" style="box-sizing: border-box; margin: 0px; padding: 0px;"><p style="box-sizing: border-box; margin: 0px 0px 1rem; padding: 0px;"><span style="color: #2b00fe;">أحدث إصدار أصل للمعلوميات هو مصدرك الموثوق للمعلومات حول عالم التكنولوجيا الحديثة والويب. نسعى لتقديم محتوى ذو جودة عالية ومفيد للقرّاء الباحثين عن معلومات شاملة حول أحدث التطورات في هذه المجالات. ويدعم اللغة العربية 64 بت نسخة كاملة أوفلاين رابط واحد مباشر.</span></p></li></ul><ul class="d-flex align-items-center" style="align-items: center; box-sizing: border-box; display: flex; list-style: none; margin: 0px; padding: 0px;"><li class="program-details-title col-6 col-sm-6 col-sm-6 col-lg-6" style="box-sizing: border-box; flex: 0 0 auto; margin: 0px; padding: 0px; width: 150.818px;"><img alt="" src="https://www.mutaz.pro/bootstrap/images/program_version_icon.svg" style="aspect-ratio: auto; box-sizing: border-box; display: inline-block; margin: 0px; max-width: 100%; padding: 0px; vertical-align: middle;" /><span class="ms-1" style="box-sizing: border-box; color: #1c6d8f; margin-bottom: 0px; margin-left: 0px; margin-right: 0.25rem !important; margin-top: 0px; margin: 0px 0.25rem 0px 0px; padding: 0px;">الإصدار:</span></li><li class="program-details-content col-6 col-sm-6 col-sm-6 col-lg-6" style="box-sizing: border-box; flex: 0 0 auto; margin: 0px; padding: 0px; width: 150.818px;"><span style="box-sizing: border-box; color: #2b00fe; margin: 0px; padding: 0px;">2025 v26.3.0.156</span></li></ul><ul class="d-flex align-items-center my-2" style="align-items: center; box-sizing: border-box; display: flex; list-style: none; margin-bottom: 0.5rem !important; margin-left: 0px; margin-right: 0px; margin-top: 0.5rem !important; margin: 0.5rem 0px; padding: 0px;"><li class="program-details-title col-6 col-sm-6 col-sm-6 col-lg-6" style="box-sizing: border-box; flex: 0 0 auto; margin: 0px; padding: 0px; width: 150.818px;"><img alt="" src="https://www.mutaz.pro/bootstrap/images/program_size_icon.svg" style="aspect-ratio: auto; box-sizing: border-box; display: inline-block; margin: 0px; max-width: 100%; padding: 0px; vertical-align: middle;" /><span class="ms-1" style="box-sizing: border-box; color: #1c6d8f; margin-bottom: 0px; margin-left: 0px; margin-right: 0.25rem !important; margin-top: 0px; margin: 0px 0.25rem 0px 0px; padding: 0px;">الحجم:</span></li><li class="program-details-content col-6 col-sm-6 col-sm-6 col-lg-6" style="box-sizing: border-box; flex: 0 0 auto; margin: 0px; padding: 0px; width: 150.818px;"><span style="box-sizing: border-box; color: #2b00fe; margin: 0px; padding: 0px;">155.22 KB</span></li></ul><ul class="d-flex align-items-center my-2" style="align-items: center; box-sizing: border-box; display: flex; list-style: none; margin-bottom: 0.5rem !important; margin-left: 0px; margin-right: 0px; margin-top: 0.5rem !important; margin: 0.5rem 0px; padding: 0px;"><li class="program-details-title col-6 col-sm-6 col-sm-6 col-lg-6" style="box-sizing: border-box; flex: 0 0 auto; margin: 0px; padding: 0px; width: 150.818px;"><img alt="" src="https://www.mutaz.pro/bootstrap/images/program_core_icon.svg" style="aspect-ratio: auto; box-sizing: border-box; display: inline-block; margin: 0px; max-width: 100%; padding: 0px; vertical-align: middle;" /><span class="ms-1" style="box-sizing: border-box; color: #1c6d8f; margin-bottom: 0px; margin-left: 0px; margin-right: 0.25rem !important; margin-top: 0px; margin: 0px 0.25rem 0px 0px; padding: 0px;">نوع النسخة:</span></li><li class="program-details-content col-6 col-sm-6 col-sm-6 col-lg-6" style="box-sizing: border-box; flex: 0 0 auto; margin: 0px; padding: 0px; width: 150.818px;"><span style="box-sizing: border-box; color: #2b00fe; margin: 0px; padding: 0px;">apk</span></li></ul><ul class="d-flex align-items-center" style="align-items: center; box-sizing: border-box; display: flex; list-style: none; margin: 0px; padding: 0px;"><li class="program-details-title col-6 col-sm-6 col-sm-6 col-lg-6" style="box-sizing: border-box; flex: 0 0 auto; margin: 0px; padding: 0px; width: 150.818px;"><img alt="" src="https://www.mutaz.pro/bootstrap/images/program_download_icon.svg" style="aspect-ratio: auto; box-sizing: border-box; display: inline-block; margin: 0px; max-width: 100%; padding: 0px; vertical-align: middle;" /><span class="ms-1" style="box-sizing: border-box; color: #1c6d8f; margin-bottom: 0px; margin-left: 0px; margin-right: 0.25rem !important; margin-top: 0px; margin: 0px 0.25rem 0px 0px; padding: 0px;">عدد التحميلات:</span></li><li class="program-details-content col-6 col-sm-6 col-sm-6 col-lg-6" style="box-sizing: border-box; flex: 0 0 auto; margin: 0px; padding: 0px; width: 150.818px;"><span style="box-sizing: border-box; color: #2b00fe; margin: 0px; padding: 0px;">89793</span></li></ul><a class="download-program-btn d-md-inline-block d-block text-center" href="https://download856.mediafire.com/0tatk6nstwzgVzQK0---9JVPBzFeF47GREgwAM9Wi1rpGi8eHri0caGJgzz9IWzWjLdIO9XGk4QsWZpRjV0Im72oNlScd_tVlqj0OkqvyY8kgWi-JesV5g6GVwSeJ40M3SDZWsKlaBXfnwyw-yF86DVEF9aPOIYxCuiUiZEO6VPOXw/ic2ld58hpc7qz1n/base.apk" rel="nofollow" style="background-color: #1c6d8f; border-radius: 25px; border: 1px solid rgb(28, 109, 143); box-sizing: border-box; color: white; display: block; font-size: 19px; margin: 30px 0px 0px; padding: 9px 27px; text-align: center; text-decoration-line: none; transition: 0.3s;" target="_blank">التحميل المباشر</a></div></div></div>
إضافة صندوق اشترك قناة يوتيوب
إضافة صندوق الاشتراك إلى قناة يوتيوب تعتبر فكرة مهمة لجذب المشاهدين. هاذ الإضافة سوف تقوم في زيادة عدد المتابعين. يمكن للمستخدمين الضغط على زر الاشتراك بسهولة دون الحاجة إلى البحث في القناة. من التنسيق الجيد. احرص على وضعه في مكان بارز لجذب الانتباه. استخدام الألوان المناسبة مع تصميم القناة يمكن أن تنتج من فعاليته.
كود الإضافة:
<p><br /></p><section class="widget widget_block" id="block-2" style="background: rgb(255, 255, 255); box-sizing: inherit; color: #555555; font-family: sky, sans-serif; font-size: 14px; margin: 0px 0px 10.5909px; visibility: visible;"><div class="ms-youtube" style="box-sizing: inherit; text-align: center;"><div class="ms-icon-svg" style="align-items: center; background: red; border-radius: 50%; box-sizing: inherit; color: white; display: inline-flex; padding: 30px;"><svg viewbox="0 0 32
32"><g><path d="M29.73,9.9A5,5,0,0,0,25.1,5.36a115.19,115.19,0,0,0-18.2,0A5,5,0,0,0,2.27,9.9a69,69,0,0,0,0,12.2A5,5,0,0,0,6.9,26.64c3,.24,6.06.36,9.1.36s6.08-.12,9.1-.36a5,5,0,0,0,4.63-4.54A69,69,0,0,0,29.73,9.9Zm-2,12A3,3,0,0,1,25,24.65a113.8,113.8,0,0,1-17.9,0,3,3,0,0,1-2.78-2.72,65.26,65.26,0,0,1,0-11.86A3,3,0,0,1,7.05,7.35C10,7.12,13,7,16,7s6,.12,9,.35a3,3,0,0,1,2.78,2.72A65.26,65.26,0,0,1,27.73,21.93Z"></path><path d="M21.45,15.11l-8-4A1,1,0,0,0,12,12v8a1,1,0,0,0,.47.85A1,1,0,0,0,13,21a1,1,0,0,0,.45-.11l8-4a1,1,0,0,0,0-1.78ZM14,18.38V13.62L18.76,16Z"></path></g></svg></div><h2 style="box-sizing: inherit; clear: both; color: #222222; font-family: sky-bold, sans-serif; font-size: 24px; margin-top: 20px;">اشترك في قناتنا على يوتيوب</h2><p style="box-sizing: inherit; line-height: 25px; margin: 20px 0px;">اشترك الان لمتابعة كل ماهو جديد وحصري على قناتنا</p><a href="https://youtube.com/@asltk1?si=uPh7RDW5kxVkAlly" style="background-color: red; border-radius: 10px; box-sizing: inherit; color: white; display: block; font-size: 17px; font-weight: 700; margin: 10px auto; padding: 10px 0px; position: relative; text-decoration-line: none; transition: 0.3s; width: 150px;">اشتراك</a></div></section><section class="widget widget_text" id="text-77" style="background: rgb(255, 255, 255); box-sizing: inherit; color: #555555; font-family: sky, sans-serif; font-size: 14px; margin: 0px 0px 10.5909px; visibility: visible;"><div class="textwidget" style="box-sizing: inherit;"><br /></div></section>
كيفية تثبيت إضافات بلوجر بسهولة؟
يمكنك تثبيت إضافات بلوجر من خلال التنسيق و فتح نافذة جديدة أين ما شئت ان يضره الكود وقم بل اختيار HTML/JavaScript وضع الكود ثم حفظ.
أهم المعايير لاختيار أفضل الإضافات
- التأكد من توافق الإضافة مع قالب بلوجر المستخدم.
- اختيار الإضافات الخفيفة التي لا تبطئ الموقع.
- تجربة الإضافات على موقع تجريبي قبل تطبيقها على الموقع الرئيسي.
ملاحظة: لقد بذلنا جهدًا كبيرًا في صنع الأكواد المذكورة تقديرًا لك. اترك لنا تعليقًا!
خاتمة: إذا كنت تبدأ الآن، فإن أهم الإضافات التي يجب أن تركز عليها هي الإضافات التي تحسن سرعة الموقع وتجربة المستخدم، مثل جدول المحتويات، أزرار المشاركة، ونماذج الاشتراك. وبعد ذلك، يمكنك إضافة ميزات متقدمة مثل تحسين SEO وإضافات التخصيص.