Ganze Zelle als Link
Autor: Martin N.
Besucht 1217,
Followers 2,
Geteilt 0
Hallo!
Ich habe ein Text-Objekt welches sich über die ganze Browser-Breite zieht. In den Stil-Eigenschaften habe ich ein Hintergrund-Bild gesetzt. Ich will nun die komplette Zelle klickbar (Link) machen. Dass ich den Text ohne weiteres als Link definieren kann ist mir klar, aber ich will eben die ganze Zelle klickbar haben, sodass der Anwender nicht immer genau den Text treffen muss.
Wie mach ich das am geschicktesten?
Vielen Dank für die Hilfe!
Gepostet am
Am besten einen Screenshot machen von der Vorschau und dieses Bild dann als Bildobjekt einbinden. Man kann kein DIV wo Text enthalten ist als ganzes Klickbar machen.
Vielleicht wäre es noch möglich dies als Hoverbutton zu machen. Kommt darauf an wieviel Text du hast.
(It > De) ... wenn du interessiert bist, poste den Seitenlink, um den zusätzlichen Code zu studieren ...
ciao
.
ich würde ein .png nehmen
und dann die Zelle mit dem Symbol Erweitern
auf die ganze breite bringen. Dann Ist es zwar kein Text Link aber der User muss dann auch nicht genau den Text anklicken. Der verloren gegangene Content/Text kann als Alternativ Beschreibung/Text genutzt werden.
Gruß
Andreas
Fahr mal mit der Maus darüber
Beispiel hat 1200x100 px
Autor
Hi!
Danke für die Antworten.
Die Seite ist noch nicht online, deswegen hab ich auch keinen Link.
Ich weiß dass ich daraus ein Bild machen könnte (das ist auch zurzeit meine Lösung), aber so ändert sich je nach Auflösung auch die Schriftgröße. Bei Stil-Hintergrundbild ist halt der Vorteil, dass das Bild nicht skaliert wird sondern immer 100% bleibt und nur an den Seiten entsprechend gecroppt wird. Der Text wäre dann natürlich auch immer gleich groß, weil er nicht im Bild integriert ist.
Es ist nicht viel Text, sind eher nur 3-4 Wörter die auf diesem (ich nenns mal) "Ribbon" stehen, darunter hab ich noch einen "Trenntstrich" bestehend aus "_" - der Oktik halber .
Eventuell muss ich mir einfach selber das CSS zusammenschustern. Dachte es geht vl einfacher ein ganzes Objekt als Link zu definieren. Immerhin ist das Hintergrundbild auch nur in einem DIV drinnen welches eben auf die ganze Breite aufgespannt ist und entsprechend sollte es kein Problem sein dieses als Link zu definieren. Wenn aber Website x5 das out of the Box nicht anbietet, muss man wohl selber basteln :/
Ich will halt nur so wenig wie möglich selbst anlegen, meine CSS Kenntnisse sind schon etwas eingetrocknet und ich will möglichst Brwoser-Kompatibel bleiben und da hab ich immer Angst, dass durch mein "reinpfuschen" eventuell manche Kompatibilität leidet.
Es gibt mehrere Widget die auch in Frage kommen. Jedenfalls mit einem Text-Objekt wo nur Text enthalten ist, geht es nicht.
(It > De) ... ... es ist einfach, Sie können in ein Unterverzeichnis exportieren [/test], ein Klick ......
... Sie werden in wenigen Worten lösen und ein Kopieren / Einfügen über das EXPERT-Panel ...
.
ciao
.
Autor
Du hast was von Hover-Button gesprochen.
Würde das wirklich in Frage kommen? Ich brauch im Endeffekt ein Textobjekt (idealerweise Zweizeilig) auf einem Stil-Hintergrundbild und das ganze Hintergurndbild soll klickbar sein (dh. wahrscheinlich dass der "Button" transparent und auf die ganze größe der Zelle aufgespannt sein müsste).
Autor
Anyways, hab jetzt selber was mit html und css gebastelt. Funktioniert soweit. Vielleicht aber als Anregung für zukünftige Updates: Alles verlinkbar machen ist sicher eine schönes Feature welches nicht schwer umzusetzen ist. Hab jetzt auch nur das "a href" vor ein neues DIV gesetzt welches die ganze Zelle abdeckt....fertig.
Guten Tag Martin,
da es zurzeit nicht möglich ist, diese Funktion in WebSite automatisch zu haben, schlage ich Ihnen vor, einen Anregung-Beitrag aufzumachen, wo Sie uns beschreiben, was Sie in den zukünftigen Aktualisierungen von WebSite X5 haben möchten. So können wir die Idee weiterleiten.
Danke! Mit freundlichen Grüßen.
Hallo Martin,
die IDEE auch ganze Zellen verlinken zu können ist nicht ganz so unkomot.
So muss man nicht in einer Zelle mehrer Links anlegen (wenn sie denn benötigt werden).
Könntest du hier mal deine Vorgehensweise beschreiben wie du das hin bekommen hast.
Gruß
MCMACMASTER
Autor
Hi Klaus!
Ich hab ein HTML Element verwendet (da kann man schön die Höhe einstellen).
In den Stil-Einstellungen kannst du dann ein Hintergrund Bild setzen welches letztendlich komplett klickbar geworden ist und in der Mitte einen Text hat der weiß ist und einen leichten Glow-Effekt hat (damit er sich vom Bild etwas abhebt).
HTML Inhalt:
<a href="link.html"><div id="text"><p>Dein Text</p></div></a>
CSS:
#text{
position: relative;
font-family: 'Montserrat', sans-serif;
font-size: 30px;
color: #fff;
text-decoration: none;
text-shadow: 0 0 5px #000, 0 0 8px #000;
width: 100%;
height: 100%;
}
#text p{
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
width: 100%;
height: 10%;
margin: auto
}
a{
color: #fff;
text-decoration: none;
}