Spezialthema

War Ukraine Russland

[1] Automatische Generator Website - Karten

[2] Statische Liste basiert Ordnerbaum

Automatische Generator Website-Karten

Automatische Sitemap - Generator [ ] [ ] [ ]

Es kommt oft vor, dass seine Webseite langsam entwickeln, der Webmaster ziemlich schwierig wird zu "Kurs zu halten" aller Blätter Ihrer Website. Das Ergebnis - ein Benutzer, der die Seite besucht, lange kann die Informationen, die er braucht, zu finden und findet es nicht (obwohl in der Tat, es auf dem Gelände ist).

Zur Vermeidung einer solchen "Vorfälle", in der Regel auf Websites mit ein paar Dutzend oder mehr Seiten, die Praxis der Website Karten mit - einer speziellen Seite der Website, die (in der Regel in Form einer hierarchischen Baum) sind alle Seiten der Website. Aber wenn die Website mehr als hundert Seiten enthält, dann pflegen manuell "operational" Map-Website ziemlich lästige Sache.

Kostenloses Skript "Sitemap-Generator" wurde entwickelt, um automatisch eine Seite auf der Website "Site Map" zu erstellen, die in Form eines strukturierten Baum, HTML-Seiten dargestellt, die auf der Website vorhanden sind.

ACHTUNG! Nicht zu verwechseln mit einer XML-Sitemap, die für die Suchmaschinen, um Index der Site-Entwurf!

Downloaden und entpacken Sie die Datei auf Ihrem Computer.

Machen Sie Ihre Einstellungen in der Datei makesitemap.php:

$ Workdir - gibt den Pfad zu der Platte auf die Site - Dateien (Standard die gesamte Website indiziert).
$ ExceptionFileList - die Namen der Dateien , die in der Sitemap Baum indiziert und aufgenommen werden wird nicht.
$ ExceptionDirList - Ordnernamen , die in der Sitemap Baum indiziert und aufgenommen werden wird nicht.
$ OutFile - Dateiname und Pfad , in dem das Ergebnis der Erzeugung von Sitemaps werden aufgezeichnet.
$ Header - Dateiname und Pfad, dessen Inhalt wird an den Baum an die resultierende Datei hinzugefügt werden.
$ FooterFile - Dateiname und Pfad, deren Inhalt wird nach dem Baum in die Ausgabedatei hinzugefügt werden.

In der Tat, müssen Sie nur in $ exceptionFileList, $ exceptionDirList Ordner und Dateien zu bringen , die nicht in die endgültige Sitemap - Datei aufgenommen werden sollen.

Kopieren Sie die Dateien dtree.css, dtree.js und diriktoriyu img_sm in das Verzeichnis , in dem die resultierende Datei sitemap.html befinden.

Kopieren Sie die Datei an einem beliebigen Ort Makesitemap.php.

Um Verwirrung zu vermeiden, empfehle ich alle Dateien und Verzeichnisse auf der Website root img_sm zum Download bereit .

Achten Sie darauf , eine Datei sitemap.html chmod 777 Berechtigungen zu installieren.

Zunächst wird die Datei sitemap.html leer, aber nachdem ich das Drehbuch beginnen, füllte er den Inhalt von Dateien $ Header, $ footerFile und die tatsächliche Verzeichnisbaum.

