Geri git   ForumAyyıldız | F.AY Forumları ve Paylaşım Platformu > Webmaster Dünyası > Hazır Scriptler > Mybb

Kullanıcı Etiketleme

Yeni Konu aç Cevapla
 
LinkBack Seçenekler Stil
Alt 12-04-2013   #1 (permalink)
Prenses
Laura - ait Kullanıcı Resmi (Avatar)
Üyelik Tarihi: Nov 2013
Mesajlar: 184
Konular: 97
Bulunduğu Yer: Ne Önemi Var? Düşün ki; Fizan'dan...
Mesleğiniz: :)
Burcunuz: Balık
Takımınız: Fenerbahçe
İlişki Durumu: Rabbine Aşık
Tecrübe Puanı: 455
Rep Puanı : 10
Aldığınız Beğeni: 75
Verdiğiniz Beğeni: 113
Standart MyBB Temanıza Login Box Yapımı

Şimdi öncelikle admin paneline girmelisiniz. Bütün işimiz orada çünkü ;
index şablonunu açın <head> tagının hemen altına aşağıdaki kodu girin :
Kod:

Kod:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

Bunu yapmamızın amacı jquery kodlarını çağırmak.
Altınada aşağıdaki kodu ekleyin ve burada işimizi biterelim.
Kod:


