إضافة لتسجيل الدخول والخروج بحسابك بجوجل

إضافة لتسجيل الدخول والخروج بحسابك بجوجل

يوجد الآن مشاهدة التعليقات : 17

الموضوع

اقرأ ايضًا

التعليقات

عن الكاتب

تعليمات

مجددا ومع الحصريات من إضافات الويب من ضمنها قوالب بلوجر أتيح لكم إضافة فريدة لإستخدام الدخول لحسابك بجوجل وذلك عن طريق الأداة بالضغط عليها وكتابة بريدك الإلكتروني سيوجهك لدخول لحسابك وأيضا زر خاص بالخروج من الحساب أي Deconnexion مباشرة يقفل الحساب .. هذه الإضافة يمكن إستعمالها كتزيين للموقع أضفت إليها بعض التغيرات يمكنكم تجربة الأداة كاملة وبحرية تامة لإكتشاف طريقة عملها عبر المدونة التالية 

شرح  طريقة التركيب
1. داخل القالب ابحث عن  ]]></b:skin> ضع الكود التالي فوقه أو ضعه بين <style>   </style> فوق </head>
/* Css Admin Ar1web.com */
#adminblog{background: #F4836A;color: #fff!important;width:130px;border:none;font-size: 14px;font-family:ge_ss_threeregular;cursor:pointer;text-align:center;border:1px solid #e66f55;border-radius: 2px;padding:5px 0;position:absolute;top:10px;right:10px;transition:all .4s ease-in-out;}
.fa-user:before {content: "\f007";margin-right: 5px;padding: 10px 10px;background: #5A4F4F;}
#layoutlogin{background:#000;opacity:.7;position:absolute;top:0;left:0;right:0;bottom:0;z-index:99999;display:none}
#login{position:absolute;width:222px;height:auto;top:30%;left:50%;margin-left:-111px;font-family:Arial;z-index:100000;display:none}
#loginbox{background:#fff;width:200px;padding:10px;display:none;position:absolute;top:62px;left:0;border:1px solid #ddd;border-radius: 2px;z-index:1;overflow:hidden;}
#loginbox .emaillogin input.email {color: #777;padding: 10px;font-size: 14px;font-family:ge_ss_threeregular;width:89%;border:1px solid #ddd;border-radius: 2px;}
#loginbox .emaillogin input:focus {outline: none;}
#loginbox .emaillogin input.signin-btn{background: #F4836A;color: #fff!important;border:none;outline: none;width:100%;font-size: 14px;font-family:ge_ss_threeregular;cursor:pointer;border-radius: 2px;margin-top: 10px;padding: 11px;}
#login1,#login2{color: #777;padding:5px 10px;font-size: 14px;font-family:ge_ss_threeregular;width:38%;display:none;text-align:center;background:#fff;border:1px solid #ddd;border-radius: 2px;position:absolute;top:38px;left:0px;cursor:pointer;transition:all .4s ease-in-out;}
#login2{border-bottom:none;z-index:2}
#Admin1,#Admin2{color: #777;padding:5px 0;font-size: 14px;font-family:ge_ss_threeregular;width:100%;text-align:center;background:#fff;border:1px solid #ddd;border-radius: 2px;position:absolute;top:0px;left:0px;cursor:pointer;transition:all .4s ease-in-out;}
.logout{background: #F4836A;color: #fff!important;width:38%;font-size: 14px;font-family:ge_ss_threeregular;cursor:pointer;text-align:center;border:1px solid #e66f55;border-radius: 2px;padding:5px 10px;position:absolute;top:38px;right:-1px;transition:all .4s ease-in-out;}
a.logout{text-decoration:none}
#Admin1:hover,#login1:hover{background:#eee}
.logout:hover,#adminblog:hover{background:#d56148}
2. إبحث عن </body> وضع الكود التالي فوقه
<div id='adminblog' onclick='document.getElementById(&apos;login&apos;).style.display=&apos;block&apos;;layoutlogin.style.display=&apos;block&apos;;adminblog.style.display=&apos;none&apos;;'>تسجيل الدخول<i class='fa fa-user'/></div>
<div id='login'>
<div id='Admin1' onclick='document.getElementById(&apos;login1&apos;).style.display=&apos;inline&apos;;logoutbox.style.display=&apos;inline&apos;;Admin1.style.display=&apos;none&apos;;Admin2.style.display=&apos;inline&apos;;'>الدخول</div>
<div id='Admin2' onclick='document.getElementById(&apos;login1&apos;).style.display=&apos;none&apos;;logoutbox.style.display=&apos;none&apos;;Admin1.style.display=&apos;inline&apos;;Admin2.style.display=&apos;none&apos;;' style='display:none'>الرجاء الإختيار</div>
<div id='login1' onclick='document.getElementById(&apos;loginbox&apos;).style.display=&apos;block&apos;;login1.style.display=&apos;none&apos;;login2.style.display=&apos;inline&apos;;logoutbox.style.display=&apos;none&apos;;'>تسجيل الدخول</div>
<div id='login2' onclick='document.getElementById(&apos;loginbox&apos;).style.display=&apos;none&apos;;login1.style.display=&apos;inline&apos;;login2.style.display=&apos;none&apos;;logoutbox.style.display=&apos;inline&apos;;' style='display:none'>تسجيل الدخول</div>
<div id='loginbox'>
<div class='emaillogin'>
<form action='https://accounts.google.com/ServiceLogin?service=blogger&amp;continue=https://www.blogger.com/home&amp;followup=https://www.blogger.com/home' method='post' onsubmit='onlogin()' target='_blank'>
    <input class='email' name='Email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;البريد الإلكتروني&quot;;}' onfocus='if (this.value == &quot;البريد الإلكتروني&quot;) {this.value = &quot;&quot;;}' type='text' value='البريد الإلكتروني'/>
      <input class='signin-btn' name='submit' onclick='document.getElementById(&apos;login&apos;).style.display=&apos;none&apos;;layoutlogin.style.display=&apos;none&apos;;adminblog.style.display=&apos;block&apos;;' type='submit' value='الولوج للحساب'/>
    </form>
   </div>
  </div>  
    <div id='logoutbox' style='display:none'>
<a class='logout' href='https://accounts.google.com/Logout?service=blogger' onclick='document.getElementById(&apos;login&apos;).style.display=&apos;none&apos;;layoutlogin.style.display=&apos;none&apos;;adminblog.style.display=&apos;block&apos;;' target='_blank'>تسجيل الخروج
   </a>
  </div>
    </div>
<div style='clear:both'/>
<div id='layoutlogin'/>
ملحوظة:

يسعدنا تفاعلكم بالتعليق، لكن يرجى مراعاة الشروط التالية لضمان نشر التعليق
1أن يكون التعليق خاص بمحتوى التدوينة
2أن لا تضع أي روابط خارجية
3لإضافة كود حوله أولاً بمحول الأكواد
4أي سؤال خارج محتوى التدوينة يرجى استخدام ركن الأسئلة
5😊😉😀😁😎😍😜😑😇💖😯😱😭👍❓🍻

هناك 17 تعليقًا:

  1. ممكن رابط الصورة اللى تحت اللوجو اللى حضرتك كنت حططها قبل العجله بتاعت السحاب

    ردحذف
  2. مشكور اخي على الاضافه الرائعه بس اكو مشكله الخلفيه السوداء تظهر عندي نص في الاعلى موجوده وفي الاسفل غير موجوده ممكن حل لهذه المشكه =(

    ردحذف
    الردود
    1. يمكنك زيادة طول الخلفية ولفعل ذلك إبحث عن : #layoutlogin

      تحتها مباشرة أضف : height: 1000px;

      يمكنك زيادة طولها بتغيير 1000 إلى 1500 .. وهكذا بمقاس مدونتك

      حذف
  3. ما قصرت أبدآ

    ردحذف
  4. يأأخي الاضافة رائعة ولاكن حجمها صغير و وحجم كلمة تسجيل الخروج وكلمة تسجيل الدخول صغير جدً وغير ملائمها ارجوك اجد لي حلاً
    رابط المدونة
    http://www.drabdel3zim.ga
    :lv

    ردحذف
    الردود
    1. عليك بتكبير الخط ابحث عن #adminblog
      وستجد الأكواد أسفلها بالضبط : font-size: 14px;
      غير الرقم بالذي يرضيك

      حذف
  5. :lv
    انتا أحسن واحد قبلتو في حياتي انتا رجل تستحق كل الاحترام والتقدير وانا شخصيأ بحترمك:-bd
    |o|
    (ممكن تقولي علي كيفية يمكن تغير شكل صندوق التعليقات)

    ردحذف
  6. اخي تظهر لدي مشكلة ممكن المساعدة :) تظهر لي كتابة في اعلى الصفحة واسفل الصفحة http://cayberspece.blogspot.com/2014/08/teenage-mutant-ninja-turtles-2014-hd.html

    ردحذف
    الردود
    1. الكواد الذي وضعتها فوق </body> جرب وضعها فوق اكثر بالضبط فوق هذا الكود
      <script type='text/javascript'>
      //<![CDATA[
      $('#cssmenu ul ul li:odd').addClass('odd');

      فوق <script type='text/javascript'>

      حذف
  7. hosam18502/06/2015

    مشكورررررررررر يا رائع
    http://basmat-nja7.blogspot.com

    ردحذف
  8. أخي اريد تنزيله لتحت
    http://i.imgur.com/lFYC74S.png

    ردحذف
    الردود
    1. ابحث عن هذا الكود #adminblog ستجد بسطره : top: 10px; غير 10 بـ 100 مثلا أو على حسب الحد الذي تريد كلما صعدت في الرقم نزلت الإضافة

      حذف
  9. كيف يمكن تعديل اللون حتى يتناسق مع لون قالب المدونة

    ردحذف
  10. ههههههههههههه لكن للئسف انت تصنعها و الاخوة سيطورونها للختراق

    ردحذف

عن الكاتب :

إرشادات

    تحميل الملفات

    نستخدم بمدونتنا مواقع مختلفة في رفع الملفات ونوفر منها إثنان:
  • موقع : Mediafire
  • موقع :file-upload
  • باسوورد فك الضغط للملفات المضغوطة : Ar1web2014
  • تجدون روابط التحميل في القوالب والملحقات بجانب التدوينة أي بالسيدبار
  • كل ملحق أو قالب يوجد بالمدونة هو للإستعمال الشخصي فقط
  • إن تواجد رابط معطوب فالمرجو التبليغ عنه هنا، شكرا.
  • أين تجدنا؟

    بعيدا عن الصفحات المزورة أو المزيفة التي يحاول البعض من خلالها استغلال جهود فريق عمل عرب ويب، هذه هي حساباتنا وصفحاتنا الرسمية في الشبكات الاجتماعية، لا نمتلك سوى هذه الصفحات والحسابات وهي الوحيدة التي تتبع للمدونة : https://www.instagram.com/ar1web

    كلمة الختام

    في مدونة عرب ويب نسعى دوما جاهدين للتحسن والتقدم وليس ما تراه هو حدودنا! ونحن نقدر كثيرا زوارنا وآراؤهم فإن كان لديك أي اقتراح/نصيحة/ومضة مفيدة/نقد بناء أو ما إلى ذلك يمكنك مشاركتنا كل ما في جعبتك من خلال الإتصال بنا : istoretech3@gmail.com
أخر تعديل كان في يوم السبت 20 يونيو من سنة 2020 ، هذه الصفحة قابلة للتعديل وقت اللزوم