AcasaAcasa  Ultimele imaginiUltimele imagini  CăutareCăutare  ÎnregistrareÎnregistrare  ConectareConectare  

 :: PS , IT ,PLATFORME WEB :: ForumGratuit :: TutorialeDistribuiţi|

Tutorial | Pop-ul Login

Vezi subiectul anterior Vezi subiectul urmator In jos
AutorMesaj
D3M0NHASH*L
D3M0NHASH*L

Funcţie: Co-Administrator
Subiecte : 57
Bani în mână : 96
Mulţumiri Primite : 1
Stare de spirit : :)
Tutorial | Pop-ul Login Empty
MesajSubiect: Tutorial | Pop-ul Login Tutorial | Pop-ul Login Icon_minitimeSam Mai 03, 2014 6:00 pm
Mergem in ACP -> Afisare -> Template-uri -> General -> overall_hader
Cod:
<!-- BEGIN switch_login_popup -->
  <div id="login_popup">
      <table class="forumline" width="{LOGIN_POPUP_WIDTH}" height="{LOGIN_POPUP_HEIGHT}" border="0" cellspacing="1" cellpadding="0">
        <tr height="25">
            <td class="catLeft">
              <span class="genmed module-title">{SITENAME}</span>
            </td>
        </tr>
        <tr height="{LOGIN_POPUP_MSG_HEIGHT}">
            <td class="row1" align="left" valign="top">
              <div id="login_popup_buttons">
                  <form action="{S_LOGIN_ACTION}" method="get">
                    <input type="submit" class="mainoption" value="{L_LOGIN}" />
                    <input type="button" class="mainoption" value="{L_REGISTER}" onclick="parent.location='{U_REGISTER}';" />
                    <input id="login_popup_close" type="button" class="button" value="{L_DONT_DISPLAY_AGAIN}" />
                  </form>
              </div>
              <span class="genmed">{LOGIN_POPUP_MSG}</span>
            </td>
        </tr>
      </table>
  </div>
  <!-- END switch_login_popup -->
Si il inlocuim cu :
Cod:
    <!-- BEGIN switch_login_popup -->
      <div id="login_popup">
    <form class="logare" action="./login.forum?connexion" method="post">
    <h1>{SITENAME}</h1>
    <font color=white><b><p>Salut, pentru a beneficia de toate premisiunile pe forum, te rugam sa te conectezi</p></b></font>
    <input class="conectare-casauta" placeholder="Nume Utilizator" name="username" size="15" maxlength="40" type="text">
    <input class="conectare-casauta" placeholder="Parola"  name="password" size="15" maxlength="32" type="password">
    <input class="conectare-trimite" name="login" value="Conectare" type="submit">
    <input type="button" value="{L_REGISTER}" class="mergi_la_inregistrare" onclick="parent.location='{U_REGISTER}';" />
    <input id="login_popup_close" class="nu_mai_afisa_iar" type="button" value="{L_DONT_DISPLAY_AGAIN}" />
    </form>
      </div>
      <!-- END switch_login_popup -->
Mergem in ACP -> Afisare -> Imagini si Culori -> Culori -> Foaie de STILL CSS si adaugam:
Cod:
/* Script Created By BaxAndrei(BaxAndrei.MexiMas.Com) for ForumGratuit(Help.ForumGratuit.Ro) - Login PopUP */

#login_popup > form > h1 {
font-size: 20px;
}

#login_popup > form > font > b > p {
font-size: 12px;
}

#login_popup:hover {
opacity: 1;
}
#login_popup {
opacity: 0.4;
}

.logare {
  height: 330px;
  margin: 50px auto;
  padding: 18px 20px;
  width: 290px;
  background: #3f65b7;
  background-clip: padding-box;
  border: 1px solid #172b4e;
  border-bottom-color: #142647;
  border-radius: 5px;
  background-image: -webkit-radial-gradient(cover, #437dd6, #3960a6);
  background-image: -moz-radial-gradient(cover, #437dd6, #3960a6);
  background-image: -o-radial-gradient(cover, #437dd6, #3960a6);
  background-image: radial-gradient(cover, #437dd6, #3960a6);
  -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.3), inset 0 0 1px 1px rgba(255, 255, 255, 0.1), 0 2px 10px rgba(0, 0, 0, 0.5);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.3), inset 0 0 1px 1px rgba(255, 255, 255, 0.1), 0 2px 10px rgba(0, 0, 0, 0.5);
}
.logare > h1 {
  margin-bottom: 20px;
  font-size: 16px;
  font-weight: bold;
  color: white;
  text-align: center;
  text-shadow: 0 -1px rgba(0, 0, 0, 0.4);
}

.conectare-casauta {
  display: block;
  width: 270px;
  font-size: 15px;
  height: 37px;
  margin-bottom: 20px;
  padding: 0 9px;
  color: white;
  text-shadow: 0 1px black;
  background: #2b3e5d;
  border: 1px solid #15243b;
  border-top-color: #0d1827;
  border-radius: 4px;
  background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.2) 20%, rgba(0, 0, 0, 0));
  background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.2) 20%, rgba(0, 0, 0, 0));
  background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.2) 20%, rgba(0, 0, 0, 0));
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.2) 20%, rgba(0, 0, 0, 0));
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.2);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.2);
}
.conectare-casauta:focus {
  outline: 0;
  background-color: #32486d;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3), 0 0 4px 1px rgba(255, 255, 255, 0.6);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3), 0 0 4px 1px rgba(255, 255, 255, 0.6);
}
.lt-ie9 .conectare-casauta {
  line-height: 35px;
}

