RevivaL |
09 Nisan 2021 21:21 |
Sohbet Siteleri İçin Sohbet Giriş Formu
Merhaba arkadaşlar sohbet siteleri için sohbete giriş login formu hazırladım sizler için.
html, html5 site için yapmanız gereken sadece kodu web sitenizin anasayfasına eklemek olacaktır.
Eğerki içerik yönetim sistemi wordpress veya bir başka sistem kullanıyorsanız bilişenler kısmından metin bilişeni ekleyerek kodu yapıştırabilirisiniz.
CSS KODUMUZ
HTML-Kodu:
<style type="text/css">
.chatForm {
max-width: 300px;
margin: auto;
border-radius: 2px;
text-align: left;
border: 1px solid [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f56892]#f56892[/URL]
font-family: 'Tahoma';
font-size: 14px;
background-color: [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f6fafe]#f6fafe[/URL]
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
position: relative;
z-index: 10;
overflow: hidden;
position: relative;
}
.chatForm h4 {
margin: 0 0 30px;
padding: 5px;
text-align: center;
font-size: 30px;
color:
[URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=666]#666[/URL]
border-bottom: solid 1px
[URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=e5e5e5]#e5e5e5[/URL]
}
.chatForm p {
margin: 0 0 2em;
position: relative;
font-size: .85rem;
line-height: 1.6;
}
.chatForm label {
position: absolute;
left: 8px;
top: 12px;
color: [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=000]#000[/URL]
font-size: 16px;
display: inline-block;
padding: 4px 10px;
font-weight: 400;
background-color: rgba(255,255,255,0);
-moz-transition: color .3s,top .3s,background-color .8s;
-o-transition: color .3s,top .3s,background-color .8s;
-webkit-transition: color .3s,top .3s,background-color .8s;
transition: color .3s,top .3s,background-color .8s;
top: -18px;
background-color:
rgba(255,255,255,.8);
font-size: 14px;
text-align: left;
}
.chatForm input {
display: block;
box-sizing: border-box;
width: 100%;
outline: 0;
margin: 0;
background: [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=fff]#fff[/URL]
border: 1px solid [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f56892]#f56892[/URL]
font-size: 1.6em;
padding: 15px 12px;
border-radius: 2px;
}
.chatForm input[type=submit] {
background:
[URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=369]#369[/URL]
border-radius: 2px;
border: none;
color:
[URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=fff]#fff[/URL]
cursor: pointer;
display: block;
font-size: 2em;
line-height: 1em;
outline: 0;
padding: .5em 0;
}
.chatForm .secim {
margin-top: -15px;
float: left;
width: 50%;
height: 25px;
}
.chatForm p.radiom {
float: left;
position: relative;
top: -4px;
font-size: 15px;
}
.chatForm input.radio {
top: 5px;
float: left;
}
.chatForm .h3 {
background: linear-gradient(top, #f56892, [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f95a75%29#93;#f95a75)[/URL]
background: -ms-linear-gradient(top, #f56892, [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f95a75%29#93;#f95a75)[/URL]
background: -webkit-gradient(linear, left top, left bottom, from(#f56892), to([URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f95a75%29%29#93;#f95a75))[/URL]
background: -moz-linear-gradient(top, #f56892, [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f95a75%29#93;#f95a75)[/URL]
color: white;
height: 65px;
line-height: 65px;
text-align: center;
margin-top: 0px;
margin-bottom: 5px;
font-size: 24px;
font-weight: 600;
}
.chatForm .form-group {
margin-bottom: 15px
}
.chatForm .chatContainer {
padding: 20px;
padding-bottom: 10px;
}
.chatForm .form-group input {
border: 1px solid [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f56892]#f56892[/URL]
border-radius: 3px;
font-size: 13px;
}
.chatForm .login-button {
background: linear-gradient(top, #eb668f, [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f25d6d%29#93;#f25d6d)[/URL]
background: -ms-linear-gradient(top, #eb668f, [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f25d6d%29#93;#f25d6d)[/URL]
background: -webkit-gradient(linear, left top, left bottom, from(#eb668f), to([URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f25d6d%29%29#93;#f25d6d))[/URL]
background: -moz-linear-gradient(top, #eb668f, [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f25d6d%29#93;#f25d6d)[/URL]
color: white;
font-weight: bold;
display: block;
width: 100%;
padding: 10px 16px;
font-size: 18px;
line-height: 1.3333333;
border-radius: 6px;
display: inline-block;
padding: 6px 12px;
margin-bottom: 0;
font-size: 20px;
font-weight: 400;
line-height: 1.42857143;
text-align: center;
white-space: nowrap;
vertical-align: middle;
-ms-touch-action: manipulation;
touch-action: manipulation;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
border: 1px solid transparent;
border-radius: 4px;
}
.chatForm .login-button:hover {
color: white;
background: linear-gradient(top, #f7c4d3, [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f56892%29#93;#f56892)[/URL]
background: -ms-linear-gradient(top, #f7c4d3, [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f56892%29#93;#f56892)[/URL]
background: -webkit-gradient(linear, left top, left bottom, from(#f7c4d3), to([URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f56892%29%29#93;#f56892))[/URL]
background: -moz-linear-gradient(top, #f7c4d3, [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f56892%29#93;#f56892)[/URL]
font-weight: bold;
}
.chatForm .social-area {
padding-bottom: 10px; </style>
HTML KODUMUZ
HTML-Kodu:
<form method="get" action="/sohbet" class="chatForm">
<h2 class="h3">İRCREHBERİ AİLESİ</h2>
<div class="chatContainer">
<div class="form-group">
<input type="text" class="form-control login-input input-lg fa fa-user" name="nick" id="nickname" placeholder="NİCK YAZIN..">
</div>
<div class="form-group">
<input type="text" class="form-control login-input input-lg" name="password" id="password" placeholder="ŞİFRE (varsa)">
</div>
<div class="form-group login-area">
<b> <button type="submit" class="btn btn-u btn-block login-button fa fa-angle-double-right"> <b>SOHBETE BAŞLA</b></button></b>
</div>
</div>
<input type="hidden" name="auto" value="1">
<center><p><font color="red"><b>18 yaşından büyükler içindir</b></font>.</p></center>
</form><br><br>
KODLARI BİR ARADA KULLANIM ŞEKLİ ANA SAYFA İNDEX'TE GÖSTERMEK İÇİN
HTML-Kodu:
<style type="text/css">
.chatForm {
max-width: 300px;
margin: auto;
border-radius: 2px;
text-align: left;
border: 1px solid [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f56892]#f56892[/URL]
font-family: 'Tahoma';
font-size: 14px;
background-color: [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f6fafe]#f6fafe[/URL]
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
position: relative;
z-index: 10;
overflow: hidden;
position: relative;
}
.chatForm h4 {
margin: 0 0 30px;
padding: 5px;
text-align: center;
font-size: 30px;
color:
[URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=666]#666[/URL]
border-bottom: solid 1px
[URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=e5e5e5]#e5e5e5[/URL]
}
.chatForm p {
margin: 0 0 2em;
position: relative;
font-size: .85rem;
line-height: 1.6;
}
.chatForm label {
position: absolute;
left: 8px;
top: 12px;
color: [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=000]#000[/URL]
font-size: 16px;
display: inline-block;
padding: 4px 10px;
font-weight: 400;
background-color: rgba(255,255,255,0);
-moz-transition: color .3s,top .3s,background-color .8s;
-o-transition: color .3s,top .3s,background-color .8s;
-webkit-transition: color .3s,top .3s,background-color .8s;
transition: color .3s,top .3s,background-color .8s;
top: -18px;
background-color:
rgba(255,255,255,.8);
font-size: 14px;
text-align: left;
}
.chatForm input {
display: block;
box-sizing: border-box;
width: 100%;
outline: 0;
margin: 0;
background: [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=fff]#fff[/URL]
border: 1px solid [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f56892]#f56892[/URL]
font-size: 1.6em;
padding: 15px 12px;
border-radius: 2px;
}
.chatForm input[type=submit] {
background:
[URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=369]#369[/URL]
border-radius: 2px;
border: none;
color:
[URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=fff]#fff[/URL]
cursor: pointer;
display: block;
font-size: 2em;
line-height: 1em;
outline: 0;
padding: .5em 0;
}
.chatForm .secim {
margin-top: -15px;
float: left;
width: 50%;
height: 25px;
}
.chatForm p.radiom {
float: left;
position: relative;
top: -4px;
font-size: 15px;
}
.chatForm input.radio {
top: 5px;
float: left;
}
.chatForm .h3 {
background: linear-gradient(top, #f56892, [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f95a75%29#93;#f95a75)[/URL]
background: -ms-linear-gradient(top, #f56892, [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f95a75%29#93;#f95a75)[/URL]
background: -webkit-gradient(linear, left top, left bottom, from(#f56892), to([URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f95a75%29%29#93;#f95a75))[/URL]
background: -moz-linear-gradient(top, #f56892, [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f95a75%29#93;#f95a75)[/URL]
color: white;
height: 65px;
line-height: 65px;
text-align: center;
margin-top: 0px;
margin-bottom: 5px;
font-size: 24px;
font-weight: 600;
}
.chatForm .form-group {
margin-bottom: 15px
}
.chatForm .chatContainer {
padding: 20px;
padding-bottom: 10px;
}
.chatForm .form-group input {
border: 1px solid [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f56892]#f56892[/URL]
border-radius: 3px;
font-size: 13px;
}
.chatForm .login-button {
background: linear-gradient(top, #eb668f, [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f25d6d%29#93;#f25d6d)[/URL]
background: -ms-linear-gradient(top, #eb668f, [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f25d6d%29#93;#f25d6d)[/URL]
background: -webkit-gradient(linear, left top, left bottom, from(#eb668f), to([URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f25d6d%29%29#93;#f25d6d))[/URL]
background: -moz-linear-gradient(top, #eb668f, [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f25d6d%29#93;#f25d6d)[/URL]
color: white;
font-weight: bold;
display: block;
width: 100%;
padding: 10px 16px;
font-size: 18px;
line-height: 1.3333333;
border-radius: 6px;
display: inline-block;
padding: 6px 12px;
margin-bottom: 0;
font-size: 20px;
font-weight: 400;
line-height: 1.42857143;
text-align: center;
white-space: nowrap;
vertical-align: middle;
-ms-touch-action: manipulation;
touch-action: manipulation;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
border: 1px solid transparent;
border-radius: 4px;
}
.chatForm .login-button:hover {
color: white;
background: linear-gradient(top, #f7c4d3, [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f56892%29#93;#f56892)[/URL]
background: -ms-linear-gradient(top, #f7c4d3, [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f56892%29#93;#f56892)[/URL]
background: -webkit-gradient(linear, left top, left bottom, from(#f7c4d3), to([URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f56892%29%29#93;#f56892))[/URL]
background: -moz-linear-gradient(top, #f7c4d3, [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=f56892%29#93;#f56892)[/URL]
font-weight: bold;
}
.chatForm .social-area {
padding-bottom: 10px; </style>
<form method="get" action="/sohbet" class="chatForm">
<h2 class="h3">İRCREHBERİ AİLESİ</h2>
<div class="chatContainer">
<div class="form-group">
<input type="text" class="form-control login-input input-lg fa fa-user" name="nick" id="nickname" placeholder="NİCK YAZIN..">
</div>
<div class="form-group">
<input type="text" class="form-control login-input input-lg" name="password" id="password" placeholder="ŞİFRE (varsa)">
</div>
<div class="form-group login-area">
<b> <button type="submit" class="btn btn-u btn-block login-button fa fa-angle-double-right"> <b>SOHBETE BAŞLA</b></button></b>
</div>
</div>
<input type="hidden" name="auto" value="1">
<center><p><font color="red"><b>18 yaşından büyükler içindir</b></font>.</p></center>
</form><br><br>
SON OLARAK DÜZENLEMENİZ GEREKEN YER
BURADA SOHBET KLASÖRÜ ADRESİNİ VEYA YOLUNU BELİRTİNİZ.
<form method="get" action="/sohbet" class="chatForm">
|