Ürün Bloklarını Renklendirme

debreli · 17 Eyl 2010

yeni ürünler bloğunu çift rekli yaptım.resimler üzerinde fare ile gezince hem renk değişiyor hemde alta bir blok varsa aşağı oynuyor.

aşağıdaki kodu tamanızın stylesheet dosyasının en altına kaydedin.

Kod:

.thumb {
text-align:center;  vertical-align:top; border: 1px solid #e8e8e8;
	background: #f5f9fc;
	cursor: pointer;margin: 8;
padding: 8px;}

.thumb2 {
text-align:center;  vertical-align:top; border: 1px solid #cde0f0;
	background: #edf4fa;
	cursor: pointer;margin: 10;
padding: 10px;}

latesthome.tpl dosyasını da aşağıdaki gibi değiştirin.

Kod:

 <?php if ($products) { ?>
<div class="top">
  <div class="left"></div>
  <div class="right"></div>
  <div class="center">
    <div class="heading"><?php echo $heading_title; ?></div>
  </div>
</div>

<div class="middle">
  <table class="">
  <?php for ($i = 0; $i < sizeof($products); $i = $i + 4) { ?>
    <tr>
      <?php for ($j = $i; $j < ($i + 4); $j++) { ?>

      <td style="width: 25%;"class="thumb" onmouseover="this.className='thumb2'" onmouseout="this.className='thumb'"><?php if (isset($products[$j])) { ?>
       <a href="<?php echo str_replace('&', '&', $products[$j]['href']); ?>"><img src="<?php echo $products[$j]['thumb']; ?>" title="<?php echo $products[$j]['name']; ?>" alt="<?php echo $products[$j]['name']; ?>" /></a><br />
      <a href="<?php echo str_replace('&', '&', $products[$j]['href']); ?>"><?php echo $products[$j]['name']; ?></a><br />
      <span style="color: #999; font-size: 11px;"><?php echo $products[$j]['model']; ?></span><br />
      <?php if ($display_price) { ?>
      <?php if (!$products[$j]['special']) { ?>
      <span style="color: #900; font-weight: bold;"><?php echo $products[$j]['price']; ?></span>
      <?php } else { ?>
      <span style="color: #900; font-weight: bold; text-decoration: line-through;"><?php echo $products[$j]['price']; ?></span> <span style="color: #F00;"><?php echo $products[$j]['special']; ?></span>
      <?php } ?>
      <a class="button_add_small" href="<?php echo $products[$j]['add']; ?>" title="<?php echo $button_add_to_cart; ?>" >&nbsp;</a>
      <?php } ?>
      <br />
      <?php if ($products[$j]['rating']) { ?>
      <img src="catalog/view/theme/default/image/stars_<?php echo $products[$j]['rating'] . '.png'; ?>" alt="<?php echo $products[$j]['stars']; ?>" />
      <?php } ?>
      <?php } ?></td>
      <?php } ?>
    </tr>
    <?php } ?>
  </table>
</div>

<div class="bottom">
  <div class="left"></div>
  <div class="right"></div>
  <div class="center"></div>
</div>
<?php } ?>

orta blokta kullandığınız modulerde de kullanabilirsiniz.

ürün isimlerinide bloğun üstüne aldım.geliştirebilirsiniz acizane bukadar yapabildim.dğer ortabloktaki modüllerde de kullanabilirsiniz

lates_home.tpl dosyasını aşağıdaki ile değiştirin.

Kod:

