The RIPL library is designed to be easily extensible to a variety of presentation types. Today, I’m going to show how to update the library to show content in an alternative presentation.
Building on our previous example, we’re going to add a few new parameters. We’ll change the target rendering style and add a new handler for the onclick event…. plus we’ll add a little CSS to change things up.
So, we’ve added a few new attributes:
- ripl:display_targetstyle – There are predefined styles for rendering content and users, plus you can add your own. We’re going to use the preset ‘contentlist_cards’ rendering style for this list.
- ripl:display_itemsperpage – Because the contentlist_cards view takes up more space, we’ll actually be showing fewer items, though we’ll be showing more information about each one.
- ripl:event_onclick – Now we get to use the new RIPL PopUp display.
So we get:
Great, but we want to really change up the look, so let’s lay some CSS on top:
#demo2 .ripl_contentitem_render_card {background-color:#80a020; border-top:1px solid #D9DB56;border-bottom:1px solid #757116;border-left:1px solid #757116;border-right:1px solid #757116; width:100%}
#demo2 .ripl_contentitem_render_card:hover {background-color:#AEBC21}
#demo2 .ripl_colors_normal {color:#f0f25e}
#demo2 .ripl_colors_deemphasis {color:#D9DB56}
#demo2 .ripl_colors_link {color:#ffffff}
And voila: