Username Password
Bookmark and Share

Thingy and ThingyRecord

Thingy is WebGUI's point and click application builder. It allows you to easily build complex data forms without any programming knowledge. Thingy's possibilities are endless, and this chapter will give some examples of how you might use it.


In addition, Shop contains a SKU asset called ThingyRecord, which allows you to sell records in a Thing. Using ThingyRecord, you can build things like an online classifieds section where people can purchase a record, or classified ad, on your site. This example will be illustrated in this chapter.


Since ThingyRecord requires that you understand how to use Thingy first, both assets are covered here.



Thingy allows you to build complex web-based applications without any knowledge of Perl, HTML, CSS, or Javascript. Just point and click! Thingy is useful for building employee directories, contact lists, inventory databases and more.


Creating a Thingy is a multi-step process. First, you create the Thingy asset. Then, you add “things” inside the asset to develop the application you want. Multiple “things” can be created and cross referenced to link data stored within things to each other.


To create a Thingy:


  1. Click on Thingy in the New Content menu to open the Add/Edit Thingy screen.



  1. Give the Thingy a title in the “Title” field.

  2. The menu title is the title of this Thingy asset as it appears in the site navigation. If left blank, the title entered in the “Title” field will be used; otherwise, specify a different menu title here.

  3. The URL is the URL of this specific asset. You can specify a URL, or you can leave it blank and WebGUI will make one for you.

  4. The “Description” field can be used to enter content that will display as static content on the page to the application user. This can be something that describes the purpose of the application you are building, or provides instructions for how to use it.

  5. Set display settings in the Display tab.


    1. Hide from navigation?: if set to Yes, this asset will be hidden in the site's navigation.

    2. Open in new window?: if set to yes, this asset will open in a new browser window when independently viewed.

    3. Display the title?: if set to No, the title of this asset will not appear on the page.

    4. Style Template: this is a style that the asset is displayed in; if the asset is viewed on a container asset, such as a page layout or folder, the container asset's style will override this.

    5. Printable Style: the template used for the printable version of this asset.

    6. Thingy Template: the template that is used for this specific asset.

    7. Default Thing: the thing that is displayed by default upon entering the application. This can be a screen for entering data, or for searching existing data. This field will remain empty until you create things, so may need to come back and edit it later.

7. The Security tab contains the standard security settings. You can select an Owner of the asset, and select the group to edit and group to view.

8. The Metadata tab is the standard Metadata screen common amongst all assets. If you need to handle metadata for the purposes of content profiling you can do so here.

9. Click save to create a Thingy asset.



Upon initially creating the Thingy asset, two options will appear. To create a thing(s) within this asset, click on the Add Thing link below the asset title. To create an application, you need to create a series of things from which the application is built. A thing can be anything from a simple text field, to an entire contact form, to something containing assets and templates... the sky is the limit. Once you have created these things, you can then manage them.


The “Back to Thingy default view” link will return you to the default view of this Thingy asset, based on the Default Thing field in the Thingy's Display tab.


Add Things

Things need to be added to the Thingy asset. These are the “things” from which your web application is built. The type of thing(s) you build is completely dependent upon the purpose of your application.


  1. Click the Add Thing link located below the Thingy asset's title. This will open the Edit/Add Thing screen. The Fields tab is the default view of this screen, and is where you create the fields the user will see and, if necessary, complete. Once a Thingy asset is populated with things, it may be necessary to enter the Manage Things screen in order to access the Add Thing link.

  2. Give this thing a title in the “Thing Name” field.

  3. Click on the Add Field button to begin adding fields to this thing. In this example, a form is being made to collect employee contact information, so information such as employee name, email address, and telephone number need to be included.

  4. Upon clicking on the Add Field button, the Add Field screen will pop up. On this screen you configure the field you are adding.

    1. The “Label” field is the label for this field as the user is going to see it displayed on the page.

    2. From the dropdown menu, select the “Field Type,” which is the form element for this field. It will also be used to validate that the user has input the correct type of data if necessary. This is a lengthy list, so be sure to look it over before selecting. Some of the selections are unique, such as the ability to select an asset or workflow. Once other things are created, you will find that they will appear in this list as well. In this way, things can be contained within other things and data can be cross referenced.


    1. For any type of field in which the user is making a selection, such as Yes/No or select box, enter the default value for the field in the “Default Value” field. For example, if you want a Yes/No field to be set to Yes by default, enter Yes in this field. If you select a field type such as Select Box, Select List or Radio List you will need to enter the possible values.

