- Extension News Plugin tt_news - Extension RealURL

Transkript

1 Websiteentwicklung auf Basis vontypo3 Extensions/SEO Unterlagen zur Vorlesung WS 14/ Zusammenfassung der letzten Vorlesungen - Extension News Plugin tt_news - Extension RealURL 2. Weitere Konfigurationen in TYPO3 3. Suchmaschinenoptimierung 1

2 TYPO3 Extensions 1. Extension tt_news Die Newsextension wird aus dem Repository geladen. TYPO3 Extensions 1. Extension tt_news Diese Extension legt ebenfalls eigene Datenbanktabellen an. 2

3 TYPO3 Extensions 1. Extension tt_news Nach der Installation können bei Bedarf ebenfalls zahlreiche Einstellungen vorgenommen werden TYPO3 Extensions 1. Extension tt_news Anschließend wird noch ein Static Template benötigt. Hier werden z.b. die PIDs der Seiten : die die eigentlichen News enthalten für die Listenansicht für die Detailansicht Außerdem kann ein separates Template für die Darstellung angegeben werden. Alle hier vorgenommenen Anpassungen werden in Constants eingetragen. 3

4 TYPO3 Extensions 1. Extension tt_news plugin.tt_news.pid_list = 19 plugin.tt_news.singlepid = 18 plugin.tt_news.backpid = 9 plugin.tt_news.file.templatefile = fileadmin/templates/tt_news_template.html TYPO3 Extensions 1. Extension tt_news Die einzelnen Newsbeiträge werden in einer Extraseite (Sysordner) News gepflegt. 4

5 TYPO3 Extensions 1. Extension tt_news Anschließend werden die News in die einzelnen Seiten mit den Verschiedenen Ansichten(z.B. Latest, List, Single) eingebunden. TYPO3 Extensions 1. Extension tt_news Anschließend wird konfiguriert, welche Ansicht und welche News auf der Seite dargestellt werden. 5

6 TYPO3 Extensions 1. Extension tt_news Anschließend wird konfiguriert, welche Ansicht und welche News auf der Seite dargestellt werden. Single Latest List TYPO3 Extensions 2. Extension RealURL Mit der RealURL werden die dynamischen URLs nach Beadrf umgeschrieben. Z.B. wird aus: Vorteile: 1. Bessere Merkbarkeit und Lesbarkeit für den User 2. Suchmaschinenoptimierung Die Extension ist sehr komplex. Für eine individuelle Konfiguration sind gute PHP- Kenntnisse erforderlich. 6

7 TYPO3 Extensions 2. Extension RealURL Die Extension wird wie bekannt im Extension Manager installiert. TYPO3 Extensions 2. Extension RealURL Die Extension wird wie bekannt im Extension Manager installiert. Wichtig: Den Filenamen im Path to Configuration file auf realurlconf.php ändern. Dann 7

8 TYPO3 Extensions 2. Extension RealURL kann eine zusätzliche Extension danp_realurlconfigurator installiert werden. Diese erzeugt eine Standardkonfiguration, die dann bei Bedarf direkt im Backend angepasst werden kann. TYPO3 Extensions 2. Extension RealURL RealURL muss dann im Setup aktiviert werden. # RealURL prefixlocalanchors = all simulatestaticdocuments = 0 tx_realurl_enable = 1 baseurl = 1.Zeile: Ankerpunkte auf der Seite werden auch mit Realurl richtig angesprungen. 2.Zeile: Ein anderes, nicht so leistungsfähiges Verfahren wird deaktiviert 3.Zeile: RealUrl wird aktiviert 4.Zeile: Hier wird die URL angegeben, die als Basis der URL dient 8

