tr-opencart

     
avatar Şuanki Zaman: 03-29-2024, 07:51 AMHoşgeldin Misafir !
  Şifremi Hatırlat   kayıt ol
opencart temaları

Tema Yeni Üst Menü Modifiyesi

Konuyu görüntüleyenler: 1 Misafir
 
Değerlendir:
  • 0 Oy - 0 Yüzde
  • 1
  • 2
  • 3
  • 4
  • 5
%
Cevapla  Gönder 
v  v
Yazar  e-ticaretdersleri - Görüntüleme - Okunma  5251 - Yorum  4

e-ticaretdersleriv
Osmanlı Torunu
******
Süper Moderator user avatar
Çevrimdışı

Mesajlar: 3,225
Konular: 520
Katılma Tarihi: Jan 2012
Rep Puanı: 102
Teşekkürler: 1169
1060 Mesajına, 2133 Teşekkür edildi.



Kişisel Bilgileri: v
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-bottom1px solid #000000;
    
height37px;
    
margin-bottom15px;
    -
webkit-border-radius5px 5px 5px 5px;
    -
moz-border-radius5px 5px 5px 5px;
    -
khtml-border-radius5px 5px 5px 5px;
    
border-radius5px 5px 5px 5px;
    -
webkit-box-shadow0px 2px 2px #DDDDDD;
    
-moz-box-shadow0px 2px 2px #DDDDDD;
    
box-shadow0px 2px 2px #DDDDDD;
    
padding0px 5px;
}
#menu ul {
    
list-stylenone;
    
margin0;
    
padding0;
}
#menu > ul > li {
    
positionrelative;
    
floatleft;
    
z-index20;
    
padding6px 5px 5px 0px;
}
#menu > ul > li:hover {
}
#menu > ul > li > a {
    
font-size13px;
    
color#FFF;
    
line-height14px;
    
text-decorationnone;
    
displayblock;
    
padding6px 10px 6px 10px;
    
margin-bottom5px;
    
z-index6;
    
positionrelative;
}
#menu > ul > li:hover > a {
    
background#000000;
    
-webkit-border-radius5px;
    -
moz-border-radius5px;
    -
khtml-border-radius5px;
    
border-radius5px;
}
#menu > ul > li > div {
    
displaynone;
    
background#FFFFFF;
    
positionabsolute;
    
z-index5;
    
padding5px;
    
border1px solid #000000;
    
-webkit-border-radius0px 0px 5px 5px;
    -
moz-border-radius0px 0px 5px 5px;
    -
khtml-border-radius0px 0px 5px 5px;
    
border-radius0px 0px 5px 5px;
    
backgroundurl('../image/menu.png');
}
#menu > ul > li:hover > div {
    
displaytable;
}
#menu > ul > li > div > ul {
    
displaytable-cell;
}
#menu > ul > li ul + ul {
    
padding-left20px;
}
#menu > ul > li ul > li > a {
    
text-decorationnone;
    
padding4px;
    
color#FFFFFF;
    
displayblock;
    
white-spacenowrap;
    
min-width120px;
}
#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 {
    
floatleft;
    
height52px;
    
width5px;
}
.
menu-right {
    
floatright;
    
height52px;
    
width5px;
}
#menu {
    
height52px;
    
margin-bottom15px;
    
width980px;
    
margin-leftauto;
    
margin-rightauto;
    
backgroundurl('../image/menu.png');
    
z-index20;
    
font-size14px;
    
positionrelative;
}
#menu ul {
    
list-stylenone;
    
margin0;
    
padding0;
}
#menu > ul > li  {
    
positionrelative;
    
floatleft;
    
z-index20;
    
backgroundurl("../image/home-sep.png"no-repeat top right;
    
height52px;
    
text-decorationnone;
    
z-index999;
}
#menu > ul > li:last-child {
    
backgroundnone;
}

#menu > ul > li > a {
    
displayblock;
}
#menu > ul > li > a span{
    
displayblock;
}
#menu > ul > li > a span span {
    
font-size13px;
    
font-family'PT Sans Caption'sans-serif;
    
color#292d34;
    
padding17px;
    
text-decorationnone;
    
displayblock;
    
z-index6;
    