You can fill in the “Possible Values” field in a normal manner, such as:


50 Percent

Full Amount


Or, you can do key/value pairs:


50|50 Percent

100|Full Amount


An example of this using hex color codes would look like:




You can also do the value/label pairs like this:

0|American Indian/Alaskan Native


2|Black or African American

3|Native Hawaiian/Other Pacific Islander


5|American Indian/Alaskan Native and White

6|Asian and White

7|Black/African American and White

When using key/value pairs, the first value (before the pipe) is what gets stored in the database, but the second value (after the pipe) is what gets displayed to the user.

    1. Content entered in the “Pre-text” field will be displayed above/before the field. It is useful for providing instructions to the user about what should be entered.

    2. The “Subtext” field is an extension of the label. You can use this to give additional information or direction for what should be entered in the field you are creating. This text will appear under/after the field.

    3. Set the “Status” of this field:



  • Hidden: hidden fields are not visible to the user. Make sure you enter a default value for this field.

  • Visible: can be seen by the user, but not modified. Make sure you enter a default value for this field.

  • Editable: can be seen by the user and can be filled out by the user.

  • Required: must be filled out by the user.

G. The “Size” field allows you to set the width of the field by indicating how many characters this field would contain on average.

H. The “Possible values” field is used for list types. Enter the values you want to appear, one per line. If you want a different label, other than the value entered in this field, the possible values list should be formatted as







Make sure you use the braced, quotes etc. Simply replace “key1” and “value1” with your own name/value pairs.

I. The “Extras” field is available to enter additional tag properties for the field tag. For example, 'class=”myClass”'.

J. When all fields are complete, click the Submit button.



The field will appear on the Edit/Add Thing screen, and it will have buttons to either edit, delete or copy. Click the Add Field button to continue adding fields for this thing.



  1. The Edit Screen tab allows you to customize the appearance of the edit screen for this thing.

    1. Give the edit screen a title in the “Edit screen title” field.

    2. The “Instructions” field can be used to enter instructions for users using this screen.

    3. In the “Max entries per user” field indicate the maximum number of entries, of this thing, a user can add.

    4. The “Who can add?” field allows you to select the group of users who are allowed to add this thing.

    5. The “Who can edit?” field allows you to determine the group of users who will be allowed to use this edit screen.

    6. The “Save Button Label” allows you to determine what the form submit button should say; this is the label that users will see on the screen.

    7. The “After Save” field allows you to select the screen shown to the user after saving/submitting this thing.

    8. The “Edit Template” is the template used for this edit screen.

    9. The On Add, On Edit, and On Delete fields allow you to select a workflow to be triggered once each of these actions takes place. For example, upon adding a new employee, you may want to trigger a workflow that automatically emails a colleague alerting him/her of this action.

  1. The View Screen tab allows you to customize the view of records contained in this thing. This is the form used to display the information that is input in the Edit Screen for this thing. So, if a user performs a search in this thing, this is the screen used to display/view data related to a specific search result.

    1. The “Who can view?” field allows you to select the group of users allowed to view this thing.

    2. The “View Template” is the template used to display this thing.

    3. The “Default View” field allows you to select the default view of this thing. You can select Search or Add Thing. This is the screen users will see upon entering the application.

    4. The Fields area allows you to select which fields (created in the Fields tab by you) you want displayed in the default view of this thing. The “View Screen Title” will concentrate all the fields that you select into a list, with each field labels separated by a comma. It will then place that string into a template variable called viewScreenTitle that is available on the view screen.

7. The Search Screen tab allows you to customize the criteria by which this thing can be searched.


    1. Give the search screen a title in the “Search Screen Title” field.

    2. In the “Description” field you can enter information or instructions regarding this search screen.

    3. The “Who can search?” field allows you to select the group of users allowed to search this thing.

    4. The “Who can import?” field allows you to select the group of users allowed to import data from an external database into this thing.

    5. The “Who can export?” field allows you to select the group of users allowed to export data from this thing to an external database.

    6. If “Export meta data?” is set to Yes, metadata fields will be included in the export (thingDataId, lastUpdated, ipAddress etc).

    7. The “Search Template” is the template used to display the search screen for this thing.

    8. The “Things Per Page” field allows you to determine how many things will be displayed on the page in the search results before pagination.

    9. The “Fields” field allows you to select what fields users are allowed to search this thing by, and what fields will be displayed in the search results for this thing. It also allows you to determine the criteria by which search results will be organized.

