TEMPLATE: Artikelansicht zweispaltig & dreispaltig auf CSS Basis

[CojaX]

Ist beim einen ein Bild dabei und beim anderen nicht?

Ein Bild oder abweichender Text könnte alles eben so "nach unten" weiterschieben.

Du kannst in deiner product_listing_v1.html dem <div> in dem das Bild - falls vorhanden - ist eine feste Höhe geben, so dass bei einem leeren Feld (also ohne Bild) trotzdem die Größe bleibt.

Musst eben nur Wissen, wie groß deine Thumbnail Bilder sind.

Dazu passt du das hier :

Code: PHP  [Auswählen]

<div style="float:left;width:120px">{if $module_data.PRODUCTS_IMAGE}
    <a href="{$module_data.PRODUCTS_LINK}"><img src="{$module_data.PRODUCTS_IMAGE}" alt="{$module_data.PRODUCTS_NAME}" /></a>
  {/if}</div>
 

An zu :

Code: PHP  [Auswählen]

<div style="float:left;width:120px;height:120px">{if $module_data.PRODUCTS_IMAGE}
    <a href="{$module_data.PRODUCTS_LINK}"><img src="{$module_data.PRODUCTS_IMAGE}" alt="{$module_data.PRODUCTS_NAME}" /></a>
  {/if}</div>
 

Und den Wert von 120px auch eben durch ausprobieren anpassen 

[JulianRomeo]

Guten morgen,

ich hab nun die Thumbnails alle auf eine größe geändert, also die Höhe, nun passt das ganze.

Ich hab aber eine Frage zum Design.

Ich hab die farben des Rahmen und der Balken angepasst. Kann ich diese Balken auch mit einem Bild versehen? Würde das gern passend zum rest des Style xct5 haben.

Wo muss ich das anpassen, oder wie am besten?

[CojaX]

Hallo,

wir können dir nicht jeden Code nach Wunsch schreiben.

Deine Fragen sind alles Basiswissen, was jeder Webadmin im Schlaf beherschen sollte.

Ich lege dir mal diese zwei Seiten ans Herz,
dort erfährst du alles zum Thema CSS - was welche Codes bewirken und wie man sie einbaut:

http://www.css4you.de/
http://www.w3schools.com/css/

Dann noch einmal einen letzten Code für deine Frage:

Die "Balken" werden in dieser Zeile defeniert:

Code: CSS  [Auswählen]

#listingheader{padding:7px 0px 0px 15px;margin:0;height:22px;font-SIZE:11px;background-image:url(img/hl_new_products.jpg);background-repeat:repeat-x;font-weight:bold;color:#ffffff;}

Um ein Bild einzufügen, erstellst du es zB mit Photoshop in der passenden Größe,
lädst es per FTP hoch, und änderst die URL "hl_new_products.jpg" in "dein-eigenes-bild.jpg".

Das Standardbild von den Standard "Boxen" hat die URL img/bg_boxheader.gif.

Gruß 

[JulianRomeo]

Guten morgen CojaX,

Basiswissen für ich CSS nun nicht nennen... aber ich denke, das sieht jeder anders.

Ich hab mir die Seiten aber angesehen und danke dir für diese verlinkung.

[Gamehammer]

Hallo Leute,

ich habe wie beschrieben die Artikelanzeige auf 3-spaltig geändert. Auf der Startseite wird es auch absolut korrekt angezeigt. Das Problem ist wenn ich auf die Detailansicht zu den Artikeln gehe. Dort erscheint dann über dem Header des Shops folgende Fehlermeldung bzw. folgender Hinweis:

/* "+css+"<\/style>"); }); $(function() { $("#tabbed_product_info").tabs(); $("#accordion_product_info").accordion({ autoHeight: false }); }); /*]]>*/

Woran kann das liegen und wie beseitige ich diesen Fehler / Hinweis ?

Hier zudem noch die geforderten Daten:
- Fehlerbeschreibung: siehe Text oben
- PHP-Version, MySQL-Version: 5.3.18-nmm1 (Zend: 2.3.0) , MySQL 5.1.70-nmm2-log
- Link zum Shop: http://www.gamehammer.de/shop
- Angabe evtl. installierter Module: jQuery-Autocomplete und Artikelanzeige 3-spaltig
- Sind Originaldateien geändert worden?: Ja, den Modulen endsprechend
- Shopversion: v1.06 rev 4356 dated: 2013-01-23
- Datenbank Version: MOD_1.0.6.0

