Opencart Türkiye Destek Sitesi ,E-Ticaret Yazılımı Destek Paylaşım Forumu

e-ticaretdersleri Tüm Mesajlarını Bul · Konu Tarihi: **10-01-2012 10:45 AM**

Evet arkadaşlar bir temadan aldığım güzel bir üst menü modifiyesini sunuyorum.Ekteki dosyayı kendi kullandığınız temanın image klasörünün içersine atınız. Şimdi kuruluma Başlayalım...

İlk Önce Dosyamızı Açalım : catalog/view/theme/senninteman/stylesheet/ stlesheet.css

Bulalım :

PHP Kod:

/* menu */
#menu {
    background: #585858;
    border-bottom: 1px solid #000000;
    height: 37px;
    margin-bottom: 15px;
    -webkit-border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -khtml-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    -webkit-box-shadow: 0px 2px 2px #DDDDDD;
    -moz-box-shadow: 0px 2px 2px #DDDDDD;
    box-shadow: 0px 2px 2px #DDDDDD;
    padding: 0px 5px;
}
#menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
#menu > ul > li {
    position: relative;
    float: left;
    z-index: 20;
    padding: 6px 5px 5px 0px;
}
#menu > ul > li:hover {
}
#menu > ul > li > a {
    font-size: 13px;
    color: #FFF;
    line-height: 14px;
    text-decoration: none;
    display: block;
    padding: 6px 10px 6px 10px;
    margin-bottom: 5px;
    z-index: 6;
    position: relative;
}
#menu > ul > li:hover > a {
    background: #000000;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
}
#menu > ul > li > div {
    display: none;
    background: #FFFFFF;
    position: absolute;
    z-index: 5;
    padding: 5px;
    border: 1px solid #000000;
    -webkit-border-radius: 0px 0px 5px 5px;
    -moz-border-radius: 0px 0px 5px 5px;
    -khtml-border-radius: 0px 0px 5px 5px;
    border-radius: 0px 0px 5px 5px;
    background: url('../image/menu.png');
}
#menu > ul > li:hover > div {
    display: table;
}
#menu > ul > li > div > ul {
    display: table-cell;
}
#menu > ul > li ul + ul {
    padding-left: 20px;
}
#menu > ul > li ul > li > a {
    text-decoration: none;
    padding: 4px;
    color: #FFFFFF;
    display: block;
    white-space: nowrap;
    min-width: 120px;
}
#menu > ul > li ul > li > a:hover {
    background: #000000;
}
#menu > ul > li > div > ul > li > a {
    color: #FFFFFF;
} 

Değiştirelim :

PHP Kod:

/* menu */
.menu-left {
    float: left;
    height: 52px;
    width: 5px;
}
.menu-right {
    float: right;
    height: 52px;
    width: 5px;
}
#menu {
    height: 52px;
    margin-bottom: 15px;
    width: 980px;
    margin-left: auto;
    margin-right: auto;
    background: url('../image/menu.png');
    z-index: 20;
    font-size: 14px;
    position: relative;
}
#menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
#menu > ul > li  {
    position: relative;
    float: left;
    z-index: 20;
    background: url("../image/home-sep.png") no-repeat top right;
    height: 52px;
    text-decoration: none;
    z-index: 999;
}
#menu > ul > li:last-child {
    background: none;
}

#menu > ul > li > a {
    display: block;
}
#menu > ul > li > a span{
    display: block;
}
#menu > ul > li > a span span {
    font-size: 13px;
    font-family: 'PT Sans Caption', sans-serif;
    color: #292d34;
    padding: 17px;
    text-decoration: none;
    display: block;
    z-index: 6;
    position: relative;
}
#menu > ul > li:first-child > a {
    background: url('../image/sephome-hov-left.png') no-repeat;
    margin-left:-5px;
    padding-left: 5px;
    height: 52px;
}
#menu > ul > li:first-child > a span{
    background: url('../image/sep-hov-center.png') repeat-x;
    height: 52px;
}
#menu > ul > li:first-child > a span span {
    background: url('../image/sep-hov-right.png') no-repeat top right;
    color: #FFFFFF;
    height: 52px;
}
#menu > ul > li:first-child > a:hover {
    background: url('../image/sephome-hov-left.png') no-repeat;
    margin-left:-5px;
    padding-left: 5px;
    height: 52px;
}

#menu > ul > li:first-child > a:hover span {
    background: url('../image/sep-hov-center.png') repeat-x;
}
#menu > ul > li:first-child > a:hover span span {
    background: url('../image/sep-hov-right.png') no-repeat top right;
    color: #FFFFFF;
    text-shadow: 0.1em 0.1em 0.05em #333;
}
#menu > ul > li > a:hover {
    background: url('../image/sep-hov-center.png') repeat-x;
    text-shadow: 0.1em 0.1em 0.05em #333;
}
#menu > ul > li > a:hover span {
    background: url('../image/sep-hov-left.png') no-repeat top left;
}
#menu > ul > li > a:hover span span {
    background: url('../image/sep-hov-right.png') no-repeat top right;
    color: #FFFFFF;
}
#menu > ul > li:hover {
    background: url('../image/sep-hov-center.png') repeat-x;
}
#menu > ul > li:hover a span {
    background: url('../image/sep-hov-left.png') no-repeat top left;
}
#menu > ul > li:hover a span span {
    background: url('../image/sep-hov-right.png') no-repeat top right;
    color: #FFFFFF;
}
#menu > ul > li > div {
    display: none;
    position: absolute;
    z-index: 5;
    background: url("../image/drop.png") no-repeat scroll 20px 3px transparent;
    -webkit-border-radius: 0px 0px 5px 5px;
    -moz-border-radius: 0px 0px 5px 5px;
    -khtml-border-radius: 0px 0px 5px 5px;
    border-radius: 0px 0px 5px 5px;
}
#menu > ul > li:hover > div {
    display: table;
    padding-top: 10px;
}
#menu > ul > li > div > ul {
    display: table-cell;
    background: #50B033;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
}
#menu > ul > li ul + ul {
    padding-left: 20px;
}
#menu > ul > li ul > li:first-child {
    border-top: none;
    -webkit-border-radius: 5px 5px 0px 0px;
    -moz-border-radius: 5px 5px 0px 0px;
    -khtml-border-radius: 5px 5px 0px 0px;
    border-radius: 5px 5px 0px 0px;
}
#menu > ul > li ul > li:last-child {
    -webkit-border-radius: 0px 0px 5px 5px;
    -moz-border-radius: 0px 0px 5px 5px;
    -khtml-border-radius: 0px 0px 5px 5px;
    border-radius: 0px 0px 5px 5px;
}
#menu > ul > li ul > li{
    box-shadow: 0 0 12px rgba(0, 0, 0, 0.3);
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: #33CC00;
}
#menu > ul > li ul > li:first-child:hover {
    background: #6E9F15;
    -webkit-border-top-right-radius: 5px;
    -webkit-border-top-left-radius: 5px;
    -moz-border-radius: 5px 5px 0px 0px;
    -khtml-border-radius: 5px 5px 0px 0px;
    border-radius: 5px 5px 0px 0px;
}
#menu > ul > li ul > li:hover {
    background: #6E9F15;
    text-shadow: 0.1em 0.1em 0.05em #333;
}
#menu > ul > li ul > li:last-child:hover {
    background: #6E9F15;
    -webkit-border-bottom-right-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius: 0px 0px 5px 5px;
    -khtml-border-radius: 0px 0px 5px 5px;
    border-radius: 0px 0px 5px 5px;
}
#menu > ul > li ul > li > a {
    text-decoration: none;
    padding: 4px;
    color: #FFFFFF!important;
    display: block;
    white-space: nowrap;
    min-width: 149px;    
}
#menu > ul > li ul > li > a:hover {
    color: #FFFFFF!important;
}
#menu > ul > li > div > ul > li > a {
    color: #FFFFFF;
    padding: 0 16px;
    line-height: 2.9;
} 

roi-intrépide Tüm Mesajlarını Bul · Konu Tarihi: **10-15-2012 04:24 PM**

ektedi gibi bir goruntu cikti yardimci olabilir misiniz Smile

e-ticaretdersleri Tüm Mesajlarını Bul · Konu Tarihi: **10-15-2012 04:48 PM**

