Getting started with Flux
Making your first website
When Flux first starts, you will be presented with a window named 'Untitled', this represents a new Project. To save the Project, choose 'Save As...' from the 'File' menu and give your project a name. You can call it anything you like and save it anywhere on your computer (or a network drive).
Once it is saved, you can make your first web page, but as all websites produced with Flux are based on CSS, you need to make a CSS file first. To do this, click on the Empty 'Site' folder in the project window. This represents the 'root' of your website, and you can put any files you want in here such as HTML, pictures, downloads, and in this case, CSS files. Click on the 'New StyleSheet' button on the toolbar, and give your new CSS file a name. It's best not to use any spaces or special characters in this name, so choose a name like 'main', 'companystyle' or 'mycssfile'.
Now that you have a CSS file, you can make a new HTML page. To do this, click the 'New Page' button on the toolbar. Again, you need to choose a simple name for the html file. If this is the main page for your new website (i.e. the first page a visitor will see), call it 'index'. Flux automatically adds the '.html' on the end of this name.
You will now have a CSS file and a HTML file in the 'Site' folder, to start designing your website, double-click the HTML file. You now have select a CSS file on which the HTML file will base it's styling, you can choose the CSS file you just created. This will open the 'Designer' window, containing the HTML file you just created.
You're now ready to start creating content for your website!
Creating content
In Flux, almost all content is held in 'containers', to make a new container on your page, select 'Container' from the 'New Object' menu which is located on the toolbar on the Designer window. The new container will appear on the page, you can drag this around anywhere and double-click it to view it's styling in the 'Element Attributes' palette. Flux allows editing of many different attributes using this palette, we will change some of the simpler ones now.
Changing Element Attributes
First, ensure you have selected the container by clicking on it with your mouse. Now click on the 'Borders & Margins' tab on the Element Attributes pallete, you can now add borders to the left, top, right, and bottom sides of the container, to add a border, type a number above 0 into the fields for each of the sides. You will now see that your container has borders. We can also add a fill to the container by selecting the 'Fill' tab on the Element Attributes palette. Here we simply select a color to fill the container with, we can also affect it's opacity (translucency). Once this is done, press the 'Preview' button on the Designer window's toolbar. You will now see how your page will look in a web browser. If you're concerned about how your page will look in a range of web browsers, you can choose to view the page in one of the other web browsers installed on your computer by selecting the browser from the 'Page > Preview' menu.
Flux uses Spotlight technology to quickly find web browsers installed on your computer, to make sure Flux is finding all your browsers, go to the 'Browsers' area of Flux preferences and press the 'Find browsers' button. Flux will quickly find all suitable browsers, and they will then be available in the 'Page > Preview' menu.