شرح تركيب الصندوق
اضافة جميلة جدا و هي عبارة عن تحميل تطبيق المدونة
توضع الأضافة بالسيد بار و بخطوات بسيطة جدا
طريقة التركيب
اذهب الى التخطيط واختار اضافة جديدة و الصق الكود التالي بداخلها مع تسميتها بما تريد و احفظها
<link href='//maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css' rel='stylesheet'/>
<style>
.blog-logo img {
width: 30%;
height: 30%;
border-radius: 20%;
}
.blog-app-text {
text-align: center;
}
.blog-app-title {
background: #3598DC;
color: #fff;
width: 65%;
display: inline-block;
padding: 3px;
text-align: center;
border-radius: 20px;
}
.blog-app-description {
padding: 5px 2px;
color: #737373
}
.download-app {
width: 100%;
height: 100%;
overflow: hidden;
}
.download-app a {
width: 48%;
display: inline-block;
float: right;
text-align: center;
margin: 3px;
border-radius: 30px;
padding: 4px 0;
color: #fff;
}
.android {
background: #74C043;
}
.ios {
background: #808080;
}
.tooltip {
-webkit-transition: all 200ms ease-out;
-moz-transition: all 200ms ease-out;
-o-transition: all 200ms ease-out;
-ms-transition: all 200ms ease-out;
transition: all 200ms ease-out;
position: absolute;
display: inline-block;
width: 130px;
HEIGHT: 23px;
line-height: 23px;
text-align: center;
margin-right: -71px;
margin-top: -30px;
font-size: 13px;
background: #02ADD4;
border-radius: 2px;
color: #FFFFFF;
opacity: 0;
}
.download-app a:hover .tooltip {
opacity: 1;
z-index: 9999;
}
</style>
<div class='blog-app'>
<div class='blog-logo'>
<center><a href='#'><img src='https://2.top4top.net/p_14213zxjc1.jpg'/></a></center>
<div>
<div class='blog-app-text'>
<h3 class='blog-app-title'>حمل تطبيق المدونة</h3>
<p class='blog-app-description'>
حمل تطبيق مدونتنا على هاتفك لتتوصل بكل جديدنا، وحتى لا يفوتك اي شيء ، فماذا تنتظر !
</p>
</div>
<div class='download-app'>
<a class='android' href='#'><i class="fa fa-android"/></i><span class='tooltip'>تحميل على الاندرويد</span></a>
<a class='ios' href='#'><i class="fa fa-apple"/></i><span class='tooltip'>تحميل على IOS</span></a>
</div>
</div></div></div>
التعديلات
- غير رابط صورة التطبيق الحالية بصورة التطبيق الخاصة بك
- استبدل علامة # برابط تحميل التطبيق على IOS و android
ثم قم بحفظ القالب و مبروك عليك الاضافة
شكرًا لوقتكم واهتمامكم بقراءة موضوع تركيب تحميل تطبيق المدونة لمدونات البلوجر. إذا صادفتكم أي مشكلة أثناء استخدام الكود أو كان لديكم أي استفسار، فلا تترددوا في طرحه ضمن التعليقات أو التواصل معنا عبر صفحة الاتصال بنا . ولا تنسوا الانضمام إلى متابعي مدونة هلا تك ليصلكم كل كل ما هو جديد.