9 TYPO3 Extensions 2. Extension RealURL Die Extension benötigt das Apache Modul mod_rewrite, das das Umschreiben von Internetadressen ermöglicht. Dieses Modul wird mit der.htaccess Datei konfiguriert. Mit dieser Datei kann man z.b. Passwörter vergeben Weiterleitungen eintragen und für uns benötigten folgenden Befehle eintragen: RewriteEngine On RewriteRule ^typo3$ - [L] RewriteRule ^typo3/.*$ - [L] RewriteCond %{REQUEST_FILENAME}!-f RewriteCond %{REQUEST_FILENAME}!-d RewriteCond %{REQUEST_FILENAME}!-l RewriteRule.* index.php TYPO3 Extensions 2. Extension RealURL RewriteEngine On RewriteRule ^typo3$ - [L] RewriteRule ^typo3/.*$ - [L] RewriteCond %{REQUEST_FILENAME}!-f RewriteCond %{REQUEST_FILENAME}!-d RewriteCond %{REQUEST_FILENAME}!-l RewriteRule.* index.php Zunächst wird das Modul aktiviert. In Zeile 2 und 3 wird definiert, dass das Typo3-Verzeichnis /typo3 von dem Rewrite ausgeschlossen wird. Die Regeln dann besagen, dass wenn die Anfrage auf kein file, kein directory und kein link läuft, sie intern an die index.php von Typo3 weitergeleitet wird. REQUEST_FILENAME ist eine Servervariable, und enthält den kompletten lokalen (physikalischen) Pfad zu der angefragten Datei: Alle anderen Anfragen werden an die Index-Dateigeleitet. Dort wird sie anhand der RealURL-Extension korrekt umgesetzt. 9

10 TYPO3 Extensions 2. Extension RealURL Was passier also, wenn ein User z.b. die URL aufruft? 1.zunächst überprüft der Webserver die Datei.htaccess. Als Ergebnis wird die Anfrage an die index.php Datei weitergeleitet. 2. Prinzipiell wird dann die localconf.php abgearbeitet und hierüber dann die realurlconf.php. 3.In der realurlconf.php wird dann die URL ausgewertet und den GET-Parametern zugeweisen. Konfiguration 10

11 TYPO3 Konfiguration Auslagern von TypoScript in eine Datei Vorteile 1. Einsatz von Versionsverwaltung z.b. GIT oder Subversion Vor allem bei größeren Projekten mit mehreren Entwicklern 2. Einsatz von eigenen Programmierwerkzeugen wie z.b. UltraEdit, BBEdit, Eclipse,Aptana, 3. Browserbasierter Editor arbeitet in einigen Browsern fehlerhaft TYPO3 Konfiguration Auslagern von TypoScript in eine Datei Vorgehen 1.Anlegen eines eigenen Ordners typoscript innerhalb von fileademin 2. Anlegen einer Textdatei setup.ts 3. Übernahme des Typoscripts aus setup aus demtemplate 4. Einbindung der Datei im Setup Inhalte können weiterhin auch direkt im Editor bearbeitet werden 11

12 Backendkonfiguration Wozu das Backend konfigurieren? Redakteure, die für den Inhalt der Website zuständig sind, müssen die entsprechenden Aufgaben möglichst einfach und schnell durchführen können. Die Aufgaben sind i.d.r. Seiten anlegen Inhalte einpflegen News einstellen Bilder und Dokumente hochladen Backendkonfiguration Login für Redakteure o Nach Login eines Redakteurs sieht das Backend z.b. wie folgt aus: 12

13 Backendkonfiguration Weitere Konfigurationsmöglichkeiten o Mit weiteren TypoScript Befehlen kann das Backend angepasst werden. o Die Befehle werden i.d.r. auf der Rootseite unter Pageproperties im Reiter Resources in das Feld Page-TS-Config eingetragen o Oder auf User, oder Gruppenebene im User-TS-Config o Z. B. o Unbenutzte Spalten ausblenden o Ausblenden von überflüssigen Optionen o Umbenennen von Optionen o Beschränkungen für neue Datensätze o Listenansicht für viele Datensätze o RTE-Konfiguration Backendkonfiguration Ausblenden nicht benötigter Spalten o mod.shared.colpos_list=0,2 o 0... Normal o 1... Links o 2.. Rechts o 3... Rand 13

14 Backendkonfiguration TypoScript in Usergroups o Seiten Cache löschen aktivieren Backendkonfiguration RTE o Der Rich Text Editor bietet sehr umfangreiche Konfigurationsmöglichkeiten. Allerdings ist der Aufwand recht groß. Es können z.b. o Alle Funktionen / Buttons individuell aktiviert / deaktiviert werden o eigen Stylesheets eingebunden werden, die das Design der Website wiedergeben o HTML-Tags und CSS Elemente erlaubt/ unterdrückt werden o Ein gutes Tutorial: 14

