Hallo,

Dies ist mein erster Beitrag und ich möchte alle hier recht herzlich grüßen!


Nachdem ich mir nun mit etwas HTML und CSS einen Button gebastelt habe, versuche ich diesen nun zu verlinken.
Ich bekomme es leider nicht hin.

Dies ist die Zeile Code, die ich in ein HTML Widget eingefügt habe:

<div class="wrap"><button class="button">ANFRAGE</button></div>
 

Und hier der entsprechende CSS Code:

<style type="text/css">
/*<![CDATA[*/
 
.wrap {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
 
.button {
  width: 140px;
  height: 45px;
  font-family: 'Roboto', sans-serif;
  font-size: 18px;
  text-transform: uppercase;
  letter-spacing: 2.0px;
  font-weight: 500;
  color: black;
  background-color: orange;
  border: none;
  border-radius: 45px;
  transition: all 0.3s ease 0s;
  cursor: pointer;
  outline: none;
  }
 
.button:hover {
  background-color: gray;
  transform: translateY(-7px);
}
 
/*]]>*/
</style>
 

Der Button funktioniert eigentlich recht gut, nur was nützt dieser, wenn nichts passiert ;-)
Ich bin immernoch Anfänger und batel mir viel aus Code-Schnipseln, Probieren und auch immer mehr über eigenes Wissen zusammen.
Sicher ist hier die Lösung recht einfach, nur komme ich leider nicht drauf.

Den HTML Code im Widget um

<a href="https.//www.xxx.xx"></a>
 

zu ergänzen funktioniert nicht.

Wielleicht ist jemand so nett und gibt mir einen kleinen Schubs.

Herzliche Grüße
Jürgen

Hallo Jürgen

Du kannst einen Button ganz einfach einfügen und verlinken lassen. Du brauchst das nicht als Widget selbst zu coden. Wie immer auf "Inhalt hinzufügen", in der Auswahl auf "Button" klicken und dann entsprechend anpassen. Eine Anleitung, wie du Buttons ganz einfach einfügst und verlinkst, findest du ansonsten auch hier:

https://help.jimdo.com/hc/de/articles/115005504943-Wie-füge-ich-einen-Button-ein-

Falls du das aber immer noch selbst als Widget coden willst, würde ich folgendes ausprobieren:

<form method="get" action="http://deine-url.xxx" target="_blank">
<input type="submit" class="deine Klasse" value="Dein Text für den Button"> 
</form>
 

Anstatt "_blank" kannst du bei target auch "_self" einfügen. Dann geht die neue Seite im gleichen Browser-Tab auf. Das Aussehen kannst du in deinem Head per CSS anpassen...

Vielleicht hilft dir das weiter.

Gruss Butterman

Vielen Dank für Eure Unterstützung!