Tutorial: Warenkorb in den Header verschieben

Aus Wiki | xtcModified eCommerce Shopsoftware

Auch hier nach wurde schon oft gefragt, daher hier jetzt als Anleitung:

In "/templates/xtc5/index.html" bitte die Warenkorb-Box wie folgt mit Asterisk (*) auskommentieren: 

{*$box_CART*}

Suche in "/templates/xtc5/index.html": 

    <div id="header">
        <div id="logo"><img src="{$tpl_path}img/spacer.gif" width="400" alt="{$store_name}" /></div>
        <div id="search">{$box_SEARCH}</div>
    </div>

und ersetze mit: 

    <div id="header">
        <div id="logo"><img src="{$tpl_path}img/spacer.gif" width="400" alt="{$store_name}" /></div>
        <div id="cart">{$box_CART}</div>
    </div>

Suche in "/templates/xtc5/boxes/box_cart.html": 

{config_load file="$language/lang_$language.conf" section="boxes"}
{if $deny_cart neq 'true'}
	<h2 class="boxcartheader">{#heading_cart#}</h2>
	<div{if $GV_AMOUNT =='' } class="boxcartbody" {else} class="boxcartbody"{/if}>
	{if $ACTIVATE_GIFT=='true'}
		{if $GV_AMOUNT neq ''}
			<p><strong>{#voucher_balance#}</strong>&nbsp;{$GV_AMOUNT}</p>
			<div class="hr"></div>
		{/if}
	{/if}
	{if $empty=='false'} <!-- cart has content -->
		{foreach name=aussen item=products_data from=$products}
			<p>{$products_data.QTY}&nbsp;x&nbsp;<a href="{$products_data.LINK}">{$products_data.NAME|truncate:20:"...":true}</a></p>
		{/foreach}
		<div class="hr"></div>
		<p style="text-align:right">{if $DISCOUNT}{#text_discount#} {$DISCOUNT}<br />{/if}
		{$UST}
		<strong>{#text_total#}:{$TOTAL}</strong><br />
		{if $SHIPPING_INFO}{$SHIPPING_INFO}{/if}</p>
		<div class="hr"></div>
		<p style="text-align:right;"><a href="{$LINK_CART}"><strong>{#heading_cart#}&nbsp;»</strong></a></p>
	{else} <!-- cart has no content -->
		<p>{#text_empty_cart#}</p>
	{/if}
	</div>
{/if}

und ersetze mit: 

{config_load file="$language/lang_$language.conf" section="index"}
{config_load file="$language/lang_$language.conf" section="shopping_cart"}
{config_load file="$language/lang_$language.conf" section="boxes"}
{if $deny_cart neq 'true'}
	{if $empty=='false'}
		<h2 class="boxcartheader-menu"><a href="{$LINK_CART}"><strong>{#link_cart#}:</strong></a></h2>
		<div{if $GV_AMOUNT =='' } class="boxcartbody-menu" {else} class="boxcartbody-menu"{/if}>
			<strong>{$PRODUCTS}</strong> {#text_article#} | {#text_total#}:<strong>{$TOTAL}</strong>
		</div>
	{else} <!-- cart has no content -->
		<h2 class="boxcartheader-menu"><a href="{$LINK_CART}"><strong>{#link_cart#}:</strong></a></h2>
		<div{if $GV_AMOUNT =='' } class="boxcartbody-menu" {else} class="boxcartbody-menu"{/if}>
			<p><strong>0</strong> {#text_article#} | {#text_total#}: <strong>0,00 {$smarty.session.currency}</strong>{*#text_empty_cart#*}</p>
		</div>
{/if}
 
	{if $ACTIVATE_GIFT=='true'}
		{if $GV_AMOUNT neq ''}
			<div class="boxcartbody-menu">{#voucher_balance#} <strong>{$GV_AMOUNT}</strong></div>
		{/if}
	{/if}
{/if}

Suche in "/templates/xtc5/stylesheet.css": 

#header #logo {
	float:left
}

und füge danach ein: 

#header #cart {
	#background: url(img/cart.png) no-repeat;
	#background-position:right;
	width: 230px;
	height:75px;
	float:right;
	color:#fff;
	padding:10px 10px 20px 0px;
	margin-right:12px;
}
#header #cart a {
	color:#fff;
	font-size:13px;
	outline: none;
}

Wenn ihr ein Warenkorb-Symbol hinter dem Warenkorb anzeigen wollt, dann bitte die Rauten vor den Zeilen 

[...]
#background: url(img/cart.png) no-repeat;
#background-position:right;
[...]

entfernen und ein "cart.png" im Ordner "/templates/xtc5/img/" bereitstellen.

So könnte es nach dem Umbau aussehen:

Suchleisteoben.png

Von „http://www.xtc-modified.org/mediawiki/index.php?title=Tutorial:_Warenkorb_in_den_Header_verschieben&oldid=1765“
           
anything