Icon-Verzeichnis anlegen

Code & Blog Logo

Um in unseren Admin-Bereich des CMS Icons zu verwenden, müssen wir erstmal aussuchen welche es sind und wo sie gespeichert werden. Danach werden wir die Icons in der Seitenauflistung einbauen.

Ich habe mich für die kostenlosen Silk-Icons von FamFamFam entschieden. Da wir die Icons auch irgendwo anders benutzen können, landen diese nicht direkt ins Admin-Verzeichnis, sondern in das Verzeichnis /system/images/icons.

Icons für die Seitenauflistung

Wie gesagt, brauchen wir als erstes Icons für die Seitenauflistung. Ich habe mich dafür entschieden, erstmal 2 Aktionen zu erstellen:

Bearbeiten

page_edit.png:

Löschen

cross.png:

Nun fehlt noch der Einbau in die Datei admin/includes/sites.php. Hier werden nun in der Zeile der Ausgabe die Bilder mit Verlinkung eingefügt:

<table>
  <thead>
    <tr>
      <td><strong>Titel</strong></td>
      <td><strong>Alias</strong></td>
      <td><strong>Aktionen</strong></td>
    </tr>
  </thead>
  <tbody>
    <?PHP
      $res = mysql_query("SELECT * FROM ".$dbpraefix."pages ORDER BY title LIMIT 0,30");
      while($row = mysql_fetch_assoc($res)){
        echo "<tr>
                <td>".$row['title']."</td>
                <td>".$row['alias']."</td>
                <td>
                  <a title="Bearbeiten" 
                     href="index.php?page=site-edit&site=".$row['alias']."">
                    <img src="/system/images/icons/page_edit.png" />
                  </a>
                  <a title="Löschen" 
                     href="index.php?page=site-delete&site=".$row['alias']."">
                    <img src="/system/images/icons/cross.png" />
                  </a>
                </td>
              </tr>";
      }
    ?>
  </tbody>
</table>

Du arbeitest in einer Agentur oder als Freelancer?
Dann wirf doch mal einen Blick auf unsere Software FeatValue.

Kommentare

Ben schrieb am 01.02.2011:

kleiner Fehler bei den Icon Links: bevor man auf das verzeichnis system zugreifen kann muss man noch mit ../ zurück;) also wäre der richtige pfad für z.B. Cross:

Ben schrieb am 01.02.2011:

sorry, schon wieder vergessen dass hier html code gesperrt wird;), n.d.t.: img src="../system/images/icons/cross.png" /

Jordan Kniest schrieb am 08.08.2011:

Da muss ich Ben rechtgeben ;)

Über uns

Wir entwickeln Webanwendungen mit viel Leidenschaft. Unser Wissen geben wir dabei gerne weiter. Mehr über a coding project