PHP Kod:

<div id="menu"> 

ile başlayan

PHP Kod:

<div id="notification"> 

kadar olan kısımları aşağıdaki kod ile değiştiriniz.. Ekteki resmi örnek default/image klasörüne atınız

PHP Kod:

<div id="menu">
  <ul>
    <li>
<a href="index.php?route=common/home">
<span>
<span style="padding-bottom: 0px;">Ana Sayfa</span>
</span>
</a>
</li>
    <?php foreach ($categories as $category) { ?>
  
   <li><a href="<?php echo $category['href']; ?>" tppabs="<?php echo $category['href']; ?>"><span><span><?php echo $category['name']; ?></span></span></a>

      <?php if ($category['children']) { ?>
      <div>
        <?php for ($i = 0; $i < count($category['children']);) { ?>
        <ul>          <?php $j = $i + ceil(count($category['children']) / $category['column']); ?>
          <?php for (; $i < $j; $i++) { ?>
          <?php if (isset($category['children'][$i])) { ?>
          <li><a href="<?php echo $category['children'][$i]['href']; ?>"><?php echo $category['children'][$i]['name']; ?></a></li>
          <?php } ?>
          <?php } ?>
        </ul>
        <?php } ?>
      </div>
      <?php } ?>
    </li>
    <?php } ?>
  </ul>
</div>
<?php } ?>

roi-intrépide Tüm Mesajlarını Bul · Konu Tarihi: **11-12-2012 06:27 PM**

Merhaba,
belirttigin komutlari;
catalog/view/theme/THEME/template/common/header.tpl

dosyasindan degistirdim. Ayrica png'yi de ekledim fakat goruntu halen ekteki gibidir.

Not: Tema olarak default degil farkli bir tema kullaniyorum.

emn_emn Tüm Mesajlarını Bul · Konu Tarihi: **12-29-2012 06:07 PM**

güzel eklenti saol


Direk Link
HTML Link
BBCode Link
Sosyal Paylaş	Sabah net google facebook digg twiter yahoo mixx stumbleupon delicious reddit myspace friendfeed google buzz linkedin

Benzeyen Konular
Konu:		Yazar	Cevaplar:	Gösterim:	Son Mesaj
	[Modifikasyon] Anasayfa Modüllerine Yeni Ürün İkonu Eklemek	TECHNOLOG	29	19,530	02-27-2017 12:08 PM Son Mesaj: sekhil
	Yeni Projem Melez Çalışmam	e-ticaretdersleri	0	1,487	10-15-2016 05:22 PM Son Mesaj: e-ticaretdersleri
	Sabit üst menü	Ersen16	5	6,269	09-26-2016 11:36 AM Son Mesaj: tolikachocolate
	üst menü bağımsız eklame	barikat87	0	1,686	05-03-2016 03:51 PM Son Mesaj: barikat87
	[Modifikasyon] Geliştirilmiş Captcha Modifiyesi +Ajax	e-ticaretdersleri	2	3,786	03-07-2016 09:52 PM Son Mesaj: gencosman
	Opencart Nitro yüzünden yeni kategorilerim görünmüyor	cokasi	0	1,922	01-05-2016 09:45 PM Son Mesaj: cokasi
	musteri uye sayfasi sag menu linkleri	yusuf14	0	1,701	12-15-2015 02:03 PM Son Mesaj: yusuf14
	Glen Sipariş Formuna Yeni alan nasıl eklenir?	webhost	8	4,037	12-02-2015 05:35 PM Son Mesaj: demon
	Opencart Gelişmiş Üst Kategori Modifiyesi	e-ticaretdersleri	4	3,649	11-26-2015 10:34 AM Son Mesaj: isilcetn
	Sepet Modifiyesi + Üyelik Zorunluluğu	e-ticaretdersleri	8	6,116	11-25-2015 06:42 PM Son Mesaj: demon

	Şuanki Zaman: 12-19-2024, 02:12 AMHoşgeldin Misafir !
	Beni Hatırla Şifremi Hatırlat

« Önceki \| Sonraki »

Opencart Türkiye Destek Sitesi ,E-Ticaret Yazılımı Destek Paylaşım Forumu

Tema Yeni Üst Menü Modifiyesi