15 Backendkonfiguration Beispielkonfiguration für Darstellung der Buttons # RTE Konfiguration # Buttons die gezeigt/versteckt werden RTE.default { showbuttons (bold, italic, underline, left, center, right, orderedlist, unorderedlist, insertcharacter, line, link, image, removeformat ) hidebuttons ( fontstyle, fontsize, strikethrough,lefttoright, righttoleft, textcolor, bgcolor, textindicator, emoticon, user, spellcheck, outdent, indent, justifyfull, subscript, superscript, acronym, copy, cut, paste, textstyle, textstylelabel, formatblock, blockstyle, blockstylelabel, table, toggleborders, tableproperties, rowproperties, rowinsertabove, rowinsertunder, rowdelete, rowsplit, columninsertbefore, columninsertafter, columndelete, columnsplit, cellproperties, cellinsertbefore, cellinsertafter, celldelete, cellsplit, cellmerge, findreplace, insertcharacter, undo, redo, showhelp, about, chmode, insertag ) } Backendkonfiguration Beispielkonfiguration für Darstellung der Buttons nachher vorher 15

16 Suchmaschinenoptimierung Suchmaschinenoptimierung Marktanteil Suchmaschinen in Deutschland 16

17 Suchmaschinenoptimierung Entwicklung der Marktanteile in Deutschland Suchmaschinenoptimierung SEO Begriffe TYPO3 Frankfurt Suchmaschinenoptimierung = Google Optimierung Was für Google gut ist, ist i.d.r. für alle anderen auch gut. bezahlte Werbung Google Adwords (SEM - Search Engine Marketing) SEO 17

18 Suchmaschinenoptimierung PageRank Der PageRank-Algorithmus ist ein Verfahren, eine Menge verlinkter Dokumente, wie beispielsweise das World Wide Web, anhand ihrer Struktur zu bewerten bzw. zu gewichten. Der Algorithmus wurde von Larry Page (daher der Name PageRank) und Sergei Brin an der Stanford University entwickelt und von dieser zum Patent angemeldet. Er diente der Suchmaschine Google des von Brin und Page gegründeten Unternehmens Google Inc. als Grundlage für die Bewertung von Seiten. Der PageRank-Algorithmus ist eine spezielle Methode, die Linkpopularität einer Seite bzw. eines Dokumentes festzulegen. Das Grundprinzip lautet: Je mehr Links auf eine Seite verweisen, umso höher ist das Gewicht dieser Seite. Je höher das Gewicht der verweisenden Seiten ist, desto größer ist der Effekt. Das Ziel des Verfahrens ist es, die Links dem Gewicht entsprechend zu sortieren, um so eine Ergebnisreihenfolge bei einer Suchabfrage herzustellen, d.h. Links zu wichtigeren Seiten weiter vorne in der Ergebnisliste anzuzeigen. Der PageRank-Algorithmus bildet einen zufällig durch das Netz surfenden Benutzer nach. Die Wahrscheinlichkeit, mit der dieser auf eine Webseite stößt, korreliert mit dem PageRank. Der PageRank hat eine Skala von 0 bis 10. Quelle Wikipedia Suchmaschinenoptimierung SEO PageRank alleine ist nicht zwangsläufig ausschlaggebend für die Position auf der Ergebnisseite 18

19 Suchmaschinenoptimierung SEO Verschiedene Bereiche 1. On Site Maßnahmen a) technische Optimierung b) inhaltliche (textuelle Optimierung) 2. Off Site Maßnahmen Überwiegend Erhöhung der Linkpopularity D.h. Verlinkung von anderen Websites auf die eigene. On Site: Suchbegriff TYPO3 Frankfurt On Site URL title-tag h1-tag (nur 1 x pro Seite) p-tag h2-tag 19

20 Suchmaschinenoptimierung title - Tag Keyword sollte an erster Stelle stehen. Dazu muss im Setup per TypoScript der Tag neu generiert werden. # Page title entfernen config.nopagetitle = 2 # SEO Title Tag aendern page.headerdata { 10 = TEXT 10 { field = subtitle//title wrap = <title> - FH-Frankfurt Demo Website</title> } } Suchmaschinenoptimierung Code aufräumen o Kommentare entfernen o Klassen entfernen 20

21 Suchmaschinenoptimierung Code aufräumen (im Setup) #Kommentare im Quellcode deaktivieren config.disableprefixcomment = 1 #csc-header entfernen lib.stdheader.stdwrap.datawrap > lib.stdheader.3.headerclass > #noch mehr entfernen tt_content.stdwrap.datawrap > tt_content.stdwrap.innerwrap > # class="bodytext" bei RTE abstellen lib.parsefunc_rte.nontypotagstdwrap.encapslines.addattributes.p.class > Suchmaschinenoptimierung Weitere technische Maßnahmen o möglichst fehlerfreier Code (w3c-konform) ( 21

