So sieht die "neue" product_info_tabs_v1.html aus:
{config_load
file="$language/lang_$language.conf" section
="product_info"}{$FORM_ACTION}<h1
>{$PRODUCTS_NAME}</h1
><div id
="productinfowrap">{if $PRODUCTS_IMAGE!=''} <a title
="{$PRODUCTS_NAME}" href
="{$PRODUCTS_IMAGE|replace:"info_images
":"popup_images
"}" class="thickbox" rel
="{$PRODUCTS_ID}"> <img src
="{$PRODUCTS_IMAGE}" alt
="{$PRODUCTS_NAME}" class="productimage" />{if $PRODUCTS_POPUP_LINK!=''}{/if} </a
>{/if} <div id
="productinfoprice"> <p
class="productprice"><b
>{$PRODUCTS_PRICE}</b
></p
> <p
class="taxandshippinginfo">{$PRODUCTS_TAX_INFO}{if $PRODUCTS_SHIPPING_LINK}{$PRODUCTS_SHIPPING_LINK}{/if}</p
> {if $SHIPPING_NAME} <p
class="shippingtime"><b
>{#text_shippingtime#}</b>{if $SHIPPING_IMAGE}<img src="{$SHIPPING_IMAGE}" alt="{$SHIPPING_NAME}" />{/if} {$SHIPPING_NAME}</p>
{/if} {if $PRODUCTS_VPE} <hr size
="1" />{$PRODUCTS_VPE}{/if} {if $MODULE_graduated_price !=''}<hr size
="1" />{$MODULE_graduated_price}{/if} {if $PRODUCTS_DISCOUNT!=''}<hr size
="1" />{$PRODUCTS_DISCOUNT}{/if} {if $PRODUCTS_FSK18=='true'}<hr size
="1" /><img src
="{$tpl_path}img/fsk18.gif" alt
="" style
="cursor:default" />{/if} {if $PRODUCTS_MODEL!=''}<hr size
="1" /> <b
>{#model#}</b> {$PRODUCTS_MODEL}{/if}
{if $PRODUCTS_URL != ''} <hr size
="1" />{$PRODUCTS_URL} {/if}<br
/><br
/> {$PRODUCTS_PRINT} {if $PRODUCTS_DATE_AVIABLE != ''}<p
>{$PRODUCTS_DATE_AVIABLE}</p
>{/if} </div
> <br
class="clearfix" /> {if $MODULE_product_options !=''} <div
class="productoptions">{$MODULE_product_options}</div
>{/if} <!-- BOF
- Tomcraft
- 2009-11-28 - Included xs
:booster
//--> {if $XTB_REDIRECT_USER_TO=='product'}<div style
='width:400px;padding:10px;color:white;background-color:green;'><strong
>Sie haben
die eBay Auktion gewonnen
!</strong
><br
/> Bitte w
ä
;hlen Sie nun noch
die gew
ü
;nschten Produkteigenschaften und legen Sie den Artikel danach in den Warenkorb
, um mit der Zahlung fortzufahren und das Produkt
versandfertig zu machen
!</div
>{/if} <!-- EOF
- Tomcraft
- 2009-11-28 - Included xs
:booster
//--> <div
class="addtobasket">{$ADD_QTY}{$ADD_CART_BUTTON}</div
> </div
>{$FORM_END}{*BEGIN TABS
*}<div id
="tabbed_product_info"><ul
> {if $PRODUCTS_DESCRIPTION !=''}<li
><a href
="#tab_description">{#description#}</a></li>{/if}
{if $MODULE_cross_selling != '' || $MODULE_reverse_cross_selling != ''}<li
><a href
="#tab_cross_selling">{#cross_selling#}</a></li>{/if}
{if $MODULE_also_purchased != ''}<li
><a href
="#tab_also_purchased">{#also_purchased#}</a></li>{/if}
{if $MODULE_products_reviews != ''}<li
><a href
="#tab_reviews">{#products_reviews#}</a></li>{/if}
{if $MODULE_products_media != ''}<li
><a href
="#tab_media">{#products_media#}</a></li>{/if}
{if $more_images|@count
> 0}<li
><a href
="#tab_more_images">{#more_images#}</a></li>{/if}
</ul
>{if $PRODUCTS_DESCRIPTION !=''}<div id
="tab_description">{$PRODUCTS_DESCRIPTION}</div
>{/if}{if $more_images|@count
> 0}<div id
="tab_more_images"> <!-- More Pictures
--> <div
class="morepics"> {foreach item
=more_images_data from
=$more_images} <a
class="thickbox" rel
="{$PRODUCTS_ID}" title
="{$PRODUCTS_NAME}" href
="{$more_images_data.PRODUCTS_IMAGE|replace:"info_images
":"popup_images
"}"><img align
="left" src
="{$more_images_data.PRODUCTS_IMAGE}" alt
="{$PRODUCTS_NAME}" /></a
> {/foreach} </div
> <br
class="clearfix" /> </div
>{/if}{if $MODULE_products_media != ''}<div id
="tab_media">{$MODULE_products_media}</div
>{/if}{if $MODULE_products_reviews != ''}<div id
="tab_reviews">{$MODULE_products_reviews}</div
>{/if}{if $MODULE_cross_selling != '' || $MODULE_reverse_cross_selling != ''}<div id
="tab_cross_selling">{$MODULE_cross_selling}{if $MODULE_reverse_cross_selling != ''}{$MODULE_reverse_cross_selling}{/if}</div
>{/if}{if $MODULE_also_purchased != ''}<div id
="tab_also_purchased">{$MODULE_also_purchased}</div
>{/if}</div
>{*END TABS
*}{$PRODUCT_NAVIGATOR} Sie ist nun frei von Tabellen und Inline-Stylesheets. Genauso habe ich die Krücke <div class="hrlightgrey"></div> entfernt und durch ein <hr size="1" /> ersetzt. Der Einsatz von <div>-Container heißt ja nicht, dass es zur div-Suppe ausarten muss.
Natürlich hier noch die geänderten Stylesheets:
#productinfoprice {
padding:5px;
float:right;
text-align:right;
}
#productinfoprice .productprice {
margin:0;
padding:0;
font-size:14px;
}
.productoptions {
background-color:#f8f8f8;
padding:6px;
border-top:1px solid #ccc;
}
.addtobasket {
background-color:#EDEDED;
padding:6px;
text-align:right;
border-top:1px solid #999;
}
Und die neu hinzugekommenen Stylesheets:
#productinfowrap .productimage {
float:left;
padding:5px;
margin-bottom:10px;
}
hr {
margin:5px 0;
color:#ccc;
}
.clearfix {clear:both;}
.vert_mid {vertical-align:middle;}
Um das Produktmengeneingabefeld und den Warenkorb-Button ordentlich zu positionieren habe ich noch in der include/modules/product_info.php folgendes gemacht:
Suche:
$info_smarty->assign('ADD_CART_BUTTON', xtc_image_submit('button_in_cart.gif', IMAGE_BUTTON_IN_CART));
Ersetze mit:
$info_smarty->assign('ADD_CART_BUTTON', xtc_image_submit('button_in_cart.gif', IMAGE_BUTTON_IN_CART, 'class="vertical_mid"'));
Bereits im FF 3.6, IE8, Safari, Opera und Chrome getestet.
Gruß
Ronny
Linkback: https://www.modified-shop.org/forum/index.php?topic=7409.0 
