View previous topic :: View next topic |
Author |
Message |
jonal Smarty Rookie
Joined: 16 Apr 2021 Posts: 11
|
Posted: Tue Apr 27, 2021 12:28 pm Post subject: Wrap something if var is true |
|
|
I need to put a wrapping anchor around my element if an anchor is given (the var contains a value).
But the my bad approach without knowledge would something be like this:
Code: |
{if $Data.tile_link}
<a href="{$Data.tile_link}">
<div>All my code</div>
</a>
{else}
<div>All my code</div>
{/if}
|
But the problem with this that I have a duplicate of my code in there. So twice the filesize. Because the code is a little more complex than just a div.
How can I wrap something with a simple if else?
I tried this:
Code: |
{if $Data.tile_link}
<a href="{$Data.tile_link}">
{else}
{/if}
<div>All my code</div>
{if $Data.tile_link}
</a>
{else}
{/if}
|
But it actually inserted multiple <a> tags somehow.
The HTML result I would like to get is:
Code: |
<a href="#">
<div>All my code</div>
</a>
|
|
|
Back to top |
|
AnrDaemon Administrator
Joined: 03 Dec 2012 Posts: 1785
|
Posted: Wed Apr 28, 2021 12:46 pm Post subject: |
|
|
Code: | <div>
{if $Data.tile_link}<a name="{$Data.tile_link}"/>{/if}
All my code
</div> |
Or explain your needs from the beginning. WHAT do you need to achieve? Not "how". |
|
Back to top |
|
jonal Smarty Rookie
Joined: 16 Apr 2021 Posts: 11
|
Posted: Wed Apr 28, 2021 1:47 pm Post subject: |
|
|
AnrDaemon wrote: | Code: | <div>
{if $Data.tile_link}<a name="{$Data.tile_link}"/>{/if}
All my code
</div> |
Or explain your needs from the beginning. WHAT do you need to achieve? Not "how". |
Thanks. But not actually what I'm looking for.
I got my code and if my var contains a link I would like to wrap my whole code into an anchor tag
So the HTML would be either this:
Code: |
<a href="#">
<div>All my code</div>
</a>
|
or this:
Code: |
<div>All my code</div>
|
depending on if my var has something in it |
|
Back to top |
|
bsmither Smarty Elite
Joined: 20 Dec 2011 Posts: 322 Location: West Coast
|
Posted: Fri Apr 30, 2021 11:56 pm Post subject: |
|
|
If you use {capture name="foo"}, the block of code that is captured can be used in multiple other places, but developed in just one place.
Code: |
{capture name="foo"}
<div>All my code</div>
{/capture}
{if $Data.tile_link}
<a href="{$Data.tile_link}">
{$smarty.capture.foo}
</a>
{else}
{$smarty.capture.foo}
{/if} |
|
|
Back to top |
|
AnrDaemon Administrator
Joined: 03 Dec 2012 Posts: 1785
|
Posted: Tue May 04, 2021 7:54 am Post subject: |
|
|
jonal wrote: | So the HTML would be either this:
Code: |
<a href="#">
<div>All my code</div>
</a>
|
|
Which is nonsense from HTML standpoint. |
|
Back to top |
|
jonal Smarty Rookie
Joined: 16 Apr 2021 Posts: 11
|
Posted: Tue May 04, 2021 11:30 am Post subject: |
|
|
AnrDaemon wrote: | jonal wrote: | So the HTML would be either this:
Code: |
<a href="#">
<div>All my code</div>
</a>
|
|
Which is nonsense from HTML standpoint. |
Why is this nonsense? It wraps my code with an anchor which got the same size as my content
Last edited by jonal on Tue May 04, 2021 11:33 am; edited 1 time in total |
|
Back to top |
|
jonal Smarty Rookie
Joined: 16 Apr 2021 Posts: 11
|
Posted: Tue May 04, 2021 11:31 am Post subject: |
|
|
bsmither wrote: | If you use {capture name="foo"}, the block of code that is captured can be used in multiple other places, but developed in just one place.
Code: |
{capture name="foo"}
<div>All my code</div>
{/capture}
{if $Data.tile_link}
<a href="{$Data.tile_link}">
{$smarty.capture.foo}
</a>
{else}
{$smarty.capture.foo}
{/if} |
|
Thank you very much. Thats what I was looking for. |
|
Back to top |
|
AnrDaemon Administrator
Joined: 03 Dec 2012 Posts: 1785
|
Posted: Tue May 04, 2021 1:10 pm Post subject: |
|
|
jonal wrote: | Why is this nonsense? It wraps my code with an anchor which got the same size as my content |
You literally just said that you wrapping a ship in an anchor. Sounds equally ridiculous.
Not to mention, in modern web this is done using "id" attributes and no longer require extra tags.
So, Code: | <div{if $Data.tile_link} id="{$Data.tile_link|escape:html}"{/if}>
All my code
</div> | would be even better answer. |
|
Back to top |
|
jonal Smarty Rookie
Joined: 16 Apr 2021 Posts: 11
|
Posted: Tue May 04, 2021 1:38 pm Post subject: |
|
|
AnrDaemon wrote: | jonal wrote: | Why is this nonsense? It wraps my code with an anchor which got the same size as my content |
You literally just said that you wrapping a ship in an anchor. Sounds equally ridiculous.
Not to mention, in modern web this is done using "id" attributes and no longer require extra tags.
So, Code: | <div{if $Data.tile_link} id="{$Data.tile_link|escape:html}"{/if}>
All my code
</div> | would be even better answer. |
Oh well, I didn't know about the id thing. What is that called, so I can look up browser support?
But thank you anyway!
Quick edit: I can't make that id "link" work in plain html. Maybe we talk about something different? I don't want an anchor for example a navigation. I want to set an external link on that. |
|
Back to top |
|
AnrDaemon Administrator
Joined: 03 Dec 2012 Posts: 1785
|
Posted: Tue May 04, 2021 8:14 pm Post subject: |
|
|
My sincere apology, I somehow missed the href part.
Still, nobody stops you from wrapping your code into <a> tag and add href= attribute only if you have the link.
Sane CSS only highlight links that do have href (see a:link pseudo class). |
|
Back to top |
|
|