اضافة رسالة رمضان لمدونات بلوجر

اضافة رسالة رمضان لمدونات بلوجر

اضافة رسالة شخصية لمدونات بلوجر, اضافات بلوجر المحترف, المحترف, حوحو, عرب ويب, اضافات بلوجر

اضافة رسالة شخصية + صورتك لمدونات بلوجر


السلام عليكم,
بحلول رمضان فالعديد من المدونون يبحثون على اضافات رمضان ولكن للاسف الاضافات الموجودة لحد الان كلها قديمة او غير انيقة...
اليوم و حصريا اتيت لكم باضافة رائعة لمدونات بلوجر و هي عبارة عن رسالة يمكنك تغييرها كما تشاء يعني رسالة شخصية... المميز في الاضافة هي بعض التئتيرات تلاتية الابعاد التي سيستمتع الزائع عند معاينتها.
بالمناسبة, فانا ايضا استعمل الاضافة ^_^*

↓ شرح طريقة التركيب

  1. انضم لمتابعي الموقع من هنا
  2. ادخل الى القالب تحرير HTML
  3. فوق الوسم </b:skin> نضع الكود التالي

/*======  OuaMessage - by ara1tech.blogspot.com ====== */

.ara1tech_layout{text-align:center;position:fixed;top:0;left:0;bottom:0;right:0;background:rgba(0, 0, 0, 0.49);z-index:99999;display:none}
.ara1tech_message{width:50%;background:#fff;font-size:16px;border-radius:5px;padding:20px;border:1px solid transparent;text-align:center;color:#333;position:absolute;top:10%;left:50%;margin-left:-25%;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
.profile-ara1tech,.profile-ara1tech2{padding:4px}
.ara1tech_message:before{content:"";height:0;width:0;position:absolute;bottom:-40px;left:20px;border:20px solid transparent;border-color:#fff transparent transparent}
.profile-ara1tech {
    background: #2195D3;
    border: 1px solid transparent;
    border-radius: 100%;
    position: fixed;
    bottom: 10px;
    left: 10px;
    cursor: pointer;
    width: 50px;
    height: 50px;
    z-index: 9999;
}
.profile-ara1tech2 {
    background: #FFF;
    border: 5px solid transparent;
    border-radius: 100%;
    position: absolute;
    bottom: -240px;
    left: -123px;
    width: 199px;
    height: 199px;
}
.close_ara1tech {
    font-size: 40px;
    color: rgba(36, 202, 26, 0.91);
    position: absolute;
    top: -30px;
    right: -30px;
    cursor: pointer;
}
@media (max-width:800px){.ara1tech_message{width:90%!important;margin-left:-45%!important;}
.profile-ara1tech2{left:50%;margin-left:-105px;}
.ara1tech_message:before{left:50%;margin-left:-20px;}
.close_ara1tech{color:#555;top:-16px;right:0;}
}
.animated.flip{-webkit-backface-visibility:visible;backface-visibility:visible;-webkit-animation-name:flip;animation-name:flip;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}
@-webkit-keyframes flip{0%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-360deg);transform:perspective(400px) rotate3d(0,1,0,-360deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}
40%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}
50%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}
80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95);transform:perspective(400px) scale3d(.95,.95,.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}
100%{-webkit-transform:perspective(400px);transform:perspective(400px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}
}
@keyframes flip{0%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-360deg);transform:perspective(400px) rotate3d(0,1,0,-360deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}
40%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}
50%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}
80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95);transform:perspective(400px) scale3d(.95,.95,.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}
100%{-webkit-transform:perspective(400px);transform:perspective(400px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}
}
.tada{-webkit-animation:tada 1s linear 1s infinite normal;animation:tada 1s linear 1s infinite normal}
@-webkit-keyframes tada{0%,100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}
10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg)}
30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg)}
40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg)}
}
/* end  Oua-Message*/ 


  1. بعد دلك اضف الكود التالي فوق  </body>


<img alt='' class='profile-ara1tech tada' height='50' onclick='openara1techfitri()' src='https://goo.gl/cOr2jh' title='أنقر فوقي لأقول لك شيئا' width='50'/>
<div class='ara1tech_layout animated flip' id='id_fitri'>
<div class='ara1tech_message'>
<h2>&quot;رمضان مبارك لكل العرب&quot;</h2>
<p>بصفتي
<br/> مؤسس مدونة <b>عرب تيش</b> أهنئكم واقول لكم
      <br/>
<b>الله يتقبل صيامكم وقيامكم ومبارك عليكم الشهر </b>.</p>
<img alt='' class='profile-ara1tech2' height='200' src='https://goo.gl/cOr2jh' width='200'/>
<div class='close_ara1tech' onclick='closeara1techfitri()'>X</div>
</div>
</div>
<script>
//<![CDATA[
function openara1techfitri(){var e=document.getElementById("id_fitri");"block"!==e.style.display?e.style.display="block":e.style.display="none"};
function closeara1techfitri(){var e=document.getElementById("id_fitri");"none"!==e.style.display?e.style.display="none":e.style.display="block"};
//]]>
</script>

  1.  الان احفض القالب و هنيئا لك ^_^

مهم : اخي ان كنت تريد نسخ هده التدوينة ضع المصدر في النهاية و ضع رابط التدوينة المباشر #فل_نرتقي

اضافة رمضان لمدونات بلوجر,اضافة رمضان بلوجر,كيفية اضافة فانوس رمضان لمدونة بلوجر,اضافة فانوس رمضان بلوجر,اضافات بلوجر احترافية,اضافات بلوجر 2016,اضافات بلوجر رائعة,اضافات بلوجر احترافية 2016,اضافات بلوجر عرب ويب,اضافات بلوجر css,اضافات بلوجر مميزة,اضافة رسالة رمضان لبلوجر

قد تُعجبك هذه المشاركات