Autor Zpráva
tatras5
Profil *
#1 · Zasláno: 5. 7. 2015, 11:25:03 · Upravil/a: Moderátor (editace znemožněna) o 33 minut později
Odpovědět Citovat
Ahoj, včera jsem měnil v opencartu možnost checkbox na carousel, v rámci úspory místa. Takových panelů by tam mělo být 7, protože je to eshop s dveřmi, tak si zákazník musí vybrat své specifické požadavky.
Takže jsem tam přidal ten carousel( funguje jak má), ale rozhodilo mi to stránku pravý panel s doporučenými a nejprodávanějšími produkty se posunul až pod stránku. Já se v css moc neorientuji, ale pro někoho kdo se v tom vyzná stačí asi jen zmenšit velikost toho checkboxu.

Vypadá to takhle S checkboxemBez checkboxu

První kód(ten je uložený v šabloně product.tpl, cesta je /www/catalog/view/theme/theme377/template/product/product.tpl, pro orientaci) 
        <?php if ($option['type'] == 'checkbox') { ?>
        <div id="option-<?php echo $option['product_option_id']; ?>" class="option">
          <label><?php if ($option['required']) { ?>
          <span class="required">*</span>
          <?php } ?>
          <b><?php echo $option['name']; ?>:</b></label>
          
<style>input[type="checkbox"] {
display:none;
}
input[type="checkbox"] + label.imaga {
display: block; width: 50px; height: 50px; vertical-align: middle; cursor: pointer; margin: 5px auto; padding: 0px 1.5px; border: 3px solid #fff;
}
input[type="checkbox"]:checked + label.imaga {border: 3px solid green;}
</style>

<div id="carousel-op">
<ul class="jcarousel-skin-opencart">
<?php foreach ($option['option_value'] as $option_value) { ?>
<li class="optionimage">

<input type="checkbox" name="option[<?php echo $option['product_option_id']; ?>][]" value="<?php echo $option_value['product_option_value_id']; ?>" id="option-value-<?php echo $option_value['product_option_value_id']; ?>" />

<label class="imaga" style="background-image:url(<?php echo $option_value['image']; ?>);" for="option-value-<?php echo $option_value['product_option_value_id']; ?>"></label>

<label for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><?php echo $option_value['name']; ?>
<?php if ($option_value['price']) { ?>
(<?php echo $option_value['price_prefix']; ?><?php echo $option_value['price']; ?>)
<?php } ?>
</label>
</li>
<?php } ?>
</ul>
</div>

Druhý kód (kde si myslím, že by to mohlo být je carousel.css cesta: /www/catalog/view/theme/theme377/stylesheet/carousel.css) 

.jcarousel-skin-opencart .jcarousel-direction-rtl {
    direction: rtl;
}
.jcarousel-skin-opencart .jcarousel-container-horizontal {
    padding:10px 40px 0 48px;
}
.jcarousel-skin-opencart .jcarousel-clip {
    overflow: hidden;
    width: 100%;
}
.jcarousel-skin-opencart .jcarousel-clip-horizontal {
}
.jcarousel-skin-opencart .jcarousel-item {
    text-align: center;
}
.jcarousel-skin-opencart .jcarousel-item-horizontal {
    margin-left: 0;
    margin-right:17px;
}
.jcarousel-skin-opencart .jcarousel-direction-rtl .jcarousel-item-horizontal {
    margin-left: 10px;
    margin-right: 0;
}
.jcarousel-skin-opencart .jcarousel-item-placeholder {
    background: #fff;
    color: #000;
}
.jcarousel-list li a img{ opacity:0.3;}
.jcarousel-list li{ }
.jcarousel-list li:first-child{}
.jcarousel-prev.jcarousel-prev-horizontal.jcarousel-prev-disabled.jcarousel-prev-disabled-horizontal{background: url('../image/button-previous.png') left bottom no-repeat!important;}
.jcarousel-next.jcarousel-next-horizontal.jcarousel-next-disabled.jcarousel-next-disabled-horizontal{    background: url('../image/button-next.png') left bottom no-repeat;}
/**
 *  Horizontal Buttons
 */
.jcarousel-skin-opencart .jcarousel-next-horizontal {
    position: absolute;
    top:9px;
    right:20px;
    width: 12px;
    height:22px;
    cursor: pointer;
    background: url('../image/button-next.png') left top no-repeat;
}
.jcarousel-skin-opencart .jcarousel-direction-rtl .jcarousel-next-horizontal:hover{ background-position:0 -28px;}
.jcarousel-skin-opencart .jcarousel-direction-rtl .jcarousel-next-horizontal {
    left: 5px;
    right: auto;
    background: url('../image/button-previous.png') left top no-repeat;
}
.jcarousel-skin-opencart .jcarousel-next-horizontal:hover, .jcarousel-skin-opencart .jcarousel-next-horizontal:focus {background-position:0 bottom;}
.jcarousel-skin-opencart .jcarousel-next-horizontal:active {
}
.jcarousel-skin-opencart .jcarousel-next-disabled-horizontal, .jcarousel-skin-opencart .jcarousel-next-disabled-horizontal:hover, .jcarousel-skin-opencart .jcarousel-next-disabled-horizontal:focus, .jcarousel-skin-opencart .jcarousel-next-disabled-horizontal:active {opacity:1;
    cursor: default;
    background: none;
}
.jcarousel-skin-opencart .jcarousel-prev-horizontal {
    position: absolute;
    top:9px;
    left:20px;
    width:12px;
    height:22px;
    cursor: pointer;
    background: url('../image/button-previous.png') left 0px no-repeat;
}
.jcarousel-skin-opencart .jcarousel-direction-rtl .jcarousel-prev-horizontal {
    left: auto;
    right: 0px;
    background: url('../image/button-next.png') center no-repeat;
}
.jcarousel-skin-opencart .jcarousel-prev-horizontal:hover, .jcarousel-skin-opencart .jcarousel-prev-horizontal:focus {background-position:0 bottom;
}
.jcarousel-skin-opencart .jcarousel-prev-horizontal:active {
}
.jcarousel-skin-opencart .jcarousel-prev-disabled-horizontal, .jcarousel-skin-opencart .jcarousel-prev-disabled-horizontal:hover, .jcarousel-skin-opencart .jcarousel-prev-disabled-horizontal:focus, .jcarousel-skin-opencart .jcarousel-prev-disabled-horizontal:active {opacity:1;
    cursor: default;
}

Jedná se o normální modul Opencart, původně určený pro šablonu default. Odkaz na návod podle kterého jsem to přidával., Odkaz na stažení modulu

Předem děkuji za reakce.

Moderátor Davex: Titulek „Problém v OpenCart“ nevystihoval podstatu dotazu. Příště zkus prosím vymyslet lepší.
Tomáš123
Profil
#2 · Zasláno: 5. 7. 2015, 11:42:34
Odpovědět Citovat
tatras5:
Pridaj živú ukážku stránky, na ktorej sa chyba prejavuje. Kvantum deklarácií priradených ku triedam nikomu nenapovie riešenie problému.
tatras5
Profil *
#3 · Zasláno: 5. 7. 2015, 13:26:22
Odpovědět Citovat
Tomáš123, Tomáš123:
http://online-truhlar.cz/index.php?route=product/product&product_id=46
Tomáš123
Profil
#4 · Zasláno: 5. 7. 2015, 15:03:13
Odpovědět Citovat
tatras5:
Ten kód je otrasný. S nefunkčnosťou nemajú checkboxy nič spoločné. Problém je v tom, že celý hlavný stĺpec vôbec nepláva, pláva jeho rodič, čo je zbytočné. Ak chceme vytvoriť dvojstĺpcový layout, spravidla použijeme štruktúru podobnú tejto: 
<div class="obal">
  <div class="stlpec1"></div>
  <div class="stlpec2"></div>
</div>

Ty používaš niečo ako toto: 
<div class="obal"><!-- zbytočne pláva -->
  <div class="stlpec1"><!-- nepláva -->
    <div class="stlpec2"></div><!-- pláva, ale zbytočne lebo zvyšok nefunguje -->
  </div>
</div>

V zmesi tony zbytočných prvkov a tried som sa stratil a vzdal. Mal by si to celé trochu trochu prerobiť.
tatras5
Profil *
#5 · Zasláno: 5. 7. 2015, 18:31:30
Odpovědět Citovat
Tomáš123:
Dík, vyřešeno!
Časová prodleva: 9 let

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0