• Navigation überspringen
  • Zur Navigation
  • Zum Seitenende
Organisationsmenü öffnen Organisationsmenü schließen
Friedrich-Alexander-Universität Dokumentation der WordPress-Themes und -Plugins
  • FAUZur zentralen FAU Website
  1. Friedrich-Alexander-Universität
  2. Regionales Rechenzentrum Erlangen
  • RRZE
  • Videoportal
  • Lageplan und Anfahrt
  1. Friedrich-Alexander-Universität
  2. Regionales Rechenzentrum Erlangen
Friedrich-Alexander-Universität Dokumentation der WordPress-Themes und -Plugins
Menu Menu schließen
  • Grundlagen
    • Rahmenbedingungen für Webauftritte
    • Über WordPress
      • Grundsätzliches zum Webpublishing
    • Login und Navigation im Backend
      • Profil
      • Dashboard
      • Der Customizer
    • Benutzer anlegen und bearbeiten
    • Seiten
      • Eine Seite erstellen
      • Mehrere Seiten gleichzeitig konfigurieren
      • Seiten und Beiträge freigeben
    • Beiträge
    • Sidebar
    • Inhalte bearbeiten
      • Mediathek
      • Bilder
      • Galerie
        • Bildergalerie im Gridformat
      • Tabellen
      • Zitate
      • Formeln, Daten und Quellcode
    • Seitenstruktur erstellen
    • Menüs
    • Widgetbereiche und Widgets
    • Häufig gestellte Fragen
    Portal Grundlagen
  • Plugins
    • Plugins aktivieren
    • Externe Daten einbinden
      • Calendar
      • CRIS
      • FAU oEmbed
      • Jobs
      • Lehrveranstaltungen
      • Remoter
      • Statistik
      • UnivIS
      • Video
    • Neue Inhaltstypen erstellen
      • Expo
      • FAQ
      • Glossary
      • Person
      • Legal (ehemals ToS – „Terms of Service“)
      • RSVP
      • Synonym
    • Inhaltsseiten mit Funktionen erweitern
      • Contact Form 7
      • Downloads
      • Elements
      • Multilang
      • Advanced Editor Tools
      • Verfallsdatum für Beiträge („Post-Expiration“)
    • Zugang beschränken
      • Access Control
      • Private Site
    • Beiträge teilen
      • Auto-Tweet
      • RSS
    • Spezialplugins
      • Newsletter
      • Progressive Web-App (PWA)
      • The SEO Framework
      • Workflow
      • WS Form
    • Über Externe Plugins
    • Über FAU- und RRZE-Plugins
    Portal Plugins
  • Themes
    • FAU Einrichtungen
      • Umsetzungsbeispiele
      • Templates
        • Standardtemplate
        • Die Inhaltsseite mit Navi
        • Portalseite
        • Portalindexseite
        • Startseite
        • Startseite Fakultät
      • Shortcodes
        • Blogroll
        • Portalmenüs
        • Bildlinks
    • FAU Events
      • Startseite
      • Widget-Bereiche und Footer-Inhalt
      • Referenten und Vorträge
      • Shortcodes für Referenten und Vorträge
      • Call for Papers
      • Externe Anmeldeformulare einbinden
    Portal Themes
  • Entwicklung
    • Design
      • Farben (Markendesign 2021)
      • Logos
        • Logos zentraler Anwendungen
        • Einsatz im Videoportal
        • Einsatz im Social Media und auf Online-Plattformen
      • Schriften
    • Einsatzkontext (Statistik)
      • Einrichtungsbezeichnungen
    • Versionsverwaltung Git
    • Einheitliche Vergabe von Versionsnummern
    • Vorgaben an Themes
    • Vorgaben an Plugins
    • Eigene Testinstanz
    • Serverkonfiguration
    • Statistiken zu Webauftritten
    Portal Entwicklung
  • Vorlagen
    • Akkordeons
    • Ansprechpartner & Kontakte
      • Format Kompakt
      • Runde Kacheln
      • Format Sidebar
      • Klassische Darstellung
    • Beiträge ausgeben
    • Button
    • Icon & Iconboxen
    • Kurze Hinweise
    • Testimonials
    • Textboxen
    Portal Vorlagen
  • Tutorials
    • Schnelleinstieg FAU Events
    • Publikationsliste erstellen
    • Tipps und Tricks
    • Neue Daten in die FAU-Karte einbinden
    • Vortragsliste erstellen
    • Schnelleinstieg FAU Einrichtungen
      • Vorbereitungen
      • Navigation im Backend
      • Ein Theme auswählen
      • Seitenlogo und Seiteninformationen ergänzen
      • Eine Startseite erstellen
      • Rechtstexte generieren
      • Inhaltsseiten erstellen für Anfänger
      • Beiträge und die dynamische Sidebar
      • Abmessungen für Bilder und Grafiken
      • Beiträge und die dynamische Sidebar
      • Portale und die Seitennavigation
      • Suchmaschinenoptimierung in 5 Minuten
      • Blogroll und Finetuning
    • Barrierefreiheit
      • Vorwort und Überblick
      • Einführung und Hintergründe
      • Bereitstellung und Pflege von Inhalten
      • Entwicklung und Design
      • Organisatorische und rechtliche Anforderungen
      • Satzungen
      • Tests der Barrierefreiheit
      • Weitere Leitfäden und relevante Informationsangebote
      • Kurzanleitung zur Verbesserung der digitalen Barrierefreiheit in Dokumenten aus Büroanwendungen
    • SEO – Search engine optimization
      • SEO Inhalte gestalten
      • SEO Grundlagen
      • SEO und Barrierefreiheit
    Portal Tutorials
  1. Startseite
  2. Plugins
  3. Inhaltsseiten mit Funktionen erweitern
  4. Elements
  5. Buttons

