Megjegyzés:
Az én megoldásom nem biztos, hogy nálad is beválik, magam részéről minden felelősséget elhárítok. ;P
Nos...
Elsőként nézzünk el a Falanx.hu oldalra, hogy lássuk, miről is beszélünk.
A nyitóképen a szokásos fejléc, lábléc, oldalsávok által határolt területen, ahol általában tartalmaink látszanak, mindenféle dobozokat láthatunk, címekkel, bevezetőkkel, képekkel, 'tovább'-linkekkel, sőt, a kiemelten fontos hírt erős pirosas háttérrel emeltük ki. nagyszerű. Egészen úgy néz ki, mint egy kezdőlap...
Adva van tehát a feladat, hogy mindenféle dobozokat tegyünk középre, és töltsük is fel őket a megfelelő tartalommal: jelesül, hogy a megfelelő kategóriákból vegyük ki a legfrissebb hír bevezetőjét. Nem megfeledkezve arról, hogy legfelülre a legfontosabb hírt is szeretnénk feltenni, származzon bármely kategóriából.
Bontsuk tehát ketté a feldatatot:
-hozzuk létre a dobozokat
-találjuk ki, hogy hogyan töltsük fel őket a megfelelő tartalommal.
Tervre:
találjuk ki a kezdőoldal felépítését. A dobozok elrendezését, valamint azt, hogy melyik dobozba melyik kategóriából vegyük a híreket. Például egy ilyenre.
CSS:
nem árt, ha némi CSS-tudással rendelkezünk, ugyanis így fogjuk létrehozni a dobozokat. (létrehozhatjuk őket táblázatos layouttal is, de ezt a témát itt nem érintjük)
Kell továbbá a Front_page modul a kezdőoldal létrehozásához. Töltsük le, és a benne leírtaknak megfelelően telepítsük fel.
A példában használt előlaphoz háromfajta dobozt fogunk elkészíteni:
-a kiemelt hírek dobozát
-egy teljes szélességű és
-egy fél oldal szélességű dobozt.
Az előlap HTML váza a következő:
<!-- kikapcsoljuk a breadcrumbot -->
<style>#breadcrumb{display: none}</style>
<!-- kiemelt hír helye -->
<div id="front_wrap">
<div id="front_left1" class="front_half">
<h3>Itthon</h3><!-- a doboz címkéje -->
<!-- generált tartalom -->
</div>
<div id="front_right1" class="front_half">
<h3>Nagyvilág</h3><!-- a doboz címkéje -->
<!-- generált tartalom -->
</div>
<div id="front_middle3" class="front_middle">
<h3>Szubjektív</h3><!-- a doboz címkéje -->
<!-- generált tartalom -->
</div>
</div>Jelen esetben három kategóriából -Itthon, Nagyvilág, Szubjektív- listázunk híreket. A breadcrumbot eltüntetjük, kialakítjuk a HTML-vázat, és az egyes dobozokat felcímkézzük. (Én, amit lehet, statikusra hagyok, persze lehet a címkéket is dinamikusra tenni...)
A kiemelt hírnek nem készítünk dobozt, mert az mindig legfelülre kerül, ráadásul ha nem akarunk kiemelt hírekkel vesződni, akkor dobozok szépen a helyükre ugranak.
A dobozok megjelenítésére a következő CSS-kód szolgál (megj: igyekeztem minél kevesebb formázást benne hagyni a szemléltetés kedvéért):
/* fél szélességű doboz */
.front_half{float: left; width: 216px; margin-right: 14px;}
/*a teljes szélességű doboz */
.front_middle{float: left; width: 447px;}
/* doboz címkéje */
#front_wrap h3 {margin-bottom: 7px; border-bottom: 2px solid #cccccc; text-transform: uppercase}
/* a hírek címkéje */
#front_wrap .node h2.title a {border-bottom: 1px solid #aaaaaa}
/* egy kis cikképformázás */
#front_wrap img {float: left; width: 70px; padding: 1px; margin: 4px 5px 0px 0px; border: 1px solid #aaaaaa}
/* tovább link */
a.front_more{display: block; float: right; margin-top: -12px; margin-bottom: 25px}
#front_right1{ margin-right: 0px; }
/* híreket elválasztó elem */
.front_hr {display: block; clear: both; width: 216px;}Ezzel megvolnánk. Tegyük most ezeket egy kicsit félre, és lássuk a lekérdezéseket.
Megjegyzés:
ha valaki nodevote-ot használ, de nem akarja a főlapon is viszontlátni, akkor a HTML vázban a legelső sort így használja:
<style>#breadcrumb, fieldset {display: none}</style>és a css-be is vegye bele ezt:
#front_wrap fieldset {display: none}Alapvetően kétfajta lekérdezésre lesz szükségünk:
-kiválasztjuk a kiemelt hírt bármely kategóriából
-a dobozokat a kategóriák legfrissebb hírével töltjük fel.
Fontos: figyeljünk arra, hogy ha egy hír egyszerre kiemelt és legfrissebb, akkor ne két példányban -kiemelve illetve a kategóriájának megfelelő dobozban- jelenjen meg.
Ennek tükrében a lekérdezéseink a következőek:
Kiemelt hír:(bármely kategóriából)
$result1 = pager_query(db_rewrite_sql("SELECT n.nid, n.created FROM {node} n INNER JOIN term_node ON n.nid = term_node.nid WHERE n.type = 'story' AND n.status = 1 AND n.sticky = 1 ORDER BY n.created DESC"), 1);Hír a dobozokba:
$result1 = pager_query(db_rewrite_sql("SELECT n.nid, n.created FROM {node} n INNER JOIN term_node ON n.nid = term_node.nid WHERE n.type = 'story' AND term_node.tid = X AND n.status = 1 AND n.sticky = 0 ORDER BY n.created DESC"), 2);Nos, akkor fésüljük össze a vázat és a lekérdezéseinket.
A kész kód így néz ki:
<style>#breadcrumb, fieldset {display: none}</style>
<?php $result1 = pager_query(db_rewrite_sql("SELECT n.nid, n.created FROM {node} n INNER JOIN term_node ON n.nid = term_node.nid WHERE n.type = 'story' AND n.status = 1 AND n.sticky = 1 ORDER BY n.created DESC"), 1);
while ($node = db_fetch_object($result1)) {
$output .= node_view(node_load(array('nid' => $node->nid)), 1);
}
print $output;
?>
<?php unset ($output); ?>
<div id="front_wrap">
<div id="front_left1" class="front_half">
<h3>Itthon</h3>
<?php
$result1 = pager_query(db_rewrite_sql("SELECT n.nid, n.created FROM {node} n INNER JOIN term_node ON n.nid = term_node.nid WHERE n.type = 'story' AND term_node.tid = 2 AND n.status = 1 AND n.sticky = 0 ORDER BY n.created DESC"), 2);
while ($node = db_fetch_object($result1)) {
$output .= node_view(node_load(array('nid' => $node->nid)), 1);
$output .= '<a class="front_more" href="node/'.($node->nid).'">tovább...»</a>';
$output .= '<br class="front_hr" />';
}
print $output;
?>
</div>
<?php unset ($output); ?>
<div id="front_right1" class="front_half">
<h3>Nagyvilág</h3>
<?php
$result1 = pager_query(db_rewrite_sql("SELECT n.nid, n.created FROM {node} n INNER JOIN term_node ON n.nid = term_node.nid WHERE n.type = 'story' AND term_node.tid = 3 AND n.status = 1 AND n.sticky = 0 ORDER BY n.created DESC"), 2);
while ($node = db_fetch_object($result1)) {
$output .= node_view(node_load(array('nid' => $node->nid)), 1);
$output .= '<a class="front_more" href="node/'.($node->nid).'">tovább...»</a>';
$output .= '<br class="front_hr" />';
}
print $output;
?>
</div>
<?php unset ($output); ?>
<div id="front_middle3" class="front_middle">
<h3>Szubjektív</h3>
<?php
$result1 = pager_query(db_rewrite_sql("SELECT n.nid, n.created FROM {node} n INNER JOIN term_node ON n.nid = term_node.nid WHERE n.type = 'story' AND term_node.tid = 6 AND n.status = 1 AND n.sticky = 0 ORDER BY n.created DESC"), 2);
while ($node = db_fetch_object($result1)) {
$output .= node_view(node_load(array('nid' => $node->nid)), 1);
$output .= '<a class="front_more" href="node/'.($node->nid).'">tovább...»</a>';
$output .= '<br class="front_hr" />';
}
print $output;
?>
</div>
<?php unset ($output); ?>
</div>Ne feletjsük ki az egyes snippetek közé betenni az
<?php unset ($output); ?>Ezt szépen fogjuk és az adminisztráció -> beállítások -> front_page menüpont alatt beillesztjük mind az anonim, mint az authenticated userek számára.
Egészségünkre :)