8. When all tabs of the Edit/Add Thing screen are complete, click the save button at the top of the screen to save your new thing. Click Add Thing to create a new thing and repeat the steps above until you have created as many things as necessary.


Upon entering the Thingy asset, users will see the screen that you set as the default. In this example, the Search screen for this thing.



Users with the appropriate privileges will also see some additional links. These will differ among users depending upon individual privileges, and depending upon the things you have built.



  • Manage Things: takes you to a screen on which all things contained within the Thingy asset are displayed. Each thing has an asset toolbar from which to manage it. Also in this screen is a link from which additional things can be added. This is the Add Thing link located below this screen's title.



  • Import: allows you to import data into the thing.



The user can browse his/her workstation and upload a .csv file. The fields near the bottom of this screen are the fields contained in this thing, and the user may designate which fields are included in the data being imported, and determine what to do with duplicate data.

  • After a search a link will be made available from which to export data contained in this thing. Clicking this link will generate a csv file for download.

  • A link is also available to direct users to the edit screen for this thing; in this example, the Add/Edit Employee Contact Info screen.

  • The the right of these links is a faded dropdown menu. You can use this dropdown menu to select a different thing to view.

In this example, users can perform a search upon entering the application.



If data needs to be input, the user can select the “Add Employee Contact Information” link from the links at the top. This will open the Edit Employee Contact Info screen.



In this screen users can add an employee to the database. Fields with an asterisk are required. Upon saving, the user is directed back to the default thing, which in this case is the search.


To perform a search, users simply enter search criteria in the available search fields. The search is a limiting search. Leaving the search fields blank and clicking on Search will return all data, in this case all employees, by default. Searching for last name Doe will return all users with the last name Doe; results will be further limited if a first name is included. Search returns will be displayed directly below the search fields.



Search results will be sorted by the criteria designated when the search screen was configured for this thing, in this case, alphabetical. To sort by other criteria, such as first name or telephone number, click on the title of that column. Each search result has a red X by which a result can be deleted. The user will be prompted to confirm that this delete should take place. Each result also has an edit button. Clicking on the edit button will direct the user to the edit screen for this thing; in this example, the Edit Employee Contact Info screen. The Copy button will allow an individual record to be copied.


Clicking on the matching search criteria of a specific result, in this case the last name Doe, will open the view screen displaying just that result's data.



Rearrange Fields in a Thing

The field display order within a Thing is easily rearranged. While in the Edit/Add Thing screen, simply grab a field with your mouse, drag it to a new position, and drop it in place. In the image below, the Department field is being moved.




Here are some samples to give you some ideas. These are fairly simple examples, so you will want to take your organization's specific needs into consideration and experiment to see what best meets those needs.



Try using Thingy for a rolodex type of application. In this example, two things were added to the Thingy asset: one to enter organizations, and one to enter members of organizations. The two things were then cross-linked so when an organization is added a member may be selected as that organization's contact, and when a member is created, s/he may be added to an existing organization.


First Thing: Organizations

The Fields tab contains the basic contact information for the organization. The Organization Manager field is populated by selecting a person from the Organization Members database (next Thing in the Thingy asset). The Organization Manager field was created by selecting the Organization Members thing for the field type.



This thing can be searched by organization name.


Second Thing: Organization Members

The Organization Members Fields tab contains members' contact information and organization affiliation. The Member Organization field was created by selecting the Organizations thing as the field type.



This thing was then configured to be searched by either the member's name and/or organization.



The Add/Edit Organization screen contains the contact information for the organization, and the Organization Manager field contains a dropdown menu of organization members from which to choose the manager.



The Organizations search screen displays a field to search for the organization you wish to find. In the example, Organization 1 was searched for. The search results display the organization's name, address, telephone number, and organization manager.



The Organization Members thing contains a screen in which to Add/Edit Members.



This screen allows new members to be added to the database and existing members' information to be edited. Included in this screen is the Member Organization dropdown menu, which allows each member in the system to be affiliated with the organization s/he is a member of. This field is populated with the organizations created in the Organizations thing. At the bottom is a field that indicates if this member is the organization manager.