Buttons

Bereichsnavigation: Plugins
  • Plugins aktivieren
  • Externe Daten einbinden
    • Calendar
      • Erste Schritte
      • Termine einbinden
      • Darstellungsbeispiele
    • CRIS
      • Typen-Filter
      • Einstellungen
      • Erweiterte Optionen
      • Automatische Synchronisierung
    • FAU oEmbed
      • Einbindung von Karten
      • Fragen & Antworten
    • Jobs
    • Lehrveranstaltungen
    • Remoter
    • Statistik
    • UnivIS
      • Attribute
      • Einzelne Lehrveranstaltungen
      • Einzelne Mitarbeiter
      • Voreinstellung der UnivIS-OrgNr.
      • Organisationsdaten einbinden
      • Mitarbeiterdaten einbinden
      • Lehrveranstaltungsdaten einbinden
      • Publikationsdaten einbinden
      • UnivIS im Gutenberg Editor
      • FAQ
    • Video
  • Neue Inhaltstypen erstellen
    • FAQ
      • Attribute
        • category
        • class
        • glossary
        • hide
        • id
        • order
        • show
        • sort
        • tag
      • Beispiele
        • Alle Attribute in Verwendung
        • Einzelne FAQ in vorgegebener Reihenfolge
        • FAQ nach Schlagwörtern filtern und in Kategorien gruppieren
        • Glossar mit expliziten Kategorien als A-Z Register
        • Glossar mit expliziten Kategorien als Tabs
        • Glossar mit expliziten Kategorien als Tagcloud
        • Glossar mit expliziten Schlagwörtern als A-Z Register
        • Glossar mit expliziten Schlagwörtern als Tabs
        • Glossar mit expliziten Schlagwörtern als Tagcloud
        • Glossar mit Kategorien als Tagcloud Register
        • Glossar mit Schlagwörtern als Tabs
      • FAQ von anderen Quellen beziehen
        • Domains registrieren
        • Protokoll
        • Synchronisieren
    • Person
      • Alle Formate in der Übersicht
      • Sortierung
      • Standardausgabe
      • Format card
        • Anwendungsbeispiele card
      • Format table
      • Format kompakt
      • Format page
      • Format sidebar
      • FAQ
      • Eine Kontaktübersicht anlegen
        • Kontaktübersicht Musterseite A
        • Kontaktübersicht Musterseite B
        • Kontaktübersicht Musterseite C
        • Kontaktübersicht Musterseite D
    • Legal (Rechtliche Pflichttexte)
    • Expo
    • Glossary
    • RSVP
      • Hilfsmittel und Hinweise zur Nutzung
      • Analoge Kontaktverfolgung
    • Synonym
  • Inhaltsseiten mit Funktionen erweitern
    • WS Form
    • Contact Form 7
    • Downloads
    • Elements
      • Accordion
        • Accordions verschachteln
        • Accordion Sprungmarken
        • Accordion – Häufige Probleme und Fragen
      • Alerts / Hinweisboxen
        • Inner Alert
      • Assistant
      • Buttons
      • Content-Index
        • Beispielseite Shortcode Content-Index
      • Content-Slider / Text-Slider
      • Divider – Der unsichtbare Trenner
      • Einschub
      • Galerie
      • Hidden Text
      • Icons
      • LaTeX
      • Legal-text
      • Mehrspaltige Fließtexte
      • Mehrspaltiger Inhalt
      • News – Beiträge ausgeben
        • Custom News Beispielumsetzung
      • Notices / Absatzklassen
      • Tabs – Registerkarten
      • Timeline
    • Multilang
      • Mehrsprachigen Webauftritt mit einer einzelnen Instanz bereitstellen
      • Mehrsprachigen Webauftritt mit mehreren Instanzen bereitstellen
    • Advanced Editor Tools
    • Verfallsdatum für Beiträge („Post-Expiration“)
  • Zugang beschränken
    • Access Control
    • Private Site
  • Beiträge teilen
    • Auto-Tweet
    • RSS
  • Spezialplugins
    • The SEO Framework
    • Progressive Web-App (PWA)
    • RRZE Newsletter
      • Newsletter-Module (Erweiterungen)
    • Workflow
      • Übersetzung
      • Fremdsprachigen Webauftritt managen
  • Über Externe Plugins
  • Über FAU- und RRZE-Plugins