Um eine Sitemap für die Ausführung erzeugen makesitemap.php eine Skriptdatei (für diese Art in der Linie brazuera Pfad zur Datei, zum Beispiel: http: //mysite/makesitemap.php) laufen.

Die resultierende Site - Map - Datei wird in sitemap.html - Datei sein.

Zur gleichen Zeit gibt es die folgenden Einschränkungen:

Index nur statische HTML-Seiten.
ACHTUNG! Um Index einen beliebigen Ordner sollte es eine index.html Datei enthalten.

Es scheint, dass jeder. Verwenden!

Statische Liste basiert Ordnerbaum

Dies ist eine Liste basiert Ordnerbaum. Was Sie tun müssen , ist die Schaffung eines <UL> <LI> Liste. Das Skript wird dann erstellen Sie den Baum basierend auf dieser Liste. Das Skript verwendet Cookies Zustand zu erinnern Knoten. Es enthält auch Funktionen für die Erweiterung / Kollabieren alle Knoten. Sie können Knoten dynamisch hinzufügen und löschen Rechtsklick auf den Knoten.

Statische Liste basiert Ordner tre [

] [

]

Konfiguration:

Der Aufbau eines Baumes

Das Menü ist HTML basiert. Sie erstellen den Baum von einem verschachtelten Gebäude <UL> <LI> Liste.
Beispiel:

<ul id="dhtmlgoodies_tree" class="dhtmlgoodies_tree"> 
 <li><a href="#">Main item</a> 
 <ul> 
 <li><a href="#">Sub menu item</a> 
 <ul> 
 <li><a href="#">Sub menu item</a> 
 <ul> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Sub menu item</a></li> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Sub menu item</a></li> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Sub menu item</a></li> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Sub menu item</a></li> 
 </ul> 
 </li> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Sub menu item</a></li> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Sub menu item</a></li> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Sub menu item</a></li> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Sub menu item</a></li> 
 </ul> 
 </li> 
 <li><a href="#">Sub menu item</a> 
 <ul> 
 <li><a href="#">Sub menu item</a></li> 
 <li><a href="#">Sub menu item</a></li> 
 <li><a href="#">Sub menu item</a></li> 
 <li><a href="#">Sub menu item</a></li> 
 </ul> 
 </li> 
 <li><a href="#">Sub menu item</a></li> 
 <li><a href="#">Sub menu item</a></li> 
 <li><a href="#">Sub menu item</a></li> 
 </ul> 
 </li> 
 <li><a href="#">Main item</a></li> 
 <li><a href="#">Main item</a> 
 <ul> 
 <li><a href="#">Sub menu item</a></li> 
 <li><a href="#">Sub menu item</a></li> 
 </ul> 
 </li> 
 <li><a href="#">Main item</a> 
 <ul> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Sub menu item</a></li> 
 <li><a href="#">Sub menu item</a></li> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Sub menu item</a></li> 
 <li><a href="#">Sub menu item</a></li> 
 </ul> 
 </li> 
 </ul>

<ul id="dhtmlgoodies_tree" class="dhtmlgoodies_tree"> 
 <li><a href="#">Main item</a> 
 <ul> 
 <li><a href="#">Sub menu item</a> 
 <ul> 
 <li><a href="#">Sub menu item</a> 
 <ul> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Sub menu item</a></li> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Sub menu item</a></li> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Sub menu item</a></li> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Sub menu item</a></li> 
 </ul> 
 </li> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Sub menu item</a></li> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Sub menu item</a></li> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Sub menu item</a></li> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Sub menu item</a></li> 
 </ul> 
 </li> 
 <li><a href="#">Sub menu item</a> 
 <ul> 
 <li><a href="#">Sub menu item</a></li> 
 <li><a href="#">Sub menu item</a></li> 
 <li><a href="#">Sub menu item</a></li> 
 <li><a href="#">Sub menu item</a></li> 
 </ul> 
 </li> 
 <li><a href="#">Sub menu item</a></li> 
 <li><a href="#">Sub menu item</a></li> 
 <li><a href="#">Sub menu item</a></li> 
 </ul> 
 </li> 
 <li><a href="#">Main item</a></li> 
 <li><a href="#">Main item</a> 
 <ul> 
 <li><a href="#">Sub menu item</a></li> 
 <li><a href="#">Sub menu item</a></li> 
 </ul> 
 </li> 
 <li><a href="#">Main item</a> 
 <ul> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Sub menu item</a></li> 
 <li><a href="#">Sub menu item</a></li> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Sub menu item</a></li> 
 <li><a href="#">Sub menu item</a></li> 
 </ul> 
 </li> 
 </ul>

Es ist wichtig , dass durch Sie Ihren Baum geben (s) eine ID. In dem obigen Code, werden Sie sehen, dass ich es die ID gegeben haben
dhtmlgoodies_tree sollten Sie auch feststellen , dass der Baum die auf die an die CSS - Klasse zugeordnet werden müssen
dhtmlgoodies_tree das Beispiel:
<ul id="dhtmlgoodies_tree" class="dhtmlgoodies_tree">

Javascript - Konfiguration

Sie haben einen Bezug zu Ihrem Baum (n) durch die Verwendung von Javascript zu erstellen. Dies wird durch die Schaffung einer Anordnung der ID (s) der Bäume durchgeführt. Beispiel:
var idOfFolderTrees = ['dhtmlgoodies_tree','dhtmlgoodies_tree2']; 'dhtmlgoodies_tree2']; var idOfFolderTrees = ['dhtmlgoodies_tree','dhtmlgoodies_tree2']; In der Demo habe ich zwei Ordner-Strukturen. Die ID der erste ist,
dhtmlgoodies_tree ' , während': Zweiter bekam mein Baum ist die id
dhtmlgoodies_tree2 Sie werden von der die ID in der Haupt <UL> -Tag finden. Beispiel:
<ul id="dhtmlgoodies_tree"> Sie werden von dem dieser den Fund von Array - Code unten an der Spitze des <SCRIPT des type = "text / der javascript"> Abschnitt genannt.

