• أضافة صفحة تحميل أحترافية النسخه الثانية



    تم تصميم صفحة تحميل احترافية بعدما نالت صفحة التحميل النسخه الاولى اعجاب الكثير من زوار ومتابعين مدونة القيسي ويب واتمنى ان تعجبكم النسخة الثانية.
    كما شرحت سابقا هذه الاضافة تعطي جمال لمدونتك وخصوصا عند تصفح الزائر لمدونتكــ اي انها تظهر عند تحميل صفحات مدونتك وتختفي عند انتهاء تحميل الصفحه لا اريد ان اطيل عليكم سوف اترككم مع الشرح . طريقة التركيب
    1. قم بالدخول الى تحرير قالب مدونتك وابحث عن هذه الوسم </b:skin> وضع فوقه/قبله الكود التالي
    
    /* qaisi1web Material Loader */
    #loader-wrapper{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1000}#loader-wrapper .loader-section{position:fixed;top:0;width:51%;height:100%;background:#eceff1;z-index:1000;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}#loader-wrapper .loader-section.section-left{left:0}#loader-wrapper .loader-section.section-right{right:0}#loader{display:block;position:relative;left:-47%;top:50%;width:150px;height:150px;margin:-75px 0 0 -75px;border-radius:50%!important;border:3px solid transparent;border-top-color:#3498db;-webkit-animation:spin 2s linear infinite;animation:spin 2s linear infinite;z-index:1001}#loader:before{content:"";position:absolute;top:5px;left:5px;right:5px;bottom:5px;border-radius:50%;border:3px solid transparent;border-top-color:#e74c3c;-webkit-animation:spin 3s linear infinite;animation:spin 3s linear infinite}#loader:after{content:"";position:absolute;top:15px;left:15px;right:15px;bottom:15px;border-radius:50%;border:3px solid transparent;border-top-color:#f9c922;-webkit-animation:spin 1.5s linear infinite;animation:spin 1.5s linear infinite}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg)}}.loaded #loader-wrapper{visibility:hidden;-webkit-transform:translateY(-100%);-ms-transform:translateY(-100%);transform:translateY(-100%);-webkit-transition:all 0.3s 1s ease-out;transition:all 0.3s 1s ease-out}.loaded #loader-wrapper .loader-section.section-left{-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%);-webkit-transition:all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);transition:all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1)}.loaded #loader-wrapper .loader-section.section-right{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);-webkit-transition:all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);transition:all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1)}.loaded #loader{opacity:0;-webkit-transition:all 0.3s ease-out;transition:all 0.3s ease-out}.progress{background-color:rgba(255,64,129,0.22)}
    
    
    2. ضع الكود التالي اسفل/بعد هذه الوسم <body> مباشرة
    
    <div id='loader-wrapper'><div id='loader'/><div class='loader-section section-left'/><div class='loader-section section-right'/></div>
    
    
    3. قم بحفظ القالب وشاهد النتيجه . . . اتمنى ان تنال اعجابكم 🌹
    إقرأ أيضًا
    أضافة صفحة تحميل احترافية v1
    ان واجهت اي مشاكل تعليقاتكم مرحب بها . . . بالتوفيق 😍

    تم تصميم صفحة تحميل احترافية بعدما نالت صفحة التحميل النسخه الاولى اعجاب الكثير من زوار ومتابعين مدونة القيسي ويب واتمنى ان تعجبكم النس...

    روابط الموضوع للنسخ

    رابط
    HTML
    BBCode
    يسمح بنقل الموضوع لكن مع ذكر المصدر في نهاية الموضوع المنقول ووضع رابط الموضوع الأصلي
    أضافة صفحة تحميل أحترافية النسخه الثانية

    تم تصميم صفحة تحميل احترافية بعدما نالت صفحة التحميل النسخه الاولى اعجاب الكثير من زوار ومتابعين مدونة القيسي ويب واتمنى ان تعجبكم النس...

    15 تعليقات
    كيف تعلق ؟

    1. شكراا ليك اخي رووووعه

      ردحذف
    2. اخي لكن بعد ان يتم التحميل ينقلني الى صفحتك

      ردحذف
      الردود
      1. يبدو انك تستخدم قالب من تصميم مدونة القيسي ويب وقد قمت بحذف حقوق التصميم، صفحة التحميل ليست سبب مشكلتك

        حذف
    3. نعم اخي
      انا استخدم قالب فكرة مين

      هل يوجد حل لهذه المشكلة
      ارجواالرد باسرع وقت اخي

      ردحذف
      الردود
      1. صديقي يبدو انك حذفت حقوق التصميم، اعدها وسوف يعود كل شي كما كان

        حذف
    4. هل يوجد حل للمشكله
      انا استخدم قالب فكرة مين

      ردحذف
    5. اخي التحميل مستمر ولا ينقطع

      ردحذف
    6. غير معرف11/04/2017

      لما الصق
      <body>
      ما تيجي

      ردحذف
      الردود
      1. هل تقصد اننك لم تجده !
        هذه الوسم موجود في كل قوالب بلوجر .. ابحث عنه بالشكل التالي
        body>

        حذف
    7. اخى لم تتم

      ردحذف

    contact-us

    الاسم

    بريد إلكتروني *

    رسالة *