Buttons

Beratung und Support

Webteam

Webteam

  • E-Mail: webmaster@fau.de
Beschreibung: Für alle Fragen rund um WordPress, Webhosting & Co.

GitHub

  • Repository
  • Fehler melden
Elements ist auf allen CMS-Instanzen vorinstalliert und bereits aktiviert. Sie können alle Elements-Shortcodes ohne vorangegangene Aktivierung benutzen.
Beispiel 1

Buttons

Anstelle altmodischer Links, sind Buttons eine deutlich modernere Alternative ihren Seiten-Besuchern den Weg zum Download oder zum entsprechenden Topic zu weisen. Hier finden Sie die Basics, um erfolgreich Buttons auf ihrer RRZE WordPress-Seite einzurichten.

Shortcode

Da die Beispiele auf dieser Seite alle nicht verlinkt sind, ist hier die wohl wichtigste Funktion der Buttons: Das Verlinken.

Wenn Sie einen Button erstellen fügen Sie den Link einfach wie folgt als Attribut ein:


[button link="https://www.meine-domain.de"]Beispiel[/button]

Mögliche Attribute

Um ihre Buttons nach persönlichen Wünschen zu gestalten, können Sie die folgenden Parameter verwenden.

Parameter Erklärung Beispiel
link = “ „ Verlinkt ihren Button zur angegebenen Seite link=“https://www.meine-domain.de“
color = “ „ Färbt den Hintergrund des Buttons in der gewählten Farbe. Farbcode im Hex-Dezimalcode angeben. color=“#1f4c7a“
style = “ „ Erzeugt ein Erscheinungsbild ähnlich den Bootstrap-Buttons https://getbootstrap.com/docs/3.3/components/#btn-dropdowns
Mögliche Werte sind:
 success 
info
warning
danger
ghost

Wurde eine eigene Hintergrund- oder Randfarbe eingestellt, wird das style-Attribut ignoriert.

style = „info“
border_color= “ „ Färbt den Rahmen des Button in der gewählten Farbe. Farbcode im Hex-Dezimalcode angeben. border_color=“#1f4c7a“
size = “ „ Ändert die Größe des Buttons zu den folgenden möglichen Parametern
 xsmall 