Kod:
<script type="text/javascript"> /** * Modal Boxes JS * * @author Euan T. <euan@euantor.com> * @version 1.0.0 */ jQuery.noConflict(); jQuery(document).ready(function($) { // Make the jQuery modal login redirect you back to the page you're currently on // $('#loginModal input[name="url"]').attr("value", window.location); // /Login redirect // // Modal Boxes // $('a[name="modal"]').on('click', function(event) { event.preventDefault(); var target = $(this).attr('rel'); // Set up the shadowing var maskHeight = $(document).height(); var maskWidth = $(window).width(); $('#mask').css({'width': maskWidth, 'height': maskHeight}); $('#mask').fadeIn(1000); $('#mask').fadeTo("slow", 0.8); // Position the actual modal var winH = $(window).height(); var winW = $(window).width(); $(target).css('top', (winH / 2) - ($(target).height() / 2)); $(target).css('left', (winW / 2) - ($(target).width() / 2)); $(target).fadeIn(2000); }); $('.modalBox a[rel="closeModal"]').on('click', function(event) { event.preventDefault(); $('#mask, .modalBox').hide(); }); $('#mask').on('click', function () { $(this).hide(); $('.modalBox').hide(); }); // /Modal Boxes // }); </script>



Kaydedip çıkalım. Merak etmeyin kodlarla fazla işimiz olmayacak


ve geldik artık login boxun en önemli kısmına. Şimdi header_welcomeblock_guest'e girelim ve tümünü bu kodlarla değişelim ;
Kod:


Kod:
<div id="mask"></div> Welcome guest! Please <a href="{$mybb->settings['bburl']}/member.php?action=login" name="modal" rel="#loginModal">{$lang->welcome_login}</a> or <a href="{$mybb->settings['bburl']}/member.php?action=register">{$lang->welcome_register}</a> <div id="loginModal" class="modalBox loginModalBox"> <div class="thead"> Login at {$mybb->settings['bbname']} </div> <div class="modalContent loginModalContent"> <form method="post" action="member.php"> <table border="0" width="100%"> <tr> <td> <label for="login_username">Username:</label> </td> <td> <input type="text" value="" style="width: 200px;" maxlength="30" size="25" name="username" class="textbox" id="login_username" /> </td> </tr> <tr> <td> <label for="login_password">Password:</label> </td> <td> <input type="password" value="" style="width: 200px;" size="25" name="password" class="textbox" id="login_password" /> </td> </tr> <tr> <td> <label class="smalltext" title="If ticked, your login details will be remembered on this computer, otherwise, you will be logged out as soon as you close your browser."><input type="checkbox" value="yes" checked="checked" name="remember" class="checkbox"> Remember?</label> </td> <td> <input type="submit" value="Login" name="submit" class="button" /> </td> </tr> </table> <input type="hidden" value="do_login" name="action" /> <input type="hidden" value="" name="url" /> </form> </div> </div>

Kaydettikten sonra son bir işlemimiz kaldı. Css yi eklemek. Temanızın gelişmiş css sine girin ve en aşağıya aşağıdaki kodu ekleyin.
Kod:



Kod:
#mask { position: absolute; z-index: 9010; background-color: #000000; display: none; top: 0; left: 0; } .modalBox { position: fixed; width: 440px; display: none; z-index: 9015; background: #ffffff; border: 1px solid #000000; -webkit-box-shadow: 0px 7px 10px 0px rgba(0,0,0,0.81); -moz-box-shadow: 0px 7px 10px 0px rgba(0,0,0,0.81); box-shadow: 0px 7px 10px 0px rgba(0,0,0,0.81); } .modalBox .thead { font-weight: bold; } .modalBox .modalContent { padding: 5px 10px; }




Not: Panel Tamamen İngilizcedir Türkçeleştirebilirsiniz.





Laura isimli Üye şimdilik offline konumundadır   Alıntı ile Cevapla
Cevapla

Tag Ekle
box, login, mybb, temanıza, yapımı


Konuyu Toplam 1 Üye okuyor. (0 Kayıtlı üye ve 1 Misafir)
 
Seçenekler
Stil

Yetkileriniz
Sizin Yeni Konu Acma Yetkiniz var yok
You may not post replies
You may not post attachments
You may not edit your posts

BB code is Açık
Smileler Açık
[IMG] Kodları Açık
HTML-KodlarıKapalı
Trackbacks are Açık
Pingbacks are Açık
Refbacks are Açık


Forum Sosyal
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2019, Jelsoft Enterprises Ltd.
SEO by vBSEO 3.6.1 ©2011, Crawlability, Inc.

Tasarım : VampRens
Açılış Tarihi: 30 Ağustos 2013
Forumayyildiz.Net Her Hakkı Saklıdır
Sitemap
1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 13, 15, 17, 18, 19, 22, 23, 24, 26, 27, 28, 29, 30, 31, 41, 42, 43, 45, 51, 53, 73, 74, 75, 76, 77, 78, 81, 83, 84, 85, 86, 87, 88, 89, 90, 91, 92, 93, 94, 95, 96, 97, 98, 100, 101, 103, 104, 105, 106, 107, 108, 109, 110, 111, 112, 113, 114, 115, 116, 117, 118, 119, 120, 121, 122, 123, 124, 126, 127, 128, 129, 130, 131, 132, 133, 135, 136, 137, 138, 139, 140, 141, 142, 143, 144, 145, 146, 147, 149, 151, 152, 153, 154, 155, 156, 157, 158, 159, 160, 161, 162, 163, 164, 165, 166, 167, 168, 169, 170, 171, 172, 175, 177, 178, 179, 180, 181, 182, 183, 185, 186, 187, 188, 189, 190, 191, 192, 193, 194, 195, 196, 197, 198, 199, 200, 201, 202, 203, 204, 205, 206, 207, 208, 209, 210, 211, 212, 213, 214, 215, 216, 217, 218, 219, 220, 221, 222, 223, 224, 225, 226, 227, 228, 229, 230, 231, 232, 233, 234, 235, 236, 237, 239, 240, 241, 242, 244, 245, 246, 248, 251, 252, 254, 255, 256, 257, 258, 259, 262, 263, 264, 265, 266, 267, 268, 269, 270, 271, 272, 273, 274, 275, 276, 277, 278, 280, 281, 282, 283, 284, 285, 286, 290, 296, 303, 307, 308, 309, 310, 311, 312, 313, 314, 316, 317, 318, 324, 325, 326, 327, 328, 329, 333, 334, 335, 336, 337, 338, 339, 340, 341, 342, 343, 344, 345, 346, 347, 348, 349, 350, 351, 352, 353, 354, 355, 356, 357, 358, 359, 360, 361, 362, 363, 364, 365, 366, 367, 368, 369, 387, 391, 392, 393, 394, 395, 396, 401, 402, 403, 404, 405, 406, 407, 408, 409, 410, 411, 412, 413, 414, 415, 416, 417, 418, 419, 420, 421, 422, 423, 424, 425, 426, 427, 428, 429, 430, 431, 432, 433, 434, 435, 437, 438, 439, 440, 441, 442, 443, 444, 445, 446, 447, 448, 449, 450, 451, 452, 453, 454, 455,