Carousel
Items Per RowThe number of items to show is adjustable for each device type.
ThemeKit Lite Theme
Content Carousel
Home
Controls
ArrowsThe arrows show/hide function can be set for each device type.
Images
OptionsThe optional images have controls for maximum width, padding and border width and color
Spans
StylesThe optional spans have controls for font size and color and for text align.
Links
The optional links are at the bottom of the container and can open internal or external pages.
Slides
SpacingThe spacing between the slides can be adjusted to show the grid background
ThemeKit Lite Carousel
In many respects a carousel is a better option than a slideshow on responsive pages and the image size can be much smaller.
The ThemeKit Lite Carousel is multifunctional in that it can display images or text content and can be used for displaying products, an illustrated navigation, user testimonials, quotes and so on …
Layout
The carousel can be centered with a maximum width setting or be switched to full width by checking a box.
The number of items to show can be set for each device type and the container has controls for background color and opacity, padding and item spacing.
Items
The items have options for an image with alt text, a heading, a styled span, text, another styled span and a full width CTA style link.
When the image option is used the lazy loading function should be turned on if the carousel is not in view on page load.
Navigation
The carousel can be navigated by grab and drag on computers and swipe on touch devices like tablets and phones.
The navigation arrows can be set to show or hide for each device type.
ThemeKit Rocks
This is definitely the best way to created a top quality website design with EverWeb.
Susan HolmesProfessional Grade
The ThemeKit Pro themes exceeded all my expectations and and I'm now the proud owner of a first rate website.
Jim PierceResponsive
I struggle with trying to create a responsive website with EverWeb until I tried a ThemeKit theme.
Joyce McClureVideo
My video website was a disaster - especially on mobile devices. The ThemeKit AV theme fixed all that and more.
Andy CampbellCube
I needed a really unique hero for my home home page and ended up rebuilding my whole website using ThemeKit Cube.
Eric FosterI struggled with trying to create a spacious responsive layout with subtle animation until I found ThemeKit Motion.
Mira RussellIcon Row
Icon Row
The row can have 2, 3 or 4 items.
When there are three items the last one aligns itself in the center of row 2 below the first break point.
The items stack vertically on phones in portrait mode.
Columns
The columns are created using the CSS Grid Layout Module.
Each column has an <article> element which can have a border if required
The article has a heading, text and an optional link.
The icon and the heading are in a header element.
Icons
The optional icons are SVGs and are inserted by opening the SVG download folder, double clicking the file to open it in TextEdit in plain text mode, copying the code and pasting it into the SVG code box in the widget settings.
Icons can be round or square with a border option.
Links
The optional links are positioned at the bottom of the container so that they remain in line despite varying amounts of content.
The links can be configured to open internal or external pages and have a new window option.
ThemeKit Lite Links
The ThemeKit Lite Links widget can be used for a horizontal navigation if required but its main purpose is to provide CTA style links to replace any text links in the page content.
Text links are outdated and should be avoided on responsive pages. Links on mobile devices need to have a minimum with of 32px for fingertips and 40px for thumbs and a minimum height of 28px. If the links are less than these dimensions they will be registered as unsuitable by the search engines.
Better By Design
Apart from the general layout style, the thing that sets a good website design apart is the details. If links or action tabs have a hover state it should have a transition applied to smooth out the change in state, A change in background color is more professional looking than a change in hover text color.
Adding an unusual animation to the hover - like the chevron to double chevron of the above links - adds that little extra design feature and makes the website more memorable to visitors.