Text Logo

ThemeKit Expo

  • ThemeKit Expo Info Slider 1

    Layout

    The relative column widths of the image and the info are adjustable

  • ThemeKit Expo Info Slider 2

    Link

    The links are optional and can have common or individual text.

  • ThemeKit Expo Info Slider 3

    Icons

    The SVG link icons are optional and have a choice of bag, basket or cart and are available in black or white.

  • ThemeKit Expo Info Slider 4

    The action tabs have controls for icon color and background color. They can be hidden below the breakpoint

  • ThemeKit Expo Info Slider 5

    Breakpoint

    Below the selected breakpoint the image becomes full width and the info appears below it.

  • ThemeKit Expo Info Slider 6

    Thumbnail Row

    The thumbnails are optional and the number to show can be set

  • ThemeKit Expo Info Slider 7

    Hide Thumbs

    The thumbnails can be hidden on screen widths less than the breakpoint.

  • ThemeKit Expo Info Slider 8

    Styles

    The container has the option to add a border and/or a bottom box shadow .

Info Slider

The ThemeKit Expo Info Slider has a two column grid layout with the images in the left column and the info section in the right. The relative column widths are adjustable.
Thumbnails
The thumbnails are optional and the number of thumbs to show can be set. When they are present the thumbail grid can be hidden on screen widths below the breakpoint if required.
Info Panel
The info is contained in the <figcaption> element for the best search engine indexing. The links are optional and there is an option to add an icon for bag, basket or cart in black or white.
Action
The action tabs have controls for icon color and for the background color and its opacity. The tabs can be hidden below the breakpoint. Slides can be changed using the action tabs, thumbnails or grab and drag on computers and by swiping on touch devices.
Link
The link can be used for an internal/external link with either individual or common link text.
In this case the link shows the optional cart icon and has the add to cart code added to the URL box for the ThemeKit Expo theme.

    Adaptive Slidehsow

    Adaptive Slideshow

    There aren't to many responsive sliders around that can successfully display images with radically different aspect ratios. This one was adapted from an existing script by completely rewriting the styles.
    Any slideshow used on a responsive web page must supply a smaller image for mobile devices and this one is no exception.
    Caption & Links
    The caption is below the image and is contained in the <figcaption> element for the best search engine indexing. The links are optional and are indicated by the link icon at the top right.
    The icons can appear on hover when the slideshow is viewed on a computer.
    Action
    The action tabs have controls for icon color and for the background color and its opacity. The tabs can be hidden below the breakpoint. Slides can be changed using the action tabs, thumbnails or grab and drag on computers and by swiping on touch devices.