Posting in the Magento forums has been disabled pending the implementation of a new and improved forum solution which should better serve the community.

For new questions please post at magento.stackexchange.com, the community-run support site for the Magento community. We will be providing updates on the new forum solution soon. For questions or concerns please email community@magento.com.

Magento Forum

Produkt Optionen mit Bildern auswählen
 
sebtb
Sr. Member
 
Avatar
Total Posts:  196
Joined:  2008-12-28
 

Ich weiß ehrlich garnicht wie ich den Title des Threads nennen sollte, denn mein Anliegen ist schwer in wenigen Worten zu fassen.
Ich habe in den Anhang eine *.gif gelegt, die 4 verschiedene Volant-Typen für Markisen zeigt. Der Kunde soll nun am besten eine der Grafiken anklicken und ohne jeglichen Aufpreis wird der bei der Bestellung hinterlegt, welchen Volant der Kunde angeklickt hat.
Oder ein Drop Down Menü mit diesen Grafiken.

Oder andere Vorschläge?

mfg
Sebastian

Image Attachments
volant.jpg
 
Magento Community Magento Community
Magento Community
Magento Community
 
sebtb
Sr. Member
 
Avatar
Total Posts:  196
Joined:  2008-12-28
 

oder die erzeugten value der dropdowns bzw label mit css ansprechen`?

ala

option[value=948]:before { content:url(Form10.jpg); }

nur weiß ich nicht genau wie ich das anlege @ magento.

 
Magento Community Magento Community
Magento Community
Magento Community
 
e6o1
Member
 
Avatar
Total Posts:  52
Joined:  2008-01-17
 

hmm kann man das ned mit attributen loesen?

 
Magento Community Magento Community
Magento Community
Magento Community
 
sebtb
Sr. Member
 
Avatar
Total Posts:  196
Joined:  2008-12-28
 

noe :(

 
Magento Community Magento Community
Magento Community
Magento Community
 
albossum
Member
 
Total Posts:  55
Joined:  2009-03-17
 

sind das immer die gleichen grafiken?

dann kannst das doch mit javascript (onchange) lösen…

z.b.: der kunde wählt den namen aus nen dropdown und daneben wird dann das richtige bild angezeigt…

gruß

albossum

 
Magento Community Magento Community
Magento Community
Magento Community
 
MarvinToys
Sr. Member
 
Avatar
Total Posts:  194
Joined:  2008-07-27
 

normalerweise muss das mit Attributen möglich sein. Ich kann ja in meine Attribute HTML-Tags verwenden. Einfach mal nen paar Bilder in dein ImageOrdner und dann per Link im Attribut einfach einlesen. Mit der Mehrfachauswahl müsste man natürlich rumprobieren.  Kannst ja auch Individuelle Optionen (ganz unten) Buttons untereinander einfügen. bei der Bezeichnung trägst hinter den Namen einfach den Link zum Bild ein. Nicht vergessen hinter dem LinkTag nen <BR> einzufügen. sonst ist es nicht genau untereinander.

Und wenn de nen neues Attribut anlegst, kannst du glaube ich auch zwischen Text und HTML -Eingabe wählen.

nimm einfach ind.Options.

imagetag Bsp für Titel= Typ 1 <img src="../skin/frontend/default/default/images/Bild.gif"><br>

Image Attachments
Unbenannt.jpg
 
Magento Community Magento Community
Magento Community
Magento Community
 
sebtb
Sr. Member
 
Avatar
Total Posts:  196
Joined:  2008-12-28
 

@ toox :  im Warenkorb zeigt er dann aber den Link des Bildes mit an..ist auch net so das Wahre :(

@ albossum :  hättest zu Zeit und Lust dazu mir da mal zu helfen? hab mit javascript leider nicht viel am Hut.

 
Magento Community Magento Community
Magento Community
Magento Community
 
albossum
Member
 
Total Posts:  55
Joined:  2009-03-17
 

kann dir mal nen code schicken… hab das in unserem oscommerce shop für grußkarten gemacht…

http://www.spreewald-praesente.de/herrenstiege-p-167.html

 
Magento Community Magento Community
Magento Community
Magento Community
 
sebtb
Sr. Member
 
Avatar
Total Posts:  196
Joined:  2008-12-28
 

Danke für das, aber wären Sie so nett, mir das wo einzubauen, hab nämlich kP wo das reinkommt. Ich könnt mich auch dankbar zeigen ^^

icq 339933843
skype sebastian.tobias

 
Magento Community Magento Community
Magento Community
Magento Community
 
mago
Jr. Member
 
Avatar
Total Posts:  25
Joined:  2009-03-29
Germany
 

Ich beschreibe hier die magento-Umsetzung der Grußkarten-Variante.

Folgende Datei habe ich dazu geändert: template/catalog/product/view/options/type/select.phtml

Der select wird hier durch nur einen Funktionsaufruf ausgegeben.
echo $this->getValuesHtml();

Diese Funktion befindet sich hier: app/code/core/Mage/Catalog/Block/Product/View/Options/Type/Select.php

Dort habe ich den Code für die Erzeugung des Select heraus gelöst und verwende ihn im select-Template. Nur dann wenn das gewünschte Attribut ausgegeben werden soll. In meinem Beispiel habe ich das Attribut Color genommen. Es hat die Id 3. Die 3 muss dann mit der Id des Volant-Attributs ersetzt werden.

Nun kann ich in dem onChange-Event des Attribut-select ein Bild in ein Image-Tag unterhalb des select laden.
In der JS-Funktion loadAttributePreview() löse ich dann die Id der select-optionen in einen Dateinamen auf.

Der gesamte Inhalt von template/catalog/product/view/options/type/select.phtml

<?php
/**
 * @category   design_default
 * @package    Mage
 * @copyright  Copyright (c) 2008 Irubin Consulting Inc. DBA Varien (http://www.varien.com)
 * @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
 */
?>
<?php 
/* @var $this Mage_Catalog_Block_Product_View_Options_Type_Select */ ?>

<script type="text/javascript">
//<![CDATA[
    
function loadAttributePreview(obj{
        translate 
= new Array();
        
translate['3''rot.jpg';
        
translate['4''schwarz.jpg';
        
translate['5''gelb.jpg';
        if(
obj.selectedIndex{
            imageFilename 
translate[obj.options[obj.selectedIndex].value];
        
else {
            imageFilename 
'default.jpg';
        
}
        document
.getElementById('attributePreview').src='<?php print $this->getSkinUrl('images/attributes/'); ?>'+imageFilename
        
//alert('value <?php print $this->getSkinUrl('images/attributes/'); ?>'+imageFilename+' '+obj.selectedIndex);
    
}
//]]>
</script>

<?php $_option 
$this->getOption() ?>
<dt><label><?php echo  $this->htmlEscape($_option->getTitle()) ?><?php if ($_option->getIsRequire()): ?><span class="required">&nbsp;*</span><?php endif; ?></label></dt>
<
dd<?php if ($_option->decoratedIsLast){?> class="last"<?php }?>>
<?php 
if($this->getOption()->getId() == 3{
    $require 
= ($_option->getIsRequire()) ? ' required-entry' '';
    
$extraParams '';
    
$select $this->getLayout()->createBlock('core/html_select')
        ->
setData(array(
            
'id' => 'select_'.$_option->getId(),
            
'class' => $require.' product-custom-option'
        
));
    if (
$_option->getType() == Mage_Catalog_Model_Product_Option::OPTION_TYPE_DROP_DOWN{
        $select
->setName('options['.$_option->getid().']')
            ->
addOption(''$this->__('-- Please Select --'));
        
else {
            $select
->setName('options['.$_option->getid().'][]');
            
$select->setClass('multiselect'.$require.' product-custom-option');
        
}
        
foreach ($_option->getValues() as $_value{
        $priceStr 
$this->_formatPrice(array(
            
'is_percent' => ($_value->getPriceType() == 'percent') ? true false,
            
'pricing_value' => $_value->getPrice(true)
            ), 
false);
        
$select->addOption(
            
$_value->getOptionTypeId(),
            
$_value->getTitle() . ' ' $priceStr ''
        
);
    
}
    
if ($_option->getType() == Mage_Catalog_Model_Product_Option::OPTION_TYPE_MULTIPLE{
        $extraParams 
' multiple="multiple"';
    
}
    $select
->setExtraParams('onchange="opConfig.reloadPrice();loadAttributePreview(this)"'.$extraParams);
    print 
$select->getHtml();
    print 
"<img src=\"".$this->getSkinUrl('images/attributes/default.jpg')."\" border=\"0\" id=\"attributePreview\" alt=\"Color\"/>\n";
else {
     
echo $this->getValuesHtml();
} ?>
    <?php 
if ($_option->getIsRequire()): ?>
        <?php 
if ($_option->getType() == Mage_Catalog_Model_Product_Option::OPTION_TYPE_RADIO || $_option->getType() == Mage_Catalog_Model_Product_Option::OPTION_TYPE_CHECKBOX): ?>
            
<span id="options-<?php echo $_option->getId() ?>-container"></span>
        
<?php endif; ?>
    <?php 
endif;?>
</dd>
 
Magento Community Magento Community
Magento Community
Magento Community
 
albossum
Member
 
Total Posts:  55
Joined:  2009-03-17
 

danke @mago und sorry @SebastianTobias…

hatte das schon wieder total vergessen… hab super viel streß und termine im nacken… hätte das auch nicht besser beschreiben können, eher schlechter, weil bin in magento auch noch nicht so drin, wie ich´s mir wünsche…

ist natürlich “nur” die “einfache” variante, weil mit vordefinierten bildern… (bitte nicht falsch verstehen, weil einfach ist es sicher nicht) bei unseren grußkarten ist es ja so, dass das select feld automatisch mit gelisteten und verfügbaren (wawi) grußkarten gefüttert wird. neue grußkarten im sortiment sind also automatisch im select mit bild dabei…

weiß auch noch nicht, wie ich das überhaupt umsetzen kann, weil ist mit magento sicher nicht so einfach wie bei oscommerce… wenns überhaupt geht… na mal sehen

oder hat dazu jemand ne idee?

gruß

albossum

 
Magento Community Magento Community
Magento Community
Magento Community
 
sebtb
Sr. Member
 
Avatar
Total Posts:  196
Joined:  2008-12-28
 

werd ich gleich mal morgen ausprobieren smile thx mago
vllt kann ichs ja dann wieder verbessern, wie das andere ^^

@albossum, ich werd ma nachdenken

 
Magento Community Magento Community
Magento Community
Magento Community
 
pgoetzin
Jr. Member
 
Total Posts:  28
Joined:  2009-04-24
 

Hallo zusammen,
ich habe es mal mit css probiert und es scheint zu gehen, bild wird angezeigt.
habe es aber noch nicht ausführlich getestet..

einfach

option[value='6']:before { content:url("/skin/frontend/default/default/images/media/col_right_callout.jpg"); }

in boxes.css reinkopieren und value anpassen

grüße
Philipp

 
Magento Community Magento Community
Magento Community
Magento Community
 
pgoetzin
Jr. Member
 
Total Posts:  28
Joined:  2009-04-24
 

zu früh gefreut,
in firefox 3 gehts ohne probleme im IE leider nicht ... im ie zeigt er kein bild an

 
Magento Community Magento Community
Magento Community
Magento Community
 
sebtb
Sr. Member
 
Avatar
Total Posts:  196
Joined:  2008-12-28
 

probier mal die grafiken mit nem image preloader vorzuladen, vielleicht gehts dann.
ansonsten kann ich den Code von mago empfehlen (:

 
Magento Community Magento Community
Magento Community
Magento Community
Magento Community
Magento Community
Back to top