WidgetsBox
List Layout
List Layout Basic Example
In this example, the UIkit Divided List Layout was used as the list layout. The link is displayed as a button. In addition, the fields for category and creator were displayed. The elements are displayed with animation (80 ms delay). The images are displayed with rounded corners via parameters.
-
Beautifull Landscapes
Demo Articleswritten by MarcoLorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor... -
Car Technology
Demo Articleswritten by MarcoLorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor... -
Item TagGoogle Link Tag
Developing new things (external Google Link)
Demo ArticlesItem TagGoogle Link Tagwritten by MarcoLorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor... -
In Code we Trust
Demo Articleswritten by MarcoLorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor... -
Sparkling Events
Demo Articleswritten by MarcoLorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor...
List Layout Striped Example
In this example, the UIkit Striped List layout was used. The filter was set to two elements. The title (h4) was also given the UIkit class 'uk-text-bold'. The fields for category, tags and creator have been removed in this example. The article images are displayed in a circle layout according to the module option.
List Layout with Search Filter Example
The search filter hides items that do not match the search text. It is not an effective filter option, but simply hides items from the entire list that do not match the search.
Simple Layouts
Of course, "standard" list layouts are also possible. The first of the examples below shows the UIkit standard layout. The second is an "unstyled" unordered list. Simple "ordered" lists can also be created with or without additional information. The "Row Counter" option in the module settings is available for this purpose.