<p>I'm not sure I totally get what you're trying to do, but if you want to cut down a bit of the code duplication in here a good start would be to use a <a href="http://twig.sensiolabs.org/doc/2.x/tags/macro.html" rel="nofollow noreferrer">Twig macro</a>.</p>

<p>So you'd set up your macro like this:</p>

<pre><code>{% macro input(cssClass) %}
    &lt;a class=”{{ cssClass }}” href="#"&gt;Viewer&lt;/a&gt;
    &lt;a class=”{{ cssClass }}” href="#"&gt;Photo&lt;/a&gt;
    &lt;a class=”{{ cssClass }}” href="#"&gt;Video&lt;/a&gt;
{% endmacro %}

{% from _self import input %}
</code></pre>

<p>Then you'd call it like this:</p>

<pre><code>{{ input('dual') }}
</code></pre>

<p>If you don't need the value of the radio buttons for anything else, you could always give them the value of your CSS class; that way you don't need to convert them from one thing to another. If you did it this way then you could just call your macro like this:</p>

<pre><code>{% set cssClass = entry.viewerOption %}
{{ input(cssClass) }}
</code></pre>

<p>Make sure you've set a default option for your radio button when you've added it in the Control Panel.</p>

CC BY-SA 3.0
2017-03-13T13:27:11.397Z
2017-03-14T08:55:39.743Z
2017-03-14T08:55:39.743Z
Steve Holland
<p>The issue arises from inline three buttons (Viewer, Video, Photo) via CSS.</p>

<p>The idea was to make the buttons more responsive for example if I want to display just one button than stretch to 100% width within the parent. Two buttons (50% each) and three buttons (33.33% each).</p>

<p>I guess if I setup radio field and the values are <code>displayOne</code>, <code>displayTwo</code> and <code>displayThree</code>. </p>

<pre><code>{% for option in entry.viewerOption %}

{% if option in entry.viewerOption.value.selected(displayOne) %}
&lt;a class=”single” href="#"&gt;Viewer&lt;/a&gt;
{% else %}
&lt;a class=”single” href="#"&gt;Photo&lt;/a&gt;
{% else %}
&lt;a class=”single” href="#"&gt;Video&lt;/a&gt;
{% endif %}

{% else %}

{% if option in entry.viewerOption.value.selected(displayTwo) %}
&lt;a class=”duel” href="#"&gt;Viewer&lt;/a&gt;
&lt;a class=”duel” href="#"&gt;Photo&lt;/a&gt;
&lt;a class=”duel” href="#"&gt;Video&lt;/a&gt;
{% endif %}

{% else %}

{% if option in entry.viewerOption.value.selected(displayThree) %}
&lt;a class=”triple” href="#"&gt;Viewer&lt;/a&gt;
&lt;a class=”triple” href="#"&gt;Photo&lt;/a&gt;
&lt;a class=”triple” href="#"&gt;Video&lt;/a&gt;
{% endif %}
{% endfor %}
</code></pre>

<p>I am not sure what is the best method to dynamically single, duel or triple buttons base on selected radio value.</p>

<templating><field>
Display selected radio's value
# Display selected radio's value

(Asked by: username_0 on 2017-03-13)

The issue arises from inline three buttons (Viewer, Video, Photo) via CSS.
The idea was to make the buttons more responsive for example if I want to display just one button than stretch to 100% width within the parent. Two buttons (50% each) and three buttons (33.33% each).
I guess if I setup radio field and the values are displayOne, displayTwo and displayThree. 
{% for option in entry.viewerOption %}

{% if option in entry.viewerOption.value.selected(displayOne) %}
Viewer
{% else %}
Photo
{% else %}
Video
{% endif %}

{% else %}

{% if option in entry.viewerOption.value.selected(displayTwo) %}
Viewer
Photo
Video
{% endif %}

{% else %}

{% if option in entry.viewerOption.value.selected(displayThree) %}
Viewer
Photo
Video
{% endif %}
{% endfor %}

I am not sure what is the best method to dynamically single, duel or triple buttons base on selected radio value.

**Tags:** templating, field


---

## 1 answers

### Answer by username_1 on 2017-03-13. Score: 1 | Accepted answer

I'm not sure I totally get what you're trying to do, but if you want to cut down a bit of the code duplication in here a good start would be to use a Twig macro.
So you'd set up your macro like this:
{% macro input(cssClass) %}
    Viewer
    Photo
    Video
{% endmacro %}

{% from _self import input %}

Then you'd call it like this:
{{ input('dual') }}

If you don't need the value of the radio buttons for anything else, you could always give them the value of your CSS class; that way you don't need to convert them from one thing to another. If you did it this way then you could just call your macro like this:
{% set cssClass = entry.viewerOption %}
{{ input(cssClass) }}

Make sure you've set a default option for your radio button when you've added it in the Control Panel.


---

