Jump to content

Column selection for editor


kaz
 Share

Recommended Posts

I would like to give an editor the ability to specify the width of columns in a section. The template may have 2 columns, which have now the with of quarter spacing.

How do I set it up to make the most sense? If the editor sets the left column to 4, the right column should automatically be 8.

Is there a way to do such a setting. I have no idea which field is best suitable for this? I had a look at FieldtypeOptions, but I don't think that's right? maybe InputfieldFloatRange, but then I have only one width.

Has anyone implemented something like this before and can give a tip? It would be great if the editor could change the widths uk-width-1-*@m.

Here an example of how I do it statically at the moment.

<div uk-grid>
    <div class='uk-width-1-4@m uk-width-1-1@s'>
        <figure>
            <img src='{$page->image->url}' alt=''>
        </figure>
    </div>
    <div class='uk-width-3-4@m uk-width-1-1@s'>
        $page->body
    </div>
</div>

 

Link to comment
Share on other sites

I'd go with FieldtypeOptions. Let's say your field is called "colwidth" and your options are:
1=1
2=2
3=3
Then you could do something like

<?php
$w1 = $page->colwidth;
$w2 = 4 - $w1;
?>
<div uk-grid>
    <div class='uk-width-<?= $w1 ?>-4@m uk-width-1-1@s'>
        <figure>
            <img src='{$page->image->url}' alt=''>
        </figure>
    </div>
    <div class='uk-width-<?= $w2 ?>-4@m uk-width-1-1@s'>
        $page->body
    </div>
</div>

 

  • Like 1
Link to comment
Share on other sites

3 hours ago, gebeer said:

I'd go with FieldtypeOptions. Let's say your field is called "colwidth" and your options are:
1=1
2=2
3=3

I'd find it more intuitive to use these labels:

Quote

# select column width option:
1-3 (25% - 75%)
2-2 (50% - 50%)
3-1 (75% - 25%)

But it could use the same code as yours 🙂 

  • Like 1
Link to comment
Share on other sites

@gebeer

I have sadly an error message with the minus operator, the passing of w2:

Notice: Object of class ProcessWire\SelectableOptionArray could not be converted to number in /Users/Sites/localhost/domain.com/site/templates/fields/matrix.php on line 26

Line 26 is
$w2 = 4 - $w1;

The operator is correct, the error is probably in the position of the lines? It's part within a repeater matrix, here's the full code:

if($item->type == 'twocols_content') {
    $w1 = $item->colwidth;
    $w2 = 4 - $w1;
    echo "<article uk-grid>
            <div class='uk-width-{$w1}-4@m uk-width-1-1@s'>
            …
            </div>
            <div class='uk-width-{$w2}-4@m uk-width-1-1@s'>
                $item->content
            </div>
    </article>";
}

w1 is passed correctly after selection, the Options/Select field colwidth is passed.

I have applied it this way (InputfieldRadios):
1=1
2=2
3=3
4 I don't need, 4 results in zero, when the minus operator works 😉

Link to comment
Share on other sites

1 hour ago, kaz said:

sorry, I don't understand?
w1 = $item->colwidth;
the value is passed,
$w2 = 4 - $w1;
needs to change something on this line?

If you echo $item->option a string will be echoed and you can't calculate with a string.

In order to do the math you have to echo $item->option->value to get the value of the selected field which is in your case an integer.

To be precise you could do

$w1=intval($item->colwidth->value);

See: https://www.php.net/manual/de/function.intval.php

  • Like 2
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...