Bilder in Categorieliste zentrieren

[EMail4You]

hi @ll

ich möchte die Categorieliste so gestalten, dass die Bilder zur jeweiligen Categorie zentriert über/unter der Categoriebeschreibung erscheinen! (Bisher erscheinen sie linksbündig über der Beschreibung)

Wie muss ich die categorie-listing.htm modifizieren?

Gruß

EMail4You

[giller]

hi @ll

ich möchte die Categorieliste so gestalten, dass die Bilder zur jeweiligen Categorie zentriert über/unter der Categoriebeschreibung erscheinen! (Bisher erscheinen sie linksbündig über der Beschreibung)

Wie muss ich die categorie-listing.htm modifizieren?

Gruß

EMail4You

sehr schöne frage. bist du dir sicher das du selber änderung am shop machen

willst. ich habe da ein bischen angst.

das was du wilst schreibt man ins cascading style sheets

auf die klasse die den bild container umgiebt.

ich nutze keine kategorie bilder aber sie könnte z.b. .cat_img {margin:auto;}

heißen und helfen.

Und bitte mal ein Buch kaufen und lesen grundwissen sollte schon ein bischen

vohanden sein.

Professionelles Webdesign mit (X)HTML und CSS. - Das Buch von Galileo Computing

[EMail4You]

Angst??? wovor??

Das Wort gehört nicht zu meinem Wortschatz!

Ich denke... lesen ist zwar ok, aber selbst probieren und testen bringt erst den richtigen AHA-Effekt!

lG

EMail4You

[Sentor77]

Moin,

dann rate ich dir, dass doch einfach auszuprobieren. Kopiere dir die Datei und fang an daran rumzubasteln.

Du musst dir letzendlich ein neues Layout dafür basteln. Wenn du das Standard Template xt_default nutzen, dann kann das hier ein kleiner Denkanstoß für dich sein:

<h1>{$categories_name}</h1>

<div id="catImage">{img img=$categories_image type=m_category_info alt=$categories_name|escape:"html"}</div>

{if $categories_description}<p>{$categories_description}</p>{/if}

{if $categorie_listing !=''}

	<h3>{txt key=TEXT_HEADING_MORE_CATEGORIES}</h3>

	{php}$i=0;{/php}

	<div id="cat_listing">

		{foreach item=module_data from=$categorie_listing}

			{php}$i++;if ($i % 2 == 0){{/php}    <div class="s_cat odd">

			{php}}else{{/php}

			<hr class="spacer" />

			<div class="s_cat even">

			{php}}{/php}

				<div class=img_wrap">

					<a href="{$module_data.categories_link}" title="{$module_data.categories_name}">

						{img img=$module_data.categories_image type=m_category_thumb class=productImageBorder alt=$module_date.categories_name|escape:"html"}

					</a>

					<h2><a href="{$module_data.categories_link}" title="{$module_data.categories_name}">{$module_data.categories_name}</a></h2>

				</div>

			</div>

		{/foreach}

		<div style="clear:both;"></div>  

		{page name=xt_new_products type=user order_by='rand()' tpl_type='product_listing'}

	</div>

{/if}

[/HTML]

besonders die Zeile

[HTML]<div id="catImage">{img img=$categories_image type=m_category_info alt=$categories_name|escape:"html"}</div>[/HTML]

ist hie rinteressant, da hier das Bild gesetzt wird. Zentrieren kannst du es dir dann via css.

Viel Spaß beim basteln.