Aktuelle Sonderangebote

[IVOMANIA]

Ich habe ein Problem mit der main_specials.html.

Ich benutze die originale Datei aus dem webs Template. Trotzdem werden mir immer die ersten beiden Produkte nebeneinander, das 3. rechts darunter und die nächsten beiden wieder nebeneinander unter dem 3. Produkt angezeigt. So geht das dann weiter.
Wenn ich den Aufbau richtig verstehe sollen es doch

Code: Alles auswählen

<div id="main_specials" class="grid_12 alpha omega">
	<h2>{#heading#}</h2>
	{foreach from=$module_content item=CNT}
	<div class="grid_6 alpha">

immer 2 Spalten werden?
Bei mir will das einfach nicht klappen.
http://www.kathy.de/shop

Hat das Template hier einen Fehler?

Gruß Jens

[Xantiva]

Ja, Du musst alpha und omega abwechseln ...

Code: Alles auswählen

<div class="grid_6 alpha">

In so einer Darstellung von "Grid - Elemente" nebeneinander, muss das erste in einer Reihe zusätzlich die Klasse alpha und das letzte in einer Reihe die Klasse omega erhalten. Schau in den Quellcode der Startseite von meinem Shop. Die Kategorien sind in einer Dreierliste und die Produkte in einer Viererliste ...

Code: Alles auswählen

grid_4 alpha
grid_4
grid_4 omega

grid_4 alpha
grid_4
grid_4 omega

bzw.

Code: Alles auswählen

grid_3 alpha
grid_3
grid_3
grid_3 omega

grid_3 alpha
grid_3
grid_3
grid_3 omega

Bei Dir sollte es in der Zweierliste dann so aussehen:

Code: Alles auswählen

grid_6 alpha
grid_6 omega

grid_6 alpha
grid_6 omega

[IVOMANIA]

Ich habe jetzt

Code: Alles auswählen

{config_load file="$language/lang_$language.conf" section="main_specials"}

{if $module_content}
<div id="main_specials" class="grid_12 alpha omega">
	<h2>{#heading#}</h2>
	{foreach from=$module_content item=CNT}
	<div class="grid_6 {cycle values="alpha,omega"}">
		{if $CNT.PRODUCTS_IMAGE}
			<p class="center">
				{strip}
				<a href="{$CNT.PRODUCTS_LINK}">
					{img
						img_id=$CNT.PRODUCTS_IMAGE.ID
						src=$CNT.PRODUCTS_IMAGE.FILE
						preset=INFO
						prd_id=$CNT.PRODUCTS_ID
						alt=$CNT.PRODUCTS_IMAGE.ALT
						title=$CNT.PRODUCTS_IMAGE.TITLE
					}
				</a>
				{/strip}
			</p>
		{/if}

		<p><a href="{$CNT.PRODUCTS_LINK}"><strong>{$CNT.PRODUCTS_NAME}</strong></a></p>
		<p class="indent">
			{$CNT.PRODUCTS_PRICE}<br />
			{if $CNT.PRODUCTS_VPE}
				{$CNT.PRODUCTS_VPE}
			{/if}
		</p>

		{if $smarty.const.SHOWTAX}
			<p class="indent">
				{$CNT.PRODUCTS_TAX_INFO}<br />
				{get_shipping_link}
			</p>
		{/if}
	</div>
	{/foreach}
</div>
{/if}

in meiner main_specials.html stehen. Laut Firebug wechselt auch grid_6 alpha und grid_6 omega. Doch die Produkte werden immer noch so bescheiden dargestellt.

Gruß Jens

[Xantiva]

Eigentlich sieht das gut aus, was Dir fehlt, sind gleichgroße Produktbilder. So floaten die beiden letzten Produkte nicht wie gewünscht und sehen aus, als ob sie rechtsbündig wären.

Das solltest Du über die Bildformate doch gut hinbekommen?

Ciao,
Mike

[Doc Olson]

Ich glaube eher, dass die Höhe der Elemente das Problem ist. Alle Elemente floaten ja "left". "Fertigdecke Weihnachtsstern" ist aber höher, sodass die nächste Zeile da rechts dran hängen bleibt anstatt an die linke Kante zu floaten. Am unkompliziertesten wäre hier eine fixe Höhe für alle Elemente, damit solche überstehenden Kanten nicht auftreten.

Der Screenshot verdeutlicht das mal.

[IVOMANIA]

Das mit der Höhe der Bilder war die Lösung. Ich habe nun die maximale Bildhöhe auf 130 gesetzt.
Dadurch haben alle Bilder die selbe Höhe.
Wie man eine feste Größe dort einstellen kann, weiß ich leider nicht.
Doch so geht es auch, bis neue Produktbilder zur Verfügung stehen

Gruß Jens