Antwort #45 am: 09. Juli 2009, 07:01:58
Um es mal ein wenig zu erläutern...
"/weg_zum_shop/templates/Dein_template/javascript/tabfunktion.js" wurde erstellt mit folgendem Inhalt:
function punkt1 () {
if(document.getElementById('pid1').style.display=='none') {
document.getElementById('pid1').style.display='block';
document.getElementById('pid2').style.display='none';
document.getElementById('pid3').style.display='none';
}
}
function punkt2 () {
if(document.getElementById('pid2').style.display=='none') {
document.getElementById('pid1').style.display='none';
document.getElementById('pid2').style.display='block';
document.getElementById('pid3').style.display='none';
}
}
function punkt3 () {
if(document.getElementById('pid3').style.display=='none') {
document.getElementById('pid1').style.display='none';
document.getElementById('pid2').style.display='none';
document.getElementById('pid3').style.display='block';
}
}
In der "/weg_zum_shop/templates/Dein_template/javascript/general.js.php" wurde dies wie beschrieben eingefügt:
<script src="<?php echo 'templates/'.CURRENT_TEMPLATE; ?>/javascript/tabfunktion.js" type="text/javascript"></script>
Meine "/weg_zum_shop/templates/Dein_template/module/product_info/product_info_v1.html" sieht wie folgt aus:
{config_load
file="$language/lang_$language.conf" section
="product_info"}{if $MODULE_product_options !=''}{php
} // DA WIR EIN JAVASCRIPT IN DEN OPTIONEN HABEN, WENN DAS ADDON RICHTIG EINGEBAUT WURDE, KÖNNEN WIR HIER DANACH SUCHEN. // WENN WIR EIN JAVASCRIPT FINDEN, WIRD DER ARTIKEL OPTIONEN HABEN! if (strpos ($this->_tpl_vars
['MODULE_product_options'], 'javascript')) { $this->_tpl_vars
['myPriceUpdate_JS'] = $this->_tpl_vars
['tpl_path'] . 'source/product_info_jscript.js.php'; $this->_tpl_vars
['myPriceUpdate_PP'] = $this->_tpl_vars
['tpl_path'] . 'source/product_info.php'; $this->_tpl_vars
['myPriceUpdate_DO'] = 787; include_once ($this->_tpl_vars
['myPriceUpdate_JS']); }{/php
}{/if}{if $MODULE_product_options !=''}{if $MODULE_product_options eq
""} {include_php
file=$mySourcePath_JS}{/if}{/if}{$FORM_ACTION}<h1
>{$PRODUCTS_NAME}</h1
><div id
="productinfowrap"><table
><tr
><td style
="padding-right:20px;"> {if $PRODUCTS_IMAGE!=''} <a title
="{$PRODUCTS_NAME}" href
="{$PRODUCTS_IMAGE|replace:"info_images
":"popup_images
"}" class="thickbox" rel
="{$PRODUCTS_ID}"><img align
="left" src
="{$PRODUCTS_IMAGE}" alt
="{$PRODUCTS_NAME}" class="productimage" /></a
> {if $PRODUCTS_POPUP_LINK!=''}<div
class="hrlightgrey"></div
><a href
="{$PRODUCTS_POPUP_LINK}" onclick
="window.open(this.href); return false;">{#text_zoom#}</a>{/if}
{/if}</td
><td
> <div id
="productinfopricewithimages"> <p
class="productprice"> {if $MODULE_product_options !=''} {if $myPriceUpdate_DO eq
787} <noscript
> <strong
>{#baseprice#} {$PRODUCTS_PRICE}</strong><br />
</noscript
> <input type
="hidden" name
="langpricetext" id
="langpricetext" value
="{#fullprice#}" /> {include_php
file=$myPriceUpdate_PP} <small
>{#baseprice#} {$PRODUCTS_PRICE}</small><br />
{else} <strong
>{$PRODUCTS_PRICE}</strong
><br
/> {/if} {else}<strong
>{$PRODUCTS_PRICE}</strong
><br
/> {/if} </p
> <noscript
> <p
>Sie haben JavaScript deaktiviert und eine autom
. Produktpreisaktualisierung ist nicht möglich
. </p
></noscript
> <p
class="taxandshippinginfo" style
="white-space:nowrap">{$PRODUCTS_TAX_INFO}{if $PRODUCTS_SHIPPING_LINK}{$PRODUCTS_SHIPPING_LINK}{/if}</p
> {if $SHIPPING_NAME}<p
class="shippingtime"><strong
>{#text_shippingtime#}</strong>{if $SHIPPING_IMAGE}<img src="{$SHIPPING_IMAGE}" alt="{$SHIPPING_NAME}" />{/if} {$SHIPPING_NAME}</p>
{/if} {if $PRODUCTS_VPE} <div
class="hrlightgrey"></div
>{$PRODUCTS_VPE}{/if} {if $MODULE_graduated_price !=''}<div
class="hrlightgrey"></div
>{$MODULE_graduated_price}{/if} {if $PRODUCTS_DISCOUNT!=''}<div
class="hrlightgrey"></div
>{$PRODUCTS_DISCOUNT}{/if} {if $PRODUCTS_FSK18=='true'}<div
class="hrlightgrey"></div
><img src
="{$tpl_path}img/fsk18.gif" alt
="" style
="cursor:default" />{/if} {if $PRODUCTS_MODEL!=''}<div
class="hrlightgrey"></div
> <strong
>{#model#}</strong> {$PRODUCTS_MODEL}{/if}
{if $PRODUCTS_URL != ''} <div
class="hrlightgrey"></div
><div style
="padding-top:5px;">{$PRODUCTS_URL}</div
> {/if} <br
/> <div style
="margin-top:10px"></div
> {$PRODUCTS_PRINT} {if $PRODUCTS_DATE_AVIABLE != ''}<p
>{$PRODUCTS_DATE_AVIABLE}</p
>{/if} </div
> <div style
="clear:both;"></div
> </td
></tr
></table
> {if $MODULE_product_options !=''} <div
class="productoptions">{$MODULE_product_options}</div
>{/if} <div
class="addtobasket"> <table border
="0" cellspacing
="0" cellpadding
="2"> <tr
> <td style
="width:100%; padding-right:5px;">{$ADD_QTY}</td
> <td
>{$ADD_CART_BUTTON}</td
> </tr
> </table
> </div
> <br
> <div id
="moreInformationHead"> <a href
="#" onclick
="javascript:punkt1 (); return false" title
="Beschreibung">Artikelbeschreibung
</a
> | <a href
="#" onclick
="javascript:punkt2 (); return false" title
="Datenblatt">Datenblatt
</a
> | <a href
="#" onclick
="javascript:punkt3 (); return false" title
="Mehr Bilder">Weitere Produktbilder
</a
> </div
> <div id
="moreInformation"> <div id
="pid1" style
="margin: 5px; display: block;"> {if $PRODUCTS_DESCRIPTION !=''} <p
>{$PRODUCTS_DESCRIPTION}</p
> {else} Keine weitere Beschreibung vorhanden
. {/if} </div
> <div id
="pid2" style
="margin: 5px; display: none;"><p
></p
></div
> <div id
="pid3" style
="margin: 5px; display: none;"> {if $PRODUCTS_IMAGE_1 != ''} <p
><a
class="thickbox" rel
="{$PRODUCTS_ID}" title
="{$PRODUCTS_NAME}" href
="{$PRODUCTS_IMAGE_1|replace:"info_images
":"popup_images
"}"><img align
="left" src
="{$PRODUCTS_IMAGE_1}" alt
="{$PRODUCTS_NAME}" /></a
> <a
class="thickbox" rel
="{$PRODUCTS_ID}" title
="{$PRODUCTS_NAME}" href
="{$PRODUCTS_IMAGE_2|replace:"info_images
":"popup_images
"}"><img align
="left" src
="{$PRODUCTS_IMAGE_2}" alt
="{$PRODUCTS_NAME}" /></a
></p
> {else} Keine weiteren Bilder vorhanden
. {/if} </div
> <br clear
="all" /> </div
></div
>{$FORM_END}{if $MODULE_products_media != ''}{$MODULE_products_media}{/if}{if $MODULE_products_reviews != ''}{$MODULE_products_reviews}{/if}{if $MODULE_cross_selling != ''}{$MODULE_cross_selling}{/if}{if $MODULE_reverse_cross_selling != ''}{$MODULE_reverse_cross_selling}{/if}{if $MODULE_also_purchased != ''}{$MODULE_also_purchased}{/if}{if $PRODUCTS_ADDED != ''}<p
class="productinfoproductadded">{$PRODUCTS_ADDED}</p
>{/if}{$PRODUCT_NAVIGATOR} Meine "/weg_zum_shop/templates/Dein_template/stylesheet.css" wurde ebenfalls erweitert mit:
/* Tab's */
#moreInformation {
border: 1px solid #C0C0C0;
min-height: 150px;
background-color: #F6F6F6;
}
#moreInformationHead {
padding: 2px 5px 2px 5px;
width: 345px;
border-right: 1px solid #C0C0C0;
border-left: 1px solid #C0C0C0;
border-top: 1px solid #C0C0C0;
}
Klicke ich nun in meinem Demoshop in der Produktansicht auf den Tab "Artikelbeschreibung" erscheint exakt die Beschreibung die ich im Backend in der Artikelverwaltung angegeben habe.
Klicke ich auf den Tab "Weitere Produktbilder" erscheinen 2 weitere Vorschaubilder, die sich wie vorher auch ganz normal mittels Thickbox öffnen.
Beim Klicken auf den Tab "Datenblatt" erscheint im Moment natürlich noch nichts.
Dies will ich aber ändern.
Nun meine Frage: Wie?
Ich dachte da etwa an folgendes:
Ich gebe im Backend in der Artikelbeschreibung ganz normal meinen Text ein für den 1. Tab quasi. Dann kommt in exakt der selben Artikelbeschreibung so etwas wie ein Code, z.B. [TAB2] und direkt danach die Beschreibung, die im Frontend unter dem 2. Tab, also "Datenblatt", sichtbar wird.
Wer kann mir bei der Umsetzung helfen oder hat eine eventuell bessere Idee?