WebSite X5Help Center

 
Martin N.
Martin N.
User

Ganze Zelle als Link  de

Автор: Martin N.
Просмотрено 1175, Подписчики 2, Размещенный 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!

Размещено
12 Ответы - 2 Полезно
Andreas S.
Andreas S.
Moderator
Лучший пользователь месяца DE

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.

Читать больше
Размещено От Andreas S.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Martin N.
... ... ... ich will eben die ganze Zelle klickbar haben, sodass der Anwender nicht immer genau den Text treffen muss. Wie mach ich das am geschicktesten? ... ... ...

(It > De) ... wenn du interessiert bist, poste den Seitenlink, um den zusätzlichen Code zu studieren ...

ciao

.

Читать больше
Размещено От  ‪ KolAsim ‪ ‪
Andreas L.
Andreas L.
User

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

Читать больше
Размещено От Andreas L.
Andreas L.
Andreas L.
User

Fahr mal mit der Maus darüber wink

Beispiel hat 1200x100 px

Читать больше
Размещено От Andreas L.
Martin N.
Martin N.
User
Автор

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 laughing.

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.

Читать больше
Размещено От Martin N.
Andreas S.
Andreas S.
Moderator
Лучший пользователь месяца DE

Es gibt mehrere Widget die auch in Frage kommen.  Jedenfalls mit einem Text-Objekt wo nur Text enthalten ist, geht es nicht.

Читать больше
Размещено От Andreas S.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Martin N.
... ...  Die Seite ist noch nicht online, deswegen hab ich auch keinen Link. ... ... ... ... 

(It > De) ... ... es ist einfach, Sie können in ein Unterverzeichnis exportieren [/test], ein Klick ...wink...
... Sie werden in wenigen Worten lösen   und ein Kopieren / Einfügen   über das EXPERT-Panel ...

.

ciao

.

Читать больше
Размещено От  ‪ KolAsim ‪ ‪
Martin N.
Martin N.
User
Автор

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).

Читать больше
Размещено От Martin N.
Martin N.
Martin N.
User
Автор

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.

Читать больше
Размещено От Martin N.
Incomedia
Elisa B.
Incomedia

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.

Читать больше
Размещено От Elisa B.
Klaus G.
Klaus G.
User

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

Читать больше
Размещено От Klaus G.
Martin N.
Martin N.
User
Автор

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;
}

Читать больше
Размещено От Martin N.