small
medium
large
xlarge

Ohne Attribut ist die Standardgröße als Medium eingestellt.

size = „small“
font =“ „ Ändert die Schriftfarbe auf Schwarz, empfohlen für helle Hintergrundfarben font=“dark“
width =“ „ Ändert die Breite des Buttons.
Mögliche Parameter sind:
full 
215
(Angabe in px z.B. 200)

Ohne Angabe richtet sich die Breite nach dem Text auf dem Button.

width=“235px“

Beispiele

Beispiele für das color-Attribut

Beispiel 1Beispiel 2Beispiel 3Beispiel 4

Verwendeter Code

[button color="#F20732"]Beispiel 1[/button]<br>
[button color="#07038C"]Beispiel 2[/button]<br>
[button color="#0439D9"]Beispiel 3[/button]<br>
[button color="#056CF2"]Beispiel 4[/button]<br>
[button color="#F20505"]Beispiel 5[/button]<br>

Beispiele für das border_color-Attribut

Damit Sie die Randfarben besser sehen, wurde hier zusätzlich das Attribut font="dark" und color="#FFFFFF" verwendet!

Beispiel 1Beispiel 2Beispiel 3Beispiel 4

Verwendeter Code

[button color="#FFFFFF" font="dark" border_color="#F20732"]Beispiel 1[/button]
[button color="#FFFFFF" font="dark" border_color="#07038C"]Beispiel 2[/button]
[button color="#FFFFFF" font="dark" border_color="#0439D9"]Beispiel 3[/button]
[button color="#FFFFFF" font="dark" border_color="#056CF2"]Beispiel 4[/button]

Beispiele für das Style-Attribut

Zur Erinnerung: Die Attribute color und border-color überschreiben das style-Attribut!

Beispiel 1Beispiel 2Beispiel 3Beispiel 4


Beispiel 1 style = "success"
Beispiel 2 style = "info"
Beispiel 3 style = "warning"
Beispiel 4 style = "danger"

Beispiele für die Größen von Buttons

Größe xsmall

Beispiel 1Beispiel 2Beispiel 3Beispiel 4
[button size="xsmall" url="www.wordpress.rrze.fau.de"]Beispiel 1[/button]

Größe small

Beispiel 1Beispiel 2Beispiel 3Beispiel 4
[button size="small" url="www.wordpress.rrze.fau.de"]Beispiel 1[/button]

Größe medium (Standard)

Beispiel 1Beispiel 2Beispiel 3Beispiel 4
[button size="medium" url="www.wordpress.rrze.fau.de"]Beispiel 1[/button]

Größe large

Beispiel 1Beispiel 2Beispiel 3Beispiel 4
[button size="large"]Beispiel 1[/button]

Größe xlarge

Beispiel 1Beispiel 2Beispiel 3Beispiel 4
[button size="xlarge" url="www.wordpress.rrze.fau.de"]Beispiel 1[/button]

Beispiele für die Breite von Buttons

Maximale Breite

Durch width="full" wird der Button auf maximale Breite gestreckt.

Beispiel 1Beispiel 2Beispiel 3Beispiel 4
[button width = "full" url="www.wordpress.rrze.fau.de"]Beispiel 1[/button]

Variable Breite

Durch width = " " können sie eine beliebige pixel-breite wählen z.B. 300 px. | width = "300"

Beispiel 1Beispiel 2Beispiel 3Beispiel 4
[button width="300" url="www.wordpress.rrze.fau.de"]Beispiel 1[/button]

Weitere Hinweise zum Webauftritt

Social Media

  • RSS Feed
  • GitHub
  • Twitter

Noch Fragen?

Schreiben Sie uns eine Mail an webmaster@fau.de. Wir beantworten Ihnen alle offenen Fragen rund um unser Content Management System (CMS), WordPress, Webhosting und Co.

Regionales Rechenzentrum Erlangen
(RRZE)

Martensstraße 1
91058 Erlangen
  • Kontakt
  • Webworking Blog
  • Impressum
  • Datenschutz
  • Barrierefreiheit
  • RSS Feed
  • GitHub
  • Twitter
Nach oben