WordPress

Allgemein

Technik

Design

Konzept

WordPress Plugins

Interessantes

Vermarktung

Themen

Font / Schriften

Social Media

Youtube

eCommerce

Gemischtes

Kolumne

Webinar

Blog Archiv

Kurse / Webinare

Meine nächste Webinare / Kurse

Anleitung – Wie verlinkt man richtig

von | Feb 3, 2016 | Interessantes | 2 Kommentare

Schlagwörter: featured - HTML

Heute möchte ich euch mal kurz erklären wie man in WordPress ein Wort oder Bild verlinken kann. Eigentlich ist das dank dem Visuellen Editor so einfach wie in Word. Aber es gibt Orte in WordPress wo kein so ein Editor eingebaut ist (zum Beispiel in der Kategorieansicht auch in WooCommerce)

Verlinken mit Visuellen Editor

  1. Man öffnet die Seite den Beitrag und sucht das Wort welches man verlinken will aus und markiert es
    anleitung-verlinken-text
  2. Danach klickt man auf den Ketten-Button und schon öffnet sich ein neues Fenster
    anleitung-verlinken-button-klicken
  3. anleitung-verlinken-auswahlmenu
    Hier fügt man dann unter URL die korrekte URL ein und zwar den ganzen URL – also inkls http: usw. – Sobald man fertig ist, einfach auf Link hinzufügen und schon ist das Wort verlinkt.

Kleiner Tipp

Wenn die verlinkte Seite innerhalb der eigenen Webseite liegt und es noch im Sinn der Userführung ist, dann kann man einfach den normalen Link setzen. Wenn aber die verlinkte Seite extern ist, dann sollte man das Kästchen „Öffne Link in einem neuen Tab“ aktivieren.

Verlinken von Hand

Wenn man ein Link von hand setzen muss, dann benützt man den HTML Code, aber auch das ist nicht wirklich kompliziert.

  1. anleitung-manuel-verlinken-feld Hier sucht man sich das Wort aus das man verlinken möchte (Oder schreibt zuerst den Text fertig) und merkt sich die URL auf die man verlinken möchte.
  2. Dann sieht das ganze etwa so aus
    anleitung-manuel-verlinken-text
  3. Ein Link von Hand setzt man so – in dem man das Wort das verlinkt werden möchte mit einem TAG (so eckige Klammern) – davor und danach – eingefasst wird
    1
    
    [ a href="https://www.chefblogger.me">Chefblogger</a ]

    In diesem Beispiel wird das Wort Chefblogger mit der www.chefblogger.me Url verlinkt. Ihr müsst jetzt eigentlich nur noch die URL ersetzen und bei euch einfügen und abspeichern.

  4. Wenn ihr ein Link innerhalb der Seite verlinken wollt – also auf einen Artikel oder Seite – dann sieht der Code so aus wie bereits oben gezeigt
    1
    
    [ a href="https://www.chefblogger.me">Chefblogger</a ]

    Solltet ihr aber extern verlinken wie zB auf eine andere Webseite dann, macht es sinn, dass ihr den Link in einem neuen Tab Feld/ neue Seite in eurem Browser öffnet – dafür erweitert ihr den Befehl mit target=“_blank“

    1
    
    [ a href="http://www.google.ch" target="_blank">Google</a ]
  5. So könnte dann das Ganze aussehen:

    anleitung-manuel-verlinken-link-fertig
    Und dann könnt ihr die Seite ganz einfach abspeichern und dann im Frontend testen/anschauen

Bild verlinken

Wenn man ein Bild verlinken möchte, ist es am einfachsten wenn man kurz ohne Visuellen Editor arbeitet und das ganze direkt coded.

  1. Ein Bild link sieht immer so ähnlich aus
    1
    
    [ img src="http...." ]

    je nachdem können noch weitere Befehle eingebaut sein, aber die könnt ihr einfach ignorieren. Wichtig ist das ein Bild immer von einem < und > eingerahmt ist.

  2. Wenn ihr so ein Bild verlinken müsst, könnt ihr es ebenfalls wie oben beschrieben verlinken
    1
    
    [ a href="https://www.chefblogger.me">Chefblogger</a ]
  3. Aber dann sieht das ganze halt so aus
    1
    
    [ a href="https://www.chefblogger.me"><img src="http...."></a ]
  4. Wenn der Link in einem neuen Fenster geöffnet werden soll, dann sieht der Code dann so aus
    1
    2
    3
    
    [ a href="https://www.chefblogger.me" target="_blank" ]
    <img src="http....">
    </a>

P.S diese [] Klammern in <> umwandeln

Ihr seht, ein Wort verlinken ist eigentlich eine ganz einfache Sache. Kann man den visuellen Editor verwenden, dann ist es nur eine sache von 3 Klicks und sonst muss man ein wenig „coden“. Aber auch dies ist nicht wirklich kompliziert.





2 Kommentare

  1. Derk Starke

    5***** Sterne, besser kann man es nicht beschreiben.
    LG vom Niederrhein
    Derk

    Antworten
    • Eric-Oliver Mächler

      hoi Derk – freut mich wenn ich dir helfen konnte 🙂

      Antworten

Einen Kommentar abschicken

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert