After installing In-edit, the new category called “Content” is created in the root category. This category is meant to hold the content pages of your website be default. The Catalog & Advanced view section of the administrative console will be also enhanced with ‘Pages’ tab, listing the content pages similar to ‘Links’ tab is displaying links or ‘Products’ tab – products.

You may start by entering the ‘Content’ category in the Catalog section, switching to ‘Pages’ tab and clicking ‘New Page’ button in the toolbar to create your first content page.

 

The add/edit page form will open. The form has the following fields:

• Title (HTML <title>) – page title used for HTML <title> tag in
• Title (On page) – page title displayed on the page, Title (HTML <title>) will be used if left blank
• Title (Menu Item) – page title used for menu items linking to this page, Title (HTML <title>) will be used if left blank
• Path – the path or filename of the page, may include directory, for example “company/about-us”, should not include file extension
• Template (design) – the template used for rendering the page
• Online Form – the drop-down with online forms for associating the content page with the form. The corresponding (form) Template should be selected above the online form to display on the page
• Online Form Submitted Template – the path of page displayed after successful submission of the online form
• Is Index page – if set to on, the page will be default page for current category
• Use Category Title for Menu – if set to on, the category title will be used for menu item
• Display in menu – controls if the page should be displayed in site menu
• Status – current status of the page, disabled & pending pages cannot be accessed from the front end
• Meta Description – the meta description of the page, published on the page and used by search engines
• Meta Keywords – the meta keywords describing the page, published on the page and used by search engines
• Priority – controls page priority (ordering) in the site menu

Fill in the Title field, the Path field and select ‘general’ template in the Template (design) field and save the page. Now you may click on the link in the ‘Path’ column of the grid to view your newly created page.

You should notice the “Edit Page” button in the upper left corner of the page. This button opens the page add/edit form which you have used to create the page. In the content area of the page you should see the “Edit” button. Clicking the button opens the content block edit form which has only one field – the “Content”. You may type the content of the page directly into the textarea or click Edit icon on the left of the textare to open the visual content editor. Once you’ve done editing the content, click Save and you will instantly see the content on the page.

 

Default Design Templates

In-edit comes with two design templates which may be used for creating content pages.

• ‘General’ – this design basically copies the index page except for the center column, which is replaced by the editable content area
• ‘Content’ – this design is  a two-column page with the left column displaying the automatically generated sub-menu and the right column used for the editable content area
• ‘Form’ – this design is based on the ‘Content’ design above, but it displays the online form on the page as well as editable content blocks before and after the form

Linking to In-edit content pages

You may check out the page on the front end of the site by opening a separate browser window and going to www.yoursite.com/company/about-us.html (in case you have mod_rewrite enabled), or www.yoursite.com/index.php?env=-company/about-us (if mod_rewrite is disabled).

 

Ok, now it’s time to create a link to the newly created page from one of the templates. To do so, simply locate the place you would like to place a link to the page and paste the following code:

 

<a href=”<inp2:m_link template=”company/about-us”/>”>Go to the content page</a>

 

Browse to the template you have created the link on, and you should see that the <inp2:m_link ../> tag has created correct URL.  

Creating custom content blocks on other templates.

But what if you want to put an editable content block on already existing page, for example your site home page. This can be easily done with In-edit.

 

Open the index.tpl template and locate a place where you would like the editable content to be displayed and place the following tag:

 

<inp2:m_include template=”in-edit/blocks/content”/>

 

The in-edit/blocks/content.tpl template you have just included consists of the necessary tags to display block title and editable content. You may explore this template and customize it to match your requirements, or better create a copy of it and customize the copy. 

 

Browsing in edit mode

Now, when you have added an editable content block and link to a separate content page you your website, you may use the powerful administrative mode browsing feature to visually edit your website content.

Navigate to the In-edit -> Browse Pages section of the administrative console. The front end of your website will be opened in the content frame on the right. You should see the ‘Edit’ button in place of the editable block you have placed. Clicking the button brings the content block edit form described above.

By default, the editable block contains the page title. It may be also edited by clicking the ‘Edit Page’ button in the upper left corner of the screen.

 

Integrating the site menu

In-edit is capable of displaying site menus. To integrate this feature you would need to make simple adjustments to the template of theme you are currently using.

 

By default, In-edit generates the menu starting from the “Content” category. To build the menu the system first locates the Pages in the category with “Display in menu” set to on.

Then it locates the direct sub-categories and looks for the pages inside those categories with “Is Index Page” set to on.

If a sub-category has no page marked as index page inside, the system still counts the category as menu item and uses the category default template as the link for the menu item.

If you don’t want the category default template to be used, you may specify custom template on the Properties tab of category edit, in the ‘Category Menu Link’ field. For example if one of the first-level categories does an index page, but rather has only number of subcategories with index page, you may specify one of these subcategory index page template as the category menu link.

If a sub-category has an index page inside the system targets the menu item for this index page. The process happens recursively for every level of the content categories structure.

This way of generating the menu allows flexible structuring of the website and easy configuring of the menu.

 