22 Suchmaschinenoptimierung Weitere technische Maßnahmen o Vermeidung von Duplicate Content Seiten mit gleichem Inhalt über mehrere URLs erreichbar. Z.B o Verwendung von Redirects in der htaccess-datei o Einbindung eines Canonical-Tags im Head-Bereich der Seite o Eintragen von Nofollows in der robots.txt Datei Suchmaschinenoptimierung Weitere technische Maßnahmen o Verwendung von Redirects in der htaccess-datei RewriteCond %{HTTP_HOST}!^www\. RewriteRule ^(.*)$ [R=301,L] 22

23 Suchmaschinenoptimierung Weitere technische Maßnahmen Einbindung eines Canonical-Tags im Head-Bereich der Seite Ein kanonischer Link, englisch Canonical Link, gibt Webseitenbetreibern in einem HTML-Dokument die Möglichkeit, bei mehrfach verwendetem Inhalt (Duplikate Content) die Originalressource auszuweisen. Er wird in Form eines link-elements im Kopf eines HTML-Dokuments notiert: <link rel="canonical" href=" Suchmaschinenoptimierung Weitere technische Maßnahmen Nach der Übereinkunft des Robots-Exclusion-Standard-Protokolls liest ein Webcrawler (Robot) beim Auffinden einer Webseite zuerst die Datei robots.txt (kleingeschrieben) im Stammverzeichnis ( root ) einer Domain. In dieser Datei kann festgelegt werden, ob und wie die Webseite von einem Webcrawler besucht werden darf. Website-Betreiber haben so die Möglichkeit, ausgesuchte Bereiche ihrer Website für (bestimmte) Suchmaschinen zu sperren. Die Datei robots.txt ist eine Textdatei in einem einfach lesbaren Format. Jede Zeile besteht aus zwei Feldern, die durch einen Doppelpunkt getrennt werden. User-agent: Sidewinder Disallow: / Eintragen von Nofollows in der robots.txt Datei z.b. Disalow: /*?id=* Disallow: /*&type=98 23

24 Suchmaschinenoptimierung Weitere technische Maßnahmen o geringe Ladezeiten o schneller Server o Grafiken optimal umrechnen (jpg, gif, png) o CSS und JavaScript Dateien auslagern und ggf. komprimieren o Hintergrundbilder zu Sprites zusammenfassen o SSL-Zertifikat (https) Suchmaschinenoptimierung Google Webmastertools o Fehleranalyse o Besucheranalyse o Anmeldung einer XML-Sitemap 24

25 Suchmaschinenoptimierung Google Analytics zur Auswertung der Besuchszahlen o Einbindung eines Tracking Codes Suchmaschinenoptimierung Google Analytics o Auswertung über externes Tool 25

26 Suchmaschinenoptimierung Google Analytics o Auswertung über externes Tool Suchmaschinenoptimierung Off Site Maßnahmen o Eintragen eines Links auf die eigene Website z.b. o Wikipedia o Auf Kunden Websites o Portale o Beiträge in Blogs und Foren o Pressemitteilungen o Verzeichnisse (z.b. Google Places) o Social Media (Facebook, Twitter, YouTube) o. 26

27 Praktikum / Bachelor PAGEmachine AG Praktikum bei PAGEmachine Vertiefen der Kenntnisse o Programmierung in HTML, CSS, PHP MySQL JavaScript, TypoScript o Frameworks LESS, Bootstrap, TYPO3 FLOW jquery, etc. o Programmierung von Websites o Erstellen von Extensions o Versionsverwaltung GIT o Projektmanagement (Kanban, Scrum) 27

28 Cooles Team Top Arbeitsplätze 28

29 PAGEmachine AG Bachelor bei Pagemachine Relaunch einer Unternehmens-Website unter Einsatz des Content Management Systems TYPO3 Entwicklung einer Extension zur Präsentation von Referenzen unter Einsatz des Content Management Systems TYPO3 Konzeption und Umsetzung eines Bewerbermanagementsystems als Extension für TYPO3 Entwicklung einer Extension zur Lokalisierung des Benutzerstandortes auf Basis von Extbase für das Content Management System TYPO3 Programmierung eines Parsers von Stammdaten aus Lebensläufen, unabhängig ihres Formats, unter besonderer Berücksichtigung der Wiederverwertbarkeit und Erweiterbarkeit Vielen Dank für Ihre Aufmerksamkeit Diese Präsentation können Sie ab morgen unter: /fh-frankfurt herunterladen. Miklos Weiszhaupt 29