Setting up the Workspace

Assuming you have coded or downloaded a website template, save the template to wherever you want to work with it. Most templates comprise of a folder containing the code files, fonts and images. Open this folder as a project in VS Code, so you can view all the files as a 'tree' in the sidebar.

WebYep uses PHP for its functionality. Therefore an important first step is to change the file extension of any '.html' files to '.php' in the file tree.

At times, working with HTML code in PHP files (within VS Code) can be slightly tedious. There are issues discussed on StackOverflow; particularly relating to the Prettifier plugin not working in PHP files and functionality like format-on-save being lost. I have found the Format HTML in PHP plugin can solve some of these issues, and I'd recommend you try it.

Sadly Live Server doesn't seem to play very well with PHP files. If you have lots of web designing to do, it may be worth keeping files in HTML format, before changing their extensions to .php in VS Code. However you can still open projects from within MAMP or XAMPP; therefore giving you both actual previews of the website locally, while still being able to edit the code in VS Code. See what works best for you!