Button Links only on Text


#1

This probably has a simple solution that i’m not aware of. The button I created uses the following
“<?= $page->selfbrandbutton()->kirbytext() ?>”
although on my page this results in only the text taking the user to the page intended, what would need to be done so that the entire button is linked to my chosen destination.


#2

Well, it would be helpful if you tell us what is stored in your selfbrandbuttonfield. The code you posted above just tells me you are trying to output something with kirbytext.


#3

Oh sorry, I thought I had copied the entire thing.

That section of code is simply wrapped in a button like this,

<button class="casebutton animated fadeInUpShort"><?= $page->selfbrandbutton()->kirbytext() ?></button>

Would I wrap the button with a URL field?


#4

That is still the same as above? Which button? Wha tis the content in the field? Please be more specific when asking question and provide all context, otherwise we loose a lot of time.

I lost my crystal ball and can’t see what is in your project from where I am.


#5

Sorry, this site seems to the hide the content wrapping the php code, unless i put spaces into my tags, I hadn’t realized.

< button class="casebutton animated fadeInUpShort" >     <?= $page->selfbrandbutton()->kirbytext() ?>   < /button >

This button isn’t placed inside any container or div it stands alone like this and has “(link: http://wikipedia.org text: Read Case Study)” as the content within text file.


#6

You have to wrap code blocks inside three backticks each on a separate line before and after your code, see edited posts.

Ok, what I would do, since this is not really a button but a link, I wouldn’t use the button element at all. In your template, use an anker tag (you can style it as a button if you really must), and in your selfbrandbutton field just put the url, not a link Kirbytag.

Then in your template

<a href="<?= $page->selfbrandbutton() ?>" class="case button bla bla">Read Case Study</a>

#7

Or if you want to store the link text inside your field, then use the link KirbyTag, but apply your classes to this link tag.

(link: https://wikipedia.de text: Read case study class: casebutton animated fadeInUpShort)