Website Building

Sync

14. Juli 2023July 14, 2023 · 2 Min. Lesezeit2 min read

More fancy tricks for fast website building today brings the most used and usefull example, the best way to spread your message !

As for every build we start with a fresh copy of the Flamewerk Template.

For everybody new, you are one blog post away of learning to build Flamewerk apps read our setup of NodeJS, Yarn, Github and VS code. [

Flamewerk: Nuxt3 Startup Theme

🔥 Build Modern Webapps for Free Forever with one easy config, Deploy in less then 5min on any cloudprovider. Create a website, application, shop or community with super documentation and our community.

Flamewerk

](https://flamewerk.com/news/setup-installation) More documentation can be found at https://flamewerk.com/docs/setup

Okay that out of the way let's start.

Todays analogy comes in thinking of building a project like a 🌴 Coconuts 🥥. The shell of the coconut will be the JavaScript files: Project, Api and Products and to some extend Page files. the coconut meat is consistent of your content and custom functionality.

Today's focus is on the project.js file, this contains the basic shell of your project. For setting up a website layout we will customize the following layout parameter. You can customize the headertype and footertype with the options provided;

layout: 'web',            // (default, web, app )

headertype: 'Maximum',    // Options: Tiny, Maximum, Application

footertype: 'Tiny',  // Options: Tiny, Minimal, Maximum, Ecommerce

Once you have this setup you can experiment with various settings in this file.

Adding content#

The extra section today is about adding extra pages and start the basics around translations.

Every markdown page you add in the content/en/ folder wil be rendered as a page that will be accessable trough every language enless a translated content file is present.

Example of a page: content/en/test.md

---
title: 'Test Page'
description: 'Test Meta Description of the Page'
---
::BlockProseContent

#🌎 Hello World

::

You can visit this page on the route: localhost:3000/test

Currently the following languages are supported and you can use this functionality by simple adding a folder in the content directory:

You set the default directory to load content from in the project.js file:

language: "en",

More Details about indept translation can be found here: https://flamewerk.com/docs/translation

#Flamewerk Archive

Written by

Comments

No comments yet. Start the conversation.