مجددا ومع الحصريات من إضافات الويب من ضمنها قوالب بلوجر أتيح لكم إضافة فريدة لإستخدام الدخول لحسابك بجوجل وذلك عن طريق الأداة بالضغط عليها وكتابة بريدك الإلكتروني سيوجهك لدخول لحسابك وأيضا زر خاص بالخروج من الحساب أي 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('login').style.display='block';layoutlogin.style.display='block';adminblog.style.display='none';'>تسجيل الدخول<i class='fa fa-user'/></div>
<div id='login'>
<div id='Admin1' onclick='document.getElementById('login1').style.display='inline';logoutbox.style.display='inline';Admin1.style.display='none';Admin2.style.display='inline';'>الدخول</div>
<div id='Admin2' onclick='document.getElementById('login1').style.display='none';logoutbox.style.display='none';Admin1.style.display='inline';Admin2.style.display='none';' style='display:none'>الرجاء الإختيار</div>
<div id='login1' onclick='document.getElementById('loginbox').style.display='block';login1.style.display='none';login2.style.display='inline';logoutbox.style.display='none';'>تسجيل الدخول</div>
<div id='login2' onclick='document.getElementById('loginbox').style.display='none';login1.style.display='inline';login2.style.display='none';logoutbox.style.display='inline';' style='display:none'>تسجيل الدخول</div>
<div id='loginbox'>
<div class='emaillogin'>
<form action='https://accounts.google.com/ServiceLogin?service=blogger&continue=https://www.blogger.com/home&followup=https://www.blogger.com/home' method='post' onsubmit='onlogin()' target='_blank'>
<input class='email' name='Email' onblur='if (this.value == "") {this.value = "البريد الإلكتروني";}' onfocus='if (this.value == "البريد الإلكتروني") {this.value = "";}' type='text' value='البريد الإلكتروني'/>
<input class='signin-btn' name='submit' onclick='document.getElementById('login').style.display='none';layoutlogin.style.display='none';adminblog.style.display='block';' 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('login').style.display='none';layoutlogin.style.display='none';adminblog.style.display='block';' target='_blank'>تسجيل الخروج
</a>
</div>
</div>
<div style='clear:both'/>
<div id='layoutlogin'/>
شكرا
ردحذفممكن رابط الصورة اللى تحت اللوجو اللى حضرتك كنت حططها قبل العجله بتاعت السحاب
ردحذفتفضل : http://goo.gl/uzpVuE
حذفمتشكر جدا :)
حذفمشكور اخي على الاضافه الرائعه بس اكو مشكله الخلفيه السوداء تظهر عندي نص في الاعلى موجوده وفي الاسفل غير موجوده ممكن حل لهذه المشكه =(
ردحذفيمكنك زيادة طول الخلفية ولفعل ذلك إبحث عن : #layoutlogin
حذفتحتها مباشرة أضف : height: 1000px;
يمكنك زيادة طولها بتغيير 1000 إلى 1500 .. وهكذا بمقاس مدونتك
ما قصرت أبدآ
ردحذفيأأخي الاضافة رائعة ولاكن حجمها صغير و وحجم كلمة تسجيل الخروج وكلمة تسجيل الدخول صغير جدً وغير ملائمها ارجوك اجد لي حلاً
ردحذفرابط المدونة
http://www.drabdel3zim.ga
:lv
عليك بتكبير الخط ابحث عن #adminblog
حذفوستجد الأكواد أسفلها بالضبط : font-size: 14px;
غير الرقم بالذي يرضيك
:lv
ردحذفانتا أحسن واحد قبلتو في حياتي انتا رجل تستحق كل الاحترام والتقدير وانا شخصيأ بحترمك:-bd
|o|
(ممكن تقولي علي كيفية يمكن تغير شكل صندوق التعليقات)
اخي تظهر لدي مشكلة ممكن المساعدة :) تظهر لي كتابة في اعلى الصفحة واسفل الصفحة http://cayberspece.blogspot.com/2014/08/teenage-mutant-ninja-turtles-2014-hd.html
ردحذفالكواد الذي وضعتها فوق </body> جرب وضعها فوق اكثر بالضبط فوق هذا الكود
حذف<script type='text/javascript'>
//<![CDATA[
$('#cssmenu ul ul li:odd').addClass('odd');
فوق <script type='text/javascript'>
مشكورررررررررر يا رائع
ردحذفhttp://basmat-nja7.blogspot.com
أخي اريد تنزيله لتحت
ردحذفhttp://i.imgur.com/lFYC74S.png
ابحث عن هذا الكود #adminblog ستجد بسطره : top: 10px; غير 10 بـ 100 مثلا أو على حسب الحد الذي تريد كلما صعدت في الرقم نزلت الإضافة
حذفكيف يمكن تعديل اللون حتى يتناسق مع لون قالب المدونة
ردحذفههههههههههههه لكن للئسف انت تصنعها و الاخوة سيطورونها للختراق
ردحذف