ThemeKit Design System

ThemeKit Design

ThemeKit is much more than a template. It is a hybrid of a theme and a web design framework - far superior to a theme and without the complication of a framework.
ThemeKit allows EverWeb users to create professional website designs with cutting edge features - absolutely NO knowledge of code required!
Design Pack
The basic pack includes a project file with ready made pages, demo media files and all the widgets required to create a beautiful and professional looking website.
ThemeKit is for those who don't like to start with an empty page or are not very experienced with using more advanced widgets.
ThemeKit makes it easy to create a modern, professional website with features not available 1n any of the default or third party themes.
The project file included in each widget pack has all the widgets set up along with any required media files. This makes it easy to copy them over to a new project and create a unique layout without the restrictions imposed by using a ready made theme.
Phone Simulator
Check out the Phone Simulator that can be added to every project to quickly see how the pages will look on a mobile phone.
SVG Icons
SVGs are the preferred format in modern web design due to their superior quality, minimal file size and edit functions.
Each ThemeKit pack has a download link in the "Read Me" file to download a folder with 100s of SVG icons for new products and to replace existing PNG and Font Awesome icons.
Info
Follow the colored block links further down this page for important info about preparing media files for better page download performance in the browser …

ThemeKit Box Nav

The box nav shown above is used where a large number of links are required to be layed out in a grid for easy access. A navigation like this is much more user friendly than using an inline nav with dropdowns for directories. With a navigation like this, the other pages of the site just need a header with a logo link to get back to the page with the navigation.
Tis is a CSS grid layout and the number of links per row can be specified for each device type. The height of the tabs can be adjusted using the control for top/bottom padding.
The links have an ease-in-out hover animation for smoother chang of state and the links can animate in on page load with 15 different animation types using the ThemeKit Custom stylesheet which is built in to the widget.

Installing ThemeKit

The ThemeKit download folder contains all the required widgets and a project file with examples of all the widgets in the pack.
With the EverWeb window closed …

  • Open the Finder's Go menu while holding down the option key and click on "Library"
  • Open the Application Support folder and then the EverWeb folder
  • Locate the ThemeKit project file which has a .everweb extension and drag it into the EverWeb folder
  • Double click all the widgets to install them
  • Open EverWeb and the ThemeKit project will be in the list
  • Select the ThemeKit project and click the little up/down arrows to the right
  • Select "Duplicate …" from the list to make a copy to use for the project
  • Open the duplicate file in EverWeb by double clicking it and give it a suitable name
  • Keep the original ThemeKit file - with all its original settings - as a reference