Typo3: Unterschied zwischen den Versionen
Zovi (Diskussion | Beiträge) |
Zovi (Diskussion | Beiträge) (→Fileicon ändern / erweitern bei links) |
||
(7 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt) | |||
Zeile 94: | Zeile 94: | ||
= FAQ = | = FAQ = | ||
+ | |||
+ | == eigenes CSS einbinden == | ||
+ | ZB. für eine eigene lokale Schrift einpflegen. | ||
+ | |||
+ | |||
+ | Folgendes ins Template undter '''Setup''' eintragen (nicht Constants!) | ||
+ | |||
+ | page.includeCSS.custom1 = fileadmin/fonts/async.css | ||
+ | oder für mehrere files | ||
+ | page.includeCSS { | ||
+ | file1 = fileadmin/fonts/async.css | ||
+ | file2 = fileadmin/fonts/sync.css | ||
+ | } | ||
+ | |||
+ | === Fileicon ändern / erweitern bei links === | ||
+ | siehe unten | ||
+ | |||
+ | === Schriftart / Font global ändern === | ||
+ | |||
+ | ''Nur im Bearbeitungsmodus sichtbar'' | ||
+ | |||
+ | <NOWIKI> | ||
+ | |||
+ | /* Font Neue Helvetica W06 einfügen */ | ||
+ | |||
+ | @font-face{ | ||
+ | font-family:"Neue Helvetica W06"; | ||
+ | src:url("/fileadmin/fonts/Fonts/198fd78b-3655-4768-89c4-31caf65ea363.woff2") format("woff2"),url("/fileadmin/fonts/Fonts/49631ce8-9201-47a8-8874-45371417c35f.woff") format("woff"); | ||
+ | font-weight: 300; | ||
+ | font-style: normal; | ||
+ | } | ||
+ | @font-face{ | ||
+ | font-family:"Neue Helvetica W06"; | ||
+ | src:url("/fileadmin/fonts/Fonts/1a14dcac-7c9e-471c-8039-33c730f871f2.woff2") format("woff2"),url("/fileadmin/fonts/Fonts/558ed534-0c60-42cf-8b94-d0a16eb70d37.woff") format("woff"); | ||
+ | font-weight: 400; | ||
+ | font-style: normal; | ||
+ | } | ||
+ | @font-face{ | ||
+ | font-family:"Neue Helvetica W06"; | ||
+ | src:url("/fileadmin/fonts/Fonts/5393f1cf-e069-4466-bb37-f26f99fb4cf7.woff2") format("woff2"),url("/fileadmin/fonts/Fonts/26b8484e-52e3-44ac-b958-865809934ebb.woff") format("woff"); | ||
+ | font-weight: 500; | ||
+ | font-style: normal; | ||
+ | } | ||
+ | @font-face{ | ||
+ | font-family:"Neue Helvetica W06"; | ||
+ | src:url("/fileadmin/fonts/Fonts/d9122e8d-bf26-4f1c-bab9-c06599397b59.woff2") format("woff2"),url("/fileadmin/fonts/Fonts/db0cec12-a947-40fe-a115-c5ce22ee79f6.woff") format("woff"); | ||
+ | font-weight: 600; | ||
+ | font-style: normal; | ||
+ | } | ||
+ | @font-face{ | ||
+ | font-family:"Neue Helvetica W06"; | ||
+ | src:url("/fileadmin/fonts/Fonts/c415f3fd-ff27-40fe-af94-8b4a54b4b4e4.woff2") format("woff2"),url("/fileadmin/fonts/Fonts/a1da20c7-4dc9-4af5-bd6f-9ebe50b6788d.woff") format("woff"); | ||
+ | font-weight: 800; | ||
+ | font-style: normal; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* PDF-Links */ | ||
+ | div.card a[href$='.pdf'] { | ||
+ | background: url(/fileadmin/mimetypes/mimetypes-pdf.svg) center left no-repeat; | ||
+ | display:inline-block; | ||
+ | padding-left:20px; | ||
+ | line-height:16px; | ||
+ | } | ||
+ | /* Excel-Links */ | ||
+ | div.card a[href$='.xls'], div.card a[href$='.csv'], div.card a[href$='.xlw'], div.card a[href$='.xlt'] { | ||
+ | background: url(/fileadmin/mimetypes/mimetypes-excel.svg) center left no-repeat; | ||
+ | display:inline-block; | ||
+ | padding-left:20px; | ||
+ | line-height:16px; | ||
+ | } | ||
+ | |||
+ | /* exe-Links */ | ||
+ | div.card a[href$='.exe'], div.card a[href$='.msi'], div.card a[href$='.zip'], div.card a[href$='.pkg'], div.card a[href$='.dmg'] { | ||
+ | background: url(/fileadmin/mimetypes/mimetypes-x-sys_action.svg) center left no-repeat; | ||
+ | display:inline-block; | ||
+ | padding-left:20px; | ||
+ | line-height:16px; | ||
+ | } | ||
+ | /* Word-Links */ | ||
+ | div.card a[href$='.doc'], div.card a[href$='.rtf'], div.card a[href$='.txt'] { | ||
+ | background: url(/fileadmin/mimetypes/mimetypes-open-document-text.svg) center left no-repeat; | ||
+ | display:inline-block; | ||
+ | padding-left:20px; | ||
+ | line-height:16px; | ||
+ | } | ||
+ | |||
+ | /* mailto: Links */ | ||
+ | div.card a[href^="mailto:"]{ | ||
+ | background: url(/fileadmin/mimetypes/mail_black.gif) center left no-repeat; | ||
+ | display:inline-block; | ||
+ | padding-left:20px; | ||
+ | line-height:16px; | ||
+ | } | ||
+ | |||
+ | /* Verschlüsselte mailto: Links */ | ||
+ | div.card a[href^="javascript:"]{ | ||
+ | background: url(/fileadmin/mimetypes/mail_black.gif) center left no-repeat; | ||
+ | display:inline-block; | ||
+ | padding-left:20px; | ||
+ | line-height:16px; | ||
+ | } | ||
+ | |||
+ | /* Web-Links */ | ||
+ | div.card a[href$='.com'], div.card a[href$='.ch'], div.card a[href$='.de'] { | ||
+ | background: url(/fileadmin/mimetypes/mimetypes-x-content-domain.svg) center left no-repeat; | ||
+ | display:inline-block; | ||
+ | padding-left:20px; | ||
+ | line-height:16px; | ||
+ | } | ||
+ | |||
+ | </NOWIKI> | ||
+ | |||
+ | == Bootstrap Package Carousel Höhe anpassen == | ||
+ | |||
+ | |||
+ | |||
+ | ändere folgendes: | ||
+ | /typo3conf/ext/bootstrap_package/Resources/Public/Scss/Theme/_carousel.scss | ||
+ | |||
+ | // | ||
+ | // Carousel | ||
+ | // | ||
+ | .carousel { | ||
+ | .item { | ||
+ | height: 400px; | ||
+ | @include media-breakpoint-up(md) { | ||
+ | height: 300px; #orig 600 | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | .carousel-small { | ||
+ | .item { | ||
+ | height: 300px; | ||
+ | @include media-breakpoint-up(md) { | ||
+ | height: 200px; #orig 400 | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | .carousel-fullscreen { | ||
+ | .item { | ||
+ | height: 100vh; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | // | ||
+ | // Carousel Item | ||
== Wartungsmodus == | == Wartungsmodus == | ||
− | + | === Methode 1 - Verwendung von TYPO3 Core-Way === | |
Zeile 106: | Zeile 253: | ||
− | + | === Methode 2 - Verwendung von Pflegemodus TYPO3 Extension === | |
Die Methode ist für diejenigen gedacht, die den TYPO3-Wartungsmodus aktivieren möchten, ohne eine einzige Zeile Code zu berühren. | Die Methode ist für diejenigen gedacht, die den TYPO3-Wartungsmodus aktivieren möchten, ohne eine einzige Zeile Code zu berühren. | ||
Zeile 146: | Zeile 293: | ||
− | Methode 3 - Verwendung von Pflegemodus TYPO3-Vorlage | + | === Methode 3 - Verwendung von Pflegemodus TYPO3-Vorlage === |
Eine andere Möglichkeit, Ihren Wartungsmodus einzurichten, ist die Verwendung von Free Maintenance Mode TYPO3 Template mit der ersten Click and Launch TYPO3 SaaS-Lösung absolut kostenlos mit 15 Tagen kostenloser Testversion. Diese Vorlage wurde sorgfältig mit Liebe zum Detail entworfen. Ihre Besucher werden es lieben. Sie enthält viele Funktionen und behält gleichzeitig ihren stilvollen minimalen Look. Wählen Sie nur das aus, was Sie wollen, und passen Sie es an, wie Sie wollen. | Eine andere Möglichkeit, Ihren Wartungsmodus einzurichten, ist die Verwendung von Free Maintenance Mode TYPO3 Template mit der ersten Click and Launch TYPO3 SaaS-Lösung absolut kostenlos mit 15 Tagen kostenloser Testversion. Diese Vorlage wurde sorgfältig mit Liebe zum Detail entworfen. Ihre Besucher werden es lieben. Sie enthält viele Funktionen und behält gleichzeitig ihren stilvollen minimalen Look. Wählen Sie nur das aus, was Sie wollen, und passen Sie es an, wie Sie wollen. | ||
T3 Coming Soon Site-Vorlage soll Aufmerksamkeit erregen und Besucher darüber informieren, was Sie vorhaben. Sie können auch ein beliebiges Bild als Hintergrund mit dem Zähler einstellen. | T3 Coming Soon Site-Vorlage soll Aufmerksamkeit erregen und Besucher darüber informieren, was Sie vorhaben. Sie können auch ein beliebiges Bild als Hintergrund mit dem Zähler einstellen. | ||
− | + | <br><br><br><br> | |
− | |||
− | |||
== Popup Fenster erstellen == | == Popup Fenster erstellen == |
Aktuelle Version vom 8. März 2021, 17:13 Uhr
Inhaltsverzeichnis
- 1 Extentions
- 2 Template
- 3 FAQ
Extentions
18 wichtige TYPO3 Extensions, die Du kennen solltest
oder
Shops
noch testen
LDAP
- eu_ldap
Statistik
- ke_stats ... das jenige welche!
- für etwas einfacheres reicht sys_stat aber ist wirklich einfacher. Instal
Bilder Galerien
- kj_imagelightbox2 → nicht mehr so aktuell!
- perfectlightbox Perfectlightbox
- Hinweis für Perfectlightbox:
- IE Hack
- In das TS-Setup einfach folgendes einsetzen:
# perfectlightbox ####################################### config { doctype = xhtml_trans xmlprologue = none xhtml_cleaning = all htmlTag_setParams = xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de" }
- Lightbox 2 - alternativ ist die bwrk_lightbox https://docs.typo3.org/typo3cms/extensions/bwrk_lightbox/# auch net. Simpel und effektiv.
File Explorer
- Quixplorer → {t3quixplorer} File-Explorer für typo3
Blogen
- T3BLOG
- Um T3BLOG zu installieren und mit dem Bloggen loszulegen, sind folgende Schritte nötig:
- Extensions aus dem TER herunterladen und installieren:
- Neben „t3blog“ sind die Anti-Spam-Extension “postprocantispam“ sowie die Extension „typoscripttools“ hilfreich.
- Letztere vereinfacht die Handhabung von TypoScript im Zusammenhang mit dem DAM.
- Neue Seite im Seitenbaum erstellen und bei der Option „Enthält Erweiterung“ T3BLOG auswählen.
- Template auf der soeben erzeugten Seite erstellen und die statischen Templates von T3BLOG hinzufügen.
- Im Konstanten-Editor die nötigen Konstanten setzen.
- Speichern und bloggen!
- Extensions aus dem TER herunterladen und installieren:
CSV und Excel Tabellen Import
- cag_tables
Immer wieder steht man vor der Herausforderung, tabellarische Daten auf einer TYPO3-Website zu publizieren. Die brandneue Extension cag_tables ist die eleganteste Lösung für dieses Problem, indem die Daten aus einem Excel-Sheet (bzw. einer CSV-Datei) oder aus der TYPO3-Datenbank gelesen und in Form einer such-, sortiert- und filterbaren Tabelle angezeigt werden.
Socialnetwork connect
Format, Tabs
Template
freie Temlates
- typo3-templates-kostenlos.de - kuule Sache.
FAQ
eigenes CSS einbinden
ZB. für eine eigene lokale Schrift einpflegen.
Folgendes ins Template undter Setup eintragen (nicht Constants!)
page.includeCSS.custom1 = fileadmin/fonts/async.css
oder für mehrere files
page.includeCSS { file1 = fileadmin/fonts/async.css file2 = fileadmin/fonts/sync.css }
Fileicon ändern / erweitern bei links
siehe unten
Schriftart / Font global ändern
Nur im Bearbeitungsmodus sichtbar
/* Font Neue Helvetica W06 einfügen */ @font-face{ font-family:"Neue Helvetica W06"; src:url("/fileadmin/fonts/Fonts/198fd78b-3655-4768-89c4-31caf65ea363.woff2") format("woff2"),url("/fileadmin/fonts/Fonts/49631ce8-9201-47a8-8874-45371417c35f.woff") format("woff"); font-weight: 300; font-style: normal; } @font-face{ font-family:"Neue Helvetica W06"; src:url("/fileadmin/fonts/Fonts/1a14dcac-7c9e-471c-8039-33c730f871f2.woff2") format("woff2"),url("/fileadmin/fonts/Fonts/558ed534-0c60-42cf-8b94-d0a16eb70d37.woff") format("woff"); font-weight: 400; font-style: normal; } @font-face{ font-family:"Neue Helvetica W06"; src:url("/fileadmin/fonts/Fonts/5393f1cf-e069-4466-bb37-f26f99fb4cf7.woff2") format("woff2"),url("/fileadmin/fonts/Fonts/26b8484e-52e3-44ac-b958-865809934ebb.woff") format("woff"); font-weight: 500; font-style: normal; } @font-face{ font-family:"Neue Helvetica W06"; src:url("/fileadmin/fonts/Fonts/d9122e8d-bf26-4f1c-bab9-c06599397b59.woff2") format("woff2"),url("/fileadmin/fonts/Fonts/db0cec12-a947-40fe-a115-c5ce22ee79f6.woff") format("woff"); font-weight: 600; font-style: normal; } @font-face{ font-family:"Neue Helvetica W06"; src:url("/fileadmin/fonts/Fonts/c415f3fd-ff27-40fe-af94-8b4a54b4b4e4.woff2") format("woff2"),url("/fileadmin/fonts/Fonts/a1da20c7-4dc9-4af5-bd6f-9ebe50b6788d.woff") format("woff"); font-weight: 800; font-style: normal; } /* PDF-Links */ div.card a[href$='.pdf'] { background: url(/fileadmin/mimetypes/mimetypes-pdf.svg) center left no-repeat; display:inline-block; padding-left:20px; line-height:16px; } /* Excel-Links */ div.card a[href$='.xls'], div.card a[href$='.csv'], div.card a[href$='.xlw'], div.card a[href$='.xlt'] { background: url(/fileadmin/mimetypes/mimetypes-excel.svg) center left no-repeat; display:inline-block; padding-left:20px; line-height:16px; } /* exe-Links */ div.card a[href$='.exe'], div.card a[href$='.msi'], div.card a[href$='.zip'], div.card a[href$='.pkg'], div.card a[href$='.dmg'] { background: url(/fileadmin/mimetypes/mimetypes-x-sys_action.svg) center left no-repeat; display:inline-block; padding-left:20px; line-height:16px; } /* Word-Links */ div.card a[href$='.doc'], div.card a[href$='.rtf'], div.card a[href$='.txt'] { background: url(/fileadmin/mimetypes/mimetypes-open-document-text.svg) center left no-repeat; display:inline-block; padding-left:20px; line-height:16px; } /* mailto: Links */ div.card a[href^="mailto:"]{ background: url(/fileadmin/mimetypes/mail_black.gif) center left no-repeat; display:inline-block; padding-left:20px; line-height:16px; } /* Verschlüsselte mailto: Links */ div.card a[href^="javascript:"]{ background: url(/fileadmin/mimetypes/mail_black.gif) center left no-repeat; display:inline-block; padding-left:20px; line-height:16px; } /* Web-Links */ div.card a[href$='.com'], div.card a[href$='.ch'], div.card a[href$='.de'] { background: url(/fileadmin/mimetypes/mimetypes-x-content-domain.svg) center left no-repeat; display:inline-block; padding-left:20px; line-height:16px; }
Bootstrap Package Carousel Höhe anpassen
ändere folgendes:
/typo3conf/ext/bootstrap_package/Resources/Public/Scss/Theme/_carousel.scss
// // Carousel // .carousel { .item { height: 400px; @include media-breakpoint-up(md) { height: 300px; #orig 600 } } } .carousel-small { .item { height: 300px; @include media-breakpoint-up(md) { height: 200px; #orig 400 } } } .carousel-fullscreen { .item { height: 100vh; } } // // Carousel Item
Wartungsmodus
Methode 1 - Verwendung von TYPO3 Core-Way
Schritt 1. Anmeldung zum TYPO3 Backend
Schritt 2. Gehen Sie zu Admin Tools > Einstellungen
Schritt 3. Klicken Sie auf Installationsweite Optionen konfigurieren, suchen Sie "pageUnavailable_force" und markieren Sie das Kontrollkästchen.
Methode 2 - Verwendung von Pflegemodus TYPO3 Extension
Die Methode ist für diejenigen gedacht, die den TYPO3-Wartungsmodus aktivieren möchten, ohne eine einzige Zeile Code zu berühren.
Alles, was Sie tun müssen, ist die TYPO3 Extension Wartungsmodus herunterladen und installieren. Nach der Aktivierung müssen Sie die Einstellungen der Extension konfigurieren.
Wenn Sie diese Extension installieren, erhalten Sie tonnenweise attraktive Funktionen, die Ihren Besuchern angezeigt werden, bis sich Ihre Website im Wartungsmodus befindet,
Allgemein Sie können die allgemeinen Einstellungen zur Konfiguration und Verwaltung des Status erhalten, wie z.B,
Wartungsmodus aktivieren/deaktivieren Whitelist-IP-Adressen Enddatum/Ablaufdatum konfigurieren
Um diese Erweiterung zu aktivieren und Ihre Website in den TYPO3-Wartungsmodus zu versetzen, müssen Sie sie in Aktiviert ändern.
Gestaltung
Sie erhalten die Designkonfigurationen, mit denen Sie eine attraktive Seite erstellen. So beginnen Sie mit der Erstellung Ihrer Seite. Fügen Sie in diesem Teil den Titel Ihrer Splash-Seite sowie die Überschrift und den Text hinzu. Wenn Sie mit der Meldung fertig sind, können Sie den Hintergrund Ihrer Wartungsseite ändern. Sie können z.B. die Farbe ändern oder sogar noch weiter gehen und ein Bild als Hintergrund verwenden. Außerdem können Sie
Countdown mit verschiedenen Stilen anzeigen Themen-Layouts festlegen Animierte Zähler Website/Firmenlogo festlegen Bild im Hintergrund oder Vollton-Hintergrundfarbe konfigurieren Schriftfarbe des Textes festlegen Titel, Überschrift und Einführungstext festlegen Fußzeilentext festlegen
Hier können Sie den Countdown-Timer einstellen. Sie können Ihre Besucher bitten, sich zu abonnieren, um eine Benachrichtigung zu erhalten, sobald Ihre Website wieder live ist. Hier können Sie Ihre sozialen Netzwerke konfigurieren. Alles, was Sie tun müssen, ist den Link zu Ihrem Social Media-Konto zu setzen. Die Erweiterung wird automatisch das Social-Media-Button-Symbol auf der Seite anzeigen.
Aktivieren/Deaktivieren von Social-Media-Links Feld E-Mail-Abonnement E-Mail-Benachrichtigungen für Abonnements
Methode 3 - Verwendung von Pflegemodus TYPO3-Vorlage
Eine andere Möglichkeit, Ihren Wartungsmodus einzurichten, ist die Verwendung von Free Maintenance Mode TYPO3 Template mit der ersten Click and Launch TYPO3 SaaS-Lösung absolut kostenlos mit 15 Tagen kostenloser Testversion. Diese Vorlage wurde sorgfältig mit Liebe zum Detail entworfen. Ihre Besucher werden es lieben. Sie enthält viele Funktionen und behält gleichzeitig ihren stilvollen minimalen Look. Wählen Sie nur das aus, was Sie wollen, und passen Sie es an, wie Sie wollen.
T3 Coming Soon Site-Vorlage soll Aufmerksamkeit erregen und Besucher darüber informieren, was Sie vorhaben. Sie können auch ein beliebiges Bild als Hintergrund mit dem Zähler einstellen.
Popup Fenster erstellen
Counter - Tage rückwärz zählen
<script type="text/javascript"> //Ablaufdatum(Jahr, Monat-1, Tag, Stunden, Minuten, Sekunden) var eventdate = new Date(2012, 10, 01, 0, 0, 0); d=new Date(); count=Math.floor((eventdate.getTime()-d.getTime())/1000); count=Math.floor(count/(60*60*24)); document.write(count); </script>
Sprache umschalten
Flexible mehrspaltige Inhalte mit Rahmen erstellen
sehr einfach und ohne Extention → Kuule Doku