static website editing tool

WEDIT

what is it?

Wedit is command line tool designed to help website content management.

Wedit uses static HTML website as template and enables the content to be changed through WYSIWYG editing using the web browser. All changes are immediate and align with the intended website design.

To see wedit in action, press and hold the CTRL key!

wedit in action

See how wedit is used for the Peaks website.

text editing

Any HTML element within the template marked with wedit="..." attribute is editable using markdown.

The markdown supports paragraphs links, headers, bullet points, basic text decorations, inline images or even free form HTML.

Once edit is done, all changes are automatically reflected to the static website.

repeat sections

Any HTML element can be marked with wedit-repeat="..." attribute to make it repeatable.

This is useful technique to add dynamic number of:

  • paragraphs

images support

Wedit supports the img HTML elements. Similar with ant other text element img elements are made editable with the wedit="..." attribute.

If srcset is used with ‘width’ descriptor (like srcset="image-s.jpg 320w, image-m.jpg 640w, image-l.jpg 1024w"), the new uploaded image will be automatically resized and different files will be supplied for each descriptor.

page variations

Wedit follows the template folder structure for the static website. The one exception is the variation folder, which will be mapped to any string while wedit is in edit mode. By default the variation folder name is a single hyphen (‐).

As an example, the file in template folder

  • blogs/-/index.html

will be used for URLs like

  • /blogs/some-article/index.html
  • /blogs/other-article/index.html

Another example is the common challenge of localization where

  • services/-/index.html

will be used for URLs like

  • /services/en/index.html
  • /services/de/index.html

To create new variations, while in wedit edit mode, navigate to the desire URL and wedit will create the variation in the public folder.

root content & snippet includes

Wedit has the concept of a root key. Any key with prefix ! used in an attribute like wedit="!..." is considered a root key.

A root key instructs wedit that associated content must be the same for all pages.

When changes are made to the content, wedit will regenerate all pages containing this root key.

Next to the root key, wedit can help including content form other HTML files.

With the wedit-include="..." attribute, you can append entire HTML fragments from separate files. Those HTML fragments can include root and non-root keys.

Those two techniques are useful for headers footers and other common elements within the website.

development flow

Every tool has a purpose, and wedit is not different.

Wedit does not try to replace any existing web development tools or frameworks.

Wedit does not have its own publishing workflow. As wedit works with static websites, the publishing and approval flows are left to file version control systems like GIT.

Wedit toggles only the problem of localizing and maintaining content of the static website once the web development is completed.

license

The wedit tool is free and open source, under an MIT license.

Source code and documentation can be found on the GitHub repository.

get wedit

Go get

Requires Go environment.

$ go get github.com/sofmon/wedit


Build from source

Requires Go and Dart environments.

$ git clone github.com/sofmon/wedit

$ ./build.sh for Linux/MacOS

$ ./build.ps1 for Windows

maintainers

Wedit is currently maintained by:

Haralampi Staykov About|GitHub|LinkedIn