.conectare-trimite {
  display: block;
  width: 100%;
  height: 37px;
  margin-bottom: 15px;
  font-size: 14px;
  font-weight: bold;
  color: #294779;
  text-align: center;
  text-shadow: 0 1px rgba(255, 255, 255, 0.3);
  background: #adcbfa;
  background-clip: padding-box;
  border: 1px solid #284473;
  border-bottom-color: #223b66;
  border-radius: 4px;
  cursor: pointer;
  background-image: -webkit-linear-gradient(top, #d0e1fe, #96b8ed);
  background-image: -moz-linear-gradient(top, #d0e1fe, #96b8ed);
  background-image: -o-linear-gradient(top, #d0e1fe, #96b8ed);
  background-image: linear-gradient(to bottom, #d0e1fe, #96b8ed);
  -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), inset 0 0 7px rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.15);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), inset 0 0 7px rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.15);
}
.conectare-trimite:active {
  background: #a4c2f3;
  -webkit-box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.4), 0 1px rgba(255, 255, 255, 0.1);
  box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.4), 0 1px rgba(255, 255, 255, 0.1);
}

.conectare-parola-uitata {
  text-align: center;
}
.conectare-parola-uitata > a {
  font-size: 11px;
  color: #d4deef;
  text-decoration: none;
  text-shadow: 0 -1px rgba(0, 0, 0, 0.4);
}
.conectare-parola-uitata > a:hover {
  text-decoration: underline;
}

input.mergi_la_inregistrare {
float: left;
padding-left: 3px;
padding-right: 3px;
width: 50%;
line-height: 30px;
font-size: 12px;
height: 30px;
display: block;
height: 37px;
margin-bottom: 15px;
font-size: 14px;
font-weight: bold;
color: #294779;
text-align: center;
text-shadow: 0 1px rgba(255, 255, 255, 0.3);
background: #adcbfa;
background-clip: padding-box;
border: 1px solid #284473;
border-bottom-color: #223b66;
border-radius: 4px;
cursor: pointer;
background-image: -webkit-linear-gradient(top, #d0e1fe, #96b8ed);
background-image: -moz-linear-gradient(top, #d0e1fe, #96b8ed);
background-image: -o-linear-gradient(top, #d0e1fe, #96b8ed);
background-image: linear-gradient(to bottom, #d0e1fe, #96b8ed);
-webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), inset 0 0 7px rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.15);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), inset 0 0 7px rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.15);
}

input.nu_mai_afisa_iar {
float: left;
padding-left: 3px;
padding-right: 3px;
width: 50%;
line-height: 30px;
font-size: 12px;
height: 30px;
display: block;
height: 37px;
margin-bottom: 15px;
font-size: 14px;
font-weight: bold;
color: #294779;
text-align: center;
text-shadow: 0 1px rgba(255, 255, 255, 0.3);
background: #adcbfa;
background-clip: padding-box;
border: 1px solid #284473;
border-bottom-color: #223b66;
border-radius: 4px;
cursor: pointer;
background-image: -webkit-linear-gradient(top, #d0e1fe, #96b8ed);
background-image: -moz-linear-gradient(top, #d0e1fe, #96b8ed);
background-image: -o-linear-gradient(top, #d0e1fe, #96b8ed);
background-image: linear-gradient(to bottom, #d0e1fe, #96b8ed);
-webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), inset 0 0 7px rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.15);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), inset 0 0 7px rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.15);
}

/* End Login PopUp */
Tutorial realizat de:BaxAndrei
Sus In jos
Zekennn
Zekennn

Funcţie: Administrator
Subiecte : 450
Bani în mână : 1012
Mulţumiri Primite : 23
Localizare : Salaj
Tutorial | Pop-ul Login Empty
MesajSubiect: Re: Tutorial | Pop-ul Login Tutorial | Pop-ul Login Icon_minitimeSam Mai 03, 2014 7:45 pm
Felicitari autorului pentru realizarea tutorialului si ti-e pentru ca l-ai postat aici si fiind ca ai postat si autorul tutorialului.
Sus In jos
https://dexter.all-up.com

Tutorial | Pop-ul Login

Vezi subiectul anterior Vezi subiectul urmator Sus

Subiecte similare

-
t [TUTORIAL] Tutorial IPTABLES firewall linux – comenzi de baza
t [TUTORIAL] Cum sa creezi masini personalizate cel mai usor tutorial
t Tutorial | Semnatura
t Tutorial | No lag in GTA:SA
t [Tutorial] Cum se fac bani
Pagina 1 din 1

Permisiunile acestui forum:Nu puteti raspunde la subiectele acestui forum
 :: PS , IT ,PLATFORME WEB :: ForumGratuit :: Tutoriale-