wix theme fullsite

Summary

This is custom Wix site I have built with the Wix editor using my own design. Wix is very quick solution for easily starting a website, however it does work better with simpler designs and is not very Tablet-friendly.

wix theme wireframe
Wireframe Design

The design for this site was drawn-up using Xd. I created both a Desktop and Mobile view and also my own placeholder graphic for the logo. I also imported fonts from Google Fonts and the icons from Font Awesome. Since Wix does not support code editing, this design needed to be fairly simple.

After creating the wireframe, I copied it into into Wix using the drag and drop Editor. I then re-imported the fonts and uploaded the images from my design. Unfortunately, Wix has a width limit so this meant I had to shrink the design slightly.

wix theme site effects
Site Effects

All other site-effects (e.g. animations (link hover effects, scroll-to-top button + sticky top nav), responsive layouts and editor integration) were handled by the Wix drag-and-drop editor. Although, custom javascript can be written in Wix Velo, there are limitations to what can be achieved. Wix Velo seems mostly suited to animations or accessing a database, which were not part of my main design.

Animations / Effects

  • -Link hover effects
  • -Fade-in animation

Resources