The Search Members screen allows you to search each organization separately by making a selection from the organization dropdown menu, or to search for a specific member within a specific organization. In the example below, the name field was left blank, and the Member Organization field was set to Organization 1. So, all members from Organization 1 are returned.



The results list all members in Organization 1. In the Organization Manager? field at the far right you can see that JD Brown is the manager of Organization 1. Each search result has a red X, by which to delete a member, and an Edit button by which to edit a member's information. Clicking on a member's name directs you to that member's full information.



Because JD Brown is a member of Organization 1, you can see the Member Organization field contains a hyperlink to Organization 1. Clicking on this link directs you to the view screen for Organization 1, below, in which you will see JD Brown listed as the manager, and a link back to his information.



Inventory Manager

Consider using Thingy to keep track of product inventory and vendors. Link the two together so you can can access vendor information directly from a specific product's information.

First Thing: Vendor Information



A thing was created to store vendor information. Using this form, users can input information, such as contact information and account numbers, for their product vendors.



This thing allows users to search the vendor database by vendor name or by account number.



Second Thing: Product Inventory

Then, another thing was created to keep track of types of products, and the number of a product in stock. The Vendor thing was selected as the field type of the Vendor field. So, each product entered can be associated with a vendor that exists in the vendor database.



This is what the the Add/Edit Product screen looks like. Each product can have a vendor associated with it from the Vendor dropdown menu.



For search purposes, products can be searched according to product name or vendor.



In this example, baseball caps supplied by Vendor 2 was searched.



The search results indicate that 55 baseball caps remain in stock. To edit the number of caps, the edit button next to the product name, Baseball Caps, can be clicked to be directed to the Add/Edit Product screen for baseball caps. If more caps need to be ordered, clicking on the product name, Baseball Caps, will direct the user to the view screen.



The view screen contains a link to Vendor 2, the vendor for this particular product. Clicking on the Vendor will direct you to the view screen, which contains full vendor contact information as entered in the Vendor Information thing.



Or, the user can search for all products by a given vendor by leaving the Product Name search field blank, and selecting the desired vendor from the Vendor dropdown menu. In this example, Vendor 1 was selected, and all products associated with Vendor 1 are returned.



To access vendor information directly, users can search the vendor thing by vendor name or account number. In the example below, Vendor 2 was entered in the Search field.



Using the edit button, information regarding this vendor can be altered. Clicking on the vendor name will direct the user to the view screen for that vendor.



Tracking Equipment

Try using Thingy as a tracking system for IT equipment that is checked out to employees. In this simple example, two things are added to the Thingy asset: one to enter IT equipment, and one to enter employees checking out this equipment. The two things are then cross-linked, so when an employee checks out IT equipment his or her name attaches to that item.


First Thing: Employee Data



A thing is created to store employee data. Using this form, users can input employee data, including last name, first name, email address, and phone number.



The search screen for this thing allows users to search the employee database by an employee's last name or email address.



Second Thing: Equipment Data

Then, another thing is created to store equipment data. The Employee Data thing is selected as the field type of the Employee Email Address field. So, each piece of equipment entered can be associated with an employee that exists in the employee database. Because some employees might have a common last name, the field chosen from the Employee Data thing is selected as the Email Address field.



This is what the Add/Edit Equipment screen looks like. Each piece of equipment can have an employee associated with it from the Employee Email Address dropdown menu. An employee may be associated with more than one piece of equipment, but a piece of equipment may only be checked out to one person at a time.



For search purposes, equipment can be searched by name using search terms such as “camera,” “scanner,” “phone,” or “computer.”



In this example, the term “camera” was searched.



The search results indicate that Camera 1 and Camera 2 are not checked out, while Camera 3 is associated with the email address To view more information about this, click the link to Camera 3.



The view screen contains a link to, the employee email address associated with Camera 3. Users can email the employee directly based on this screen, or click the email address for more information about this employee, including his last name, first name, and phone number as entered in the Employee Data thing.



ThingyRecord links WebGUI's Thingy asset with WebGUI Shop. It allows you to sell a record inside a Thing. This allows users to build things like an online classifieds system. A Thing inside a Thingy asset is built to house data. Then, a ThingyRecord is built, and in ThingyRecord you indicate the fields you want users to fill out. Once they complete those fields, they purchase the record. Upon doing so, the data they provided appears in the Thing.


In this example, an online classifieds system will be built. Before beginning, make sure that WebGUI Shop is set up and configured for your site.


