Forums

Using select attributes to change the output of PageList Items in 5.7.3

Permalink 1 user found helpful
Hello Community :)

I am currently working on a site for a sports club that wishes to display all upcoming events on its landing page.

The special request is: They want to display the 'level' of the event/course just in this list.

So we talk about three levels: Starter, Medium, Master.

What I plan on doing is checking each item in the pagelist for the values of that select attribute and if one of these attributes is found - output the title of that page with different CSS classes.

What I tried so far:

Create a custom template for pagelist and in view.php, put this in the top section

$starter = $c->getCollectionAttributeValue('starter');
$medium = $c->getCollectionAttributeValue('medium');
$master = $c->getCollectionAttributeValue('master');


Then, below, where the pagelist loops through the items and outputs everything:
<?php if ($starter): ?>
<div class="ccm-block-page-list-starter"><?php echo $title ?></div>
<?php endif; ?>
<?php if ($medium): ?>
<div class="ccm-block-page-list-medium"><?php echo $title ?></div>
<?php endif; ?>
<?php if ($master): ?>
<div class="ccm-block-page-list-master"><?php echo $title ?></div>
<?php endif; ?>


and to view.css I'll just put:
div.ccm-block-page-list-starter {border-left:1px solid yellow;}
div.ccm-block-page-list-medium {border-left:1px solid blue;}
div.ccm-block-page-list-master {border-left:1px solid red;}


Or whatever. In the end it will be something more beautiful, but first I need to even apply the CSS call...

Of course the attributes are created with the handle 'levels'...

I suppose this will be much useful for many people, so if anyone can point me to the right direction (I can't be very wrong), I'd like to make a HowTo from it.

Thanks!
 
Cahueya replied on at Permalink Reply
Ok, I found the solution myself, here is what I've done, maybe this helps someone in the future:


Head of view.php of PageList
So I just check for the attributeValue of the select attribute I created (handle: level). If there is a OptionsList available, I get the current (first) value. This only works for "single option"-select attributes, if you have multi-select, it will return only the first value.

Then I get the value from the option and if it is of a certain name, i will call the name of a css class.
$attrvalue=$page->getCollectionAttributeValue('level'); // is null/false or Instant of: Concrete\Attribute\Select\OptionList
      if ($attrvalue) {
         $selectedoption=$attrvalue->current();                 // is Instance of: Concrete\Attribute\Select\Option
         $optionvalue   =$selectedoption->getSelectAttributeOptionValue();
         if      ($optionvalue=="starter") { $cssname="css-starter"; }
         else if ($optionvalue=="medium"   ) { $cssname="css-medium";    }
         else if ($optionvalue=="master"    ) { $cssname="css-master";     }
         else                                  { $cssname="css-nothing";     }
      } else {                                    $cssname="css-nothing";     }



Down below where the list is being rendered, I just place $cssname as a spanclass around the Title/Link of the item.

<a href="<?php echo $url ?>" target="<?php echo $target ?>"><span class="<?php echo "$cssname" ?>"><?php echo $title ?></span></a>


Everything else is pure CSS, I just place the span class into view.css:

span.css-starter    { border-left:3px solid green; }


and do the same for the other classes and style them as I like.

I hope this helps someone in the future :)