Icons

Der Baum wird das Symbol in der Javascript Variable folderImage als Standard definiert verwenden. Allerdings können Sie es durch die Angabe einer Klasse in Ihrem <LI> deklarieren. Beispiel:
<li class="dhtmlgoodies_sheet.gif"> Hier wird das Bild "dhtmlgoodies_sheet.gif" wird von der BE ein INSTEAD der das Standardsymbol VERWENDET WERDEN.

Javascript Variablen und Funktionen

Sie haben diese Variablen zur Verfügung an der Spitze des <SCRIPT> Sektion:

var idOfFolderTrees = ['dhtmlgoodies_tree','dhtmlgoodies_tree2']; var imageFolder = 'images/'; // Path to images 
 var folderImage = 'dhtmlgoodies_folder.gif'; // Default folder image 
 var plusImage = 'dhtmlgoodies_plus.gif'; // [+] icon 
 var minusImage = 'dhtmlgoodies_minus.gif'; // [-] icon 
 var useAjaxToLoadNodesDynamically = true; 
 var ajaxRequestFile = 'writeNodes.php';

idOfFolderTrees = Eine Reihe der Bäume auf Ihrer Seite

Imagefolder = Pfad zu Ihrem Bildordner

folderImage = Name des Ordners Bilddatei

plusImage = Name der Datei - Plus-Symbol

minusImage = Name der Datei - Minus-Symbol

useAjaxToLoadNodesDynamically = Verwenden Sie AJAX Unter Knoten dynamisch zu laden?

ajaxRequestFile = Name der Server-Seite Datei, dh die Dateianforderungen Ajax sendet

Es gibt auch zwei Funktion, die Sie aufrufen können zu erweitern oder alle Knoten kollabieren. Die "ExpandAll ()" Funktion erweitert alle Knoten, während die "CollapseAll ()" Funktion alle Knoten kollabiert. Senden Sie die ID des Baumes Sie als Argument für diese Funktionen zu kollabieren oder zu erweitern. Beispiele:

expandAll('dhtmlgoodies_tree'); 
 collapseAll('dhtmlgoodies_tree2');

Wenn Sie AJAX verwenden

Wenn Sie Ajax verwenden Knoten vom Server dynamisch zu erhalten, können Sie dieses Rezept wie folgt vor:
Legen Sie Knoten in Ihrem Stammbaum wie folgt aus :

<li><a href="#">Europe</a> 
 <ul> 
 <li parentId="1"><a href="#">Loading...</a></li> 
 </ul> 
 </li>

<li><a href="#">Europe</a> 
 <ul> 
 <li parentId="1"><a href="#">Loading...</a></li> 
 </ul> 
 </li>

Achtung Die ich daran haben eine <die LI> mit einem "parentId" Parameter Erstellt. Der Wert dieses Parameters wird in die Datei auf dem Server (writeNodes.php) gesendet. Die Datei wird auf dem Server wird dann geben die Knoten, an denen Eltern ID = 1. Dies wird an das Skript zurückgeschickt werden, und das Skript wird das "Laden .." ersetzen <LI> mit dem neuen Inhalt vom Server.