To begin, a Thingy asset to house the classifieds system was created. In the Thingy and Thing was built for the classifieds category “Merchandise”. Additional Things could be created for other classifieds categories such as “Pets” or “Real Estate.”


In the Merchandise Thing, the basic fields for a classifieds ad were created.



The Default view of the Thing is the Search screen, and it has been set to allow site visitors to search by item name, which is the the “For Sale” field.


Once the Thing has been created, the ThingyRecord can be created to allow people to advertise their merchandise in your classifieds ad system. You can use ThingyRecord to charge a cost for placing the ad.


To create a ThingyRecord asset:

  1. Navigate to the page you wish to place ThingyRecord on.

  2. Select ThingyRecord from the New Content menu. The “Add/Edit Thingy Record” screen will open.



  1. Enter a title for the ThingyRecord in the “Title” field.

  2. If necessary, enter a different Menu Title. This is the ThingyRecord title for the site navigation. By default, this asset is hidden from the navigation.

  3. The URL field can be left blank, or you can enter one.

  4. In the Description field enter text related to this item of content. In this example a brief description of the purpose of the asset has been entered.

  5. Below the Description field is the “Add to Thing” drop down menu. From this menu you can select the Thing whose fields you are using in ThingyRecord. In this example, the Merchandise thing from the Classifieds Thingy was selected.



  1. The “Fields to Add” field lists the fields the Thing (selected in number 7) contains. Select the fields you want users to complete when purchasing a ThingyRecord. In this example, users must complete all four fields for their classifieds ad when purchasing the ad, so all fields have been selected.



  1. The “Thank You Message” field displays the thank you message people will see upon submitting the ThingyRecord. You can change this text. The ^ViewCart; macro is what displays a link that allows users to link to their shopping carts and pay for this record. You will most likely want to leave the macro in place.

  2. In the “Price” field, enter the amount that people will be charged for purchasing this ThingyRecord.



  1. The “Duration” field allows you to indicate how long the record will appear in the Thing. For example, if set to 1 Month, the person's classifieds ad will appear in the Merchandise Thing for one month.

  2. Set Display options in the Display tab. This is the standard Display tab.



  1. Set Security permissions in the Security tab. Again, this is the standard Security tab.



  1. If you wish to enter Metadata for this item, do so in the Metadata tab. The tab contains all the standard Metadata fields. In WebGUI Shop, you can dynamically pull in SKU assets for display on a Shelf using Keyword association. For example, I can enter a Keyword of Merchandise for a ThingyRecord asset. I can then create a Shelf asset in another location on the site. If I also give the Shelf asset a Keyword of Merchandise, the Shelf will pull in and display all ThingyRecord assets and other SKU assets that have that same keyword in their Metadata tabs.

  2. The Shop tab contains items related to WebGUI Shop commerce.


    1. “SKU” stands for Stock Keeping Unit. It is basically a special product code or inventory unit. WebGUI will create a unique SKU for you, or you can enter your own.

    2. “Vendor” is the person or company who gets credit for selling this item. Vendors are set up in the Admin Console Shop screen. This is used for sites where outside vendors sell items on your site and receive a portion of the sale.

    3. “Ships Separately?” allows you to indicate if this item should accrue additional (separate) shipping costs. In the case of ThingyRecord you can probably leave this field set to No.

    4. “Override tax rate?” allows you to override the default tax rate for an area. This is most often used in areas of the world where essential items, like food and clothing, are exempt from taxes. In the case of ThingyRecord you can probably leave this set to No.

    5. If “Override tax rate?” is set to Yes, “Tax Rate Override” is where you enter the new tax rate to calculate on this item.

16. Click the save button to create your ThingyRecord asset.



When site users visit the site they fill in the fields in the ThingyRecord. Then, they click the “Add to cart” button.



Upon submitting the form, the user will be shown (by default) a thank you message, the form with their data filled in, and a link to view their cart.



The user can click on the View Cart link to proceed to the shopping cart and finish the check out process.



Upon visiting the original Classifieds Thingy, users can search for items they would like to purchase.



If an item matches, it will appear in the search results. In the example below, you can see the classified ad purchased through ThingyRecord appears.


Keywords: cart classifieds data SKU Thingy ThingyRecord

5elnino: "COOL"
Search | Most Popular | Recent Changes | Wiki Home
© 2018 Plain Black Corporation | All Rights Reserved