<?php if ($products) { ?>
<div class="top">
  <div class="left"></div>
  <div class="right"></div>
  <div class="center">
    <div class="heading"><?php echo $heading_title; ?></div>
  </div>
</div>

<div class="middle">
  <table cellpadding="0" cellspacing="1" class="">
  <?php for ($i = 0; $i < sizeof($products); $i = $i + 4) { ?>
    <tr>
      <?php for ($j = $i; $j < ($i + 4); $j++) { ?>

<td style="width: 25%;" class="thumb" onmouseover="this.className='thumb2'" onmouseout="this.className='thumb'"><?php if (isset($products[$j])) { ?><a href="<?php echo str_replace('&', '&', $products[$j]['href']); ?>"><?php echo $products[$j]['name']; ?></a><?php } ?>

</td>
<?php } ?>
</tr> 
<?php } ?>
 
<?php for ($i = 0; $i < sizeof($products); $i = $i + 4) { ?><tr> <?php for ($j = $i; $j < ($i + 4); $j++) { ?>


      <td style="width: 25%;"class="thumb" onmouseover="this.className='thumb2'" onmouseout="this.className='thumb'"><?php if (isset($products[$j])) { ?>
       <a href="<?php echo str_replace('&', '&', $products[$j]['href']); ?>"><img src="<?php echo $products[$j]['thumb']; ?>" title="<?php echo $products[$j]['name']; ?>" alt="<?php echo $products[$j]['name']; ?>" /></a><br />
      
      <span style="color: #999; font-size: 11px;"><?php echo $products[$j]['model']; ?></span><br />
      <?php if ($display_price) { ?>
      <?php if (!$products[$j]['special']) { ?>
      <span style="color: #900; font-weight: bold;"><?php echo $products[$j]['price']; ?></span>
      <?php } else { ?>
      <span style="color: #900; font-weight: bold; text-decoration: line-through;"><?php echo $products[$j]['price']; ?></span> <span style="color: #F00;"><?php echo $products[$j]['special']; ?></span>
      <?php } ?>
      
      <?php } ?>
      <br />
      <?php if ($products[$j]['rating']) { ?>
      <img src="catalog/view/theme/default/image/stars_<?php echo $products[$j]['rating'] . '.png'; ?>" alt="<?php echo $products[$j]['stars']; ?>" />
      <?php } ?><br><a class="" href="<?php echo $products[$j]['add']; ?>" title="<?php echo $button_add_to_cart; ?>" ><image src="catalog/view/theme/default/image/satinal.png"></a>
      <?php } ?></td>
      <?php } ?>
    </tr>
    <?php } ?>
  </table>
</div>

<div class="bottom">
  <div class="left"></div>
  <div class="right"></div>
  <div class="center"></div>
</div>
<?php } ?>

stylesheet css deki üste verdiğim kodları aşağıdakiyle değiştirin.

Kod:

.thumb {
text-align:center; font-weight: bold; vertical-align:top; 
	border: 1px solid #e8e8e8;
	background: #f5f9fc;
	cursor: pointer;margin:9;
padding: 9px;}

.thumb2 {
text-align:center; font-weight: bold; vertical-align:top;
	 border: 1px solid #cde0f0;
	background: #edf4fa;
	cursor: pointer;margin: 8;
padding: 8px;}

debreli · 17 Eyl 2010

RE: [KOD] Blok Ürünlerini Renklendirme

peki hocam renklendirmeden ziyade bunun çapı örneğin 50x100 diyelim biz bunu 40x80 yapıcaz o arka plan yaptığının üstünü yani onu nasıl yapıcaz

Kod:

.thumb {
text-align:center;  vertical-align:top; width: 150px;
	height: 190px;border: 1px solid #e8e8e8;
	background: #f5f9fc;
	cursor: pointer;margin:9;
padding: 9px;}

.thumb2 {
text-align:center;  vertical-align:top; width: 150px;
	height: 190px; border: 1px solid #cde0f0;
	background: #edf4fa;
	cursor: pointer;margin: 8;
padding: 8px;}

genişlik widht: 150px
yükseklik height: 190px

kendi temana göre dğiştir.

endsh · 24 Eyl 2010

RE: Blok Ürünlerini Renklendirme

Peki Bu Özelliği Siteye Kompile Yapmak İstesek Nasıl Yapabiliriz

admin · 24 Eyl 2010

RE: Blok Ürünlerini Renklendirme

module/xxxx_home.tpl ve product/ içindeki dosyalara uygulamalısınız.

module ile product içindeki dosyalarda farklılıklar vardır. Kodları inceleyerek ekleyiniz.

gokhangunes · 11 Eki 2010

bahsettiginiz degişiklik yapılacak dosyaları 1.4.7 sürümlü sistemimde bulamadım yardımcı olabilirmisiniz.

admin · 12 Eki 2010

gokhangunes' Alıntı:
bahsettiginiz degişiklik yapılacak dosyaları 1.4.7 sürümlü sistemimde bulamadım yardımcı olabilirmisiniz.

1.4.7 sürümünde common/home.tpl dosyasında arayınız. Kodun tamanını değil de bir kısmını yazarak arayınız.

gokhangunes · 13 Eki 2010

teşekkürler

