03-01-2014 Saat: 18:38
Tasarım ve Kodlama ByHayaLeT
Kurulum:
Admin KP - Temalar ve Şablonlar - Temalar - Temanız - Css Oluştur;
Dosya Adı: header.css
Genel Stil
Kendi İçeriğimi Yazmak İstiyorum
Admin KP - Temalar ve Şablonlar - Şablonlar - Temanız - Header Şablonları
header'in İçindekileri Sil ve Aşağıdakileri Yerleştir
Admin KP - Temalar ve Şablonlar - Şablonlar - Temanız - Header Şablonları
header_welcomeblock_guest'in İçindekileri Sil ve Aşağıdakileri Yerleştir
Admin KP - Temalar ve Şablonlar - Şablonlar - Temanız - Header Şablonları
header_welcomeblock_member'in İçindekileri Sil ve Aşağıdakileri Yerleştir
Admin KP - Temalar ve Şablonlar - Şablonlar - Temanız - Navigasyon Şablonları
nav'in İçindekileri Sil ve Aşağıdakileri Yerleştir
Admin KP - Temalar ve Şablonlar - Şablonlar - Temanız - Navigasyon Şablonları
nav_bit'in İçindekileri Sil ve Aşağıdakileri Yerleştir
Admin KP - Temalar ve Şablonlar - Şablonlar - Temanız - Navigasyon Şablonları
nav_bit_active'in İçindekileri Sil ve Aşağıdakileri Yerleştir
nav_sep ve nav_sep_active'nin içindekileri silin yani boş kalsın içi ve kaydedin.
İşlem Tamamdır ;)
BEN NEXT'İM ARKADAŞLAR :) :)
Kurulum:
Admin KP - Temalar ve Şablonlar - Temalar - Temanız - Css Oluştur;
Dosya Adı: header.css
Genel Stil
Kendi İçeriğimi Yazmak İstiyorum
Kod:
@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:500);
/* 2f4b87 */
/* 2f4b87 */
/* #1f325d */
/* Menu CSS */#cssmenu {
width: auto;
}
#cssmenu,
#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a {
padding: 0;
margin: 0;
line-height: 1;
font-family: 'Source Sans Pro', sans-serif;
font-weight: 500;
font-size: 16px;
color: #ffffff;
-webkit-transition: all ease .3s;
-o-transition: all ease .3s;
-moz-transition: all ease .3s;
-ms-transition: all ease .3s;
transition: all ease .3s;
}
#cssmenu:before,
#cssmenu:after,
#cssmenu > ul:before,
#cssmenu > ul:after {
content: '';
display: table;
}
#cssmenu:after,
#cssmenu > ul:after {
clear: both;
}
#cssmenu a {
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
}
#cssmenu ul {
background: #3b5998;
border-radius: 3px;
border: 1px solid #2b4479;
border: 1px solid #2d4373;
-webkit-box-shadow: 0 1px 2px rgba(2, 2, 2, 0.25), inset 0 1px 1px rgba(255, 255, 255, 0.15);
-o-box-shadow: 0 1px 2px rgba(2, 2, 2, 0.25), inset 0 1px 1px rgba(255, 255, 255, 0.15);
-moz-box-shadow: 0 1px 2px rgba(2, 2, 2, 0.25), inset 0 1px 1px rgba(255, 255, 255, 0.15);
-ms-box-shadow: 0 1px 2px rgba(2, 2, 2, 0.25), inset 0 1px 1px rgba(255, 255, 255, 0.15);
box-shadow: 0 1px 2px rgba(2, 2, 2, 0.25), inset 0 1px 1px rgba(255, 255, 255, 0.15);
}
#cssmenu ul > li {
float: left;
list-style: none;
}
#cssmenu ul > li > a {
display: block;
text-decoration: none;
padding: 15px 44px;
position: relative;
}
#cssmenu ul > li > a:hover {
background: #2d4373;
-webkit-box-shadow: inset 0 0 1px #1e2e4f;
-o-box-shadow: inset 0 0 1px #1e2e4f;
-moz-box-shadow: inset 0 0 1px #1e2e4f;
-ms-box-shadow: inset 0 0 1px #1e2e4f;
box-shadow: inset 0 0 1px #1e2e4f;
-webkit-transition: all ease .3s;
-o-transition: all ease .3s;
-moz-transition: all ease .3s;
-ms-transition: all ease .3s;
transition: all ease .3s;
}
#cssmenu ul > li > a:hover:before {
content: '';
z-index: 2;
position: absolute;
border: 1px solid white;
border-top: 0;
border-bottom: 0;
border-right: 0;
width: 100%;
height: 100%;
top: 0;
left: -1px;
opacity: .2;
}
#cssmenu ul > li > a:hover:after {
content: '';
z-index: 2;
position: absolute;
border: 1px solid white;
border-top: 0;
border-bottom: 0;
border-left: 0;
width: 100%;
height: 100%;
top: 0;
right: -1px;
opacity: .2;
}
#cssmenu > ul > li > ul {
opacity: 0;
visibility: hidden;
position: absolute;
}
#cssmenu > ul > li:hover > ul {
opacity: 1;
visibility: visible;
position: absolute;
border-radius: 0 0 3px 3px;
-webkit-box-shadow: none;
-o-box-shadow: none;
-moz-box-shadow: none;
-ms-box-shadow: none;
box-shadow: none;
}
#cssmenu > ul > li > ul {
width: 200px;
position: absolute;
}
#cssmenu > ul > li > ul > li {
float: none;
position: relative;
}
#cssmenu > ul > li > ul > li > ul {
opacity: 0;
visibility: hidden;
position: absolute;
}
#cssmenu > ul > li > ul > li:hover > ul {
opacity: 1;
visibility: visible;
position: absolute;
}
#cssmenu > ul > li > ul > li > ul {
left: 200px;
top: 1px;
width: 200px;
}
#cssmenu > ul > li > ul > li > ul > li {
float: none;
}
#hayaletv3{
border:none;
border:0px;
margin:0px;
padding:0px;
font-family:times new roman;
font-size:14px;
font-weight:bold;
color:8e8e8e;
}
#hayaletv3 ul{
background:url(http://j1307.hizliresim.com/1c/r/qp99c.gif) top left repeat-x;
height:43px;
list-style:none;
margin:0;
padding:0;
}
#hayaletv3 li{
float:left;
padding:0px 8px 0px 8px;
}
#hayaletv3 li a:hover{
color:#000000;
text-decoration:none;
}
#hayaletv3 li ul{
background:#e0e0e0;
border-left:2px solid #fce10e;
border-right:2px solid #fce10e;
border-bottom:2px solid #fce10e;
display:none;
height:auto;
filter:alpha(opacity=95);
opacity:0.95;
position:absolute;
width:225px;
z-index:200;
/*top:1em;
/*left:0;*/
}
#hayaletv3 li:hover ul{
display:block;
}
#hayaletv3 li li {
display:block;
float:none;
padding:0px;
width:225px;
}
#hayaletv3 li ul a{
display:block;
font-size:12px;
font-style:normal;
padding:0px 10px 0px 15px;
text-align:left;
}
#hayaletv3 li ul a:hover{
background:#FFCC00;
color:#FF0000;
opacity:1.0;
filter:alpha(opacity=100);
}
/*--------[Pro-v8 NavBar Css - 2013 X.S]--------*/
#navigasyon {
font-family: tahoma;
background: #E9EFF5 url(http://st.10tl.net/tema/diesel/nav_bg.png) repeat-x 0 0;
display: block;
height: 35px;
line-height: 35px;
margin: auto;
border: 1px solid #D1D1D1;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
font-size: 11px;
}
#navigasyon ol li {
float: left;
display: inline-block;
margin: 0 3px;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-o-transition: all 0.5s;
-ms-transition: all 0.5s;
transition: all 0.5s;
}
#navigasyon ol li a {
color: #757575;
text-shadow: 1px -1px 1px #eee;
padding-left: 12px;
background: url(http://st.10tl.net/tema/diesel/nav_hover_bg.png) no-repeat 0 0;
display: block;
outline: none;
text-decoration: none;
margin-left: -15px;
}
#navigasyon ol li:first-child {
width: 30px;
margin-left: 15px;
}
#navigasyon ol li a img {
display: none;
}
#navigasyon_list li:first-child:hover img {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
opacity: 1;
}
#navigasyon_list li:first-child a {
background: url(http://st.10tl.net/tema/diesel/nav_hover_bg.png) right top !important;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
position: relative;
width: 35px;
height: 35px;
}
#navigasyon_list li:first-child a:hover {
background-position: 100% -43px !important;
}
#navigasyon_list li:first-child a img {
display: block;
position: relative;
max-width: 22px;
right: 3px;
top: 7px;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
filter: alpha(opacity=50);
opacity: 0.5;
}
/* div yerine span eklendi */
#navigasyon_list li:first-child a i {
display: none;
}
#navigasyon_list li:last-child span {
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
background: none;
}
#navigasyon_list li:first-child span:hover {
background-position: 100% -43px !important;
}
#navigasyon_list li:last-child a {
font-family: tahoma;
font-weight: bold;
color: #555;
font-size: 11px;
background: none;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
#navigasyon li:hover a {
background-position: 0 -43px;
color: #444;
}
#navigasyon li:active a {
color: #666;
text-shadow: none;
background-position: 0 -86px;
}
#navigasyon ol li a span {
background: url(http://st.10tl.net/tema/diesel/nav_hover_bg.png) right top;
display: block;
padding-left: 4px;
padding-right: 12px;
}
#navigasyon li:hover span {
background-position: 100% -43px;
}
#navigasyon li:active span {
background-position: 100% -86px;
}
#navigasyon_list {
margin:0px; padding:0px;
}
/*-----[Pro-v8 NavBar Font Hover Css - 2013 X.S]-------*/
.nav_font {
font-weight: bold;
font-style: normal;
font-family: Tahoma, Geneva, Sans-Serif;
}
.nav_font_aktif {
font-size: 12px;
color: #3C4A9A;
}
.nav_font_aktif:hover {
color: #333;
}
.slideright:hover {
-webkit-transform: translate(1em, 0pt);
-moz-transform: translate(1em, 0pt);
-o-transform: translate(1em, 0pt);
-ms-transform: translate(1em, 0pt);
}
.showbox {
-webkit-transition: all 1s ease-in-out 0s;
-moz-transition: all 1s ease-in-out 0s;
-o-transition: all 1s ease-in-out 0s;
-ms-transition: all 1s ease-in-out 0s;
}
.hayaletemre {
background: #efefef urlhttp://st.10tl.net/tema/karanlik/destek.10tl.net-v4/kirmizi/arkaplan_bg_k.gif);
color: #000;
font-family: Verdana, Arial, Sans-Serif;
font-size: 13px;
text-align: center;
line-height: 1.4;
background-attachment: fixed;
}
Admin KP - Temalar ve Şablonlar - Şablonlar - Temanız - Header Şablonları
header'in İçindekileri Sil ve Aşağıdakileri Yerleştir
Kod:
<div id="header">
<div id='cssmenu'>
<ul>
<li class='active'><a href='/'><span>Anasayfa</span></a></li>
<li class='has-sub'><a href='/portal.php'><span>Portal</span></a></li>
<li><a href='/memberlist.php'><span>Üye Listesi</span></a></li>
<li class='last'><a href='/search.php'><span>Arama</span></a></li>
<li class='last'><a href='/calendar.php'><span>Takvim</span></a></li>
<li class='last'><a href='/misc.php?action=help'><span>Yardım</span></a></li>
<li class='last'><a href='https://www.facebook.com/hayalet.designnn'><span>ByHayaLeT</span></a></li>
<li class='last'><a href='Link Ekle'><span>Link -1</span></a></li>
<li class='last'><a href='Link Ekle'><span>Link -2</span></a></li>
</ul>
</div>
<div class="hayaletemre"><div class="float_left"><div class="showbox slideright"><div class="logo"><a href="{$mybb->settings['bburl']}/index.php"><img src="{$theme['logo']}" alt="{$mybb->settings['bbname']}" title="{$mybb->settings['bbname']}" /></a></div></div></div><div float_right">{$welcomeblock}</div></div>
<br>
<br>
<br>
<navigation>
<br>
<div id="container">
<hr class="hidden" />
<br class="clear" />
<div id="content">
{$pm_notice}
{$bannedwarning}
{$bbclosedwarning}
{$unreadreports}
{$pending_joinrequests}
<br />
Admin KP - Temalar ve Şablonlar - Şablonlar - Temanız - Header Şablonları
header_welcomeblock_guest'in İçindekileri Sil ve Aşağıdakileri Yerleştir
Kod:
<br>
<br>
<span style="float: right;">
<fieldset><a href="{$mybb->settings['bburl']}/member.php?action=login">{$lang->welcome_login}</a> — <a href="{$mybb->settings['bburl']}/member.php?action=register">{$lang->welcome_register}</a></span></fieldset>
<br>
<br>
Admin KP - Temalar ve Şablonlar - Şablonlar - Temanız - Header Şablonları
header_welcomeblock_member'in İçindekileri Sil ve Aşağıdakileri Yerleştir
Kod:
<div class="float_right"><fieldset><img src="{$mybb->user['avatar']}"style="max-height: 25px"/> {$lang->welcome_back} <a href="/member.php?action=profile">Profilim</a> — <a href="/usercp.php">Üye Kontrol Paneli</a> — <a href="/usercp.php?action=profile">Ayarlar</a> {$modcplink}{$admincplink} — <a href="{$mybb->settings['bburl']}/member.php?action=logout&logoutkey={$mybb->user['logoutkey']}">{$lang->welcome_logout}</a></div>
<br>
<br>
Admin KP - Temalar ve Şablonlar - Şablonlar - Temanız - Navigasyon Şablonları
nav'in İçindekileri Sil ve Aşağıdakileri Yerleştir
Kod:
<div id="navigasyon">
<ol id="navigasyon_list">
{$nav}{$activebit}
</ol>
</div>
Admin KP - Temalar ve Şablonlar - Şablonlar - Temanız - Navigasyon Şablonları
nav_bit'in İçindekileri Sil ve Aşağıdakileri Yerleştir
Kod:
<li><a href="{$navbit['url']}" title="{$mybb->settings['bbname']}"><img alt="{$mybb->settings['bbname']}" src="http://st.10tl.net/tema/diesel/home_nav.png" /><span><i class="nav_font">{$navbit['name']}</i></span></a></li>
Admin KP - Temalar ve Şablonlar - Şablonlar - Temanız - Navigasyon Şablonları
nav_bit_active'in İçindekileri Sil ve Aşağıdakileri Yerleştir
Kod:
<li><a href="{$navbit['url']}" title="{$mybb->settings['bbname']}"><img alt="{$mybb->settings['bbname']}" src="http://st.10tl.net/tema/diesel/home_nav.png" /><span><i class="nav_font nav_font_aktif">{$navbit['name']}</i></span></a></li>
nav_sep ve nav_sep_active'nin içindekileri silin yani boş kalsın içi ve kaydedin.
İşlem Tamamdır ;)
BEN NEXT'İM ARKADAŞLAR :) :)