Die Datei "writeNodes.php" ausgibt nur einfache HTML. Beispiel:

<li class="dhtmlgoodies_sheet.gif"><a href="#">Bergen</a></li> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Stavanger</a></li> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Trondheim</a></li> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Oslo</a></li>

<li class="dhtmlgoodies_sheet.gif"><a href="#">Bergen</a></li> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Stavanger</a></li> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Trondheim</a></li> 
 <li class="dhtmlgoodies_sheet.gif"><a href="#">Oslo</a></li>

das Ansehen der writeNodes.php für weitere Informationen Datei. Ich bin nicht eine Datenbank in dieser Demo verwenden. Wenn Sie eine Datenbank verwenden, könnte die writeNodes.php Datei aussehen typischerweise wie folgt aus:

<?php 
 if(isset($_GET['parentId'])){ 

 $res = mysql_query("select * from category where parentId='".$_GET['parentId']."'"); 
 while($inf = mysql_fetch_array($res)){ 
 echo "<li><a href=\"#\">".$inf["categoryName"]."</a>"; 

 $resSub = mysql_query("select ID from category where parentId='".$inf["ID"]."'"); 
 if($infSub = mysql_fetch_array($resSub)){ 
 echo "<ul><li parentId=\"".$inf["ID"]."\"><a href=\"#\">Loading...</a></li></ul>"; 
 } 

 echo "</li>"; 

 } 
 ?>

Kekse

Cookies werden verwendet, Zustand der Knoten zu erinnern. Dies bedeutet, dass wenn Sie die Seite besuchen, wird das Skript die Knoten erweitern, die erweitert wurden, wenn Sie das letzte Mal die Seite verlassen.

Hinzufügen / Löschen von Knoten dynamisch

Neue Knoten können dynamisch aus einem Kontextmenü hinzugefügt und gelöscht werden. Sie können diese Funktion deaktivieren, indem Sie die JS-Variable contextMenuActive auf false an der Spitze der Ordner-Baum-static.js Einstellung.

Wenn ein neuer Knoten hinzugefügt wird, bezeichnet eine Funktion saveNewNode () aufgerufen wird. Sie finden diese Funktion in Ordner-tree-static.js finden. Sie müssen die Ajax-Teil dieser Funktion (es ist in den Kommentaren jetzt) zu ermöglichen. Sie müssen auch für das Speichern neuer Knoten-Unterstützung auf Ihrem Server hinzuzufügen. Wenn ein Knoten eine Anforderung erstellt wird, wird auf die Datei in der Variablen ajaxRequestFile definiert gesendet. Variablen auf diese Datei gesendet werden:

newNode = Titel des neuen Knotens

parentID = ID des übergeordneten Knoten

Alles, was Sie tun müssen, ist ein Insert-Abfrage zu haben, die mit diesen neuen Knoten in der Datenbank einfügt.

Das gleiche gilt auch für, was passiert, wenn Sie einen Knoten löschen. Sie haben die Ajax Teil der Funktion deleteNodeOnServer zu ermöglichen. Dies wird eine Anfrage an den Server senden, wo der Knoten wird in der Variablen deleteNodeId definiert löschen

Update-Protokoll

11. Juni 2006 - Zusätzliche Unterstützung für das Hinzufügen und Löschen von Knoten dynamisch

Wie es? Abonnieren Sie RSS Nachrichten!
Sie können auch shram.kiev.ua unterstützen, klicken Sie auf:

Seien Sie nicht zu Ihren Freunden und finden Sie diese Informationen, teilen mit ihnen den Artikel nicht in Ordnung!

Erweitern / Reduzieren

Kommentare

Kommentar nicht vergessen , dass der Inhalt und der Ton Ihrer Nachrichten , die Gefühle von echten Menschen verletzen können, Respekt und Toleranz gegenüber seinen Gesprächspartnern, auch wenn Sie Ihr Verhalten in Bezug auf die Meinungsfreiheit ihre Meinung nicht teilen, und die Anonymität des Internets, ändert sich nicht nur virtuell, sondern realen Welt. Alle Kommentare werden aus dem Index, Spam - Kontrolle versteckt.

Kostenlose Kreditkarte mit einem Limit von 15.000 US-Dollar.