KHALED ALMILBE




مدون ومطور قوالب بلوجر
My E-mail : ###
My Phone No. : #%^$#
My Website : www.k2d.us

اترك رسالتك

الاسم (إختيارى)

عنوان بريدك الإلكترونى (مطلوب)

محتوى الرسالة (مطلوب)

تابعنا على :

f tw +G yt vk

لدعمنا قم بمتابعة المدونة ليصلك كل جديدنا

اضغط هنا

9/23/2016

ليست هناك تعليقات
2016-09-23T17:48:00+03:00

إضافة احترافية لتعريف بصاحب المدونة بشكلين مختلفين

إضافة احترافية لتعريف بصاحب المدونة بشكلين مختلفين

اضافة لتعريف بصاحب المدونة
بشكل إحترافي ومميز

معاينة الأضافة

الأن بعد المعاينة طريقة التركيب

القالب - تحرير HTML ضع الكود التالي قبل <head> مباشرة

كود الشكل الأول

<style>/*<![CDATA[*/.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)}}@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)}}.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}}.idul_layout{text-align:center;position:fixed;top:0;left:0;bottom:0;right:0;background:rgba(0, 0, 0, 0.54);z-index:99999;display:none}.idul_message{width:50%;background:#fff;font-size:16px;border-radius:5px;padding:20px;line-height: 1.9em;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;font-family: 'droid-sans';}.profile-idul,.profile-idul2{padding:4px}.idul_message:before{content:"";height:0;width:0;position:absolute;bottom:-40px;left:20px;border:20px solid transparent;border-color:#fff transparent transparent}.profile-idul{background:#d03f42;border:1px solid transparent;border-radius:100%;position:fixed;bottom:10px;left:10px;cursor:pointer;width:50px;height:50px;z-index:9999}.profile-idul2{background:#fff;border:1px solid transparent;border-radius:100%;position:absolute;bottom:-240px;left:-120px;width:200px;height:200px}.close_idul{font-size:40px;color:#fff;position:absolute;top:-30px;right:-30px;cursor:pointer}@media (max-width:800px){.idul_message{width:90%!important;margin-left:-45%!important;}.profile-idul2{left:50%;margin-left:-105px;}.idul_message:before{left:50%;margin-left:-20px;}.close_idul{color:#555;top:-16px;right:0;}}/*]]>*/</style><link href='//www.fontstatic.com/f=droid-sans' rel='stylesheet' type='text/css'/>

كود الشكل الثاني

<style>/*<![CDATA[*/@-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)}}@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)}}@-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}}.idul_layout{text-align:center;position:fixed;top:0;left:0;bottom:0;right:0;background:rgba(0, 0, 0, 0.54);z-index:99999;display:none}.idul_message{width:50%;background:#fff;font-size:16px;border-radius:5px;padding:20px;line-height: 1.9em;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;font-family: 'droid-sans';}.profile-idul,.profile-idul2{padding:4px}.idul_message:before{content:"";height:0;width:0;position:absolute;bottom:-40px;left:20px;border:20px solid transparent;border-color:#fff transparent transparent}.profile-idul{background:#d03f42;border:1px solid transparent;border-radius:100%;position:fixed;bottom:10px;left:10px;cursor:pointer;width:50px;height:50px;z-index:9999}.profile-idul2{background:#fff;border:1px solid transparent;border-radius:100%;position:absolute;bottom:-240px;left:-120px;width:200px;height:200px}.close_idul{font-size:40px;color:#fff;position:absolute;top:-30px;right:-30px;cursor:pointer}@media (max-width:800px){.idul_message{width:90%!important;margin-left:-45%!important;}.profile-idul2{left:50%;margin-left:-105px;}.idul_message:before{left:50%;margin-left:-20px;}.close_idul{color:#555;top:-16px;right:0;}}/*]]>*/</style><link href='//www.fontstatic.com/f=droid-sans' rel='stylesheet' type='text/css'/>

ثم خطوة أخير ضع الكود التالي فوق <body> مباشرة
مع تغيير الكلام بما يناسبك

<img class='profile-idul tada' expr:alt='data:post.author' height='50' onclick='openIdulfitri()' src='http://a.top4top.net/p_266615s1.jpg' title='Click Me!' width='50'/><div class='idul_layout animated flip' id='id_fitri'>  <div class='idul_message'>    <h2>السلام عليكم ورحمة الله وبركاته</h2>    <p>أنا خالد الميلبي ,مؤسس مدونة حلولي - لدي القليل من الخبرة في مجال التدوين ,واضع بالمدونة مايفيد الزائر والمدون تابعنا قد نفيدك يوما&#1611;      <br/></p>    <img class='profile-idul2' expr:alt='data:post.author' height='200' src='http://a.top4top.net/p_266615s1.jpg' width='200'/>    <div class='close_idul' onclick='closeIdulfitri()'>&amp;times</div>  </div></div><script>//<![CDATA[function openIdulfitri(){var e=document.getElementById("id_fitri");"block"!==e.style.display?e.style.display="block":e.style.display="none"};function closeIdulfitri(){var e=document.getElementById("id_fitri");"none"!==e.style.display?e.style.display="none":e.style.display="block"};//]]></script>

واضغط حفظ وشاهد النتيجة
خطأ فى التحميل ! , ربما تكون المدونة غير عامة أو متاحة لمؤلفو المدونة فقط أو قد تكون خلاصة المدونة معطلة , من فضلك قم بجعل المدونة عامة و السماح بخلاصة المدونة كاملة لتفعيل هذه الإضافة , مزيد من المعلومات
عرض تعليقات : أو

ليست هناك تعليقات:

إرسال تعليق

المتابعون

حلولي *fb:https://www.facebook.com/hlo1y *tw:https://twitter.com/hlo1y *yt:https://www.youtube.com/user/v518v *gp:https://plus.google.com/+v518v *signature_img: https://2.bp.blogspot.com/-BB5G-R4BmMs/WYk0ptd5qGI/AAAAAAAAIuA/JYOxvfMzE9YdC1xMH9dytmkcAaWZt49XgCLcBGAs/s1600/sinature.png *txt: لـدي القليل مـن الخبره ، فـي مجال الـتدويـن اضع بالمدونة ما يـفـيـد الزائر والـمـدون ، تــابـعـنـا قـد نـفـيـدك يـومـاً peter hany *fb:https://www.facebook.com/peter.hany3 *tw: *yt: *gp: *signature_img:https://3.bp.blogspot.com/-_hF3OQo4bRA/WJ0VlzGC0qI/AAAAAAAAEUU/cddR54285KUQ1VigxKy-x8TUVwhsVEWUQCLcB/s1600/sinature.png *txt:اسمى بيتر هانى ميلاد , مصمم ومطور ويب , 20 سنة , مصرى الجنسية , أعيش فى محافظة المنوفية , طالب فى كلية الهندسة المدنية , أهتم بكل جديد فى مجال بلوجر وفى تطوير الويب , لدى خبرة فى إستعمال برامج الجرافيك , أحب تصميم القوالب البسيطة والتى تعطى إنطباع أنها ليست تحت فئة قوالب بلوجر ذات الإمكانيات المحدودة.