Note
This guide is intended to help beginner/intermediate level users in gaining familiarity with the WebTML environment, and understanding how exactly this Content Management System works.
N00b Alert! Layout not Found (Probably Deleted)
An Intermediate Guide
To learn more about the WebTML development environment, feel free to download our entire Intermediate Concepts Guide down below:
What is a WebPart?
In WebTML, WebParts act as overall containers for the Items on the page. Adding a WebPart is very simple, and multiple WebParts can be added to a page as well. It is important to note that WebParts, can constantly be reused throughout a website on multiple pages. Having this feature can allow one to save a significant amount of time.
For instance, instead of having to re-create the same footer across multiple pages more than once. The user can simply just include the footer in WebPart1, now whenever he/she types "WebPart1" in their layout, the same footer will come along and can be reused.
Creating a WebPart is the absolute first step one must follow before they begin adding Items onto their page.
What is a Pre-Configured Item Set ?
Preconfigured Item Sets come by default immediately after the user creates a section. They are a powerful feature within the WebTML system which allow users to assign/create a layout for eventual Items that will be used within the section itself.
The easiest way to notice this is right after a section has been created. Oftentimes, the main button surrounding the section refers to the section itself; whereas, this button within refers to an Item Set located inside.
The naming convention for a pre-configured Item Set is very easy to understand/determine (as it is completely dependant upon the section’s name).
For instance, if a section on your page is has been named "Header”, then the preconfigured Item Set can be called by typing in ##Header##.
What Does it Mean to Nest an Item Set?
It is important to remember that more than one Item Set can be used inside of a section.Therefore, once the pro-configured Item Set has been used, a new one can still be created.
New Items Sets can always be created inside of existing Items. There is no limit as to how many Item Sets can be created or nested.
What are WebTML Apps?
WebTML includes a repository of apps that users can utilize to further enhance their site. Apps can be integrated with ease and provide further functionality to the site. Learn more about the available WebTML Apps Here.
As part of WebTML’s development environment, users have extensive flexibility and control in how they create, organize, and edit their pages and items. The management of these features is handled exclusively by the main control panel and the admin panel. Explore the functionalities available within the main WebTML Screens and Tabs below:
Explanation of the Screens and Tabs of the main webtml control panel can be found below:
Edit This Page Screen
The Edit This Page window provides users with the ability to configure the settings for the current page, and as well as add and edit content for that page.
There are a total of 4 Tabs within the Edit This Page Screen, called:
- Tab 1: Admin
- Tab 2: General
- Tab 3: SEO
- Tab 4: History
Admin Tab
Note
Under the Admin tab, users can set the properties of the current page.
Name:
The name of the current page
Web Address:
The web address for the current page. Users can assign a URL-friendly web address as opposed to the default that is generated based on the name of the page.
Parent :
Refers to the parent of the current page. Go to the Parents and Childs Section within the WebTML concepts page to learn more.
IsActive :
Determines whether if the page is active. Non-active pages will not appear on the site.
Page Layout :
The layout that is associated with the page.
SubList :
**(not sure about the purpose of this for pages...)
TmbSize :
**check for the meaning of this
Bul_class :
**check for the meaning of this
ShowInMenu:
**check for the meaning of this
General Tab
The General Tab allows users to utilize WebTML tags to turn certain elements and content found within the Page Layout to be dynamic and editable.
Once the tags have been set, the values of those tags can be entered here. Some commonly used tags include Header, Image, and Body.
SEO Tab
The SEO tab allows users to add text to enhance their Search Engine Optimization when SEO-specific WebTML tags are included in the page layout.
History Tab
The History tab allows users to revert back to a previous version of the screen and the settings configured in each tab. Any changes that were not saved will not be accessible through the History tab.
To access a previous, saved version of the Edit This Page screen:
- Step 1: Click on the Edit This Page button
- Step 2: Click on the History tab
- Step 3: Select the desired version to revert back to
- Step 4: Click Save and Close
After the page refreshes, the settings within the Edit This Page screen will be configured in the way that it was saved at a certain point during the development and/or editing process.
Edit Tables Tab
The Edit Tables screen provides a comprehensive view of all of the Items, Item Sets, pages, page layouts, products, and more of the website.
Using the Edit Tables window throughout the development process is essential, and will assist users in organizing and managing their sites’ component successfully.
Note
An extensive explanation of the Edit Tables window can be found in the Database Tables documentation.
Site Settings Screen
Site Settings offer users the ability to set and configure specific settings for their website.
Designer Tab
Note
the designer tab offers users the ability to alter the settings in which their site has been configured.
DOCTYPE:
Allows users to specify the DOCTYPE declaration for their pages
jQuery:
Sets the version of the jQuery that will be used on the site. The default jQuery version is always set to the most recent one. Through the drop-down, users can downgrade as they like.
Menu Type :
Determines the styling that the main navigation will use. Users can select from a range of pre-installed themes for navigations.
Disable Cache :
Provides the user with the choice (yes/no) of having the ability to clear cache on their page.
FrameWork :
Sets the Framework that the site will use. Selecting a Framework will import the Framework’s file, assets, and images into the development environment.
NavType :
Selects the appropriate navigation type depending on whether or not the website is a single page or a multi-page site.
Admin Tab
Note
The Admin tab provides a variety of different fields that users can utilize to add their company information. They can then, in turn, display the information by referencing the appropriate WebTML Tags
Copyrights:
Allows users to specify the copyright information for the site.
Company Name:
Enables users to enter their company name.
Slogan:
Provides users with the ability to enter a slogan for their site .
Slogan 2:
Provides users with the option to enter in a second slogan.
SiteColors:
Allows users to change the color scheme of their chosen template/framework.
Currency Sign:
*** Don't Know ***
Google_uacct:
Provides users with the ability to add their Google Analytics account to the site.
Google Tag Manager
Allows users to add their Google Tag Manager account to their site.
Paypal Business Name
Allows users to add their Paypal Business account to their site
ControlPanelType
Provides users with the option on how the admin control panel is displayed. The two options available are horizontal and radial.
Twitter
**don't know**
Facebook
**dont' know**
General Tab
Name:
Provides the option to fill in an identifiable name.
Phone:
Provides the user the ability to add their phone number to the site.
Note:
Allows for the user to write down any relevant comments/notes.
API_KEY:
Generates a unique API key for the site. This feature provides a security enhancement to protect against any potential compromises elicited by external parties
TimeStamp (20 mins times out):
The TimeStamp feature within WebTML indicates when the last API key was generated.
History Tab
The History Tab found in Site Settings enables users to revert back to a previous version of the site. Any changes that were not saved previously will not be accessible through the History tab.
Apps Tab
The Apps tab provides an overview of all the available WebTML apps that can be integrated into a website.
Note
For more information, see the documentation on WebTML Apps.
Site Settings Screen
All of the buttons mentioned below are correlated with (or can be found on) the Site Settings Screen.
Save and Close Button
The Save and Close button allows user to save their changes and have the page refresh automatically.
Save Button
The Save button allows users to save their changes. To see the changes live on the screen, the user will have to refresh the page manually.
Generate API Key Button
The Generate API Key button creates a new API key for the site. After every 20 minutes, the API Key times out, and must be be activated again for security reasons.
| To Generate an API Key:- Step 1: Click on the Site Settings button within the Main Control Panel
- Step 2: Under the General Tab, click on the "Generate API Key" button
When the page refreshes, a new API key will be created and displayed within the API_Key field. The time stamp field below it will also indicate when the API Key was generated. After 20 minutes, the API Key will be deactivated as a security measure. Repeat the steps above to activate the API key.
| To Revoke an API Key:- Step 1: Click on the Site Settings button within the Main Control Panel
- Step 2: Under the General tab, click "Revoke API Key" button
Show Timers Button
The Show Timers button provides an indication of the time it takes for the components on the site to render. This feature is particularly useful during the development and/or maintenance periods of the site.
Force Admin Button
If the Admin buttons are not added prior to closing or logging out of the development environment, the Admin buttons will disappear and users will have to click on Force Admin again to make them visible.
The Force Admin button allows users to make all the Admin buttons temporarily visible on the page.
Once the Admin buttons are visible, users can manually add the Admin button back to ensure that its features are always accessible.
Note
Forcing Admin may cause a website to look broken. This is due to how this functionality actually disables all JavaScript code on the page.
The Admin Panel offers a similar set of features as the main control panel, with the exception that the features are specific to the Item Sets and items that the Admin button is associated with.
Edit Screen
Designer Tab
Parent Type:
Sets the type of parent for the current item. The parent can be another item, the current page, the current layout, or the view.
Item View:
Sets the layout of the item.
Admin Tab
Parent:
Sets the type of parent for the current item. The parent can be another item, the current page, the current layout, or the view.
Sublist:
Assigns a unique sublist number to the current item.
ShowInMenu:
Indicates if the current item will appear in the sitewide navigation.
General Tab
The General tabs enables users to set the values for the WebTML tags as defined in the item layout.
Edit Item Layout Screen
Name:
Refers to the name of the current item.
Animation:
Allows users to add animation effects to the Item Set. Commonly used by many modern templates, animation effects help introduce and display sections in a visually-appealing way.
Table_Name:
Indicates the source of the item, which is most often a database table or even an actual SQL query.
my_fields:
Defines all applicable WebTML tag values to bring them from the database to be displayed on the page. This field is designed to reduce overhead and increase efficiency.
Layout:
Contains the Item Set Layout, which in turn will be used for the Items within that (not sure about this one?)
Layout_Alt:
Contains the alternative layout for the Item Set. When there are multiple items present, the layout of each consecutive item will automatically alternate between what's defined in the Layout and LayoutAlt.
LayoutSingle:
Holds the Layout to be used when you click on an Item and a Single Item View is generated (not sure about the explanation for this one?)
JS:
Contains the JavaScript code required for the Item Set. Upon save, the code will be appended to the < head>< /head> tags of the page.
From Site: (not on screen)
Allows the user to pull Items from a different site.
From Page: (not on screen)
Allows the user to select a site of their choice and specify which page they'd like to pull certain Items from.
Edit Item Set Screen
The Edit Item Set Screen consists of a series of settings that can be used to the configure the properties and attributes of the Item Set.
ID:
Refers to the ID that is assigned to the Item Set by WebTML.
Name:
Refers to the name of the Item Set.
Item Layout:
Associates the Item Set with a specific Item Layout.
Page Layout Single:
The Layout for the expanded version of an Item Set that uses the same Page Layout.
Layout:
Contains the Item Set Layout, which in turn will be used for the Items within that (not sure about this one?)
Filter By:
Returns only items associated with a specific source, such as: current, parents, specific page, as set in the condition field. Learn more about filter By for Item Sets here.
Condition:
Offers a drop-down selection of the method used to retrieve items. Users can select from page, item, layout, and view.
Sublist:
Assigns a sublist value to an Item Set. Each Item Set must have it's own unique sublist number. Learn more about sublists here.
Item Count:
Allows the user to alter/set the total number of items that the page can bring.
Itemsperpage:
Determines the number of items that will appear on each page.
Order By:
Indicates to the WebTML database how Item Sets should be ordered. Options include the order that the Items were created or by their ID's.
OrderByType:
Determines if the items should be defined in an ascending or descending order.
IsAjaxCall:
Determines which items will load by an Ajax call once the current page loads.
PageID:
Displays the ID value of the page.
Dir:
Allows users to bypass the default image directory.
Icon:
Select from a drop-down list of Canvas Icons included in WebTML.
IconColor:
Allows the user to assign different colors to their chosen icon.
Launch Your . . .
Premium Website with WebTML
Need a Website?
Get a custom, secure, and easy-to-use website today from Web on Demand. Our advanced WebTML Content Management System (CMS) provides elegant and intuitive web solutions to meet your growing business needs.
- Web Design
- Search Engine Optimization
- Templates
- E-Commerce
- Website Upgrade Plan
- Domain Name Registration
- Access to Site Statistics
- Protected Access to Our CMS
- Extensive documentation
- Video tutorials