positionrelative;
}
#menu > ul > li:first-child > a {
    
backgroundurl('../image/sephome-hov-left.png'no-repeat;
    
margin-left:-5px;
    
padding-left5px;
    
height52px;
}
#menu > ul > li:first-child > a span{
    
backgroundurl('../image/sep-hov-center.png'repeat-x;
    
height52px;
}
#menu > ul > li:first-child > a span span {
    
backgroundurl('../image/sep-hov-right.png'no-repeat top right;
    
color#FFFFFF;
    
height52px;
}
#menu > ul > li:first-child > a:hover {
    
backgroundurl('../image/sephome-hov-left.png'no-repeat;
    
margin-left:-5px;
    
padding-left5px;
    
height52px;
}

#menu > ul > li:first-child > a:hover span {
    
backgroundurl('../image/sep-hov-center.png'repeat-x;
}
#menu > ul > li:first-child > a:hover span span {
    
backgroundurl('../image/sep-hov-right.png'no-repeat top right;
    
color#FFFFFF;
    
text-shadow0.1em 0.1em 0.05em #333;
}
#menu > ul > li > a:hover {
    
backgroundurl('../image/sep-hov-center.png'repeat-x;
    
text-shadow0.1em 0.1em 0.05em #333;
}
#menu > ul > li > a:hover span {
    
backgroundurl('../image/sep-hov-left.png'no-repeat top left;
}
#menu > ul > li > a:hover span span {
    
backgroundurl('../image/sep-hov-right.png'no-repeat top right;
    
color#FFFFFF;
}
#menu > ul > li:hover {
    
backgroundurl('../image/sep-hov-center.png'repeat-x;
}
#menu > ul > li:hover a span {
    
backgroundurl('../image/sep-hov-left.png'no-repeat top left;
}
#menu > ul > li:hover a span span {
    
backgroundurl('../image/sep-hov-right.png'no-repeat top right;
    
color#FFFFFF;
}
#menu > ul > li > div {
    
displaynone;
    
positionabsolute;
    
z-index5;
    
backgroundurl("../image/drop.png"no-repeat scroll 20px 3px transparent;
    -
webkit-border-radius0px 0px 5px 5px;
    -
moz-border-radius0px 0px 5px 5px;
    -
khtml-border-radius0px 0px 5px 5px;
    
border-radius0px 0px 5px 5px;
}
#menu > ul > li:hover > div {
    
displaytable;
    
padding-top10px;
}
#menu > ul > li > div > ul {
    
displaytable-cell;
    
background#50B033;
    
-webkit-border-radius5px;
    -
moz-border-radius5px;
    -
khtml-border-radius5px;
    
border-radius5px;
}
#menu > ul > li ul + ul {
    
padding-left20px;
}
#menu > ul > li ul > li:first-child {
    
border-topnone;
    -
webkit-border-radius5px 5px 0px 0px;
    -
moz-border-radius5px 5px 0px 0px;
    -
khtml-border-radius5px 5px 0px 0px;
    
border-radius5px 5px 0px 0px;
}
#menu > ul > li ul > li:last-child {
    
-webkit-border-radius0px 0px 5px 5px;
    -
moz-border-radius0px 0px 5px 5px;
    -
khtml-border-radius0px 0px 5px 5px;
    
border-radius0px 0px 5px 5px;
}
#menu > ul > li ul > li{
    
box-shadow0 0 12px rgba(0000.3);
    
border-top-width1px;
    
border-top-stylesolid;
    
border-top-color#33CC00;
}
#menu > ul > li ul > li:first-child:hover {
    
background#6E9F15;
    
-webkit-border-top-right-radius5px;
    -
webkit-border-top-left-radius5px;
    -
moz-border-radius5px 5px 0px 0px;
    -
khtml-border-radius5px 5px 0px 0px;
    
border-radius5px 5px 0px 0px;
}
#menu > ul > li ul > li:hover {
    
background#6E9F15;
    
text-shadow0.1em 0.1em 0.05em #333;
}
#menu > ul > li ul > li:last-child:hover {
    
background#6E9F15;
    
-webkit-border-bottom-right-radius5px;
    -
webkit-border-bottom-left-radius5px;
    -
moz-border-radius0px 0px 5px 5px;
    -
khtml-border-radius0px 0px 5px 5px;
    
border-radius0px 0px 5px 5px;
}
#menu > ul > li ul > li > a {
    
text-decorationnone;
    
padding4px;
    
color#FFFFFF!important;
    
displayblock;
    
white-spacenowrap;
    
min-width149px;    
}
#menu > ul > li ul > li > a:hover {
    
color#FFFFFF!important;
}
#menu > ul > li > div > ul > li > a {
    
color#FFFFFF;
    
padding0 16px;
    
line-height2.9;



Ekli Dosya(lar) Önizleme(ler)
Resmi Büyütmek İçin Tıklayın   
.rar 4556.rar Eklentiyi indir...
Boyut: 106.01 KB İndirme: 138
Telif Hakkı için Rapor Edin...
e-ticaretdersleri
Alıntı Yaparak Cevapla
Paylaş!
 Teşekkür Edenler: osdem66 , BLaDe , yusuf_07 , nokta , fe_odaliz
roi-intrépidev
Acemi Üye
**
Üye user avatar
Çevrimdışı

Mesajlar: 11
Konular: 0
Katılma Tarihi: Oct 2012
Rep Puanı: 0
Teşekkürler: 0
1 Mesajına, 1 Teşekkür edildi.



Kişisel Bilgileri: v
Konu Tarihi: 10-15-2012 04:24 PM
ektedi gibi bir goruntu cikti yardimci olabilir misiniz Smile


Ekli Dosya(lar) Önizleme(ler)
Resmi Büyütmek İçin Tıklayın   
Alıntı Yaparak Cevapla
Paylaş!
e-ticaretdersleriv
Osmanlı Torunu
******
Süper Moderator user avatar
Çevrimdışı

Mesajlar: 3,225
Konular: 520
Katılma Tarihi: Jan 2012
Rep Puanı: 102
Teşekkürler: 1169
1060 Mesajına, 2133 Teşekkür edildi.



Kişisel Bilgileri: v
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 ?>


Ekli Dosya(lar) Önizleme(ler)
Resmi Büyütmek İçin Tıklayın   
e-ticaretdersleri
Alıntı Yaparak Cevapla
Paylaş!
roi-intrépidev
Acemi Üye
**
Üye user avatar
Çevrimdışı

Mesajlar: 11
Konular: 0
Katılma Tarihi: Oct 2012
Rep Puanı: 0
Teşekkürler: 0
1 Mesajına, 1 Teşekkür edildi.



Kişisel Bilgileri: v
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.


Ekli Dosya(lar) Önizleme(ler)
Resmi Büyütmek İçin Tıklayın   
Alıntı Yaparak Cevapla
Paylaş!
emn_emnv
Acemi Üye
**
Üye user avatar
Çevrimdışı

Mesajlar: 10
Konular: 2
Katılma Tarihi: Dec 2012
Rep Puanı: 0
Teşekkürler: 1
0 Mesajına, 0 Teşekkür edildi.



Kişisel Bilgileri: v
Konu Tarihi: 12-29-2012 06:07 PM
güzel eklenti saol
Alıntı Yaparak Cevapla
Paylaş!

« Önceki | Sonraki »
Cevapla  Gönder 

Yeni Üst Menü Modifiyesi  Konusunun Linki Direk Link
Yeni Üst Menü Modifiyesi  Konusunun HTML Kodu HTML Link
Yeni Üst Menü Modifiyesi  Konusu BBCode Linki BBCode Link
Yeni Üst Menü Modifiyesi  Konusunu Paylaş Sosyal Paylaş

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

Yeni Üst Menü Modifiyesi indir, Yeni Üst Menü Modifiyesi Videosu, Yeni Üst Menü Modifiyesi online izle, Yeni Üst Menü Modifiyesi Bedava indir, Yeni Üst Menü Modifiyesi Yükle, Yeni Üst Menü Modifiyesi Hakkında, Yeni Üst Menü Modifiyesi nedir, Yeni Üst Menü Modifiyesi Free indir, Yeni Üst Menü Modifiyesi oyunu, Yeni Üst Menü Modifiyesi download


Forum Atla: