Media List

The Media List Widget contains complex and repetitive widgets/components. Images are included in the Media List Widget. They are positioned along the side of the list.

When first dropped onto a page, the Media List Widget is displayed in the Page Editor as seen below. Double click the widget to reveal the Advanced Properties Window.

  • Media Item #1
    Subtitle #1

    Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.

  • Media Item #2
    Subtitle #2

    Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.

Advanced Properties

...

Hoverable Rows : Enable a hover state on rows. When the mouse is hovered over a list row, the row is highlighted. When the mouse is moved off of the row, the highlight disappears.  

Inset Style  : If selected, the media list is displayed centred within its container and with rounded corners.  

Heading Type Set the Heading Type to Heading Size ( H1 to H6).

...

Image Size The size of the image displayed at the left side of the line. The image can be a predefined or custom size.

Item List The Media Items list is provided so that you can add or delete items from your list.
Use + and - buttons to add or remove columns in your list.
For example, add three items and you will see three list columns added to your Media List.

Note : 

The MediaList item list accepts pictures drag&drop from the desktop.

Title : The heading title of the line.  

SubTitle : The subtitle of the line.

Description : A description text for the line.

Picture : The Picture box area is used to drop a photograph from Finder or double click on the area to bring up the Finder Files. The chosen image is displayed on the left of the Media List.

...

Note : 

Since version 1.3, it is possible to add direct links/actions to every line.

Media List with Images Example

  • Media Item #1
    Subtitle #1

    Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.

  • Media Item #2
    Subtitle #2

    Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.

  • Media Item #3
    Subtitle #3

    Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.

Copyright©  Nymphide Lab 2020 - All Rights Reserved 

...