Search:  

Previous pageA first app & walkthrough Next page
The Layout Manager - Adding a component 

graduation-hat What are we learning here?


We learn how to add and remove pages.

Select the Pages-tab in the Layout Manager.

The Pages-tab is where you manage the site structure. You can add new components, rename them and move their position in the site tree. As you add and change components the navigation will be automatically adjusted for you.

If you closed the Layout Manager, mouse over the Toolbox and click on the Layout Manager - the Layout Manager will open again, in a new window. 

Creating a new 'Section' on the website

Codeless app development layout manager

The Pages-tab has two zones: Components, and Web Site.

The Component zone has two tabs: All Components and Manage Bank. We will be using the default 'All Components' tab. 

Add a 'Page' to the Web Site

Scroll-down in the 'All Components' zone and select 'Page' - this will place a new Page in the Name box shown at the bottom of the column.

Codeless app development add component

Call the Page 'Section 3', and click the [Add to Web Site] button.

The new page will now be attached to the mouse cursor. You can now move the mouse cursor over the the 'Web Site' section of the page. As you approach the tree an insertion point ( >--< ) will be displayed. When you are in the correct place - click the left mouse button to insert the new 'Page Component'. Place the Page in the 'Hello World' section in the Web Site view, between 'Section 2' and 'Admin'.  . 

If you make a mistake before you place the Page, clicking anywhere on the page outside the tree area will void the action.
If you place the Page in the wrong location, simply right-click and select 'Move'. 

If you get an 'Insertion Failed' notice, just try again and position the cursor closer to one of the existing icons.
If you continue to get "Insertion Failed' notices (due to record locking), close the Layout Manager and then reopen it.

Codeless app development delete component

A new Page will be added to the Web Site tree and that will be immediately reflected in the website layout. Refresh the webpage (in the other window open on the website itself) and you will see a new tab appear on the website as the navigation automatically adjusts to the change in the site.

How to remove the 'Page'

If you wanted to remove the page you just added you would return to the Layout Manager and select the 'Section 3' entry in the Web Site tree.

Right-click, and the context menu will open.

Select 'Delete', and then confirm when asked.

The Page would be returned to All Components for future re-use, however don't delete the Page - we will be needing it later in the example work-through

 Next - Let's see how to create an Input Form with email submission...

 


Below the line...

Advanced configuration advice

Types of Component:
There are many different types of component. Simple components are stand-alone, such as a Page, and other types of Components are intended to be embedded on a page to provide extended functionality: a Query is a good example. This 'Hello World' trial only uses a few components, just to keep things simple.

The structure and overall appearance of the website is controlled by the Layout Manager. The appearance of individual components is controlled by their own Behavior Editors.

The most basic components are the Page: a Page is a simple webpage, but whcih can also form branches to the site-tree. The body of a webpage is 'surrounded' by Layout. The Layout Elements control the main appearance of the site and the navigation.  Navigation is automatic in a neatComponents site - as the site is built the navigation will automatically create the links in the style you choose.

Layout Manager model:
The Manage Bank-tab enables the site owner to control or manage the components available to site builders. In a delegated environment this gives the owner control over what type and how many components can be used on the site. The Component Store contains an unlimited number of instances of the many components available within neatComponents. The website owner adds the components needed for site construction to the Component Bank. The website designer, can then use items in the Component Bank to build the Web Site.

Access to the 'Component Store' can be controlled by User Group Permissions. A system, or website, owner can prevent access by a User to the Store even if that User otherwise has edit control and access to the Layout Manager. The site owner can fill the Bank with a quantity of Components, and then when those are used up the designer would have to request more. This may be done for project management purposes or as a charging model when reselling websites.

View this page on your smartphoneView this page on your smartphone
A first app & walkthrough