Template Designer Benefits

  • Keep 100% of the revenue on every template sold
  • Make money on free templates through affiliate links
  • Opportunity to sell your templates to no-code and developer audience at the same time
  • Improve your Versoly and web design skills
  • Learn and share best practices

Template Checklist

Design & Layout

  • Strong graphic design principles such as contrast, typography, layout, balance, hierarchies, and proportion
  • Follows current web design trends
  • Visually appealing layouts and composition
  • Logical layer structure and naming, following Versoly UI when possible
  • Where possible use responsive font sizes and connect them to h1-h6
  • Looks great on all devices and breakpoints
  • Has accessible color contrast where possible
  • Avoid use of excessive Lorem Ipsum and other filler content
  • Pages should have unique layouts, avoid page designs with little differences
  • The amount of breakpoint required to make the website scale across devices are as little as possible
  • The template should be tailored to a particular use case and include features that enhance its usefulness for that use case.

Effects & Animations

  • Maintain consistency in effects and animations. For instance, ensure that appear effects have comparable animation curves and timing to establish a uniform browsing experience
  • Only apply effects and animations to elements that enhance functionality or improve the browsing experience. For example, avoid adding hover or pressed effects to elements that lack links or do not provide additional information when hovered over

Template Projects

  • Template is published to a free custom versoly.page URL
  • All links in the template work and point to a valid URL
  • Pages listed in the navigation or footer of the template need to link to the corresponding pages
  • Only uses default or Google fonts included with Versoly
  • Has clearly structured HTML tags on elements
  • Images have alt tags where needed
  • Template has a custom title and description added in the site settings
  • Template does not use copyrighted content such as images, videos or custom fonts
  • The project does not contain any unused components or assets
  • Components should be used for navigation, footers and repeating sections.
  • Use descriptive and meaningful names for components that reflect their functionality, rather than generic names like “Component1” or “Widget2”. Examples include “User Profile Card”, “Product Carousel”, or “Checkout Form”
  • All external Components in the template are up to date


  • Use H1 heading elements once on the page for the most important heading. It has the highest ranking.
  • Use H2-H6 subheading elements in a correct hierarchy on the page. These subheading elements rank in importance according to the number in their name, so assign correct subheadings for importance of content.
  • SEO settings need to match the template name on the home page settings. SEO Title should read "{Template Name} - Versoly HTML website template" for Static and CMS templates


  • Where possible use Versoly smart CMS structures such as blog and careers
  • Name your CMS fields in a way that clearly correlates to the item they are linked to
  • Collection slugs should be singular. Ex: website.com/article/page
  • Collection fields should be in a logical order with well-written help text on how to use them
  • Collections should have at least 3 items and a maximum of 7 items per a collection. These items should have dummy content that makes sense for that category of a website.
  • Dynamic lists that are grids should be tested with long item names to make sure the layout doesn't break.
  • While building think about how easy it is to maintain along with optimising for conversions and SEO by including titles, descriptions and pagination


  • Form fields should have correct settings. Ex: email fields should not be text fields
  • Success messages should be customized to fit website design
  • Input focus states should be customized to fit website design
  • Input fields text and placeholders should be legible
  • Give appropriate names to the Forms and Field elements (in form settings). These names will appear in form email notifications and form reports.

Naming Conventions

  • Page names should be Title Case and should be consistent with navigation link names for those pages.
  • Component names should be formatted in kebab-case
  • Collection names should be Title Case and should have the Singular and Plural versions defined correctly. This sentence should sound natural: “This is a collection of {{plural-version}}” and “Create a new {{singular-version}}”

Classes and Styles

  • When possible don't create new classes and styles when you could re-use or cascade styles from another class to create the same design.
  • Extend existing classes such as btn, btn-primary, btn-lg and accordion
  • Unused styles should be cleared.

Licensed Assets

  • The use of premium or trademarked graphics assets are not allowed. Use only free assets that are allowed for resale and free redistribution or CC0-licensed graphics from sources like:- Stock Up- Pexels - Unsplash
  • Create a page called Licenses at the slug /licenses
  • Include the following text at the top: "All graphical assets in this template are licensed for personal and commercial use. If you'd like to use a specific asset, please check the license below".
  • Display graphic sources on this page (images, icons, fonts, illustrations) with a link for each, pointing to the page where the license is defined (see example).
  • Add the following code to the page’s custom head code:<meta name="robots" content="noindex">
  • Include a "Licensing" link in the footer and link to License page.

Recommended Practices

  • Create a page called “Template Changelog” with slug "template-changelog" to track template versions and updates. Add the following code to the Changelog page's custom head code: <meta name="robots" content="noindex">
  • Test every link/component/interaction on every page and on every device so that there are no design or layout bugs.

Template Name

  • Give your template a unique single-word name, this will help you distinguish yourself from other templates.
  • Avoid common words like Basic or Clean
  • Search the Versoly template page and make sure the name isn't already in use

Custom Code

  • External libraries that are required for core functionality or visuals of your template are not allowed
  • If the library is extremely popular, open source (MIT license) and not too complex Versoly can look to create a plugin similar to the Versoly Swiper plugin

Customer Support

  • Ability and availability to provide template support to your template customers
  • Versoly bugs and features should be directed to Versoly support.
  • To reduce long term customer support, upgrading templates to fix bugs using versioning will be required

Templates sales link

  • Sell your template through a platform like Lemon Squeezy or Gumroad
  • Create a product with great images and use the naming conventions from your Versoly template

Template Designer Agreement

  • Poor-performing and or outdated templates will be removed
  • Templates with bugs will not be accepted and can be removed
  • Templates that use licensed assets which are not owned by the author will not be accepted and can be removed

Submit your template

Please note that it can take up to a week for us to review your template.

We received your message and will contact you back soon.

Error sending please try again