In-edit also comes with built-in dynamic menu script, which makes it easy to navigate the content pages of your website. The dynamic menu script which comes with In-edit is easy to customize. You may adjust the styles and effects of the menu. The menu styles information (CSS) file is located under in-edit/dmenu/nlsmenu.css. The In-portal template for generating the sub-menus is located under in-edit/dmenu/menu.js.tpl. Please note that this template is a template of JavaScript code, not HTML. You can find more information on customizing dynamic menu look here: http://www.addobject.com/nlsmenudemo/docs/styles.htm

 

Creating Online Forms

In-edit allows creating online forms easily. To create a form, navigate to the In-edit -> Forms section. The section lists all created online forms. The toolbar of the section contains the buttons to create new form, edit selected and delete selected. Click on the ‘New Form’ button in the toolbar. This will bring the form add/edit page.

 

Form add/edit page consist of ‘General’ and ‘Fields’ tabs. The ‘General’ tab contains the following fields:

• Title – form title, this title is used through the administrative console and is also used in default e-mail events, for referencing the form
• Description – internal description of the form

Fill in the fields and switch to the ‘Fields’ tab.

 

The ‘Fields’ tab lists the fields of the form. The toolbar of the ‘Fields’ tab has the following buttons:

• Save – saves the form
• Cancel – cancel the changes and returns to the forms list
• New Form Field – creates new field in the current form
• Edit – opens edit form of selected field
• Delete – deletes selected fields of the form
• Move up/down – alters the priority of the fields in the form

To create the form fields click the ‘New Form Field’ button. The button will open the form field add/edit form.

The Form Field add/edit form contains the following fields:

• Field name – internal field name
• Field label – the language label used on the front end for displaying the field prompt. You may enter the language label name here and create the language label for every language in use through Configuration -> Regional section. If your site is not multilingual and you are not planning on adding more languages, you may simply enter the field prompt directly by prefixing it with + sign, for example you may enter “+Your Name” or “form_YourName” and create a corresponding language label
• Field prompt – same as Field label, but used on the administrative console, you may also enter language label name or direct value prefixed by + sign into this field. In most of cases this field will be equals to Field label
• Input type – drop down for selecting the input type of the field. This option defines how the field will look like on the form. The Drop-down and Radio buttons types requires entering List of Values (see below)
• Validation – this option controls how the entered value should be validated. Currently it supports only e-mail address validation.
• List of Values – in combination with Drop-down and Radio button input types this field is used for listing the possible values of the field. The field accepts comma-separated pairs of key=value, where key is the internal reference of the value and the value is the value name, presented in the drop-down or next to the radio button, accordingly. The value is interpreted as a language label, unless it starts with + sign. For example, if your form should ask for a day of week, you may enter the following list of values:
  
  1=+Sunday,2=+Monday,3=+Tuesday,4=+Wednesday,5=+Thursday,6=+Friday,7=+Saturday
  
  If you would like the first option to be empty (for the drop-down type), simply start the list with “=+,”
  This field is also used with Textarea input type for specifying textarea options. For example, you may specify:
        cols=”60” rows=”5”
  for the textarea to be 60-characters wide and have 5 lines.
• Default value – the value of the field, pre-populated when user opens the form. For the fields with list of values, this field should containt the key part of key=value pair.
• Priority – the priority or the display order of the field on the form.
• Required – controls if the field is required to fill in for submitting the form
• Display in grid – controls if the field should be displayed in the form submissions list, or only when viewing single submission details
• Is System – if set to on, the field will not be displayed on the front end. Make sure not to set the system field as required, because in such case the form can’t be submitted on the front end

When you are done filling in the fields click ‘Save’ button in the toolbar to create the form field. Create all the fields you form should have and organize the fields order by using ‘Move up/down’ buttons on the fields list. Click ‘Save’ button on the fields list to finish editing the form.

After saving the form the administrative console tree is refreshed and the In-edit -> Submissions section is updated. The Submissions section contains a separate sub-section for every form created in the system.

 

Now when you have created the form, you have to create a page where the form will be displayed. Follow regular instruction on creating content pages above, but make sure to set the ‘Template (design)’ field of the page to ‘(form)’, and select the form in the ‘Online Form’ drop-down when creating the page.

Also, fill-in the ‘Online Form Submitted Template’ field. You may enter the path to the already existing content page or not yet created page. If the page does not yet exist, it will be automatically created when you successfully submit your form in administrative mode for the first time. You may edit the contents of this page afterwards.

After creating the content page, click on its path in the list to open the page in administrative mode. Fill in the form with test data and submit it. You should be redirected to the form submitted template. Edit the title and contents of this page as usual. Make sure to click ‘Edit Page’ button on this page, and set the page status to ‘Active’, otherwise it will be displayed as ‘Not found’ on the front-end.

 

To see the submission results, navigate to In-edit -> Submissions -> You form name. The section display the lists of form submissions. The columns in the list depends on the form fields you have selected to be displayed in the grid. The only columns constantly displayed on the submissions list are ID (form submission number) and Submitted On (date/time). Double click the form submission to view all the form fields in details.