ThemeKit Folio

Media

1
ThemeKit Folio Video

Video MP4

Responsive video performance can be greatly increased by taking it off screen and lazy loading it in a modal.
Video File
The video file must be made available in a smaller size for viewing on mobile devices.

Home

Responsive Video

Video files are the largest type inserted in a web page so video players must be able to prevent the file from downloading at page load and to insert a smaller file for mobile devices.
Always use self hosted video and avoid using hosted video - Vimeo and YouTube. Obviously this won't be an issue on a porfolio web page since the the video will be self created.
Folio Video
The ThemeKit Folio Video widget allows the modal to be displayed on the EverWeb design canvas for editing and is then hidden prior to publishing.
It has controls for maximum width and for adding a border and/or a bottom box shadow and for setting the overlay background color and its opacity.
In View Content
The two column grid layout design matches that of the ThemeKit Folio Article widget which both have the option of adding a sequence number, letter or date.
Play Tab
The paly tab is centered in the poster image and has controls for icon color, background color and opacity and for hover color.
Animation
Both the article and the image can animate in using any of the animation types included in the ThemeKit custom stylesheet.
Animation should be kept to a minimum on a portfolio site unless it is required to draw attention to an important item.

Flex Image Grid

ThemeKit Folio Flex Grid [1]
Image [1]
ThemeKit Folio Flex Grid [2]
Image [2]
ThemeKit Folio Flex Grid [3]
Image [3]
ThemeKit Folio Flex Grid [4]
Image [4]
ThemeKit Folio Flex Grid [5]
Image [5]
ThemeKit Folio Flex Grid [6]
Image [6]
ThemeKit Folio Flex Grid [7]
Image [7]
ThemeKit Folio Flex Grid [8]
Image [8]
ThemeKit Folio Flex Grid [9]
Image [9]
ThemeKit Folio Flex Grid [10]
Image [10]
ThemeKit Folio Flex Grid [11]
Image [11]
ThemeKit Folio Flex Grid [12]
Image [12]
ThemeKit Folio Flex Grid [13]
Image [13]

Folio Flex Grid

The widget creates a responsive grid of images with varying aspect ratio. The images can be hyperlinks to open internal/external pages.
An image link is indicated by an icon at the top right. The captions and icons can appear on hover on computers.
The images can be lazy loaded if the grid is not in view on page load to reduce the page download time.
Grid
The grid layout is adjusted using the control for the row height. The spacing between the images can be adjusted and there is a control to adjusr the grid padding.
Shuffle
The optional shuffle function will rearrange the order of the images when the page is reloaded.