debreli · 8 Ara 2010

bütün sitedeki ürün bloklarını reklendirmek istiyorsa öncelikle ürnlerin hangi syfada olduğuna bakacaksın

bu şu sekilde oluyor..
misal anasayfada bir ürünü inceleme butonuna bastın karsına ürün tanıtım bölgesi geldi sen sindi alt taraftaki benzer ürünleri anasayfadaki gibi renklendirmek istiyorsun.
açtığın sayfanın tarayıcıdaki adresine bak

bendeki adres satırı şöyle

alan adı/index.php?route=product/product&product_id=50

burda demek istiyorki ben sana temanın product/product.tpl dosyasını açtım.

demekki reklendireceğin benzer ürünler bloğu (tab sekmelerinin içindeki blok)
temanın product/product.tpl dosyasının içinde. açıyoruz bu dosyayı içindeki
bizim anasayfaya koyduğumuz blokların içindeki koda benzer kodlar var.

aşağıdaki gibi

Kod:

<?php if ($products) { ?>
      <table class="list">
        <?php for ($i = 0; $i < sizeof($products); $i = $i + 4) { ?>
        <tr>
          <?php for ($j = $i; $j < ($i + 4); $j++) { ?>
          <td width="25%"><?php if (isset($products[$j])) { ?>
            <a href="<?php echo str_replace('&', '&', $products[$j]['href']); ?>"><img src="<?php echo $products[$j]['thumb']; ?>" title="<?php echo $products[$j]['name']; ?>" alt="<?php echo $products[$j]['name']; ?>" /></a><br />
            <a href="<?php echo str_replace('&', '&', $products[$j]['href']); ?>"><?php echo $products[$j]['name']; ?></a><br />
            <span style="color: #999; font-size: 11px;"><?php echo $products[$j]['model']; ?></span><br />
            <?php if ($display_price) { ?>
            <?php if (!$products[$j]['special']) { ?>
            <span style="color: #900; font-weight: bold;"><?php echo $products[$j]['price']; ?></span>
            <?php } else { ?>
            <span style="color: #900; font-weight: bold; text-decoration: line-through;"><?php echo $products[$j]['price']; ?></span> <span style="color: #F00;"><?php echo $products[$j]['special']; ?></span>
            <?php } ?>
			<a class="button_add_small" href="<?php echo $products[$j]['add']; ?>" title="<?php echo $button_add_to_cart; ?>" >&nbsp;</a>
            <?php } ?>
            <br />
            <?php if ($products[$j]['rating']) { ?>
            <img src="catalog/view/theme/default/image/stars_<?php echo $products[$j]['rating'] . '.png'; ?>" alt="<?php echo $products[$j]['stars']; ?>" />
            <?php } ?>
            <?php } ?></td>
          <?php } ?>
        </tr>
        <?php } ?>
      </table>

bu kodun içindeki <td width="25%"> bunu bulup şu şekilde değiştiriyoruz.

<td style="width: 25%;" class="thumb" onmouseover="this.className='thumb2'" onmouseout="this.className='thumb'">

olay bukadar...

misal katagorilerden birine gir ,bende şöyle tarayıcıdaki adres satırı
alanadı/index.php?route=product/category&path=35

burda açacağın dosyanın yeri temanın product/category.tpl dosyası aynışekil üsteki örnekteki gibi kodları bul değiştir.

üstekinide düzgün cıkması için bişeyler buldum.basitmiş aslında.

anasayfada reklendirdiğiniz orta bulokları altakiyle değiştirin(temanızın module klasörünün içindeki home.tpl dosyaları)

Kod:

<?php if ($products) { ?>

<div class="middle">
  <table class="list">
  <?php for ($i = 0; $i < sizeof($products); $i = $i + 4) { ?>
    <tr>
      <?php for ($j = $i; $j < ($i + 4); $j++) { ?>
      <td style="width: 25%;"><?php if (isset($products[$j])) { ?><div class="thumb" onmouseover="this.className='thumb2'" onmouseout="this.className='thumb'"><a href="<?php echo str_replace('&', '&', $products[$j]['href']); ?>"><?php echo $products[$j]['name']; ?></a></div>      <div class="thumb1" onmouseover="this.className='thumb3'" onmouseout="this.className='thumb1'"><a href="<?php echo str_replace('&', '&', $products[$j]['href']); ?>"><img src="<?php echo $products[$j]['thumb']; ?>" title="<?php echo $products[$j]['name']; ?>" alt="<?php echo $products[$j]['name']; ?>" /></a><br />
      <span style="color: #999; font-size: 11px;"><?php echo $products[$j]['model']; ?></span><br />
      <?php if ($display_price) { ?>
      <?php if (!$products[$j]['special']) { ?>
      <span style="color: #900; font-weight: bold;"><?php echo $products[$j]['price']; ?></span>
      <?php } else { ?>
      <span style="color: #900; font-weight: bold; text-decoration: line-through;"><?php echo $products[$j]['price']; ?></span> <span style="color: #F00;"><?php echo $products[$j]['special']; ?></span>
      <?php } ?>
      <a class="button_add_small" href="<?php echo $products[$j]['add']; ?>" title="<?php echo $button_add_to_cart; ?>" >&nbsp;</a>
      <?php } ?>
      <br />
      <?php if ($products[$j]['rating']) { ?>
      <img src="catalog/view/theme/default/image/stars_<?php echo $products[$j]['rating'] . '.png'; ?>" alt="<?php echo $products[$j]['stars']; ?>" />
      <?php } ?></div>
      <?php } ?></td>
      <?php } ?>
    </tr>
    <?php } ?>
  </table>
</div>

<?php } ?>

stylesheet.css acın bu kodu ekleyin.

Kod:

.thumb {
text-align:center; font-weight: bold; vertical-align:top; 
	border: 1px solid #e8e8e8;
	background: #f5f9fc;
	cursor: pointer;margin:9;
padding: 9px; widht: 150px; height: 25px;
 }

.thumb2 {
text-align:center; font-weight: bold; vertical-align:top;
	 border: 1px solid #cde0f0;
	background: #edf4fa;
	cursor: pointer;margin: 8;
padding: 8px; widht: 150px; height: 25px;
} 

.thumb1 {
text-align:center; font-weight: bold; vertical-align:top; 
	border: 1px solid #e8e8e8;
	background: #f5f9fc;
	cursor: pointer;margin:9;
padding: 9px; 
widht: 150px; height: 190px;
}

.thumb3 {
text-align:center; font-weight: bold; vertical-align:top;
	 border: 1px solid #cde0f0;
	background: #edf4fa;
	cursor: pointer;margin: 8;
padding: 8px; widht: 150px; height: 190px;
}

thump,thump2 ürünün isminin olduğu yer.
thump1,thump3 ürünaçıklamasının olduğu yer
yükseklik ve genişlikleri temanıza göre ayarlarsınız.

widht: genişlik
height: yükseklik
renkleride kendiniz değiştirebilirsiniz..

birde isimlerin uzamasından dolayı bloklarınız bozulursa sunu deneyin.

yeni eklenen ürümler için
catalog\controller\module\latest.php Aç.
bul

Kod:

'model'   		=> $result['model'],

altına ekleyin

Kod:

'shortname'  => (substr($result['name'],0,55)),

55 yazan değeri azaltıp çoğaltabilirsiniz.

üste verdğim koddaki aşağıdakini bulun

Kod:

<div class="thumb" onmouseover="this.className='thumb2'" onmouseout="this.className='thumb'"><a href="<?php echo str_replace('&', '&', $products[$j]['href']); ?>"><?php echo $products[$j]['name']; ?></a></div>

altakiyle değiştirin

Kod:

<div class="thumb" onmouseover="this.className='thumb2'" onmouseout="this.className='thumb'"><a href="<?php echo str_replace('&', '&', $products[$j]['href']); ?>"  title="<?php echo $products[$j]['name']; ?>" alt="<?php echo $products[$j]['name']; ?>" /> <?php echo ($products[$j]['shortname'] );?>< </a></div>

anasayfanızın diğer orta blokları içinde catalog\controller\module\ klasörünün içindeki dosyalarıdan aynı işlemi yapıp düzenleyebilirsiniz.

sinan · 9 Ara 2010

güzel sistem teşekkürler.

Ürün Bloklarını Renklendirme

debreli

OpenCart-TR

debreli

OpenCart-TR

endsh

OpenCart-TR

admin

Administrator

gokhangunes

OpenCart-TR

admin

Administrator

gokhangunes

OpenCart-TR

debreli

OpenCart-TR

sinan

OpenCart-TR