Is doch ganz einfach: schmeiß die Tabellen raus, setz Dich mit Css auseinander und schon hast Du, was Du grauchst!
http://www.dilight.com/front_content.php?idcat=5
Im Klartext: Ich habe die Artikelliste als Definitionsliste umgebaut:
INPUT:
Code: Alles auswählen
/**
* Artikelliste
*
* Liste von Artikeln mit mehreren Daten basierend
* auf 4fb referenz modul
* 1.Gibt die Subheadline eines Artikel mit aus
* 2.Anschnitte nur nach ganzen Wörtern
* 3.Thumnails werden vernünftig berechnet
* 4.Image für Erzeugung von Thumbs kann gewählt werden
* Author : Evert Smit / Dirk Uptmoor / Peter Beauvain
* Copyright : None
* Created : 13-07-03
* Modified : 16-08-02 /20-09-03 upt /02-02-04 Beau
*/
// selected category
$selected = "CMS_VALUE[0]";
$seldir = "CMS_VALUE[9]";
$selimg = "CMS_VALUE[11]";
//funktion für die checkboxen
function d_checked($which) {
if ($which != "") {
return "checked";
}
} // end function
echo "<table cellspacing=\"0\" cellpadding=\"2\" border=\"0\">
<tr bgcolor=\"#E8E8EE\" valign=\"top\">
<td></td>
<td><input type=\"checkbox\" value=\"on\" ".d_checked("CMS_VALUE[14]")." name=\"CMS_VAR[14]\"></td>
<td width=\"120\">Ausgabe mit Startartikel</td>
<td></td>
<td>Kategorie wählen:<br>
<select name=\"CMS_VAR[0]\">";
if($selected!="0" && $selected!=""){
echo"<option value=\"0\">--- kein ---</option>";
}else{
echo"<option selected=\"selected\" value=\"0\">--- kein ---</option>";
}
// fetch all categorys
$query = "SELECT A.idcat, A.level, C.name FROM ".$cfg["tab"]["cat_tree"]." AS A, ".
$cfg["tab"]["cat"]." AS B, ".$cfg["tab"]["cat_lang"]." AS C WHERE A.idcat=B.idcat ".
"AND B.idcat=C.idcat AND C.idlang='$lang' AND B.idclient='$client' ".
"AND C.visible=1 ORDER BY A.idtree";
// execute query
$db->query($query);
// loop result and build the options
while ($db->next_record()) {
// indent spacer
$spaces = "|";
// how many levels
$levels = $db->f("level");
for ($i = 0; $i < $levels; $i ++) {
// add 2 spaces for every level
$spaces = $spaces . "--";
} // end for
$spaces .= ">";
if ($selected == $db->f("idcat")) {
// selected category
echo "<option selected=\"selected\" value=\"". $db->f("idcat") ."\">". $spaces . $db->f("name") ."</option>";
} else {
// category
echo "<option value=\"". $db->f("idcat") ."\">". $spaces . $db->f("name") ."</option>";
} // end if
} // end while
echo "</select>";
echo "</td>
<td></td>
</tr>
<tr valign=\"top\">
<td></td>
<td></td>
<td width=\"120\"></td>
<td></td>
<td>Überschrift: (wenn leer, keine Ausgabe)<br>
<input type=\"text\" name=\"CMS_VAR[2]\" value=\"CMS_VALUE[2]\" size=\"24\"></td>
</tr>
<tr bgcolor=\"#E8E8EE\" valign=\"top\">
<td></td>
<td> <input type=\"checkbox\" value=\"on\" ".d_checked("CMS_VALUE[4]")." name=\"CMS_VAR[4]\"> </td>
<td width=\"120\">Ausgabe der Artikel-Headline</td>
<td></td>
<td>Angezeigte Zeichen Artikel-Headline:<br>
<input type=\"text\" name=\"CMS_VAR[3]\" value=\"CMS_VALUE[3]\" size=\"24\"></td>
</tr>
<tr valign=\"top\">
<td></td>
<td><input type=\"checkbox\" value=\"on\" ".d_checked("CMS_VALUE[5]")." name=\"CMS_VAR[5]\"></td>
<td width=\"120\">Ausgabe der Artikel-Subheadline:</td>
<td></td>
<td>Angezeigte Zeichen Artikel-Subheadline:<br>
<input type=\"text\" name=\"CMS_VAR[6]\" value=\"CMS_VALUE[6]\" size=\"24\"></td>
</tr>
<tr valign=\"top\">
<td></td>
<td><input type=\"checkbox\" value=\"on\" ".d_checked("CMS_VALUE[12]")." name=\"CMS_VAR[12]\"></td>
<td width=\"120\">Ausgabe der Artikel-Text:</td>
<td></td>
<td>Angezeigte Zeichen Artikel-Text:<br>
<input type=\"text\" name=\"CMS_VAR[13]\" value=\"CMS_VALUE[13]\" size=\"24\"></td>
</tr>
<tr bgcolor=\"#E8E8EE\" valign=\"top\">
<td></td>
<tr bgcolor=\"#E8E8EE\" valign=\"top\">
<td></td>
<td><input type=\"checkbox\" value=\"on\" ".d_checked("CMS_VALUE[7]")." name=\"CMS_VAR[7]\" ></td>
<td width=\"120\">Ausgabe der Thumbnails:</td>
<td></td>
<td>Bildcontainer für Thumbnail Quelle:<br>";
$db = new DB_Contenido;
$query = "SELECT output AS out, name AS beschreibung FROM ".$cfg["tab"]["mod"]." ";
$db->query($query);
echo"<select name=\"CMS_VAR[11]\">";
echo"<option value=\"kein\">-- kein --</option> ";
while ($db->next_record()) {
$frontendpath = $db->f("out");
$name = $db->f("beschreibung");
$rest = substr("$frontendpath", 3, 30);
$find = strpos($rest,"CMS_IMG");
if ($find === false) {
}
else {
$ok = substr($rest, $find, 10);
$nummer = substr($ok, 8, 1);
?>
<option value="<?php echo $nummer ?>"<?php if ($selimg == $nummer) echo " selected" ?>><?php echo $db->f("beschreibung") ?>
<?
}
}
echo" </option> </select> ";
echo"</td>
</tr>
<td></td><td></td>
<td width=\"120\">Thumbnail Ordner</td>
<td></td><td>Bitte wählen:<br><select name=\"CMS_VAR[9]\" size=\"1\">";
echo"<option value=\"kein\">-- kein --</option>";
$db = new DB_Contenido;
$query = "SELECT DISTINCT dirname FROM ".$cfg["tab"]["upl"]." ORDER BY dirname ASC";
$db->query($query);
while ($db->next_record()) {
?>
<option value="<?php echo $db->f("dirname") ?>"<?php if ($seldir == $db->f("dirname")) echo " selected" ?>><?php echo $db->f("dirname") ?></option>
<?php
}
echo "</select></td>
<tr valign=\"top\">
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
"; //Ende
OUTPUT:
Code: Alles auswählen
<!--start modul-->
<?
echo '<div class="about-list">';
/***********************************************
* CONTENIDO MODUL - OUTPUT
*
* Erweiterte Artikel liste
*
* Liste von Artikeln mit mehreren Daten basierend
* auf 4fb referenz modul
* 1.Gibt die Subheadline eines Artikel mit aus
* 2.Anschnitte nur nach ganzen Wörtern
* 3.Thumnails werden vernünftig berechnet
* 4.Image für Erzeugung von Thumbs kann gewählt werden
* Author : Evert Smit / Dirk Uptmoor / Peter Beauvain
* Copyright : None
* Created : 13-07-03
* Modified : 16-08-02 /20-09-03 upt /02-02-04 Beau
************************************************/
//Frontendpfad ermitteln
$query = "SELECT frontendpath FROM ".$cfg["tab"]["clients"]." WHERE idclient='".$client."'";
$db->query($query);
$db->next_record();
$frontendpath = $db->f("frontendpath");
$startarton = "AND CATART.is_start = '0' AND";
//soll der startartikel mit ausgegeben werden?.
$print_startartikel = "CMS_VALUE[14]";
if($print_startartikel !=""){
$startarton = "AND";
}
//die Überschrift wird ausgegeben wenn sie nicht leer ist.
$print_mainheadline = "CMS_VALUE[2]";
//soll headline ausgegeben werden?
$print_headline = "CMS_VALUE[4]";
//soll subheadline ausgegeben werden?
$print_subheadline = "CMS_VALUE[5]";
//TelefonNummer
$print_fontext = "CMS_HTML[2]";
//soll text ausgegeben werden?
$print_text = "CMS_VALUE[12]";
//soll ein thumnail ausgegeben werden?
$print_thumbnail = "CMS_VALUE[7]";
//thumbnail breite
$thumbnail_width = "CMS_VALUE[8]";
//wenn thumbnails = 0
$imagetag = "";
//Der Link wird ausgegeben
$print_link = "CMS_VALUE[100]";
// second db class instance
$db2 = new DB_Contenido;
// selected category
$selcat = "CMS_VALUE[0]";
if($selcat!="0" && $selcat!=""){
//lastmodified (ersetzt durch artsort )
// select all articles in category widthout start article
$query = "SELECT ARTLANG.idart, ARTLANG.idartlang, ARTLANG.artsort FROM ".$cfg["tab"]["cat_art"]." AS CATART, ".
$cfg["tab"]["art_lang"]." AS ARTLANG ".
"WHERE CATART.idcat = '$selcat' AND ARTLANG.idart = CATART.idart AND ARTLANG.idlang = '$lang' "." $startarton " ."ARTLANG.online = '1' ORDER BY ARTLANG.artsort"; //DESC
//Wenn in umgekehrter Reihenfolge sortiert werden soll, muß "DESC" wieder aktiviert werden!!!
// execute query
$db->query($query);
unset($articleID);
unset($linkID);
// get id's of sub articles
while ($db->next_record()) {
$articleID[] = $db->f("idartlang");
$linkID[] = $db->f("idart");
} // end while
/****************** start table **************************/
//echo '<div class="about-list">';
/**** Überschrift der Artikelliste wird ausgegeben, wenn nicht leer ********/
if($print_mainheadline !=""){
echo '<h2>CMS_VALUE[2]</h2>';
}
if($print_mainheadline ==""){
echo '';
}
// Loop through articles
if (is_array($articleID)) {
foreach ($articleID as $key => $value) {
// select all CMS variables of the article
if($print_headline!="0" && $print_headline!=""){
$sql = "SELECT * FROM ".$cfg["tab"]["content"]." WHERE idartlang = '$value' AND idtype = '1' AND typeid = '1'";
$db->query($sql);
$db->next_record();
$headline = urldecode($db->f("value"));
for ($j="CMS_VALUE[3]"; $j < "CMS_VALUE[3]"+20; $j++)
{
$headline1 = substr($headline , 0, $j);
$cut = substr($headline, $j);
if ((ord ($cut) == 32)||(ord ($cut) == 44)||(ord ($cut) == 45)) {
$headline= substr($headline , 0, $j);
$headline .= ' .....';
}
}
}
$cfgTab_art_lang = $cfg['tab']['art_lang'];
$cfgTab_content = $cfg['tab']['content'];
$sql = "SELECT A.author AS author, B.lastmodified AS lastmod FROM $cfgTab_art_lang AS A, $cfgTab_content AS B WHERE A.idart='$value' AND B.idartlang=A.idartlang ORDER BY B.lastmodified DESC";
$db->query($sql);$db->next_record();
$modifydate= date("d.m.y",strtotime($db->f("lastmod")));
$modifytime= date("H:i",strtotime($db->f("lastmod")));
if($print_subheadline!="0" && $print_subheadline!=""){
$sql_subheadline = "SELECT * FROM ".$cfg["tab"]["content"]." WHERE idartlang = '$value' AND idtype = '1' AND typeid = '2'";
$db->query($sql_subheadline);
$db->next_record();
$subheadline = urldecode($db->f("value"));
for ($i="CMS_VALUE[6]"; $i < "CMS_VALUE[6]"+20; $i++)
{
$subheadline1 = substr($subheadline , 0, $i);
$cut = substr($subheadline, $i);
if ((ord ($cut) == 32)||(ord ($cut) == 44)||(ord ($cut) == 45)) {
$subheadline= substr($subheadline , 0, $i);
$subheadline .= ' .....';
}
}
}
//Telefonnummer: OHNE Checkbox!!!
if($print_fontext!="0" && $print_fontext!=""){
$sql_fontext = "SELECT * FROM ".$cfg["tab"]["content"]." WHERE idartlang = '$value' AND idtype = '2' AND typeid = '2'";
$db->query($sql_fontext);
$db->next_record();
$fontext = urldecode($db->f("value"));
}
if($print_text!="0" && $print_text!=""){
$sql_text = "SELECT * FROM ".$cfg["tab"]["content"]." WHERE idartlang = '$value' AND idtype = '2' AND typeid = '1'";
$db->query($sql_text);
$db->next_record();
$text = urldecode($db->f("value"));
for ($i="CMS_VALUE[13]"; $i < "CMS_VALUE[13]"+20; $i++)
{
$text1 = substr($text , 0, $i);
$cut = substr($text, $i);
if ((ord ($cut) == 32)||(ord ($cut) == 44)||(ord ($cut) == 45)) {
$text= substr($text , 0, $i);
$text .= ' .....';
}
}
}
//LINKAUSLESE
if($print_link!="0" && $print_link!=""){
$sql_link = "SELECT * FROM ".$cfg["tab"]["content"]." WHERE idartlang = '$value' AND idtype = '2' AND typeid = '1'";
$db->query($sql_text);
$db->next_record();
$link = urldecode($db->f("value"));
for ($i="CMS_VALUE[100]"; $i < "CMS_VALUE[100]"+20; $i++)
{
$link = substr($link , 0, $i);
}
}
//ENDE LINKAUSLESE
/******************* begin thumbnails **********************************/
if($print_thumbnail !="0" && $print_thumbnail !=""){
// select and resolve image path
$imagesql="select value from ".$cfg["tab"]["content"]." where idartlang='$value' and idtype='4' and typeid='CMS_VALUE[11]'";
$db2->query($imagesql);
$db2->next_record();
$image_id= $db2->f("value");
// get image name and path
$imagesql="select * from ".$cfg["tab"]["upl"]." where idupl='$image_id'";
$db2->query($imagesql);
$db2->next_record();
$webdir='upload/';
$thumbdir='CMS_VALUE[9]';
$filedir=$frontendpath;
$imagelocation=$filedir.$webdir.$db2->f('dirname').$db2->f('filename');
$thumblocation=$filedir.$webdir.$thumbdir.$db2->f('filename');
if (!file_exists($thumblocation)){
// create thunbnail
$fileinformation=getimagesize($imagelocation);
$imagewidth = $fileinformation[0];
$imageheight = $fileinformation[1];
$imagetype=$db2->f('filetype');
$imageattributes = $fileinformation[3];
//$newfile= $last_id."-image.".$imagetype;
$target=$thumblocation;
if ( !(copy($imagelocation,$target)))
{
echo "Could not copy file to destintaion., Command returned Error Message. Please check your log files. ".$imagelocation." ".$target;
die;
}
//create thumbnails 80xrelational height; neu $thumbnail_width x proportionale Höhe
// Determine what filetype and set pointer to source image
$original_image=ImageCreateFromJPEG($target);
if (!$original_image){
echo 'Error getting image from '.$target.'.';
}
$palette_image =$filedir.$webdir.$thumbdir.'vorlage.jpg';
$thumbsize = getImageSize($palette_image);
$maxdim = $thumbsize[0];
$draw_from = $imagelocation;
$dim = GetImageSize($draw_from);
if($dim[0]>$dim[1])
{
$to_w = $maxdim;
$to_h = round($dim[1]*($maxdim/$dim[0]));
$to_x = 0;
$to_y = round($maxdim-$to_h)/2;
}
else
{
$to_h = $maxdim;
$to_w = round($dim[0]*($maxdim/$dim[1]));
$to_y = 0;
$to_x = round($maxdim-$to_w)/2;
}
if($dim[2]==1) {$from = ImageCreateFromGIF($draw_from);}
elseif($dim[2]==2) {$from = ImageCreateFromJPEG($draw_from);}
elseif($dim[2]==3) {$from = ImageCreateFromPNG($draw_from);}
$thumb = ImageCreateFromJPEG($palette_image);
// $set_bg_colour = ImageColorAllocate($thumb,255,0,0);
// $fill_bg_colour = ImageFill($thumb,0,0,$set_bg_colour);
imagecreate($thumb, $from, $to_x, $to_y, 0,
0, $to_w, $to_h, $dim[0], $dim[1]);
// set image width and height of thunbnail and put pointer for filesytsem
$thumbfile= $db2->f('filename');
$target_thumb=$thumblocation;
$t_width=$thumbnail_width;
// calculating height to maintain ratio
$t_height=($thumbnail_width/$imagewidth)*$imageheight;
// remove digits to get solid number
list ($t_height,$notimportand)=explode('.',$t_height);
// create blank image
$thumb_image=imagecreatetruecolor($t_width,$t_height);
// resize image based on height and width
imagecopyresampled($thumb_image,$original_image,0,0,0,0,$t_width,$t_height,$imagewidth,$imageheight);
// store image on file system
// requires different functionf for either gif or jpeg
imagejpeg($thumb,$target_thumb);
imagedestroy($thumb);
imagedestroy($original_image);
}
$image=$webdir.$thumbdir.$db2->f('filename');
//wenn Artikel kein Bild hat
if (!$db2->f('filename')){
$image=$webdir.$thumbdir.'vorlage.jpg';
}
//Ende
$imagetag="<img src=\"$image\" class=\"image-135x170\" alt=\"generiertes Vorschaubild\" border=\"0\">";
$bgimagetag="style=\"background: url($image) no-repeat center;\"";
} // ende wenn keine thumbs gewünscht
/**************** Ende Thumbnails ***********************/
// link
$link = $sess->url("front_content.php?client=$client&lang=$lang&idcat=$selcat&idart=$linkID[$key]&m=$m&s=$s");
/***********************Anfang Tablezeile für Artikelliste**********************/
echo '
<div class="about-list-box">
<div class="about-list-imagebox" '.$bgimagetag.'></div>
<dl>
<dt>'.$headline.'</dt>
<dd class="about-list-subheadline">'.$subheadline.'</dd>
<dd class="about-list-text"><span class="about-list-textbold">Schwerpunkte:</span><br>'.$text.'</dd>
<dd class="about-list-fontext">Fon:<br>'.$fontext.'</dd>
<dd class="about-list-more"><a href="'.$link.'" title="Fuer weitere Informationen folgen Sie bitte dem Link">° more</a></dd>
</dl>
</div>';
} // end while
unset($headline);
unset($headline1);
unset($subheadline);
unset($subheadline1);
unset($text);
unset($textl);
unset($fontext);
unset($link);
unset($link1);
} // end foreach
} // end if (is_array)
//echo '<div class="top-seite">[ <a href="#top">top</a> ]</div>';
echo '</div>'; //end about-list
/***********************ende Table**********************/
?>
<!--end modul-->
Und bevor Du mühsehlig meine CSS-Datei auseinader nehmen mußt:
#about {
float: left;
margin: 20px 0 0 0;
}
.about-text H1 {
padding: 0;
margin: 0;
}
.about-text H2 {
font-size: 0.75em;
font-weight: normal;
padding: 0;
margin: 0 0 20px 0;
}
.about-text-fon {
font-size: 0.75em;
font-weight: bold;
}
.about-imagebox {
float: right;
width: 135px;
height: 135px;/*170px;*/
margin: 0 0 0 10px;
border: 1px solid #121212;
}
.about-list {
float: left;
width: 100%;
margin-top: 30px;
}
.about-list-box {
float: left;
width: 135px;
padding: 0;
margin: 0 5px 30px 0;
border: 1px dashed #4c565b;
}
.about-list-imagebox {
width: 135px;
height: 135px;
border: 1px solid #121212;
}
.about-list-box DL{
padding: 0;
margin: 10px 0;
}
.about-list-box DT{
font-weight: bold;
font-size: 0.75em;
padding: 5px;
margin: 0;
}
.about-list-box DD{
font-size: 0.75em;
padding: 5px;
margin: 0;
}
.about-list-subheadline {
font-weight: normal;
}
.about-list-text {
font-weight: normal;
height: 5em;
}
.about-list-textbold {
font-weight: bold;
font-size: 1.1em;
}
.about-list-fontext {
font-weight: bold;
}
.about-list-more A {
font-weight: bold;
font-size: 1em;
line-height: 0.75em;
}
.about-list-more :link {
color: #7D0A2B;
background: transparent;
}
.about-list-more :visited {
color: #7D0A2B;
background: transparent;
}
.about-list-more :hover {
color: #C8AF46;
background: transparent;
}
.about-list-more :active {
color: #C8AF46;
background: transparent;
}
Ach ja, die Bilder habe ich als Hintergrundbilder eingesetzt: Spart den alt-Tag.
Und die Site von dem Link ist immer noch nicht fertig....
Wenn Du die CSS umbaust, kannst du die Artikel auch wieder untereinander setzen....
Wenn's nicht klappt, noch mal melden.
Grüße,
Karin.