Ich hoffe das ich bis hierher alles richtig gemacht habe um etwas Hilfe zu erhalten.
Bedanke mich schon mal im voraus.

[xeron]

hast du irgendwas in der general.js.php geändert?

Das was da angezeigt wird stammt aus dieser. Scheinbar hast Du nach dem Einbau der Suchfunktion  jQuery-Autocomplete irgendwas überschrieben oder gelöscht?

Poste mal Deine genaral.js.php

Grüße
Andre

[Gamehammer]

Ja, die "general.js.php" wurde der Anweisung gemäß abgeändert.

Hier mal die aktuelle PHP:

Code: PHP  [Auswählen]

<?php
/* -----------------------------------------------------------------------------------------
   $Id: general.js.php 1262 2005-09-30 10:00:32Z mz $

   XT-Commerce - community made shopping
   http://www.(( Wir dulden keine kommerziellen Werbelinks - Bitte <a href="index.php?topic=3013.0">Forenregeln</a> beachten! ))

   Copyright (c) 2003 XT-Commerce
   -----------------------------------------------------------------------------------------
   Released under the GNU General Public License
   ---------------------------------------------------------------------------------------*/


   // this javascriptfile get includes at the BOTTOM of every template page in shop
   // you can add your template specific js scripts here
?>
<script src="<?php echo 'templates/'.CURRENT_TEMPLATE; ?>/javascript/jquery.js" type="text/javascript"></script>
<script src="<?php echo 'templates/'.CURRENT_TEMPLATE; ?>/javascript/thickbox.js" type="text/javascript"></script>
<script src="<?php echo 'templates/'.CURRENT_TEMPLATE; ?>/javascript/jquery-ui.js" type="text/javascript"></script>
<script src="<?php echo 'templates/'.CURRENT_TEMPLATE; ?>/javascript/jquery-searchbox.js" type="text/javascript"></script>
<?php // BOF - web28 - 2010-07-09 - TABS/ACCORDION in product_info ?>
<?php
if (strstr($PHP_SELF, FILENAME_PRODUCT_INFO )) {
?>

/* <![CDATA[ */
        //Laden einer CSS Datei mit jquery
    $.get("<?php echo 'templates/'.CURRENT_TEMPLATE; ?>"+"/css/javascript.css", function(css) {
                $("head").append("<style type='text/css'>"+css+"<\/style>");
        });

        $(function() {
                $("#tabbed_product_info").tabs();
                $("#accordion_product_info").accordion({ autoHeight: false });
        });
/*]]>*/
</script>
<?php
}
?>
<?php // EOF - web28 - 2010-07-09 - TABS/ACCORDION in product_info ?>

Und hier die Originale:

Code: PHP  [Auswählen]

<?php
/* -----------------------------------------------------------------------------------------
   $Id: general.js.php 1262 2005-09-30 10:00:32Z mz $

   XT-Commerce - community made shopping
   http://www.(( Wir dulden keine kommerziellen Werbelinks - Bitte <a href="index.php?topic=3013.0">Forenregeln</a> beachten! ))

   Copyright (c) 2003 XT-Commerce
   -----------------------------------------------------------------------------------------
   Released under the GNU General Public License
   ---------------------------------------------------------------------------------------*/


   // this javascriptfile get includes at the BOTTOM of every template page in shop
   // you can add your template specific js scripts here
?>
<script src="<?php echo 'templates/'.CURRENT_TEMPLATE; ?>/javascript/jquery.js" type="text/javascript"></script>
<script src="<?php echo 'templates/'.CURRENT_TEMPLATE; ?>/javascript/thickbox.js" type="text/javascript"></script>

<?php // BOF - web28 - 2010-07-09 - TABS/ACCORDION in product_info ?>
<?php
if (strstr($PHP_SELF, FILENAME_PRODUCT_INFO )) {
?>
<script src="<?php echo 'templates/'.CURRENT_TEMPLATE; ?>/javascript/jquery-ui.js" type="text/javascript"></script>
<script type="text/javascript">
/* <![CDATA[ */
        //Laden einer CSS Datei mit jquery
    $.get("<?php echo 'templates/'.CURRENT_TEMPLATE; ?>"+"/css/javascript.css", function(css) {
                $("head").append("<style type='text/css'>"+css+"<\/style>");
        });

        $(function() {
                $("#tabbed_product_info").tabs();
                $("#accordion_product_info").accordion({ autoHeight: false });
        });
/*]]>*/
</script>
<?php
}
?>
<?php // EOF - web28 - 2010-07-09 - TABS/ACCORDION in product_info ?>

Ehrlich gesagt, ich hätte auch nicht gewusst wo ich den Fehler suchen sollte.

[xeron]

ich sehe da momentan auch nichts falsches.

[Gamehammer]

Sorry Leute,
war mein Fehler. Ich habe in dem ganzen hin- und herkopiere eine Zeile irgendwie verloren 

Das "</script>" in Zeile 37 wurde vorher nicht geöffnet, da macht das Schließen auch keinen Sinn.

Es fehlte das"<script type="text/javascript">" in Zeile 25.

Ich möchte mich für die Hilfe von xeron recht herzlich bedanken und nochmals alle die sich Gedanken gemacht haben um Entschuldigung bitten.

 

Nach einer gewissen Zeit sieht man den Wald vor lauter Bäumen nicht

[JulianRomeo]

Guten morgen,

ich hab schon ein wenig rumprobiert und auch gesucht, aber nichts finden können... oder ich habs überlesen... bei mehr als 8 Seiten auch verständlich denk ich.

Ich hab das 2 Spalten Design verbaut und soweit sehr zufrieden. Konnte alles recht einfach finden mit Hilfe von CojaX...

Nun kommt das nächste "Problem"... lässt sich aber sicherlich lösen...

Ich hab einem Artikel einen Rabatt hinzugefügt, welcher auch angezeigt wird.

Jedoch alles in der gleichen Farbe.

Der alte Preis ist schwarz und mit einem schwarzen Strich durchgestrichen.

Der neue Preis und die Angabe wieviel Rabatt es gibt und wieviel man spart ist auch schwarz. Diesen hätte ich aber gern in rot,sodass es direkt auffällt.

Und das nächste Problem, die Box für den Artikel verschiebt sich, bzw der Inhalt der Box.

Anbei ein Screen... vielleicht kann mir jemand kurz helfen??

PS: Ich würde auch gern die Kurzbeschreibung hinzufügen, damit die ganze Artikelbox nicht so leer aussieht. Ich hab auf der ersten Seite gesehen, wie ich das machen muss,weiß aber nicht in welcher Datei ich die Änderung vornehmen muss.

[JulianRomeo]

Hallo,

wollte editieren, aber geht leider nicht.

Ich hab in meinem oberen Post geschrieben:

Der alte Preis ist schwarz und mit einem schwarzen Strich durchgestrichen.

Der neue Preis und die Angabe wieviel Rabatt es gibt und wieviel man spart ist auch schwarz. Diesen hätte ich aber gern in rot,sodass es direkt auffällt.

Des soll aber genau umgekehrt... also so,wie es standard ist... alter preis rot mit roten strich durch und neues preis schwarz...

[neicooo]

Das sollte über CSS gehen mit der Klasse

class="productOldPrice"

[WeXsler]

bin völliger Anfänger und verstehe die ganzen codes nicht so recht. Versuche aber es zu verstehen - bislang offenbar mit mäßigem Erfolg ... .

Mein Problem:

Hatte mir jetzt in dem neu aufgesetzten 1.06 das zweispaltige Design eingebaut. Sieht auch prima aus! Leider fehlen aber wesentliche Sachen . Hatte das in einem anderen Post versucht schon zu beschreiben - war aber möglicherweise schlicht falsch da. Auch wenn dieser thread ja schon ein paar Tage alt ist, sind hier wohl diejenigen, die da Ahnung haben. Ja?? Hoffe ihr könnt mir helfen!!!!

In den Boxen fehlt mir: Grundpreis, Angebotszeitraum, Lieferzeitangabe, "Jetzt Kaufen"-Button.
In der Detailansicht passt noch fast alles - außer dass da jetzt bei einem Angebot der Angebotspreis nicht angezeigt wird - in der Box der Produktübersicht schon ... .

Nachdem ich jetzt den dritten Tag laienhaft herumbastele und einfach nicht weiterkomme - könnte mir da jemand das einmal zeigen? Muss da evtl. nicht nur in der product_listing_v1.html was nachgearbeitet werden sondern auch in dem css-code für die styleshett.css?? Noch ganz wo anders was?

So habe ich das mal in meiner product_listing_v1.html versucht - aber da funktioniert nichts

Code: PHP  [Auswählen]

{config_load file="$language/lang_$language.conf" section="index"}
    {if $CATEGORIES_HEADING_TITLE}
      <h1>{$CATEGORIES_HEADING_TITLE}</h1>
    {elseif $ADVANCED_SEARCH_HEADER}
      <h1>{$ADVANCED_SEARCH_HEADER}</h1>
    {else}
      <h1>{$CATEGORIES_NAME}</h1>
    <div class="hrproductpreview"></div>
    {/if}
    {if $MANUFACTURER_DROPDOWN}{$MANUFACTURER_DROPDOWN}{/if}
    <br />
    <div align="center">
    {foreach name=aussen item=module_data from=$module_content}
       {php} $col++;
      {/php}
      <div class="listingbox">
      <div class="listing" align="center"><a href="{$module_data.PRODUCTS_LINK}" title="{$module_data.PRODUCTS_NAME}">{$module_data.PRODUCTS_NAME}</a></div>
      <div class="listing_body">
      <div class="listing_img">{if $module_data.PRODUCTS_IMAGE}
        <a href="{$module_data.PRODUCTS_LINK}"><img src="{$module_data.PRODUCTS_IMAGE}" title="{$module_data.PRODUCTS_NAME}" alt="{$module_data.PRODUCTS_NAME}" /></a>
      {/if}</div>
         {$module_data.PRODUCTS_SHORT_DESCRIPTION|strip_tags|truncate:100:"...":false}
        <div class="listing_price"><span class="price"><b>{$module_data.PRODUCTS_PRICE|regex_replace:'/(<span class=\"productOldPrice\">)<small>Unser bisheriger Preis <\/small>(.*?)(<\/span>)<br \/> Jetzt nur (.*?)<br \/><small>Sie sparen .*? \% \/ .*?<\/small>(.*?)/s':' \\1 \\2 \\3 / \\4'}</b></span><br />
        ({$module_data.PRODUCTS_TAX_INFO}<br />{if $module_data.PRODUCTS_VPE}<p class="vpe">{$module_data.PRODUCTS_VPE}{/if}<br />{if $module_data.PRODUCTS_SHIPPING_NAME}<p class="shippingtime">{#text_shippingtime#}{if $module_data.PRODUCTS_SHIPPING_IMAGE}<img src="{$module_data.PRODUCTS_SHIPPING_IMAGE}" alt="{$module_data.PRODUCTS_SHIPPING_NAME}" />{/if}
                        {$module_data.PRODUCTS_SHIPPING_NAME}{/if}<br />{$module_data.PRODUCTS_SHIPPING_LINK})</div>
        </div>
        <div class="listing_bottom"><a href="{$module_data.PRODUCTS_LINK}"><img src="{$tpl_path}buttons/{$language}/button_product_more.gif" title="Details anzeigen" alt="Details Button" /> {$module_data.PRODUCTS_BUTTON_BUY_NOW}&nbsp;<a href="{$module_data.PRODUCTS_LINK}"><img src="{$tpl_path}buttons/{$language}/button_product_more.gif" alt="Details" border="0" /></a></div>
    </div>
        {php}
      if ($col>=2) {
      $col=0;
      echo '';
      }
      {/php}
    {/foreach}
    </div>
    {$NAVIGATION}

[EDIT Tomcraft 14.07.2014: Code mit "PHP-Button" formatiert.]

[Bonsai]

Bitte verwende für Code den Knopf php hier im Editor..... dann liest das eventuell auch jemand.

[WeXsler]

ah, ok! Hatte mich schon gefragt, wie das geht. Lässt sich jetzt aber wohl leider nicht mehr ändern Vielleicht mag einer der admins das "zurechtrücken"? Danke!