Dynamic Content Docs

The Dynamic Content Suite brings full CRUD (Create Read Update Delete) editing capability to all your website content and loads all content dynamically. Plus a ton of additional functionality.


Go DYNAMIC w/ The Dynamic Content Suite

(Formerly EasyDB)

• Credentials Setup (v3.0.1) easily sets up access to your database along with Dynamic Content user credentials.

• Database Setup (v3.0.1) allows you to create a database table and fields without ever having to use complicated 3rd party tools or touch code.

• Login Setup (v3.0.1) provides secure access to easily edit your content.

• Grid (v3.0.2) allows you to layout content in a tight 'table-like' array with redesigned filter controls (NEW) and custom date pickers (NEW)

• Layout Setup (v3.0.1) allows you to layout a single set of content anywhere on the page and uses page navigation to view unlimited pages.

• Layout Pro Setup (v3.0.1) allows you to layout multiple sets of content anywhere on the page and uses page navigation to view unlimited pages.

• Layout (v3.0.0) allows you to layout a single set of content anywhere on the page.

• Layout Pro (v3.0.0) addon that allows you to layout unlimited sets of content anywhere on the page, create user roles for record & field permissions, inline editing of all content, auto image/file uploader & link creation, preset filter settings, field macros to move content into other stacks, redesigned filter controls (NEW), filter value dropdowns (NEW), custom preset filter buttons (NEW), custom date pickers (NEW), dynamic field conditionals (NEW) and support for shopping cart store layouts using Vibracart Pro (NEW).

• Layout Pro Filter Buttons (NEW) (v3.0.1) provides setup of custom preset filter buttons for filtering dynamic content. Works with the newest Dynamic Content Suite.

• Backup (NEW) (v3.0.1) addon that allows you to securely run automatic backups of your content on your schedule and manage when old backups are removed.

Dynamic Content supports all modern desktop browsers, IE10+, iOS & Android.

Feature Comparison

Layout
Grid
Layout Pro
Dynamic Content Suite
Main Suite
Main Suite
Addon
RW: 6/7/8/Classic, Stacks: 3.5/4/5, 'vanilla' MySQL & MariaDB databases, PHP: 5.6+/7+/8+
Supports Modern Browsers, IE10+, iOS & Android
Table Layout
Unrestricted Content Layout
Page Navigation: Next & Previous Buttons
Page Navigation: Page Buttons/Start/End
Wrapping Tags/Characters
Field Types: Text/Integer/ Floating/Date/Time/ Money/Email/Image/Link
Integer Replacement
Custom Field Formats: Checkbox/Color/Rating/ Progress Bar
Content Styling
Content Editing w/ Login: Add/Edit/Delete Records
In-Line Editing of All Displayed Content
Input Validation
Data File Import/Export
Responsive/ Mobile Support
Language Support
Setup Help Alerts & Built-In Docs
Content Filtering/Sorting
Multiple Filters
Preset Filter Controls: Field/Filter/Value/Sort
Field Exclusion in Filter Dropdowns
Detail Page Support
Move Content (Macros) into 3rd Party Stacks
Field Hide Controls: When Read Only/Non Editable
Auto Image & File Uploading
Image & File Size Limits
On-line User Admin Panel
User Roles: Admin/User/Visitor
User Record Access: All Records/Only User's Records
Auto-Assign User Record Access
Manual-Assign User Record Access
User Field Permissions
On-line Edit Panel
New Fld. Default Text/Empty Fld. Text/Hidden Fld. Text
Text Cleanup: Sentence Spacing/Text Cleanup/ Word Count Limit
Automatic Hidden Content if Permissions Not Allowed
Key Toggle Visibility of Login Buttons & Admin Panels
Move: Filters/Page Navigation/Login/Logout
Custom Link/Image Paths
Preset Filter Buttons: Field/Filter/Value/Sort
Multiple Values/Tags in Filter Value Dropdown
Dropdown Filtering based on Parent Field
Support for Frameworks: Foundation / Foundry / Bootstrap
Date Picker for Date Fields
Lightbox Gallery Skins
Custom Scheduled Backup of Databases (Backup Addon)
Custom Blank/Hidden Images
Shop Integration: Vibracart Pro Addon (PayPal/Stripe)
Shop Field Types: Buy Button/Single Price/Quantity Price/Description/Image
Dynamic Conditionals: Calc, Sum, Avg, Count, Conditional Actions: Style Field/Div, Show/Hide Field/Div

Installation

If Updating from EasyDB to Dynamic Content: A number of different controls, field types and new functionalities have been added to the new versions. If you don't require the new functionality and your existing EasyDB site is working as desired, then it's recommended that you DO NOT UPDATE to the Dynamic Content stacks, instead wait till you are either ready to do a general overhall of your existing site or are working on a new site (which requires the purchasing of new Dynamic Content Suite licenses). Stacks can not be mixed between the two suites. If you still wish to update an existing EasyDB site to Dynamic Content, then please contact me to get the new Suite.

Note: Check and cycle all settings to make sure all settings are reset to the desired values, as some settings have changed.

It's recommended you place each of the new Dynamic Content stacks on the page (one at a time) & copy over all the info before deleting the old EasyDB stacks on the page. All newly-placed Dynamic Content stacks will need to have the two-step setup process run on each one. After completing setup, if so desired, all files on the server with 'easydb' in the name can be safely removed. EasyDB stacks in your Addons folder on your computer can also be removed as well.

Download the Files:
Upon downloading the zip file from your download email, unzip it by double-clicking on the zip file, which should create an DynamicContent folder next to the zip file.

If double-clicking the zip file causes Archive Utility error: Unable to expand: (Error 1 - Operation not permitted.)
First delete the zip as it may be corrupted and try downloading the zip file again from your download email.
If you still have problems: do a Get Info on the zip file by selecting it and pressing Command + I. The 'Open with' should be set to the Archive Utility.app. If not, change it, shut down and restart and try double-clicking the zip file again.

If it still doesn't work, then open Terminal from Applications/Utilities or you can use the Mac search (magnifier icon) at the top right of the menu bar and start typing Terminal. It will appear, click on it to open Terminal. In Terminal type unzip followed by a space; drag & drop the zip file onto the Terminal window and the name & path should be completed for you. Press enter/return and the file will be unzipped. If there are no errors, the unzipped DynamicContent folder should be in your Home folder (Users/Your name).

If Initially Installing Dynamic Content: Start up RapidWeaver and drag each stack onto the RapidWeaver icon in the dock. You should see a informational screen indicating that stack will be installed. After you have installed all the stacks, quit RapidWeaver and then restart RapidWeaver. Since the Dynamic Content suite is stacks, open up the main Stacks Library and in the search input type 'Dynamic Content'. A list of all the Dynamic Content stacks will be shown.

If you have a previously installed Demo version: you will need to replace it with the paid version stacks. After you have placed the paid versions and copied all the settings to the paid versions, you can go the addons folder and delete the demo stacks: In the main menu, go to RapidWeaver > Manage Addons. Then select the Stacks tab and search for 'Dynamic Content' or 'EasyDB' (for older stacks) and then delete any stacks with "Demo" in the name. Any data that you have already created in a table will be available once the new stacks have been set up.

Page Setup Steps

Dynamic Content Logo
Explanation of how to set up any of the Dynamic Content stacks can be found in the dedicated documentation sections for each one or by viewing the initial release videos.

Note: Prior to setting up any of the general field display stacks, you will need to set up things in this order:

Login page:
Dynamic Content: Login Setup (ONE per project)
Note: Logging in is, by default, done through the login buttons on the main content pages. Logging in directly from the login page will not work, as it needs to know where to return the user to after verifying the login credentials. Optionally, if you enable 'Require Login' in Dynamic Content: Database Setup on the main content page, then it will auto redirect back to the login page & you will then login to see the main content page.

Main Dynamic Content Page:
Dynamic Content: Credentials Setup (ONE per project)
Dynamic Content: Database Setup
After setting up the above mentioned control stacks, setup either:
Dynamic Content: Grid OR Dynamic Content: Layout Setup OR Dynamic Content: Layout Pro Setup and place it below the other stacks mentioned above.
It's recommended you not wrap any of the above mentioned setup stacks in any framework wrapper, as that has been know to break general functionality.

If you are setting up one of the field layout stacks, then place as many as desired of:
Dynamic Content: Layout OR Dynamic Content: Layout Pro

Other Dynamic Content Pages: (opt)
Dynamic Content: Database Setup
After setting up Database Setup, add either:
Dynamic Content: Grid OR Dynamic Content: Layout Setup OR Dynamic Content: Layout Pro Setup and place it below Database Setup.
It's recommended you not wrap any of the above mentioned stacks in any framework wrapper, as that has been know to break general functionality.

If you are setting up one of the field layout stacks, then place as many as desired of:
Dynamic Content: Layout OR Dynamic Content: Layout Pro
If you are upgrading to Dynamic Content and have Dynamic Content detail pages set up, please update the detail pages first so the dcusers field is properly converted and don't click any image/links to the detail page until the detail page is totally updated.

Login Setup

Login Controls

Login Setup Controls Login Setup Panel

Dynamic Content: Login Setup allows you to add a login panel to allow editing of database content. This stack should be placed on a dedicated page by itself and there only needs to be one Login Setup per project. Other pages that contain dynamic content will have login buttons which will automatically redirect to this page.

This stack should be the first of the Dynamic Content suite to be setup !
The login page is a destination page when logging in, therefore, it's suggested that within RW, in the page's General setttings tab, disable 'Show in navigation'.

This section describes the login controls and includes 'Setup Login', 'Username Label', 'Password Label', 'Login Text', 'Width', 'Background' (color), 'Labels' (color), 'Inputs' (color), 'Login Text' (color), 'Login Border' (color), 'Label Size', 'Input Size', 'Label Shadow' (color), 'Text Shadow', 'Login Txt Size', 'Font', 'Use Google Font' and 'Google Wt' .

Setup Login: Enable to setup the login page.
Username Label: Enter the username label to display as a prompt for users.
Password Label: Enter the password label to display as a prompt for users.
Login Text: Enter the login button text.
Width: Select the percentage width of the form.
Background (color): Enter the background color for the form.
Labels (color): Enter the color for the labels.
Inputs (color): Enter the color for the input text.
Login Text (color): Enter the color for the login button text.
Login Border (color): Enter the color for the login button border.
Login Size: Set the login button text size.
Label Size: Set the label text size.
Input Size: Set the input text size.
Label Shadow (color): Enter the color for the label text shadow.
Text Shadow: Enter the label text shadow values for 'Hor', 'Vert' & 'Blur'.
Font: Set a web-safe font for the text.
Use Google Font: Enable to use a Google font for the text - Note: overrides Font.
Google Font: If used, enter name of Google font for the text (No quotes).
Google Wt: Only enter Google font weight for the login text if it's anything other than normal (400).

Login Alerts

This section explains the login alert text, button text and other miscellaneous text used in Login Setup. In the control panel to the right, you will see the button 'Login Alerts' and all alerts are displayed within it. If you and your site visitors read English, then these text controls don't have to be changed, but are available if you wish to change the text.

Note: If you are changing the text and wish to use single quote(') or double-quote(") characters in the text, then you must escape the quotes by placing a backspace character before them. Ex: l\’accès.

Credentials Setup

About

Credentials Setup

Dynamic Content: Credentials Setup allows you to setup credentials to allow a connection to your database and also to set permissions for users editing content.

Before attempting to set up permissions make sure you have setup a database on your server and assigned a user and password to that database. Setup of a database, database user and database password will vary, depending on your host. A general demonstration of doing this can be seen in 'Setting Up Your Database Credentials' in the videos section. These settings are what will be entered into 'Set/Upd DBCred' described further down. You do not need to set up a table or fields, as Dynamic Content will do that for you.

Please Note: The license for the suite and addons is per website and per 5 editing users. If you wish to use it on another site or add more editing users, then please purchase additional suite licenses.

Set/Upd DBCred

Set/Upd DBCred

The settings in this section are what you have setup on your server.

This section describes the controls that apply to database credentials and includes 'Set/Upd DBCred', 'DB Host Type', 'Custom URL', 'DB Name', 'DB Username' and 'DB Password'.

Set/Upd DBCred: Enable to setup/update the database credentials.
DB Host Type: Select the host type for the database as either 'Std. Localhost' or 'Custom'. 'Std. Localhost' is the default for most servers. 'Custom' would be used if the host has explicitly giving a url to connect to the database.
Custom URL: If Custom is selected, enter the custom URL for the database. Note: Add a colon and port number at the end, if needed, Ex. someurl.com:port
DB Name: Enter the name of the database. Note: Use lowercase, alpha-numeric, Underscore Ok. No spaces/single/dbl quotes.
DB Username: Enter the assigned username for the database. Note: Not Dynamic Content username. Use lowercase, alpha-numeric, Underscore Ok. No spaces/single/dbl quotes.
DB Password: Enter the assigned password for the database. Note: This password is for the database and Not a Dynamic Content user password, Use alpha-numeric, Underscore Ok. No spaces/single/dbl quotes.

Set/Upd UsrCred

Set/Upd UserCred Dynamic Content Users

The settings in this section will setup Dynamic Content users. It is recommended that these users be setup with completely different username/password settings for better security.

This section describes the controls that apply to dynamic content user credentials and includes 'Set/Upd UsrCred', 'Username', 'Password', 'Role', 'View', and 'Other Access'.

Set/Upd UsrCred: Enable to setup/update the dynamic content user credentials.
When 'Set/Upd UsrCred' is enabled, a section titled 'Dynamic Content Users' will display in the main edit window and one user will display by default. To add additional users, click the blue plus button to add more users. Clicking on a user will display the controls in the right stack panel. Settings for the user will be displayed in the main editing window for each user for your convenience.

Username: Enter a user's Dynamic Content username. Note: Use lowercase, alpha-numeric, Underscore Ok. No spaces/single/dbl quotes.
Password: Enter a user's Dynamic Content password. Note: Use alpha-numeric, Underscore Ok. No spaces/single/dbl quotes.
Role: Set the role for this user as either 'Admin' or 'Basic User'. 'Admin' will have access to all records. 'Basic User' will only have access to the records they create or records that they have been assigned access to.
View: Set whether the user can see all records or only their records, Note: Pro feature only.
Other Access: Enter other Dynamic Content usernames (Basic Users) who should have access to an Admin-created record when a Basic User in the online admin panel has 'View Only User Records'. Note: Pro feature only. Users separated by comma, no spaces.

Credentials Help

Credentials Help

Enable to show in-editor tips on Credential settings.

Credential Alerts

This section explains the credential alert text, button text and other miscellaneous text used in Credentials Setup. In the control panel to the right, you will see the button 'Credential Alerts' and all alerts are displayed within it. If you and your site visitors read English, then these text controls don't have to be changed, but are available if you wish to change the text.

Note: If you are changing the text and wish to use single quote(') or double-quote(") characters in the text, then you must escape the quotes by placing a backspace character before them. Ex: l\’accès.

Database Setup

About

Database Setup

Dynamic Content: Database Setup allows you to setup a table and fields within that table on your server, settup of login requirements for the page, as well as, updating max variables used.

Note: If an existing database is being used, Database Setup is still required to be setup and will not hurt the existing data. Please check to make sure the same field type are being used: Small Text: varchar(*), Large Text: text, Integer: int(11), Floating Number: double, Date: date, Time: time

Within the existing table on the server, a field named 'dcusers' w/ type of 'text' will need to be added immediately after the auto-increment id field. This field is used for permissions and is necessary for editing.

Setup/Upd DB

Database Fields Setup/Update Fields

The settings in this section describe the controls to setup the fields and includes 'Setup/Upd DB', 'Field Name', 'Rename This Field', 'Exist. Field Name', 'DELETE This Field', 'Field Type' and 'Character Length'.

Setup/Upd DB: Enable this button to setup/update the database fields.
When 'Setup/Upd DB' is enabled, a section titled 'Dynamic Content Database Fields' will display in the main edit window and one field will display by default. To add additional fields, click the blue plus button to add more fields.
Note: Each Field Type has a color-coordinated color and icon to make working w/ fields visually easy:
Medium Blue (A icon) for Small Text
Light Blue (¶ icon) for Large Text
Yellowish-Orange(1 icon) for Integer Number
Yellowish-Orange (1.0 icon) for Floating Number
Red ( icon) for Date
Pink ( icon) for Time

Clicking on a field will display the controls in the right stack panel. Settings for the field will be displayed in the field pane for your convenience and are listed below:

Field Name: Enter a field name. Note: Use alpha-numeric lowercase characters, Underscore Ok. No spaces/single/dbl quotes. No use of id.
Rename This Field: Enable if you are renaming this field. Note: Change field name in related display stacks.
Exist. Field Name: If using 'Rename This Field', enter the existing name for this field.
DELETE This Field: Enable to DELETE this field, Note: Will permanently DELETE the data for this field. You must leave the field in the Database Setup stack during the first-publish step, then before the second-publish step, disable 'DELETE This Field' and remove the field from the main edit window and then publish and visit the page.
Field Type: Select a field type as either:
'Small Text (999 char. max)' : field type: varchar(*)
'Large Text (65,535 char. max)' : field type: text
'Integer Number' : field type: int(11)
'Floating Number' : field type: double
'Date' : field type: date
'Time' : field type: time
See 'Database Help' for suggested field types for various use cases.
Character Length: Enter a character length for small text. See 'Database Help' > Character Length for suggested character lengths. Note: If the data in a field exceeds character length, then clipping of data or a server error may occur.

General DB Settings

General DB Settings

This section describes the general controls that apply to Database Setup and includes 'Connect Helper', 'Table Name', 'Require Login', 'Block Basic Users Editing', 'Change Max Variables' and 'Max to Use'.

Connect Helper: Enable this button to run the connection helper to display connection info & any errors.
Table Name: Enter the table name. Note: Use lowercase, alpha-numeric, Underscore Ok. No spaces/single/dbl quotes.
Require Login: Enable to redirect visitors to login page to allow access to the page. Note: Enable after setting up the Login page and after setting up any Dynamic Content stacks on the main page.
Block Basic Users Editing: Enable to prevent a logged-in basic user from editing content. Note: Enable after setting up the Login page.
Change Max Variables: Enable to update the max variable count allowed on the server. This update tool may be necessary if a large number of fields are being used and the server limit for variables is exceeded. Note: Enable Setup/Upd DB & then turn off on 2nd step of publish.
Max to Use: Enter the maximum variable count to use. Note: Enter a number. Must be higher than the 'Max Variable Count' manual calculation shown in the bottom-right corner of Database Setup when in setup mode.

Database Help

Database Help

Enable to show in-editor help on various Database Setup settings.

Database Alerts

This section explains the database alert text, button text and other miscellaneous text used in Database Setup. In the control panel to the right, you will see the button 'Database Alerts' and all alerts are displayed within it. If you and your site visitors read English, then these text controls don't have to be changed, but are available if you wish to change the text.

Note: If you are changing the text and wish to use single quote(') or double-quote(") characters in the text, then you must escape the quotes by placing a backspace character before them. Ex: l\’accès.

Grid

About

Grid

Dynamic Content: Grid allows you to layout the content in a very simple table-like style. Simple filter capability is available to find any content with ease. Page navigation controls are also provided to browse through multiple sets of content (records) at a time. Easy-to-use on-line editing features allow creating and editing field content and deleting entire records, as well as, importing and exporting records in .csv format.

Setup/Upd Grid

Grid Fields Setup/Update Grid

The settings in this section describe the controls to setup the grid fields (columns) and includes 'Setup/Upd Grid', 'Field Title', 'Uses Field Name', 'Field Type', 'Character Length', 'Field Alignment', 'Field Formatter', 'Thou Separator', 'Decimal Point', 'Date Format', 'Time Format', 'Min. Field Width', 'Min. Width', 'Field Width', 'Default Width', 'Edit Mode' and 'Display Mode'.

Setup/Upd Grid: Enable this button to setup/update the Grid fields.

Note: Whenever a change is made to any settings be sure do the two-step publish process.

When 'Setup/Upd Grid' is enabled, a section titled 'Dynamic Content Grid Fields' will display in the main edit window and one field will display by default. To add additional fields, click the blue plus button to add more fields.
Note: Each Field Formatter has a color-coordinated color and icon to make working w/ fields visually easy:
Medium Blue (A icon) for Small Text
Light Blue (¶ icon) for Large Text
Yellowish-Orange(1 icon) for Integer Number
Yellowish-Orange (1.0 icon) for Floating Number
Red ( icon) for Date
Pink ( icon) for Time
Medium Green (Currency icon) for Money
Cyan( icon) for Email
Redish Purple (Picture icon) for Image
Light Grey ( icon) for Link
Light Green ( icon) for Checkbox
Bluish Purple ( icon) for Color
Dark Grey ( icon) for Progress Bar

Clicking on a field will display the controls in the right stack panel. Settings for the field will be displayed in the field pane for your convenience and are listed below:

Field Title: Enter a field title to show at the top of each column in Grid. Can be uppercase or space-separated words. Note: No single/double quotes.
Uses Field Name: Enter a field name. Note: Must match Database Setup. No spaces/single/dbl quotes.
Field Type: Select a field type:
'Small Text (999 char. max)'
'Large Text (65,535 char. max)'
'Integer Number'
'Floating Number'
'Date'
'Time'
Character Length: Enter a character length for a small text field. Note: See Grid Field Help for suggested character lengths. Note: Must match Database Setup.
Field Alignment: Select the field text alignment as either 'Left', 'Center' or 'Right'.
Field Formatter: Select the field format style as either 'Small Text', 'Large Text w/ Carriage Returns', 'Integer Number', 'Floating Number', 'Date', 'Time', 'Money', 'Email', 'Image', 'Link', 'Checkbox', 'Color', 'Rating' or 'Progress Bar' - i.e., the formatter sets how the data will appear.
'Small Text' represents a small amount of text & when a record is initially added will be by default ***
'Large Text w/ Carriage Returns' represents large paragraphs of text usually with carriage returns separating paragraphs & when a record is initially added will be by default ******
'Integer Number' represents whole numbers & when a record is initially added will be by default 0
'Floating Number' represents numbers with decimals. Note: Floating number fields are set to field type of Double and can support up to 16 total digits of precision. This total includes any digits after the decimal point & when a record is initially added will be by default 0
'Date' represents a specified date layout & when a record is initially added will be automatically generated.
'Time' represents a specified time layout & when a record is initially added will be automatically generated.
'Money' represents currency with specified currency symbols & when a record is initially added will be by default $0.00
'Email' represents a unique link that will address an email in the user's default email client & when a record is initially added will be by default [email protected]
'Image' represents an image that will be rendered in the field & when a record is initially added will be by default a path to a default image.
'Link' represents a typical link to other content/pages & when a record is initially added will be by default ***
'Checkbox' represents the rendering of either a checkbox or an 'X' & when a record is initially added will be by default a red 'X'.
'Color' represents the rendering of a color in the background of the field. Supported formats: 3-hex ~ #f00, 6-hex ~ #ff0000, rgb ~ rgb(255,0,0), rgba ~ rgba(255,0,0,0), hsl ~ hsl(0,100%,50%), std. color text name ~ red
'Rating' represents the rendering of a star rating & when a record is initially added will be by default 0 stars.
'Progress Bar' represents the rendering of a percentage-based progress bar & when a record is initially added will be by default 10%
Date Format: Select the date format as either 'mm/dd/yyyy' or 'dd/mm/yyyy'.
Time Format: Select the time format as either '12-hr (am/pm)' or '24-hr'.
Currency: Enter a symbol for the currency for 'Money'.
Curr. Position: Select the currency symbol position as either 'Before Number' or 'After Number' for Money.
Thou. Separator: Enter a symbol for the thousands separator for 'Integer Number', 'Floating Number' and 'Money'.
Decimal Point: Enter a symbol for the decimal point for 'Floating Number' and 'Money'.
Email Display Fld: Enter the email display field, Note: Leave blank to display email - not recommended. When editing the field values, they should not contain actual emails, but display text, Ex. Email Bill. To edit the email display field you will need to set up this field in Grid, but set the 'Display Mode' to 'Not Shown'.
Link Display Text: Enter general link display text for all the links in this field, Note: Leave blank to display value.
Star Type: Select the star type as either '5 Stars' or '10 Stars' for Rating.
Progress Color (color): Select a bar color for Progress Bar.
Min. Field Width: Select to assign a minimum width for a field column as either 'Auto' or 'Manual'.
Min. Width: Enter a minimum field width, in px when 'Manual' is selected for 'Min. Field Width'.
Field Width: Select to assign a default width for this field column as either 'Auto' or 'Manual'.
Default Width: Enter a default field width, in px when 'Manual' is selected for 'Field Width'.
Edit Mode: Select the view mode when in edit mode (logged in) as either 'Read Only', 'Edit' or 'Not Shown'.
'Read Only' means that content will, by default, be viewable only and will not be editable in edit mode.
'Edit' means that content will, by default, be editable in edit mode.
'Not Shown' means that this field column will not be shown or be editable in edit mode.
Display Mode: Select the view mode when in display mode (normal viewing) as either 'Read Only', 'Edit' or 'Not Shown'.
'Read Only' means that content will, by default, be viewable only and will not be editable in display mode.
'Edit' means that content will, by default, be editable in display mode.
'Not Shown' means that this field column will not be shown or be editable in display mode.

Grid Help

Grid Help

Enable to show in-editor tips on various Grid field settings.

Display Settings

Display Settings

This section describes the basic layout and display settngs that apply to Grid and includes 'Uses Table Name', 'Records/Pg', 'Date Format', 'Time Format', 'Show Filter Controls', 'Display Mode', 'Allow Adds', 'Allow Importing', 'Allow Deleting', 'Allow Downloads', 'Allow Read Only Adds', 'Allow Read Only Importing', 'Allow Read Only Deleting' and 'Allow Read Only Downloads'.

Uses Table Name: Enter a table name from Database Setup to use. Note: No space/single/dbl quotes.
Records/Pg: Enter the number of records to show at a time in Grid.
Date Format: Select the date format to assign to date fields as either 'mm/dd/yyyy' or 'dd/mm/yyyy'.
Time Format: Select the time format to assign to time fields as either '12-hr (am/pm)' or '24-hr'.
Show Filter Controls: Enable to show filter controls to search records. Note: Disabling this would remove all filter controls and thus no filtering could be done.
Display Mode: Select the display mode(s) available as either 'Read Only' or 'Read Only & Edit'. 'Read Only' is used when all content will by default be viewable only and will not be editable in edit mode. Note: The login button will be hidden in 'Read Only' mode. 'Read Only & Edit' is used when all content will by default be viewable in display mode and will be editable in edit mode.

The following are to set editing permissions when 'Read Only & Edit' is used and an admin is logged in in Edit mode:
Allow Adds: Enable to allow adding of records in Edit mode.
Allow Importing: Enable to allow importing of records in Edit mode.
Allow Deleting: Enable to allow deleting of selected records or all records in Edit mode.
Allow Downloads: Enable to allow downloading of selected records or all records (.csv format) in Edit mode.

The following are to set editing permissions when 'Read Only' is used and a visitor is in Display mode:
Allow Read Only Adds: Enable to allow adding of records in Read Only mode.
Allow Read Only Importing: Enable to allow importing of records in Read Only mode.
Allow Read Only Deleting: Enable to allow deleting of selected records or all records in Read Only mode.
Allow Read Only Downloads: Enable to allow downloading of selected records or all records (.csv format) in Read Only mode.

Control Settings

Control Settings

This section describes the path, button and filter styling controls that apply to Grid and includes 'Custom Link Path', 'Cust. Img. Path', 'Font', 'Use Custom Google Font', 'Google Font', 'Google Wt', 'Edit Buttons', 'Controls Text', 'Button LineHt', 'FTV Pad Bot', 'Arrow LineHt', 'Filter Icons' (color), 'Clear Icon' (color), 'Filter/Tip Border' (color), 'Tooltip Text' (color), Tooltip/Input BG' (color), 'FTV Lbl/PgNav' (color), 'Field/Typ/Val Inp' (color) & 'Login/Out' (color).

Custom Link Path: Enter the custom link path to a page/file for all links, Note: If the full path & target is in the field, then leave blank. Add ending slash to last folder.
Cust. Img. Path: Enter the custom image path to a folder for all images, Note: If the path is in the field, then leave blank. Add ending slash to last folder.
Font: Set a web-safe font for the control text as either 'Theme Default' (Inherited & Default), 'Dynamic Content Default' (Source Sans Pro), 'Arial Black', 'Cooper Black', 'Courier New', 'Cursive', 'Futura', 'Georgia', 'Geneva', 'Gill Sans', 'Helvetica', 'Helvetica Neue', 'Hoefler', 'Impact', 'Lucida Console', 'Lucida Grande', 'Myriad Pro', 'Palatino', 'Rockwell', 'Times New Roman', 'Trebuchet MS' or 'Verdana'.
Use Custom Google Font: Enable to use a custom Google font for the control text. Note: overrides Font.
Google Font: If Use Custom Google Font is enabled, enter name of Google font. Note: No single/dbl quotes.
Google Wt: Only enter Google font weight for the control text if it's anything other than normal (400).
Edit Buttons: Set the edit buttons icon size. Note: Units em.
Controls Text: Set the edit buttons/field/type/value controls text size. Note: Units em.
Button LineHt: Set the edit buttons line height. Note: Units em.
FTV Pad Bot: Set the Field/Type/Value bottom padding. Note: Units em.
Arrow LineHt: Set the selection indicator line height for arrows. Note: Units em.
Filter Icons (color): Set the filter button & record reveal icon color.
Clear Icon (color): Set the clear filter icon color.
Filter/Tip Border (color): Set the filter controls & tooltip border color.
Tooltip Text (color): Set the button tooltip text color.
Tooltip/Input BG (color): Set the tooltip & value input background color.
FTV Lbl/PgNav (color): Set the field/type/value labels & page navigation text color.
Field/Typ/Val Inp (color): Set the field/type/value select & input text color.
LogIn/Out (color): Set the login/logout icon and text color.

Header Styling

Header Styling

This section describes the header styling controls that apply to Grid and includes 'Header BG' (color), 'Header BG Hover' (color), 'Header Side BG' (color), 'Hdr. Sd. Bor. Wd', 'Hdr. Sd. Borders' (color), 'Hdr. Bt. Bor. Wd', 'Hdr. Bt. Border' (color), 'Header Text' (color), 'Sort Arrow' (color), 'Sort Arrow Sel' (color) and 'Hdr. Text Align'.

Header BG (color): Set the header background color.
Header BG Hover (color): Set the header background hover color.
Header Side BG (color): Set the header side background color.
Hdr. Sd. Bor. Wd: Set the header left & right border width.
Hdr. Sd. Borders (color): Set the header left & right border color.
Hdr. Bt. Bor. Wd: Set the header bottom border width.
Hdr. Bt. Border (color): Set the header bottom border color.
Header Text (color): Set the header text color.
Sort Arrow (color): Set the sort arrow default color.
Sort Arrow Sel (color): Set the sort arrow selected color.
Hdr. Text Align: Select text alignment for the header text as either 'Left', 'Center' or 'Right'.

Content Styling

Content Styling

This section describes the content styling controls that apply to Grid and includes 'Content Text', 'Content Text' (color), 'Max. Row Height', 'Content LineHt', 'Max. Txt. Width', 'Rows BG' (color), 'Alt. Rows BG' (color), 'Row Borders Wd', 'Row Borders' (color), 'Row Hover' (color), 'Row Selected' (color), 'Col Borders Wd', 'Column Borders' (color), 'Progress Bar %' (color), 'Link/Email' (color), 'Link/Email Hover' (color), 'Outer Border Wd', 'Outer Border' (color), 'Outer Bor Rad' and 'Side BG' (color).

Content Text: Set the content text size. Note: Units, em.
Content Text (color): Set the content text color.
Max. Row Height: Select a maximum row height as either 'Auto (Lg. Img. Thumbs) - uneven cells', '1.0em', '1.5em', '2.0em', '3.0em', '4.0em' or '5.0em'. Note: Useful to control thumbnail image heights.
Content LineHt: Set the content line height. Note: Units, em.
Max. Txt. Width: Enter a column width for small/large text. Will control the column width so text doesn't take up the entire page width and should be coordinated with the Field Width settings in Setup/Upd Grid section.
Rows BG (color): Set the main row background color.
Alt. Rows BG (color): Set the alternating row background color.
Row Borders Wd: Set the row top & bottom border width.
Row Borders (color): Set the row top & bottom border color.
Row Hover (color): Set the row hover color.
Row Selected (color): Set the row selected color.
Col Borders Wd: Set the column left & right border width.
Column Borders (color): Set the column left & right border color.
Progress Bar % (color): Set the progress bar % text overlay color.
Link (color): Set the link default text color.
Link Hover (color): Set the link hover text color.
Outer Border Wd: Set the main grid border width.
Outer Border (color): Set the main grid outer border color.
Outer Bor Rad: Set the main grid outer border radius.
Side BG (color): Set the content extra side & reveal background color.

Field Reveal Styling

Field Reveal Styling

This section describes the field reveal styling controls that apply to Grid and includes 'Reveal Hdr. BG' (color), 'Reveal Borders' (color), 'Reveal H. Sd. Bor', 'Reveal Hdr. Bor' (color), 'Reveal H. Bt. Bor' and 'Reveal Hdr. Bot' (color).

Reveal Hdr. BG (color): Set the revealed row header background color.
Reveal Borders (color): Set the revealed row outer borders color.
Reveal H. Sd. Bor: Set the revealed row header column left & right borders width.
Reveal Hdr. Bor (color): Set the revealed row header column left & right border color.
Reveal H. Bt. Bor: Set the revealed row header bottom border width.
Reveal Hdr. Bot (color): Set the revealed row header bottom border color.

Page Navigation Styling

Page Navigation Styling

This section describes the page navigation styling controls that apply to Grid and includes 'Pgn. Footer BG' (color), 'Active Pgn. Btn' (color), 'Pgn. Button BG' (color), 'Pgn Btn Hvr BG' (color), 'Pgn. Button Bor' (color), 'Pgn Btn Hvr Txt' (color), 'Show Page Navigation Names' and 'Pgn. Names'.

Active Pgn. Btn (color): Set the active page navigation button text color.
Pgn. Button BG (color): Set the page navigation button background color.
Pgn Btn Hvr BG (color): Set the page navigation button hover background color.
Pgn. Button Bor (color): Set the page navigation button border color.
Pgn Btn Hvr Txt (color): Set the page navigation button hover text color.
Pg. Footer BG (color): Set the page navigation footer background color.
Show Page Navigation Names: Enable to show names in the page navigation buttons. Note: Hidden on mobile phone portrait orientation.
Pgn. Names: If using Show Page Navigation Names, enter the page navigation names for 'First' (first page), 'Prev' (previous page), 'Next' (next page) and 'Last' (last page).

Date Picker

Date Picker

This section explains the 'Show Date Picker', 'Days Small', 'Months Small', 'Months Large', 'Starting Day', 'Day Title Text' (color), 'Date Text' (color), 'Date Selected BG' (color), 'Date Sel Hvr Text' (color), 'Date Hover BG' (color), 'Date Hover Bor' (color), 'Date Prev/Nxt Txt' (color), 'Highlight Today', 'Today Date BG (color), 'Buttons Text' (color), 'Days Highlighted', 'Days Hlight BG' (color), 'Days Disabled', 'Days Disabl Text' (color), 'Dates Disabled', 'Show Today Button', 'Today Button' & 'Round Dates'.

Show Date Picker: Enable to show a date picker when editing dates.
Days Small: Enter small day names shown in the main date selection panel, Note: Enter in single quotes and comma-separated.
Months Small: Enter small month names shown in the month selection panel, Note: Enter in single quotes and comma-separated.
Months Large: Enter large month names shown at the top of the main date selection panel, Note: Enter in single quotes and comma-separated.
Starting Day: Select the day of the week to start from as either 'Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday' or 'Saturday'. Note: Sunday is typical Grecko-Roman calendar layout.
Day Title Text: Set day title text color.
Date Text: Set date text color.
Date Selected BG (color): Set date selected background color.
Date Sel Hvr Text: Set date selected text hover color.
Date Hover BG (color): Set the date hover background color.
Date Hover Bor (color): Set the date hover border color.
Date Prev/Nxt Txt: Set the previous & next month date text color.
Highlight Today: Enable to highlight today's date in the date picker using Today Date BG.
Today Date BG (color): If Highlight Today is enabled, set today's date background color.
Buttons Text (color): Set the today button, scroll icons & year/month at top of panel normal & hover text color.
Days Highlighted: Enter days of the week to highlight with Days Hlight BG, Note: Max 6 - comma separated numbers, Sunday: 0 - Saturday: 6.
Days Hlight BG (color): Set the days highlighted background color.
Days Disabled: Enter the days of the week to disable picking from. Note: Max 6, Enter as comma-separated numbers, Sunday:0 to Saturday:6.
Days Disabl Text: Set the days disabled text color.
Dates Disabled: Enter specific dates to disable picking from. Note: Enter in single quotes and comma-separated.
Show Today Button: Enable to show today button in date picker.
Today Button: If Show Today Button is enabled, enter the text for the datepicker today button.
Round Dates: Enable to round all dates in date picker.

General Settings

General Settings

This section explains the 'Turn Off Button Sounds', 'Uses Framework' & 'jQuery at End of Body'.

Turn Off Button Sounds: Enable to turn off sound when filter or page navigation buttons are clicked.
Uses Framework: Enable if page/theme uses a Framework: Foundation/Foundry/Bootstrap. This helps to correct styling used in Dynamic Content stacks.
jQuery at End of Body: Enable if Page/Theme moves jQuery to end of the body tag.
Dataset Nm: Enter dataset name if using Grid w/ Layout Pro.
Grid Alerts: Enable to show the localization text for grid alerts.

Grid Alerts

This section explains the grid alert text, button text and other miscellaneous text used in Grid. In the control panel to the right, you will see the button 'Grid Alerts' and all alerts are displayed within it. If you and your site visitors read English, then these text controls don't have to be changed, but are available if you wish to change the text.

Note: If you are changing the text and wish to use single quote(') or double-quote(") characters in the text, then you must escape the quotes by placing a backspace character before them. Ex: l\’accès.

Layout Setup

About

Layout Setup

Layout Setup allows you to add basic functionality to control the content laid out using the Layout stacks and provides simple page navigation buttons. Note: This basic stack only has simple display of one record at a time and does not have editing capabilities. Grid would have to be used in combination to edit any content.

Basic Content Info

Basic Content Info

This section explains the 'Setup/Upd Lyt', 'Uses Table Name' and 'Start Row'.

Setup/Upd Lyt: Enable this button when setting up Layout fields for the first time or when changing any settings to do with them or changing settings within Layout Setup. Publish the page and then visit the page. Once you see a green alert stating everything is ok, then return to RW, uncheck 'Setup/Upd Lyt' and republish again. Be sure to visit the page a second time after unchecking the control & republishing.
Uses Table Name: This is the table name from Dynamic Content: Database Setup. The table name can't have any spaces, single or double quotes. Uses Table Name will be displayed in edit-mode w/in the main stack edit window for your convenience.
Start Row: Enter a starting row (record) from the table to start page navigation from. Typically, it would be set to 1, but you could enter another number to start with different content.

Layout Setup Help

Layout Setup Help

Enable to show in-editor help on Layout Setup settings.

Page Navigation

Page Navigation

The Page Navigation buttons will display wherever you place the Dynamic Content: Layout Setup stack. It displays two buttons which each respresent a page containing a record that has been layed out on the page. The buttons represent: 'Previous' which moves back to the previous page and 'Next' which moves forward to the next page.

This section explains the 'Button Font', 'Use Custom Google Font', 'Cust. Google Fnt', 'Google Wt', 'Button Text', 'Button LineHt', 'Button Text' (color), 'Btn. Hover Txt' (color), 'Button Border' (color), 'Button BG' (color), 'Btn. Hover BG' (color), 'Button Alignment', 'Show Btn. Names' and 'Button Names'.

Button Font: Select the font for the page navigation buttons text as either 'Dynamic Content Default (Source Sans Pro)', 'Theme Default (Inherited)', 'Arial Black', 'Cooper Black', 'Courier New', 'Cursive', 'Futura', 'Georgia', 'Geneva', 'Gill Sans', 'Helvetica', 'Helvetica Neue', 'Hoefler', 'Impact', 'Lucida Console', 'Lucida Grande', 'Myriad Pro', 'Palatino', 'Rockwell', 'Times New Roman', 'Trebuchet MS' or 'Verdana'.
Use Custom Google Font: Enable to use a custom Google font for the page naviation button text. Note: This will override Button Font
Cust. Google Fnt: If Use Custom Google Font is enabled, enter name of Google font. Note: No single/dbl quotes.
Google Wt: Only enter Google font weight for the button text if it's anything other than normal (400).
Button Text: Set the page navigation button text size.
Button LineHt: Set the page navigation button line height.
Button Text (color): Set the page navigation button text color.
Btn. Hover Txt (color): Set the page navigation button hover text color.
Button Border (color): Set the page navigation button border color.
Button BG (color): Set the page navigation button background color.
Btn. Hover BG (color): Set the page navigation button hover background color.
Button Alignment: Select the alignment for the page navigation buttons as either 'Left', 'Center' or 'Right'. Note: Choose only one.
Show Btn. Names: Enable to show names in the page navigation buttons.
Button Names: If Show Btn. Names is enabled, enter the page navigation button names.

General Settings

General Settings

This section explains the 'Turn Off Button Sounds' and 'Uses Framework'.

Turn Off Button Sounds: Enable to turn off sound when page navigation buttons are clicked.
Uses Framework: Enable if page/theme uses a Framework: Foundation/Foundry/Bootstrap. This helps to correct styling used in Dynamic Content stacks.

Layout Setup Alerts

This section explains the button text and alert text used in Layout Setup. In the control panel to the right, you will see the button 'Layout Set Alerts' and the controls are shown within it. If you and your site visitors read English, then these text controls don't have to be changed, but are available if you wish to change the text.

Note: If you are changing the text and wish to use single quote(') or double-quote(") characters in the text, then you must escape the quotes by placing a backspace character before them. Ex: l\’accès.

Layout

About

Layout

In a nutshell: a Dynamic Content: Layout stack allows you to layout content with any kind of custom layout stacks. Layout stacks allow only one record to be layed out per page, but as many fields as desired, i.e., one per Layout stack.

Basic Content Info

Basic Content Info

This section explains the 'Uses Table Name', 'Start Row', 'Uses Field Name' and 'Field Type'.

Uses Table Name: Enter the table name from Database Setup to use. Note: No spaces single/dbl quotes. Uses Table Name will be displayed in edit-mode w/in the main stack edit window for your convenience.
Start Row: Enter a starting row (record) from the table to start page navigation from. Typically, it would be set to 1, but you could enter another number to start with different content. Uses Field Name: Enter the field name from Database Setup to use, Note: No spaces/single/dbl quotes.
Fld. Display Type: Select the field display type as either 'Sm/Lg Text', 'Integer Number', 'Floating Number', 'Date', 'Time', 'Money', 'Email', 'Image' or 'Link'. This must generally match the field type set up in Database Setup. 'Fld. Type' will be displayed in edit-mode within the stack for your convenience.
Note: Each 'Fld. Display Type' has a color-coordinated color and icon to make working w/ fields visually easy:
Medium Blue (A ¶ icon) for Small/Large Text
Yellowish-Orange(1 icon) for Integer Number
Yellowish-Orange (1.0 icon) for Floating Number
Red ( icon) for Date
Pink ( icon) for Time
Medium Green (Currency icon) for Money
Cyan( icon) for Email
Redish Purple (Picture icon) for Image
Light Grey ( icon) for Link

Note: If 'Fld. Display Type' is set to 'Image', then the 'Uses Field Name' control will be hidden and 'Std. Img. FldName' should be used instead.

The exceptions for Fld. Display Type are:
General text: 'Small Text' or 'Large Text' in DB would match to 'Sm/Lg Text' in Layout.
Currency: 'Floating Number' in DB would match to 'Money' in Layout.
'Small Text' in DB could optionally match to either 'Email', 'Image' or 'Link' in Layout.

Field Display Type Details

This section explains the various controls for each field display type, depending on what is selected in 'Fld. Display Type'.

Sm/Lg Text

Note: Use 'Sm/Lg Text' for Small or Large text created in Database Setup. (No detail controls at this time)

Integer Number Controls

Integer Number


Thou. Separator: Enter a character to use for the thousands separator symbol, if the number is big enough.
Enable Integer Replacement: Enable to allow integers to be replaced with custom text or a symbol in place of an integer stored in the database. An integer of one or greater will use the '1- Replacement' and zero will use the '0-Replacement'.
Enable Font Awesome: Enable to allow integers to be replaced with a font awesome icon. Use fa name only, Ex: fa-magic
1-Replacement: Enter the text or font awesome name to replace integer of 1 or greater. Note: No single or double quotes.
FA1 Color: Set the color for font awesome 1-Replacement icon.
0-Replacement: Enter the text or font awesome name to replace integer of zero. Note: No single or double quotes.
FA0 Color: The color for font awesome 0-Replacement icon.

Floating Number Controls

Floating Number


Thou. Separator: Enter a charcter to use for the thousands separator symbol, if the number is big enough.
Decimal Point: Enter a character to use for the decimal point symbol.

Note: Floating number fields are set to field type of Double and can support up to 16 total digits of precision. This total includes any digits after the decimal point.
Date Controls

Date


Date Format: Select the date format to display in either 'mm/dd/yyyy' or 'dd/mm/yyyy'.

Time Controls

Time


Time Format: Select the time format to display as either '12-hour (am/pm)' or '24-hr'.

Money Controls

Money


Currency Symbol: Enter a character to use for the currency symbol.
Curr. Position: Select the currency symbol position to display either 'Before Number' or 'After Number'.
Thou. Separator: Enter a character to use for the thousands separator symbol, if the number is big enough.
Decimal Point: Enter a character to use for the decimal point symbol.

Email Controls
Email Prompt

Email


Email (color): Set the email text default color.
Email Hover (color): Set the email text hover color.
Email Text: Enter the email display text. Note: No single/double quotes. This text is displayed for all emails instead of a real email to prevent spam bots from harvesting emails. Don't use an email address here: just enter some generic display text. An example of proper email display text might be 'Contact Us' or 'Our Email'.

When viewing an email link in read-only mode, modern browsers may show an alert prompting to allow an email. Simply click the allow button and a new email will open in the default email app.

Image Controls

Image


Std.Img.FldName: Enter an image field name from Dynamic Content: Database Setup. There are three image field names. This field is required as a minimum, but the other two are optional. The standard image field name can't contain any spaces, single or double quotes, xxx, yyy or zzz.
2xSm.Fld. Name: Enter an image field name from Dynamic Content: Database Setup. This is for a small 2x sized image (max width 1536px), but is optional. The 2x small image field name can't contain any spaces, single or double quotes, xxx, yyy or zzz.
2xLg.Fld. Name: Enter an image field name from Dynamic Content: Database Setup. This is for a large 2x sized image (min width 2048px), but is optional. The 2x large image field name can't contain any spaces, single or double quotes, xxx, yyy or zzz.
Alt. Text: Enter the image alternate display text. The alternate text can't contain single or double quotes. This generic alternate text is displayed for all images.

Link Controls

Link


Link is typically used to link from text to either another page or a non-image file.

Link (color): Set the link text default color.
Link Hover (color): Set the link text hover color.
Link Text: Enter link display text for the link, Note: No single/double quotes. This generic link text is displayed for all links.

Layout Help

Layout Help

Enable to show in-editor help on Layout settings.

Content Styling

Content Styling

This section explains the 'Opt. Tags', 'Enable Beginning Characters', 'Begining Char', 'Enable Ending Characters', 'Ending Char', 'Content Styling', 'Text Font', 'Text Size', 'Text LineHt', 'Text Color' (color), 'Use Custom Google Font', 'Cust. Google Fnt' and 'Google Wt'.

Opt. Tags: If you would like to add a wrapping tag around the content, then select one of the buttons. Only one of the buttons can be used at a time.
The 'H' Button enables a heading tag.
The Horizontal Lines Button enables a paragraph tag.
The 'B' Button enables a bold tag.
The 'I' Button enables an italic tag.
The 'Tag Wrap' selected will be displayed within the main stack window in edit-mode for your convenience.
Heading Tag: If the 'H' button is enabled, select the heading tag to use as either 'Heading 1', 'Heading 2', 'Heading 3', 'Heading 4', 'Heading 5' or 'Heading 6'.
Enable Beginning Characters: Enable to apply characters before the Layout content. This is useful to insert small amounts of text or small html snippets before.
Beginning Char: Enter the beginning characters of either text or html.
Enable Ending Characters: Enable to apply characters after the Layout content. This is useful to insert small amounts of text or small html snippets after.
Ending Char: Enter the ending characters of either text or html.
Content Styling: Enable this button to apply additional styling to the Layout content.
Text Font: Select the font to apply to Layout content as either 'Theme Default' (Inherited & Default), 'Dynamic Content Default' (Source Sans Pro), 'Arial Black', 'Cooper Black', 'Courier New', 'Cursive', 'Futura', 'Georgia', 'Geneva', 'Gill Sans', 'Helvetica', 'Helvetica Neue', 'Hoefler', 'Impact', 'Lucida Console', 'Lucida Grande', 'Myriad Pro', 'Palatino', 'Rockwell', 'Times New Roman', 'Trebuchet MS' or 'Verdana'.
Text Size: Set the text font size.
Text LineHt: Set the text line height.
Text Color (color): Set the text color. This does not affect email & link text and hover colors, instead use the dedicated field controls.
Use Custom Google Font: Enable to use a custom Google font for the Layout content. This will overide the Text Font setting.
Cust. Google Fnt: Enter the name of a Google font to use. No single or double quotes allowed.
Google Wt: Enter the Google font weight, but only if it's other than normal weight (400).

Layout Pro Setup

About

Layout Pro Setup

Layout Pro Setup allows you to add functionality to control the content laid out using the Layout Pro stacks. In a nutshell: the Dynamic Content: Layout Pro Setup stack allows multiple records to be displayed on a page at once, sets any desired prefiltering, custom multi-filter capability to find any content with ease, works with custom prefilter buttons, as well as, moving main controls and detail page setup. An advanced on-line admin interface is also provided to control individual user permissions on what content they can see and edit. Easy-to-use in-line editing features allow creating and editing field content and deleting entire records.

Note: The Layout Pro Setup stack is a paid addon to the Dynamic Content main suite which is also required.

Data Settings

Data Settings

This section explains the 'Setup/Upd LPro', 'Uses Table Name', 'Dataset Nm' & 'Start Row'.

Setup/Upd LPro: This control should be enabled when setting up Layout Pro fields for the first time or when changing any field settings or changing general settings within Layout Pro Setup. Publish the page and then visit the page. Once you see a green alert stating everything is Great, then return to RW, uncheck 'Setup/Upd LPro' and republish again. Be sure to visit the page a second time after unchecking the control & republishing.
Uses Table Name: This is the table name from Dynamic Content: Database Setup. The table name can't have any spaces, single or double quotes. Uses Table Name will be displayed in edit-mode w/in the main stack edit window for your convenience.
Dataset Nm: This is a unique name given to all Layout Pro content that is related to each other. An example of a dataset name could be a common name that represent all elements in a group of images and their related content that are being brought in. The dataset name can't contain any spaces, single or double quotes, xxx, yyy or zzz. Use lowercase, alpha numeric only. Dataset Name will be displayed in edit-mode within the main stack edit window for your convenience.
Start Row: Enter a starting row (record) from the dataset to start pagination from. This is basically the row number in the table to start pulling content from. Typically, it would be set to 1, but you could enter another number to start with different content.

Filter Controls

Filters Filter Controls

One Filter/Sort Control is added by default in the main edit mode window, but you can click the blue plus button in edit mode to add as many as you desire. Within each Filter/Sort Control, a Preset Field, Preset Filter Type, Preset Value & Sort are shown & set to None as a default. If you wish to set any preset filter values, then click on a Filter/Sort Control. In the controls pane to the right, you will see all the controls for this stack. You can set presets for Field, Filter Type, Value & Sort seperately, but if you want the preset filter to run automatically, then all of them need to be set.

Dataset Name: Enter dataset name from the main settings. Can't contain spaces, single or double quotes, xxx, yyy or zzz. Use lowercase, alpha-numeric only.
Use Preset Field (checkbox): Enable to set a preset field that will be applied when the page loads.
Preset Field: Enter a preset filter field name. Use the field name from Dynamic Content: Database Setup. The field name can't have any spaces, single or double quotes. The preset field name will be displayed in edit-mode w/in the Filter/Sort Control stack for your convenience.
Field Always Used: Enabling this will set the field name to always be used in filtering and effectively locks that control. When enabled, a lock icon will show in edit-mode w/in the Filter/Sort Control stack for your convenience. When disabled, an unlock icon will be shown and any additional filtering run after initial page load will not include the preset field name.
Use Preset Filter Type (checkbox): Enable to set a preset filter type that will be applied when the page loads.
Preset Filter Type: Select a preset filter type as either 'None', 'Contains', 'Doesn't Contain', 'Between', '=', '!=', '<', '<=', '>' or '>='. The preset filter type will be displayed in edit-mode w/in the Filter/Sort Control stack for your convenience.

Note: When preset filter type is not being used, be sure to select 'None' before unchecking 'Use Preset Filter Type'.

Filter Type Always Used: Enabling this will set the filter type to always be used in filtering and effectively locks that control. When enabled, a lock icon will show in edit-mode w/in the Filter/Sort Control stack for your convenience. When disabled, an unlock icon will be shown and any additional filtering run after initial page load will not include the preset filter type.
Use Preset Value (checkbox): Enable to set a preset value that will be applied when the page loads.
Preset Value: Enter a preset filter value. The preset filter value will be displayed in edit-mode w/in the Filter/Sort Control stack for your convenience.
Value Always Used: Enabling this will set the filter value to always be used in filtering and effectively locks that control. When enabled, a lock icon will show in edit-mode w/in the Filter/Sort Control stack for your convenience. When disabled, any additional filtering run after initial page load will not include the preset filter value.
Value Input: Select the value input type:
  'Manual Input' which allows user to type in values to filter for.
  'Auto 'Dropdown List' which presents a dropdown list of selectable values for the field selected or preset. A mini-pagination feature so you can browse through a small set of values at a time. You can also type in the value input to auto-reduce selections down to the value you are looking for.
  'Dropdown List + Fld Limit' which presents a list of selectable values for the field selected or preset, plus additional filtering from another limiting parent field that is preset. It also shows pagination controls to look through all values and auto-reduce selections when manually typing in values.
Placeholder: When 'Value Input' is set to 'Manual', enter placeholder text in the value input.
Allow Multiple Values: Enable to allow multiple preset values in the preset field value for auto dropdowns.

Note: Note: Values displayed separately in dropdown. Separate values in the field data with a comma. Field types of integer number, floating number & money can only have one value for the dropdown.

Limiting Field: When using 'Dropdown List + Fld Limit', enter a parent field that will limit this field's values. It also shows a dropdown w/ pagination controls to look through all values.
Use Preset Sort Direction (checkbox): Enable to set a preset sort direction that will be applied when the page loads.
Sort Direction: Select either 'Ascending' or 'Descending' value. The preset sort direction will be displayed in edit-mode w/in the Filter/Sort Control pane for your convenience.
Direction Always Used: Enabling this will set the sort direction value to always be used in filtering and effectively locks that control. When enabled, a lock icon will show in edit-mode w/in the Filter/Sort Control stack for your convenience. When disabled, any additional filtering run after initial page load will not include the preset sort direction value.
Fields Excluded: Enter any fields in a double-quoted & comma-separated list that are not to be shown in the filter's field dropdown, Ex: "field1","field2"
Hide All Filter Controls: Enable to hide all the filter inputs. Note: Only hide if Field/Filter Type/Value/Sort Dir will not be changed OR if using Filter Buttons.
Hide Field Control: Enable to hide the field filter selection control. Note: Only hide if Field will not be changed.
Hide Filter Type Control: Enable to hide the filter type selection control. Note: Only hide if Filter Type will not be changed.
Hide Value Control: Enable to hide the filter value input control. Note: Only hide if Value will not be changed.
Hide Sort Direction Control: Enable to hide the sort direction button. Note: Only hide if Sort Direction will not be changed.

Layout Pro Setup Help

Layout Pro Setup Help

Enable 'Lyt Pro Help' to show in-editor help on various settings.

Display Controls

Display Controls

This section explains the 'Display Mode', 'Show Filter Controls', 'Allow Add Filter', 'Allow Editing', 'Allow Adding', 'Allow Deleting' & 'Detail Page'.

Display Mode: Select the mode as either 'Read Only & Edit' or 'Read Only'. 'Read Only & Edit' will allow both initially seeing content in read-only mode, but will also display the login button to allow a user to login and work in edit mode as well. Note: It is possible to initially hide the login button, but it's visibility can be toggled in Read-Only mode by typing Shift + L. 'Read Only' mode will remove the login button and won't allow editing.
Show Filter Controls: Enabling this will show the filter controls and related buttons for all users.
Allow Add Filter: Enabling this will show the Add Filter button next to the last filter input and is shown for all users.
Allow Editing: Enabling this will show the Update button in the Layout Pro admin pane when logged in.
Allow Adding: Enabling this will show the Add Record button in the Layout Pro admin pane when logged in.
Allow Deleting: Enabling this will show the Delete Record button in the Layout Pro admin pane when logged in.
Detail Page: Enable this button if the current page is intended to be a detail page that is redirected to from a main Dynamic Content page.

Move Controls

Move Controls

This section explains the 'Move Filters', Uses Filter ID', 'Move Page Nav', 'Uses Pg Nav ID', 'Move Login/Out' & 'Login/Out Btn. ID'.
Move Filters: Enable this to move the Layout Pro filters to a new location. Drag the Dynamic Content: Layout Pro Setup Position stack to where you wish the filters to appear.
Uses Filter ID: Enter the Filter ID number from the Dynamic Content: Layout Pro Setup Position stack used to position the filters.
Move Page Nav: Enable this to move the Layout Pro page navigation to a new location. Drag the Dynamic Content: Layout Pro Setup Position stack to where you wish the page navigation to appear.
Uses Pg Nav ID: Enter the Pg Nav ID number from Dynamic Content: Layout Pro Setup Position stack used to position the page navigation.
Move Login/Out: Enable this to move the Layout Pro login/out buttons to a new location.
Login/Out Btn. ID: Enter a unique number to represent the login/out buttons. A Login/Out Macro will display in Dynamic Content: Layout Pro Setup. Right-click on the macro text and select 'Copy' from the contextual menu. Then paste this field macro into a text or html stack where you want the login/out buttons to be moved to.

Filter Styling

Filter Styling

This section explains the 'Filt Inp. Text', Filt Btn. Text', Filt Inp LineHt', 'Arrow LineHt', 'Filt Btn. LineHt', 'Filt Input Text' (color), 'FTV/Tip Text' (color), 'Input/Tip Border' (color) & 'Tooltip BG' (color).
Filt Inp. Text: Set the filter input and filter select dropdowns text size, units in em.
Filt Btn. Text: Set the filter buttons text size, units in em.
Filt Inp LineHt: Set the filter input and filter select dropdowns line height, units in em.
Arrow LineHt: Set the filter select dropdowns arrow line height, units in em.
Filt Btn. LineHt: Set the filter buttons line height, units in em.
Filt Input Text: Set the filter input and select text color.
FTV/Tip Text: Set the filter field/type/value labels and tooltip text color.
Input/Tip Border: Set the filter input/select/tooltip border color.
Tooltip BG: Set the filter buttons tooltip background color.

Page Navigation

Page Navigation

This section explains the 'Show Pg. Navigation Names', 'Pg Nav. Names', 'Bold Names', 'Pg Button Font', 'Use Custom Google Font', 'Cust. Google Fnt', Google Wt', 'Pg Btn. Text', 'Pg Btn. LineHt', 'Pg Btn. Align', 'Pg Button Text' (color), 'Pg Btn. Hover Txt' (color), 'Pg Button Border' (color), 'Pg Button BG' (color) & 'Pg Btn. Hover BG' (color).

The Page Navigation buttons will display wherever you place the Dynamic Content: Layout Pro Setup stack. It displays up to five central buttons which each respresent a set of records that have been layed out on the page. The surrounding icon buttons represent: go to 'First' set, go to 'Prev' set, ...numbered buttons..., go to 'Next' set & go to 'Last' set. As you move through the sets, the numbered buttons will automatically update.

Show Pg. Navigation Names: Enable to show names in the page navigation buttons.
Pg Nav. Names: Set the page navigation button names for 'First' record, 'Previous' record, 'Next' record & 'Last' record.
Bold Names: Enable to bold font for the page navigation buttons.
Pg Button Font: Select the font for the page navigation buttons text as either 'Theme Default (Inherited & Default)', 'Dynamic Content Default (Source Sans Pro)', 'Arial Black', 'Cooper Black', 'Courier New', 'Cursive', 'Futura', 'Georgia', 'Geneva', 'Gill Sans', 'Helvetica', 'Helvetica Neue', 'Hoefler', 'Impact', 'Lucida Console', 'Lucida Grande', 'Myriad Pro', 'Palatino', 'Rockwell', 'Times New Roman', 'Trebuchet MS' or 'Verdana'.
Use Custom Google Font: Enable to use a custom Google font for the page navigation buttons text. This will overide the Pg Button Font.
Cust. Google Fnt: Enter the name of a Google font to use. No single or double quotes allowed.
Google Wt: Enter the Google font weight, but only if it's other than normal weight (400).
Pg Btn. Text: Set the page navigation buttons text size, units in em.
Pg Btn. LineHt: Set the page navigation buttons line height, units in em.
Pg Btn. Align: Select the alignment for the page navigation buttons as either 'Left', 'Center' or 'Right'.
Pg Button Text: Set the page navigation buttons & login/out button text color.
Pg Btn. Hover Txt: Set the page navigation buttons hover text color.
Pg Button Border: Set the page navigation buttons & login/out button border color.
Pg Button BG: Set the page navigation buttons & login/out button background color.
Pg Btn. Hover BG: Set the page navigation buttons hover background color.

Login/Out

Login/Out

This section explains the 'Show Login/Out Name', 'Login/Out Names', 'Bold Name', 'Vert. Pos' & 'Hide Login/Out Buttons'.

Show Login/Out Name: Enable to show a name in the login/logout buttons.
Login/Out Names: Enter the login and logout button names.
Bold Name: Enable to bold text for the login/logout names.
Vert. Pos: Enter the vertical position of Login/Out buttons, units % from the top.
Hide Login/Out Buttons: Enable to initially hide the login/logout buttons.

Login/out button visibility can be toggled w/ Shift + L

Field Defaults

Field Defaults

This section explains the 'Default Text', 'Empty Text', 'Hidden Text', 'Text Cleanup', 'Word Count Limit', 'Use Custom Blank Image', 'Blank Image', 'Use Custom Hidden Image' & 'Hidden Image'.

Default Text: Enter the default characters for text, link & email display text and image alt fields when creating a new record.
Empty Text: Enter the text shown when a field is empty.
Hidden Text: Enter the hidden text to display when fields are hidden, due to a user not having view permissions for that field.

Note: be sure to update user permissions in the Admin panel to allow fields to be shown or hidden.

Text Cleanup: Select the spaces used after the end of a sentence in small/large text editing. Ending characters are assumed to be period(.), exclamation(!) or question mark(?). Note: You must enable 'Text Cleanup' in Layout Pro field stacks for a small/large text field. Modern fonts should be set to one space, while mono-spaced text should be set to two spaces.

Note: Text Cleanup also capitalizes the first word of each sentence, sets most other words to lowercase, adds a period at the end of the text and allows for escaping of special capitalized words. Just place a backspace (\) at the beginning of a word to keep it's capitalization, Ex: \John or \DynamicContent

Word Count Limit: Enter a word limit number when editing fields with large amounts of text, Note: leave blank for no limit.
Use Custom Blank Image: Enable to use a custom blank image.
Blank Image: Enter a custom blank image name, 472x312px, Note: on your server, place image in rw_common > plugins > stacks
Use Custom Hidden Image: Enable to use a custom hideen image.
Hidden Image: Enter a custom hidden image name, 472x312px, Note: on your server, place image in rw_common > plugins > stacks

Date Picker

Date Picker

This section explains the 'Show Date Picker', 'Days Small', 'Months Small', 'Months Large', 'Starting Day', 'Day Title Text' (color), 'Date Text' (color), Date Selected BG' (color), 'Date Sel Hvr Text' (color), 'Date Hover BG' (color), 'Date Hover Bor' (color), 'Date Prev/Nxt Txt' (color), 'Highlight Today', 'Today Date BG (color), 'Buttons Text' (color), 'Days Highlighted', 'Days Hlight BG' (color), 'Days Disabled', 'Days Disabl Text' (color), 'Dates Disabled', 'Show Today Button', 'Today Button' & 'Round Dates'.
Show Date Picker: Enable to show a date picker when editing dates.

Days Small: Enter small day names shown in the main date selection panel, Note: Enter in single quotes and comma-separated.
Months Small: Enter small month names shown in the month selection panel, Note: Enter in single quotes and comma-separated.
Months Large: Enter large month names shown at the top of the main date selection panel, Note: Enter in single quotes and comma-separated.
Starting Day: Select the day of the week to start from as either 'Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday' or 'Saturday'. Note: Sunday is typical Grecko-Roman calendar layout.
Day Title Text: Set day title text color.
Date Text: Set date text color.
Date Selected BG (color): Set date selected background color.
Date Sel Hvr Text: Set date selected text hover color.
Date Hover BG (color): Set the date hover background color.
Date Hover Bor (color): Set the date hover border color.
Date Prev/Nxt Txt: Set the previous & next month date text color.
Highlight Today: Enable to highlight today's date in the date picker using Today Date BG.
Today Date BG (color): If Highlight Today is enabled, set today's date background color.
Buttons Text (color): Set the today button, scroll icons & year/month at top of panel normal & hover text color.
Days Highlighted: Enter days of the week to highlight with Days Hlight BG, Note: Max 6 - comma separated numbers, Sunday: 0 - Saturday: 6.
Days Hlight BG (color): Set the days highlighted background color.
Days Disabled: Enter the days of the week to disable picking from. Note: Max 6, Enter as comma-separated numbers, Sunday:0 to Saturday:6.
Days Disabl Text: Set the days disabled text color.
Dates Disabled: Enter specific dates to disable picking from. Note: Enter in single quotes and comma-separated.
Show Today Button: Enable to show today button in date picker.
Today Button: If Show Today Button is enabled, enter the text for the datepicker today button.
Round Dates: Enable to round all dates in date picker.

Gallery Skin

Gallery Skin

This section explains the gallery skins used in Dynamic Content: Layout Pro Setup when pairing with several supported 3rd-Party gallery/lightbox stacks. In the control panel to the right, enable the 'Gallery Skin' button to reveal the gallery skin controls.

This section explains the 'Gallery Skin' (button), 'Gallery Skins', 'Show Title', 'Show Alt Text', 'Show Link to Dtl Page', 'Title' (color), 'Alt Text' (color), 'Icons' (color), 'Background' (color), 'BG Opacity', 'BG Opacity', 'Hover Border', 'Border Radius', 'Hover Border' (color), 'Box Shadow', 'Box Shadow' (color), 'Title Size', 'Caption Size', Icons Size' & 'Icons LineHeight'.

Gallery Skin: Enable this button to turn on the gallery thumbnail skin features to use w/ 3rd-party lightboxes, Note: optional.
Gallery Skins: Select the gallery thumbnail skin animation to use with 3rd-party lightboxes. Choices are either:
  'Scale Img : Sphere Animation' which scales up the image on hover & the color overlay starts as a sphere which grows & covers the thumbnail.
  'Scale/Tilt Img : Sphere Animation' which scales up & rotates the image on hover & the color overlay starts as a sphere which grows & covers the thumbnail.
  'Static Img : Sphere Animation' which has a static image on hover & the color overlay starts as a sphere which grows & covers the thumbnail.
  'Scale Img : Fade Animation' which scales up the image on hover & the color overlay fades in over the thumbnail.
  'Scale/Tilt Img : Fade Animation' which scales up & rotates the image on hover & the color overlay fades in over the thumbnail.
  'Static Img : Fade Animation' which has a static image on hover & the color overlay fades in over the thumbnail.
  'Scale Img : Triangle Animation' which scales up the image on hover & the color overlay starts as a triangle which expands & covers the thumbnail.
  'Scale/Tilt Img : Triangle Animation' which scales up & rotates the image on hover & the color overlay starts as a triangle which expands & covers the thumbnail.
  'Static Img : Triangle Animation' which has a static image on hover & the color overlay starts as a triangle which expands & covers the thumbnail.
  'Scale Img : Expand Animation' which scales up the image on hover & the color overlay starts in the middle & expands to cover the thumbnail.
  'Scale/Tilt Img : Expand Animation' which scales up & rotates the image on hover & the color overlay starts in the middle & expands to cover the thumbnail.
  'Static Img : Expand Animation' which has a static image on hover & the color overlay starts in the middle & expands to cover the thumbnail.
Show Title: Enable to show the title on the thumbnail.
Show Alt Text: Enable to show the alt text on the thumbnail.
Show Link to Dtl Page: Enable to show the link icon to a Dynamic Content Detail page on the thumbnail.
Title (color): Set the thumbnail title color.
Alt Text (color): Set the thumbnail alt text color.
Icons (color): Set the thumbnail icons color.
Background (color): Set the thumbnail background color.
BG Opacity: Set the thumbnail background opacity.
Hover Border: Set the thumbnail hover border width, 0-100px.
Border Radius: Set the thumbnail border radius, 0-100px.
Hover Border (color): Set the thumbnail hover border color.
Box Shadow: Set the thumbnail box shadow, Note: units px.
Box Shadow (color): Set the thumbnail box shadow color.
Title Size: Set the thumbnail title size, Note: units rem.
Caption Size: Set the thumbnail caption size, Note: units rem.
Icons Size: Set the thumbnail icons size, Note: units rem.
Icons LineHeight: Set the thumbnail icons lineheight, Note: units rem, used to align + w/ circle.

General Settings

General Settings

This section explains the 'Enable Dyn Cond', 'Enable Shop', 'Turn Off Button Sounds', 'Uses Framework' & 'jQuery at End of Body'.

Enable Dyn Cond: Enable this button to turn on Dynamic Conditionals on this page, Note: Be sure to enable 'Dyn. Conditionals' on the individual fields.
Enable Shop: Enable this button to turn on shop integration w/ Vibracart Pro shop on this page, Note: Be sure to set up dedicated shop fields.
Turn Off Button Sounds: Enable to turn off sound when filter or page navigation buttons are clicked.
Uses Framework: Enable if page/theme uses a Framework: Foundation/Foundry/Bootstrap. This helps to correct styling used in Dynamic Content stacks.
jQuery at End of Body: Enable if Page/Theme moves jQuery to end of the body tag.

Layout Pro Setup Alerts

This section explains the alert text, button text and other miscellaneous text used in Layout Pro Setup. In the control panel to the right, you will see the button 'Lyt Pro Set Alerts' and all the alert text controls are within it. If you and your site visitors read English, then these text controls don't have to be changed, but are available if you wish to change the text.

Note: If you are changing the text and wish to use single quote(') or double-quote(") characters in the text, then you must escape the quotes by placing a backspace character before them. Ex: l\’accès.

Filtering

Filtering

The filtering control(s) on a published page may appear with prefilter information already selected & entered or empty filter inputs. The Sort button (up arrow) can be toggled by clicking the icon, which allows a visitor to change the sort order of the corresponding field. The Filter button will filter the content based on the filter inputs. The Add Filter button (+) allows a visitor to add another filter control. The Remove Filter button (-) allows the removal of that filter control.

Note: Filter control(s) or the Add Filter button may not be visible if they have been disabled in the Display Controls section.

If a Preset filter has been set, then that filter will run automatically on page load. If the 'Always Used' settings in the Filter Controls section are enabled, then the particular filter control will always run using the preset value on additional filtering and the control will be effectively locked. If the 'Always Used' settings are disabled and the Clear filters button is clicked, then the filter inputs will be cleared and can be set by the visitor on additional filtering.

Filtering can also be accomplished by using the Dynamic Content: Layout Pro Filter Buttons which have preset filter values. Please see separate section for button setup.

Admin Panel

Login Panel

To access the admin panel a user must login. This is done by clicking on the login button on the page. The page will automatically redirect to the Dynamic Content Login page and the login panel will be displayed.

Admin Panel

After entering a correct username and password, the user will be auto-redirected back to the Dynamic Content page. The Admin panel will automatically slide down from the top of the page and currently contains three icon controls. The first is the Users icon (a group of users) and opens the Users pane. The second is the Layout Pro icon (cube) and opens the Layout Pro Editing pane. The third is the Close Admin icon (up arrow) and closes the Admin panel.

Admin panel visibility can be toggled w/ Control + A. (You may need to use it twice to see a change)
Admin Users PaneBasic User Pane

Users Pane

Click the Users icon to enable the Users pane which will slide down. To see all users and to set privaleges a user must have been designated as an Admin either in the Credentials Setup stack or later by enabling the checkbox next to Admin for a user.

If a user is NOT an admin, and thus a Basic User, when viewing the Users panel, they will only be able to see their username and edit their password.
To save ANY edits in the User Pane, click the Update button in the bottom right of the Users pane. After the confirmation alert, the page will refresh.
If a Layout Pro page is being visited for the first time by an admin, users must be enabled for that page by simply clicking the Update button at the bottom right of the Users pane. Be sure to verify all the record and field permissions before clicking Update. After the confirmation alert, the page will refresh and content should be visible, as lack of permissions was blocking viewing before.

If viewing the Users panel w/ admin permissions, each user's settings will be displayed as 'Username', 'Password', 'Admin', 'View Only User Records', 'User Access', 'Delete User' & 'Permissions'. The original admin user, ie., the first in the list can not be deleted, for enhanced security. Therefore, the 'Delete User' button for that admin is not available. The Visitor user is automatically added and only has settings for 'Username', 'Admin' & 'Permissions'.

Usernames are not editable for existing users, as that setting needs to be constant to allow proper functionality. If you wish to change a username, then create another user by clicking the Add User button in the bottom left of the User pane. Edit the new user settings and then click the Delete User button for the original user.

Passwords are not displayed for security reasons and 'Previously Set' is shown in the input. If you wish to change a password, then type it in the input.

Admin when enabled, a user will be able to see & edit all user settings. It also allows that user to see all records and all fields, thus the 'Permissions' will be cleared and 'All Fields Editable' will be shown in the input.

View Only User Records when enabled, will limit that user's access to only the records that they have created or edited. An admin can also assign access to additional record(s) that they have created but wish a basic user to see, even when 'View Only User Records' is set for the basic user, by adding the user to 'User Access'.

User Access is used by admins to assign full record access to basic users assigned w/ 'View Only User Records' permissions. Within the admin section, enter usernames as comma-separated list in the input.

Delete User button will remove that user's login access. After the confirmation alert, the page will refresh.

Field Permissions

Permissions sets the fields that a user can view. If they are assigned as an Admin, then 'All Fields Editable' will be displayed in the input and they will be able to view all fields. If a user should only be allowed to view some of the fields, then disable or toggle off 'Admin' and tags for each field will be automatically displayed. Then remove the fields the user should not view, by clicking the 'x' in the tag. You can see any fields removed by clicking the dropdown arrow to the right of the tags and a field input will be revealed, then click in the field input to see a dropdown of all the removed fields. If the input field is blank, then all fields shown above are viewable. Be sure to also edit the fields for the Visitor user, if there are fields that visitors shouldn't be able to view.

When updates are made to field permissions, don't forget to visit any other Dynamic Content pages and set the permissions on those pages. Permissions are unique for each page and need to be set separately.

Assign Basic User input at the bottom of the Users pane allows an admin to manually add a user w/ 'View Only User Records' permissions to an existing record. In the main webpage layout, select a field from the record in question and then enter the user's username in the input field and click the 'Assign Basic Access' button.

Add User button in the lower left of the Users pane allows an admin to add a new blank user into the user pane. At a minimum, be sure to set the 'Username' & 'Password' and adjust any other settings for that user.

Layout Pro Editing Pane

Click the Layout Pro icon (cube) to enable the Layout Pro pane which will appear to the right of the icons. These controls are used to edit Layout Pro content and are discussed in detail in the next Add/Delete/Update section.

Close Admin

Click the Close Admin icon (up arrow) to close all admin panes and slide up the admin panel.

Add/Delete/Update

Edit pane

In order to make any changes to Layout Pro content, a user must be logged in.

Adding a Record

A record can be added by first clicking the Layout Pro icon (cube) in the Admin panel to enable the Layout Pro Edit pane (if not currently shown) which will appear to the right. Then click the Add Record button (plus icon). Default values will be automatically entered into the fields for the new record. Note: Default values for some fields can be set in Layout Pro Setup 'Default Text'. After the confirmation alert, the page will refresh and the new record can be found at the end of the records by clicking the double-arrows (Last) in the page navigation controls.

Deleting a Record

A record can be deleted by first clicking a field related to that record and then clicking the Layout Pro icon (cube) in the Admin panel to enable the Layout Pro Edit pane (if not currently shown) which will appear to the right. Then click the Delete Record button (minus icon). Note: This will delete the record and all fields in that record. After the confirmation alert, the page will refresh.

Edit Text Field
Edit Image Field

Updating a Record

All editable fields will display a blue border around them when you hover over the field. Any field value can be edited by clicking on the content. An inline editing pane will open that reveals a field label and the current value if it's a simple text field.

If it's an image field, then it will also reveal a thumbnail of the current image and controls for an image drop zone or browse link, as well as, the alt image text field and other related fields. When dropped or selected, images or non-image files related to a field will be automatically uploaded to the upload location set in the related field and the path to the image/file will automatically update in the field value and will show a green outline. During uploading of an image, Layout Pro will check that the image is one of the following types: "jpg", "jpeg", "jpe", "gif", "png", "svg", "bm", "bmp", "webp" or "avif". If you change your mind before updating, you can click the small 'x' button in the thumbnail's upper-right and the existing thumbnail and path will reset.

Email and link fields will also reveal an additional control for display text.

When you have finished editing the content that is currently visible on the screen, click the Update button (wrench icon) in the Layout Pro Edit pane. The page navigation buttons can be used to show different pages of content which can then be edited as well.

To save ANY edits made to visible content, the Update button must be clicked. After updating, the page will automatically refresh and reset to a 'regular' view so any changes can be seen in normal view, but you will still be logged in so you can edit further, if needed. One of the page navigation buttons will flash, which indicates you need to click it to go to the record you just edited. If you were on the last page, then in the pagination buttons, the 'Last Record (>>|)' button will flash green to indicate that you need to click it.

Third-Party Integration

Pro Gallery Main ScreenSet URL MacroSingle Warehouse Settings

Since gallery/lightboxes are very complex stacks with lots of elements, custom integrations have been built-in to allow ease of use for users. Instead of placing static images/text/links in the ProGallery settings, field macros from Layout Pro field stacks will be used.
If you are trying to integrate into other Third-Party stacks, typically you would either drop a Layout Pro stack into a drop zone in edit mode or paste field macros into the Third-Party stack's settings.

Stacks4Stacks: ProGallery 3

In the ProGallery (version 3 ONLY) stack from Stacks4Stacks, in the main edit window, select a 'Thumbnail Layout' & 'Lightbox Type' desired, then in 'Image or Video Sources' click the blue plus button and select 'Single Warehoused Image'. You can add as many 'Single Warehoused Image' child stacks as you want to display at a time. Keep in mind that site visitors will be able to use the page navigation controls to browse through as many pages of images as desired. Note: To speed up setup: it's recommended to fully set up one image and then copy and modify those child stacks afterwards.

Select a 'Single Warehoused Image' then:
Thumbnail Image: click the Set Link button, select 'URL' from the dropdown, paste an image field macro from a Dynamic Content: Layout Pro > 'Std. Img. Macro' into the input box and click the 'Set Link' button.
Lightbox Image: click the Set Link button, select 'URL' from the dropdown, paste an image field macro Dynamic Content: Layout Pro > 'Sm. Retina Img. Macro' into the input box and click the 'Set Link' button.
Image Title: paste a text field macro from a Dynamic Content: Layout Pro > 'Field Macro' into the input box.
Image Caption: paste a text field macro from a Dynamic Content: Layout Pro > 'Field Macro' into the input box.
Alternative Link: paste a link field macro from a Dynamic Content: Layout Pro > 'Field Macro' into the input box. (Optional) Note: this macro can be from a link field that contains a link to a static page or a Dynamic Content detail page.

Note: In this instance, an image has a related set of macros. The only difference between each set should be the 'Dataset Num' set in each Layout Pro field stack. To set up addition images, copy each 'Single Warehoused Image' child stack and then in each macro, edit the number between the two sets of 'yyy' in the macro, which represents the 'Dataset Num' for that field. An example of each input type is shown to the left with the number to change indicated.
Note: The 'Gallery Skin' settings in Dynamic Content: Layout Pro Setup can be used with these third-party stacks to add a thumnail skin overlay.
Gallery Grid SelectionsGallery Integration StackGallery Integration Settings

inStacks: Gallery Stack 3

In the Gallery stack from inStacks, in the main edit window, under 'Select Grid/Slider', click the blue plus button and select a Grid child stack, shown to the left in the green box (Single Image not supported). Slideshows are not supported, as it's typical to only use a few images and thus dynamic content isn't really necessary.
In the Gallery stack, under 'Select Lightbox', click the blue plus button and select a Lightbox child stack (Lightbox:Disabled & Lightbox:Swipebox not supported).
In the Gallery stack, under 'Add Images or Integration Stacks', click the blue plus button and select 'Dynamic Content Integration'. You will only need to add ONE 'Dynamic Content Integration' child stack. Keep in mind that site visitors will be able to cycle through as many pages of images as desired.

Uses Dataset Nm: Enter the 'Dataset Nm' from Dynamic Content: Layout Pro Setup, Note: Can't contain spaces, single/dbl quotes, xxx, yyy or zzz.
Std Res. Img Fld: Field for Standard Resolution Image, Note: Must match 'Std.Img.FldName' in a Dynamic Content: Layout Pro image field.
Alt Text Fld: Field for alternative text, Note: Must match 'Alt. Text Fld' in a Dynamic Content: Layout Pro image field.
Hi-Res Img Fld: Field for Hi-Resolution Image, Note: Must match either '2xSm.Fld. Name' or '2xLg.Fld Name' in a Dynamic Content: Layout Pro image field.
Hi-Res Fld. Loc: Select the 2x field type used within a Dynamic Content: Layout Pro image field, either 2xSm.Fld. Name or 2xLg.Fld. Name.
Use LayoutPro Thumbnail Skin: Enable to use the Layout Pro Thumbnail Skin settings. If using, be sure to enable the 'Gallery Skin' button in Dynamic Content: Layout Pro Setup
Link to Dtl Pg: Enable link from the thumbnail to a detail page. Link will show in the Thumbnail Skin, Note: if disabled, then disable 'Show Link to Dtl Page' in Layout Pro Setup > Gallery Skin settings.
Link Fld: Field for link to detail page. Note: Must match 'Image LInk Fld' in Dynamic Content: Layout Pro.
Max Image Size: Enter the max size limit when uploading an image, Units MB.
Custom Class: Custom CSS Class for styling the image, Note: remove dot (.) at beginning of class name.
Using Grid: Justified: Enable if using the Grid: Justified child stack in the Gallery stack.
Img Height: Enter the image height set in Grid: Justified > Img Height.
Img Margin: Enter the image margin set in Grid: Justified > Img Margin.
Show Caption Below Thumbnail: Enable if showing the caption below the thumbnail image.


Note: When using Grid: Justified, set 'Justify Last Row' to 'no justify', enable 'Using Grid: Justified' in the Dynamic Content Integration stack and make sure the Image Height & Image Margin match those set in the Grid: Justified stack.
Note: When logged-in and editing images, edit panes may move around when images are clicked, this is expected as some lightboxes have different styling than the editor.

Vibralogix: Vibracart Pro

Please refer to Dynamic Content: Layout Pro Setup > General Settings & Dynamic Content: Layout Pro > Field Type Details for further info on how to setup shop items

Layout Pro

About

Layout Pro

In a nutshell: a Dynamic Content: Layout Pro stack allows you to layout content with any kind of custom layout stacks. Layout Pro stacks allow multiple sets of data to be layed out wherever you wish. In addition, content can be assigned inside of 3rd party stacks by placing simple field macros within text input controls.

Note: The Layout Pro stacks are a paid addon to the Dynamic Content main suite which is required and should be purchased for every domain and use of five editors.

Setup

Layout Pro Field

Drag a Dynamic Content: Layout Pro stack onto the page. In the Layout Pro pane to the right, you will see all the controls for this stack. 'Uses Dataset', 'Field Name', 'Field Type' & optional 'Tag Wrap' will be displayed in the main edit window, once those controls are set.

If a 3rd party stack has a dropzone, then you might be able to drop a Dynamic Content: Layout Pro there. If not, there are several other options for placing dynamic content. This will be discussed later in the Move Field Content section.

Basic Content Info

Basic Content Info

This section explains the 'Uses Dataset Nm', 'Dataset Num', 'Uses Field Name' and 'Fld. Display Type' controls.
Uses Dataset Nm: This is a unique name given to all FreeForm Pro content that is related to each other. Even though you may not have set up Dynamic Content: Layout Pro Setup yet, this will be used in it's 'Dataset Nm'. An example of a dataset name should be a unique name that represent all the images in a gallery and all their related fields that are being brought in. The dataset name can't contain any spaces, single or double quotes, xxx, yyy or zzz. Use lowercase, alpha numeric only characters.
Dataset Num: Enter a relative row number (record) from the dataset to pull content from. This number represents a related set of content displayed on the screen. Typically, a dataset num would be the same across a set of related fields such as an image, a title and alt text, etc for a record. You can have as many dataset nums (records) as you wish on the page at a time.
Uses Field Name: This is the field name from Dynamic Content: Database Setup to use. The field name can't contain any spaces, single or double quotes, xxx, yyy or zzz. The Field Name selected will be displayed in edit-mode w/in the stack for your convenience.

Note: If 'Fld. Display Type' is set to 'Image', then the 'Uses Field Name' control will be hidden and 'Std. Img. FldName' should be used instead.

Fld. Display Type: A content type of 'Text', 'Integer Number', 'Floating Number', 'Date', 'Time', 'Money', 'Email', 'Image', 'Link', 'Shop Buy Button (VCP)', 'Shop Single Price (VCP)', 'Shop Quantity Price (VCP)', 'Shop Description (VCP)' or 'Shop Image (VCP)' can be selected. The field display type must generally match the field type set up in Dynamic Content: Database Setup, with a few exceptions which are stated below. 'Fld. Display Type' selected will be displayed in edit-mode within the stack for your convenience.

Note: Each 'Fld. Display Type' has a color-coordinated color and icon to make working w/ fields visually easy:
Medium Blue (A ¶ icon) for Small/Large Text
Yellowish-Orange(1 icon) for Integer Number
Yellowish-Orange (1.0 icon) for Floating Number
Red ( icon) for Date
Pink ( icon) for Time
Medium Green (Currency icon) for Money
Cyan( icon) for Email
Redish Purple (Picture icon) for Image
Light Grey ( icon) for Link
Orange ( icon) for Shop Buy Button/Single Price/Quantity Price/Description/Image

The Fld. Display Type Exceptions are:
General text: 'Small Text' or 'Large Text' in Database Setup would match to 'Sm/Lg Text' in Layout Pro.
Currency: 'Floating Number' in Database Setup would match to 'Money' in Layout Pro.
'Small Text' in Database Setup could optionally match to either 'Email', 'Image' or 'Link' in Layout Pro.
Shop fields used with a Vibracart Pro shopping cart only require ONE field to be set up and will be discussed further in the Field Type Details section.

Field Type Details

This section explains the various controls for each field type, depending on what is selected in 'Fld. Display Type'.

Sm/Lg Text

Note: Use 'Sm/Lg Text' for Small or Large text created in Database Setup. (No detail controls at this time)

Integer Number Controls

Integer Number


Thou. Separator: Sets a character symbol to use for the thousands separator character, if the number is big enough.
Enable Integer Replacement: Enable to allow integers to be replaced with custom text or a symbol in place of an integer stored in the database. An integer of one or greater will use the '1- Replacement' and zero will use the '0-Replacement'.
Enable Font Awesome: Enable to allow integers to be replaced with a font awesome icon. Use fa name only, Ex: fa-magic
1-Replacement: Enter the text or font awesome name to replace integer of one or greater. Note: No single or double quotes.
FA1 Color: The color for font awesome-1 replacement icon.
0-Replacement: Enter the text or font awesome name to replace integer of zero. Note: No single or double quotes.
FA0 Color: The color for font awesome-0 replacement icon.

Floating Number Controls

Floating Number


Thou. Separator: Sets a character symbol to use for the thousands separator character, if the number is big enough.
Decimal Point: Sets a character symbol to use for the decimal point.

Note: Floating number fields are set to field type of Double and can support up to 16 total digits of precision. This total includes any digits after the decimal point.
Date Controls

Date


Date Format: Select the date to display in either mm/dd/yyyy or dd/mm/yyyy format.

Time Controls

Time


Time Format: Select the time to display in either 12-hour (am/pm) or 24-hr format.

Money Controls

Money


Currency Symbol: Set the character to use for the currency symbol.
Curr. Position: Select the currency symbol position to display either before or after the number.
Thou. Separator: Sets a character symbol to use for the thousands separator character, if the number is big enough.
Decimal Point: Sets a character symbol to use for the decimal point.

Email Controls

Email Client Prompt

Email


Email (color): Set the email text default color.
Email Hover (color): Set the email text hover color.
Email Display Fld: Enter email display text field from Dynamic Content: Database Setup. The text from this field is displayed instead of a real email to prevent spam bots from harvesting emails. Don't use an email address here, just enter a display field that will contain generic display text. An example of proper email display fld values within a table might be 'Bill's Email' or 'Contact Me' or 'Design Dept'. The email text field name can't contain any spaces, single or double quotes.
When viewing an email link in read-only mode, modern browsers may show an alert prompting to allow an email. Simply click the allow button and a new email will open in the default email app.

Image Controls

Image


Std.Img.FldName: Enter an image field name from Dynamic Content: Database Setup. There are three image field names. This field is required as a minimum, but the other two are optional. The standard image field name can't contain any spaces, single or double quotes, xxx, yyy or zzz.
2xSm.Fld. Name: Enter an image field name from Dynamic Content: Database Setup. This is for a small 2x sized image (max width 1536px), but is optional. The 2x small image field name can't contain any spaces, single or double quotes, xxx, yyy or zzz.
2xLg.Fld. Name: Enter an image field name from Dynamic Content: Database Setup. This is for a large 2x sized image (min width 2048px), but is optional. The 2x large image field name can't contain any spaces, single or double quotes, xxx, yyy or zzz.
Alt. Text Fld: Enter an image alternate text field from Dynamic Content: Database Setup. The alternate text field name can't contain any spaces, single or double quotes, xxx, yyy or zzz.
Img Location: Select the image display & upload path location used during editing as either 'Path in Field', 'Resources' or 'Custom Path':
  'Path in Field' indicates that the image path as well as the image name is stored in the database. Not recommended, as hardcoded path will break if used on different pages w/ different folder levels.
  'Resources' indicates that images are stored in the Resources folder.
  'Custom Path' indicates that images will be stored in a separate warehouse folder.
Image Folder: If 'Resources' is selected in 'Img Location', enter the Resources subfolder path to save images to. Note: Add slash to end of last folder. Leave blank if saving images in root of Resources folder.
Custom Path: If 'Custom Path' is selected in 'Img Location', enter the custom url to save images to. Note: Add an ending slash and should point to the same site.
Max Image Size: Enter the max file size limit when uploading images, units MB. Note: Decimal value OK.
Link To: Select a button to apply a link type to an image (Optional) 'Static Pg' is a standard link typically applied to images NOT moved into 3rd-party stacks, 'Dyn. DtlPg' is a link to a Dynamic Content detail page. Note: Select only one Link To button
Image Link Fld: When using 'Link To', enter an image link field from Dynamic Content: Database Setup. Can't contain spaces, single or double quotes, xxx, yyy or zzz.
Link Location: Select the image link location used during editing:
  'Path in Field' indicates that the image link path & the page name is stored in the field. Not recommended, as hardcoded path will break if used on different pages w/ different folder levels.
  'Custom Path' indicates that the image link path will be to a separate folder.
Custom Link Path: If 'Custom Path' is selected in 'Link Location', enter the custom image link path. Note: Add ending slash and should point to the same site.

Link Controls

Link


Link is typically used to link from text to either another page or a non-image file. If the link will be from an image, then it is recommended to use a 'Fld. Display Type' of 'Image' and use the dedicated 'Link To' controls within the image type.

Link Location: Select the link path used during editing as either 'Path in Field', 'Custom Path' or 'Use Non-Image File Location'. Select the link location used during editing:
  'Path in Field' indicates that the link path & the page name is stored in the field. Not recommended, as hardcoded path will break if used on different pages w/ different folder levels.
  'Custom Path' indicates that the link path will be to a separate folder.
  'Use Non-Image File Location' indicates that a link is to a non-image file & 'Non-Image File' should be enabled & a non-image file path used.
Custom Path: If 'Custom Path' is selected in 'Link Location', enter the custom url link path. Note: Add ending slash and should point to the same site.
Link (color): Set the link text default color.
Link Hover (color): Set the link text hover color.
Link Displ. Fld: Enter link display text field from Dynamic Content: Database Setup which is displayed for a link. The link display field name can't contain any spaces, single or double quotes, xxx, yyy or zzz.
Non-Image File: Enable this button if linking to a Non-Image file that is to be viewed/downloaded, Ex: .pdf, .zip, .txt
File Location: Select the non-image file display & upload path used during editing as either 'Path in Field', 'Resources' or 'Custom Path':
  'Path in Field' indicates that the non-image file path as well as the file name is stored in the database. Not recommended, as hardcoded path will break if used on different pages w/ different folder levels.
  'Resources' indicates that non-image files are stored in the Resources folder.
  'Custom Path'' indicates that non-image files will be stored in a separate warehouse folder.
File Folder: If 'Resources' is selected in 'File Location', enter the Resources subfolder to save non-image files to. Note: Add slash to end of last folder. Leave blank if saving files in root of Resources folder.
Custom URL: If 'Custom Path' is selected in 'File Location', enter the custom url to display & save non-image files to. Note: Add ending slash & should point to the same site.
Max File Size: Enter the max file size limit when uploading non-image files, units MB.
Link to Dtl Pg: Enable this button if link is to a Layout Pro detail page.

Shop Buy Button (VCP)

Shop Buy Button (VCP)


Layout Pro stacks support cart & payment setup from Vibracart Pro by VibraLogix. Select 'Shop Buy Button (VCP)' in 'Fld. Display Type' to set the actual buy button that visitors will click to buy the product.

Note: All Layout Pro field stacks related to shop content of any type, will only need to reference ONE field that contains the 'product_id' setup within Vibracart Pro.

Uses Field Name: Enter the field name from Dynamic Content: Database Setup to use and this field should contain the 'product_id' that is setup within Vibracart Pro for a product, Note: Use alpha-numeric lowercase characters, Underscore OK, Can't contain spaces, single/dbl quotes, xxx, yyy or zzz.
Shop Currency: Select the shop button currency as either 'USD', 'GBP', 'EUR', 'CAD', 'AUD', 'BRL', 'CHF', 'CZK', 'DKK', 'HKD', 'HUF', 'ILS', 'INR', 'JPY', 'MXN', 'MYR', 'NZD', 'NOK', 'PHP', 'PLN', 'RUB', 'SEK', 'SGD', 'THB' or 'TWD'.

Note: Make sure the currency selected matches what is set in the Vibracart Pro admin settings.

Shop Single Price (VCP)

Shop Single Price (VCP)


Select 'Shop Single Price (VCP)' in 'Fld. Display Type' to set the product price to a single price that is setup in Vibracart Pro.
Uses Field Name: Enter the field name from the database to use and should contain the 'product_id' that is setup within Vibracart Pro, Note: Use alpha-numeric lowercase characters, Underscore OK, Can't contain spaces, single/dbl quotes, xxx, yyy or zzz.
Shop Currency: Select the shop button currency as either 'USD', 'GBP', 'EUR', 'CAD', 'AUD', 'BRL', 'CHF', 'CZK', 'DKK', 'HKD', 'HUF', 'ILS', 'INR', 'JPY', 'MXN', 'MYR', 'NZD', 'NOK', 'PHP', 'PLN', 'RUB', 'SEK', 'SGD', 'THB' or 'TWD'.

Note: Make sure the currency selected matches what is set in the Vibracart Pro admin settings.

Shop Quantity Price (VCP)

Shop Quantity Price (VCP)


Select 'Shop Quantity Price (VCP)' in 'Fld. Display Type' to set the product price to a listing of prices based on quantity that is setup in Vibracart Pro.
Uses Field Name: Enter the field name from the database to use and should contain the 'product_id' that is setup within Vibracart Pro, Note: Use alpha-numeric lowercase characters, Underscore OK, Can't contain spaces, single/dbl quotes, xxx, yyy or zzz.
Shop Currency: Select the shop button currency as either 'USD', 'GBP', 'EUR', 'CAD', 'AUD', 'BRL', 'CHF', 'CZK', 'DKK', 'HKD', 'HUF', 'ILS', 'INR', 'JPY', 'MXN', 'MYR', 'NZD', 'NOK', 'PHP', 'PLN', 'RUB', 'SEK', 'SGD', 'THB' or 'TWD'.

Note: Make sure the currency selected matches what is set in the Vibracart Pro admin settings.

Shop Decription (VCP)

Shop Description (VCP)


Select 'Shop Description (VCP)' in 'Fld. Display Type' to set a description of the product from text that is setup in Vibracart Pro (No detail controls at this time).
Uses Field Name: Enter the field name from the database to use and should contain the 'product_id' that is setup within Vibracart Pro, Note: Use alpha-numeric lowercase characters, Underscore OK, Can't contain spaces, single/dbl quotes, xxx, yyy or zzz.

Shop Image (VCP)

Shop Image (VCP)


Select 'Shop Image (VCP)' in 'Fld. Display Type' to set an image for the product that is setup in Vibracart Pro. (No detail controls at this time).
Uses Field Name: Enter the field name from the database to use and should contain the 'product_id' that is setup within Vibracart Pro, Note: Use alpha-numeric lowercase characters, Underscore OK, Can't contain spaces, single/dbl quotes, xxx, yyy or zzz.

Note: Clicking on a Shop Image will trigger a click on the shop buy button and enter the product in the shopping cart.

Move Field Content

Move Field Content

Move Field Content is to allow the content to be moved into another location on the page, whether that is within a 3rd-party stack or a unique location like a sidebar or extra content area.

Move Field Content: Enable this button to move content to a new location. This is useful when trying to move plain text characters into the sidebar or extra content areas or when injecting content into third-party stacks.
Hide Field in Read Only: Enable to hide the field in Read-Only mode.
Use Hidden Text in Edit: Enable to use default hidden text if the field is not editable in Edit Mode.
Hide Field in Edit: Enable to hide the field in Edit Mode.

Std Field Macro

When 'Move Field Content' is enabled, a field macro button will be displayed in the Dynamic Content: Layout Pro stack. Right-click on the field macro button and you should see macro text appear and the text highlighted. At the same time, a contextual menu will appear, select 'Copy' and then paste this text where you want the content to be moved (typically into a 3rd-party control).

Image Field

Image Field Macros

For image fields, there can be up to four different macros displayed, depending on which fields are used.

Image Field Macros Revealed

For image field macros, try right-clicking on the lowest macro to reveal all of the macros for that field.
 

When placing a macro on the page, I have provided the free DropWrapper stack to quickly facilitate the creation of a wrapper. If you won't be styling the contents with css, just set 'Tag' to 'Span' and 'Attribute Type' to 'None', which creates a clean span for the macro & the moved content to be placed into. If you wish to style content, then you may want to set 'Attribute Type' to 'ID' or 'Class' to allow styling. The field macro can also be pasted into a text or html stack, but those create a lot of additional styling and code. Please Note: the moved content will bring in wrapping spans and optional styling tags, but they are styled to be inline, so you could wrap the macro in other static text, if you so desire.
Macros can be pasted into 3rd-party stack controls, if they expect plain text.

Images

When trying to move images into 3rd-party stacks there are several options:

1) If they offer a drop zone for images you can try to drop a Dynamic Content: Layout Pro stack in there. This is assuming that they allow other stacks in the dropzone.
2) Macros can be pasted into 3rd-party stack controls, if they expect plain text. Ex: If a 3rd-party stack has a control for the image path, then you could paste a field macro into that control. Other attributes like alt tag, title, date, etc can also be added using a field macro.

Advanced Option: - Only attempt if you are comfortable changing code -
It is possible to modify a 3rd-party stack to allow a Layout Pro stack inside of it. If you would like to try, make a copy of the 3rd-party stack, then right-click on it in the Finder and select 'Show Package Contents' and look for the template.html file, open it in a text editor, such as BBEdit. Search for 'slice' and inside of that you will find -addTypes="...". Inside of the double-quotes, at the end, add a comma and a space then type: com.stackits.dynamiccontentlayoutpro Save and then shut down RW and restart RW and see if it allows a Layout Pro stack to be dropped in. You will still need to publish to see if it really works. If not, then be sure to replace the 3rd-party stack w/ the copy you made.

Depending on how the stacks are loaded and in what order, 3rd-party functions may be running before the images are loaded, which can cause functionality to be broken. This can sometimes be fixed by changing the 3rd-party script.js file. Be sure to first make a copy of the stack before attempting this:
Change the line that says:
$(document).ready(function() {
     to
$(window).on('load', function() {

Layout Pro Help

Layout Pro Help

Enable to show in-editor help on various Layout Pro settings.

Content Styling

Content Styling

This section explains the: 'Assign Wrap Elements', 'Wrap Elem(s)', 'Multiple Instance of This Field', 'Opt. Tags', 'Enable Beginning Characters', 'Begining Char', 'Enable Ending Characters', 'Ending Char', 'Content Styling', 'Text Font', 'Text Size', 'Text LineHt', 'Hor. Align', 'Text Color' (color), 'Use Custom Google Font', 'Cust. Google Fnt', 'Google Wt' & 'Sharpen Images' controls.
Assign Wrap Elements: Enable to assign unique wrap element(s) to this field. Note: Used to hide wrap elements when filtered out. If using on grouping of shop fields, use on Shop Buy button field.
Wrap Elem(s): Enter wrapping elements. Note: separate with a comma, Ex: .one,.two,#three.
Multiple Instance of This Field: If a field is to be displayed on a page more than once, then enable this button to apply tags / styling to this field instance.
Opt. Tags: If you would like to add a wrapping tag around the content, then select one of the buttons. Note: Only ONE of the buttons can be used at a time.
The 'H' Button enables a heading tag.
The Horizontal Lines Button enables a paragraph tag.
The 'B' Button enables a bold tag.
The 'I' Button enables an italic tag.
The 'Tag Wrap' selected will be displayed within the stack in edit-mode for your convenience.
Heading Tag: If 'H' is selected from 'Opt. Tags', select the heading tag to use as either 'Heading 1', 'Heading 2', 'Heading 3', 'Heading 4', 'Heading 5' or 'Heading 6'.
Enable Beginning Characters: Enable to apply characters before the Layout Pro content. This is useful to insert small amounts of text or small html snippets before the content. Note, if html - set a class on the wrapping parent.
Beginning Char: Enter the beginning characters of text or html.
Enable Ending Characters: Enable to apply characters after the Layout Pro content. This is useful to insert small amounts of text or small html snippets after the content.
Ending Char: Enter the ending characters of text or html.
Content Styling: Enable this button to apply additional styling to the Layout Pro content.
Text Font: Select the font to apply to Layout Pro content as either 'Theme Default' (Inherited & Default), 'Dynamic Content Default' (Source Sans Pro), 'Arial Black', 'Cooper Black', 'Courier New', 'Cursive', 'Futura', 'Georgia', 'Geneva', 'Gill Sans', 'Helvetica', 'Helvetica Neue', 'Hoefler', 'Impact', 'Lucida Console', 'Lucida Grande', 'Myriad Pro', 'Palatino', 'Rockwell', 'Times New Roman', 'Trebuchet MS' or 'Verdana'.
Text Size: Set the text font size.
Text LineHt: Set the text line height.
Hor. Align: Select the type of text horizontal alignment as either 'Left', 'Center' or 'Right'.
Text Color: Set the text color. This does not affect email & link text and hover colors, instead use the dedicated field controls.
Enable Text Cleanup: If 'Sm/Lg Text' is selected in 'Fld. Display Type', enable to apply text cleanup to text fields ONLY during editing. Provides capitalization of first word of a sentence, lowercase all other words unless word is escaped w/ back slash '/' at beginning of word and period at sentence end. Note: this must be enabled to allow word count limit functionality set in Layout Pro Setup.
Use Custom Google Font: Enable to use a custom Google font for the Layout Pro content. This will overide the Text Font setting.
Cust. Google Fnt: Enter the name of a Google font to use. No single or double quotes allowed.
Google Wt: Enter the Google font weight, but only if it's other than normal weight (400).
Sharpen Images: When an image field is selected, Enable to sharpen the images by turning off antialiasing.

Dynamic Conditionals

Dynamic Conditionals

This section explains the: 'Dyn. Conditionals', 'Conditional Type', 'Math Calculation', 'Rounding Dec', 'Display In', 'Display Field', 'Display Div', 'If This Fld', 'Value', 'Do This Action', 'Styling CSS', 'Field Name', 'Div ID' & 'Add Close Icon' controls.

Dynamic Conditionals will do a specified conditional type of action, based on the value of a field, so it can be a very powerful layout tool.

Dyn. Conditionals: Enable this button to apply Dynamic Conditionals for this field. Also, enable 'Setup Dyn. Cond' in Layout Pro Setup.
Conditional Type: Select the type of dynamic conditional to use as either 'None', 'Calculation Across Fields', 'Sum of a Field', 'Average of a Field', 'Count of a Field' or 'Check Condition':
'None' will disable conditionals and if a decision is made to turn off dynamic conditionals, be sure to set this to 'None' before disabling 'Dyn. Conditionals'.
'Calculation Across Fields' will allow math calculations across a record's fields and then display the result.
'Sum of a Field' will allow an automatic summation of all values for the current field across all records.
'Average of a Field' will allow an automatic average of all values for the current field across all records.
'Count of a Field' will allow an automatic count of the current field across all records.
'Check Condition' will check the value of the current field and then do a selected action.
Math Calculation: If 'Calculation Across Fields' is selected from 'Conditional Type', enter a math calculation formula. Note: Enter fields as {{field}}, Ex. {{field1}} + {{field2}} would give the sum of the two fields values.

Note: Editing of a field is disabled that has a Calculation Across Fields, Sum of a Field, Average of a Field or Count of a Field.

Rounding Dec: When running a 'Math Calculation', set the number of decimals to round the result to.
Display In: Select the location where the result is displayed as either 'This Field', 'Other Field' or 'Other Div'.
'This Field' will display the result in the current field. Note: Any value currently in the field will be temporarily replaced with the result.
'Other Field' will display the result in the designated display field. Note: Any value currently in the display field will be temporarily replaced with the result.
'Other Div' will display the result in the designated display div. Note: Any value currently in the display div will be temporarily replaced with the result.
Other Field: If 'Other Field' is selected from 'Display In', enter the field where the result is displayed.
Display Div: If 'Other Div' is selected from 'Display In', enter the div where the result is displayed, ie #mydiv
If This Fld: If 'Check Condition' is selected from 'Conditional Type', select the condition to check for as either 'Contains', 'Doesn't Contain', 'Equal', 'Not Equal', 'Empty', 'Not Empty', '<', '>', '<=', '>=' or 'Between (use - as separator)'.
'Contains' is used to show matches for text.
'Doesn't Contain' is used to show any non-matches for text.
'Equal' is to show numerical equal matches for numbers.
'Not Equal' is to show numerical non-matches.
'Empty' will show matches for a field that contains nothing.
'Not Empty' will show matches for a field that contains something.
'<' will show numerical less than matches for numbers.
'>' will show numerical greater than matches for numbers.
'<=' will show numerical less than or equal to matches for numbers.
'>=' will show numerical greater than or equal to matches for numbers.
'Between (use - as separator)' will show date/time/numerical matches between values. Note: bounding values will also be shown.
Value: Enter the value to check against.
Do This Action: Select the action to do when the condition is met as either 'None', 'Style This Field', 'Style Another Field', 'Style Div', 'Show Field', 'Hide Field', 'Show Div' or 'Hide Div'.
'None' will disable 'Do This Action' and if a decision is made to turn off an action, be sure to set this to 'None' before selecting another 'Conditional Type'.
'Style This Field' is used to assign css styling to the current field.
'Style Another Field' is used to assign css styling to another designated field.
'Style Div' is used to assign css styling to a designated div.
'Show Field' is used to reveal a designated field that was originally hidden. Note: Be sure on the designated field, enable 'Hide Field in Read Only' so that field will be hidden until the condition is met.
'Hide Field' is used to hide a designated field.
'Show Div' is used to show a designated div that was originally hidden by some custom css.
'Hide Div' is used to hide a designated div.
Styling CSS: If a 'Style *' selection is made, enter the css styling used. Note: Separate style:value pairs with a semicolon (;)
Field Name: If a '* Field' selection is made from 'Do This Action', enter the field name to apply the action to.
Div ID: If a '* Div' selection is made from 'Do This Action', enter the div to apply the action to, ie #mydiv
Add Close Icon: Enable to add a close icon to the shown field/div.

Filter Buttons

Filter Button
General Controls
Individual Controls

Filter Buttons are meant to be used when you wish to give visitors an quick way to filter content w/o having to enter settings in the Layout Pro filter controls. One Filter Button Control is added by default in the main edit mode window below 'Layout Pro Filter Buttons', but you can click the blue plus button in edit mode to add as many as you desire. Within each Filter Button Control, Button display text, Preset Field, Preset Filter Type, Preset Value & Preset Sort are shown for your convenience. If you wish to set any preset filter values, then click on a Filter/ Button Control. In the controls pane to the right, you will see all the controls for this stack. It's recommended that you turn OFF the filter controls in Dynamic Content: Layout Pro Setup for each filter by enabling 'Hide All Filter Controls' which will force users to just use the buttons. Hiding the normal filter controls is optional, but it may eliminate confusion on which controls to use.

Note: Due to the nature of all filter settings being preset, the settings will not be editable when doing on-line editing. Settings must be changed in Dynamic Content: Layout Pro Filter Buttons & then republish the page.

This section describes the general controls that apply to all buttons and includes 'Filter Button Font', 'Use Custom Google Font', 'Cust. Google Fnt', 'Google Wt', 'Text Size', 'Text LineHt', 'Font Style', 'Font Weight', 'Border Width', 'Border Radius', 'Text' (color), 'Border' (color), 'Button BG' (color), 'Button Alignment' and 'Buttons Help'.

General Controls

Filter Button Font: Select the font to use for the filter button text as either 'Theme Default' (Inherited & Default), 'Dynamic Content Default' (Source Sans Pro), 'Arial Black', 'Cooper Black', 'Courier New', 'Cursive', 'Futura', 'Georgia', 'Geneva', 'Gill Sans', 'Helvetica', 'Helvetica Neue', 'Hoefler', 'Impact', 'Lucida Console', 'Lucida Grande', 'Myriad Pro', 'Palatino', 'Rockwell', 'Times New Roman', 'Trebuchet MS' or 'Verdana'.
Use Custom Google Font: Enable to use a custom Google font for the button text - Note: overrides Filter Button Font.
Cust. Google Fnt: If custom Google font, enter name of Google font, Note: No single/dbl quotes
Google Wt: Only enter Google font weight for the button text if it's anything other than normal (400).
Text Size: Set the filter button text size, Units rem.
Text LineHt: Set the filter button text line height, Units rem.
Font Style: Select the font style for the filter buttons.
Font Weight: Select the font weight for the filter buttons.
Border Width: Set the filter button border width, Units px.
Border Radius: Set the filter button border radius, Units px.
Text (color): Set the filter button text color for both normal and hover conditions.
Border (color): Set the filter button border color for both normal and hover conditions
Button BG (color): Set the filter button background color for both normal and hover conditions.
Button Alignment: Select the alignment for the filter buttonsas either 'Left', 'Center' or 'Right'.

Individual Controls


This section describes the individual controls that uniquely apply to each filter button and includes 'Button Text', 'Field Name', Filter Type', 'Value' and 'Sort Direction'. To add a button, just click the blue plus in the main edit window. Settings for each button are displayed in the main edit window for your convenience.

Button Text: Enter the text to display in the filter button.
Field Name: Enter the field name from the database to filter on, Note: Use alpha-numeric lowercase characters, Underscore OK, Can't contain spaces, single/dbl quotes, xxx, yyy or zzz.
Filter Type: Select the filter type to use which can either be 'Contains', 'Doesn't Contain', 'Between (Use - separator), '=', '!=', '<', '<=', '>' or '>='.
'Contains' is used to show matches for text.
'Doesn't Contain' is used to show any non-matches for text.
'Between (use - as separator)' will show date/time/numerical matches between values. Note: bounding values will also be shown.
'=' is to show numerical equal matches for numbers.
'!=' is to show numerical non-matches.
'<' will show numerical less than matches for numbers.
'<=' will show numerical less than or equal to matches for numbers.
'>' will show numerical greater than matches for numbers.
'>='will show numerical greater than or equal to matches for numbers.
Value: Enter the value to filter for.
Sort Direction: Select the filter sort direction as either 'Ascending' or 'Descending'.
Button Edit Text: Enable this button to change the Layout Pro Filter Buttons setttings text in the main edit window'.
Contains: Enter the filter button main edit window contains text.
Doesn't Contain: Enter the filter button main edit window doesn't contain text.
Between: Enter the filter button main edit window between text.

Buttons Help

Layout Pro Filter Buttons Help

Enable to show in-editor help & tips on various Layout Pro Filter Button settings.

Backup

Backup
Backup Settings

Everyone wants to protect their data, but getting a backup when you wanted it is often out of reach for most servers. They usually do database backups, but on their schedule, which may not be right for you. Dynamic Content: Backup allows you to do backups on your schedule and before any updates are made and even allows you to automatically manage the backup rotations.

Note: Backup is an additional purchased addon to the Dynamic Content suite, but I think everyone should protect their valuable data - be safe, not sorry.

Backup files (date-stamped .csv's) are automatically created when a user first logs into the new Grid or Layout Pro to do some editing. The backup files are stored on your server in rw_common > plugins > stacks > dcbackups. Any files can be directly imported through Grid's Import button.

This section describes the controls that apply to backing up your database files and includes 'DC Layout Type', 'Table Name(s)', 'Time Between', 'Max Keep Time', 'Uses Framework' and 'jQuery at End of Body'.

DC Layout Type: Select the Dynamic Content layout type used on this page as either 'Grid(s)' or 'Layout Pro'. Note: It is possible to have both Grid & Layout Pro on the page, you would need to add a Backup stack for both Layout Pro & one for an unlimited number of Grids. Note: adding more than one will slow down the page.
Table Name(s): Enter the table name(s) from the database(s). List in order from top of page to the bottom. Note: No spaces/single/dbl quotes. Separate table names with a comma.
Time Between: Select the minimum time between backups as either '1hr', '2hrs', '4hrs', '8hrs', '1day', '2days' or '1wk'.
Max Keep Time: Select the maximum time to keep backups on server as either 'Keep All Backups', '1 hr', '2 hrs', '4 hrs', '8 hrs', '1 day', '2 days', '1 wk', '2 wks', '1 month' or '2 months'. Note: 'Keep All Backups' will eventually fill server.
Uses Framework: Enable if page/theme uses a Framework: Foundation/Foundry/Bootstrap.
jQuery at End of Body: Enable if Page/Theme moves jQuery to end of the body tag.

Troubleshooting

Requirements

Dynamic Content's minimum requirements are MacOS10.10+, PHP: 5.6+/7+/8+, 'vanilla' MySQL & MariaDB databases, RW6/7/8/Classic & Stacks 3.5/4.

• Pro addon Layout Pro: Requires the main Dynamic Content suite.
• General addon Backup: Will work with either Grid or Layout Pro.

• Pro addon ProGallery3 (lightbox) by Stacks4Stacks: Requires the main Dynamic Content suite & Layout Pro.
• Pro addon Gallery3 (lightbox) by inStacks: Requires the main Dynamic Content suite & Layout Pro.
• Pro addon Vibracart Pro (payment cart) by Vibralogix: Requires the main Dynamic Content suite & Layout Pro.

Preview in RW

When trying to preview within RapidWeaver, if you get a Fatal error warning, RW is trying to render PHP which is not available in Preview. Note: To view dynamic content you must publish to your server.

To allow preview of other content within RapidWeaver, in the main menu go to: RapidWeaver > Preferences > General tab > Uncheck 'Render PHP on Local Preview'
You wiill then see: '(Dynamic Content *** Will Render Here - Please Publish)' for each instance of dynamic content.

Setup Steps

Stack Setup Order

The Dynamic Content stacks must be setup in this order:

  • Login Setup (Only ONE per project & on a separate page)
  • Main Content Page:
  • Credentials Setup (Only ONE per project)
  • Database Setup
  • Control stacks (Grid OR Layout Setup OR Layout Pro Setup)
  • If using the layout stacks, place as many as desired of either (Layout OR Layout Pro)

2-Step Publish

  • On a page containing Dynamic Content stacks, enable the setup button on a control stack & publish the page (For Publish Efficiency, it's recommended to select the page in the left panel, right-click on it & select 'Publish Page').
  • Visit the page & you should see a green alert(s), click the 'Great' button.
  • Back in RW, disable the setup button on the control stack & publish the page.
  • Visit the page & you shouldn't see any alerts (try clearing the history & caches if you do).
If you have previously installed a Demo version: you will need to replace it with the paid version stacks. After you have placed the paid versions and copied all the settings to the paid versions, you can go the addons folder and delete the demo stacks: In the main menu, go to RapidWeaver > Manage Addons. Then select the Stacks tab and search for 'Dynamic Content' or 'EasyDB' (for older stacks) and then delete any stacks with "Demo" in the name. Any data that you have already created in a table will be available once the new stacks have been set up.

Control Inputs

Whenever entering anything into a stack control, be sure to hit Return to set the value. Also, please check that spaces have not been accidentally entered either before or after a value, as that may break functionality.

Safari - Develop Menu

To enable the Develop menu in Safari, in Safari's main menu go to Safari > Preferences > Advanced tab and enable 'Show Develop menu in menu bar'. This will allow you to clear the browser cache using Develop > 'Clear Cache' (Option + Command + E).

Note: Safari tends to hold onto site & browser cache data, so I have found it necessary after a publish to: Clear the cache & refresh the page then repeat both of those steps a second time. Sometimes first clear the history to get a new updated version of the page.

Publishing

  • Be sure to turn off any add blockers, all other FTP & bandwidth intensive programs while setting up, as those will usually cause publishing errors.
  • When changing settings be sure to hit Return after every entry to set the new value, otherwise it may not remember the new setting. When setting up or updating any settings, be sure to do the 2-step publish process on one stack at a time with any other stacks 'Setup/Update' buttons disabled.
  • When publishing pages, it is best to only publish the current page:

In RW6: go to main menu File > Re-Publish All Files. With RW6, you must visit every Dynamic Content page before going to step-2
In RW7/8/Classic: Make sure the page has a dot next to it, which indicates changes have been made and then right-click on that Dynamic Content page and select 'Publish Page' to publish just that page.

  • Be sure to visit a Dynamic Content page after each publish step.
  • Make sure your browser's privacy setting is not blocking data, so you can see the setup alerts.
  • Wait to use the 'Clear Cache & Refresh Page' button until after you have visited the page on the 2nd publish step.
  • Make sure to clear the browser & site cache twice after a publish change - this can be done in Safari by using the 'Develop' menu & selecting 'Empty Caches' (Option + Command + E), then refresh the page, select 'Empty Caches' again & then refresh a final time.
  • Make sure you are not publishing to a site that is being hosted on a CDN service like CloudFlare, ie disable it while publishing so you can see the changes.
  • If you see any server errors or publishing errors in the RW publishing pane, in RW go to the Publishing tab and set Connections to a lower number of connections. A high number of connections can 'choke' a server as too much data is being sent at once.
  • Make sure after you are done, every stack update button is disabled and the final 2-step page publish is done.
  • If you are using a Theme or Framework that places jQuery at the bottom of the page, then in Dynamic Content: Grid/Layout Pro Setup, enable 'jQuery at End of Body' and republish that page.

Login Setup

Place only ONE Dynamic Content: Login Setup stack on a separate page. Be sure to do the 2-Step Publish on this page before continuing.

Note: The 'Username Label' & 'Password Label' are for setting text prompts to guide users when logging in. DO NOT put usernames or passwords in these inputs !

Credentials Setup

There should only be ONE Dynamic Content: Credentials Setup per project.

Main DB User

Within the Credentials Setup stack in the Set/Upd DB Credentials section, make sure that the DB Username that you enter has been given full privileges for the database. Privileges are typically set in your hosting control panel under something similar to 'MySQL Databases'. Also, make sure you enter the entire string that is assigned for the DB Username & that varies by host.

Dynamic Content Users

Be sure to set up at least one Dynamic Content user in the Credentials Setup stack in the Set/Upd UsrCred section. This first user should have 'Role' set to 'Admin' and 'View' set to 'All Records'.

Database Setup

Existing Database

Some users may wish to use an existing database table to populate Dynamic Content. This is fine as long as the field types used in the existing table match the field types Dynamic Content expects. The field types are: Small Text: varchar(*), Large Text: text, Integer: int(11), Floating Number: double, Date: date, Time: time

Note: Database Setup is still required to be setup with the same field types and will not hurt the existing data.
Within the existing table on the server, a field named 'dcusers' w/ type of 'text' will need to be added immediately after the auto-increment id field. This field is used for permissions and is necessary for editing.

Renaming Fields

When renaming fields, you must select the field and then enable 'Rename This Field', copy the old field name into 'Exist. Field Name', then rename 'Field Name' to the new name and then publish the page & visit the page. On the second step of the 2-step process: remove the 'Exist. Field Name', disable 'Rename This Field' and publish again and visit the page. This should complete the name change and you can optionally check on your server to verify the field name was changed in the table.

Require Login

When initially setting up Dynamic Content: Database Setup, don't enable 'Require Login' until after you have setup the display stacks and can login. This control will force a login to see the page, but is a hinderance and will slow down initial setup progress of the stacks.

Connect Helper

Be sure to enable the 'Connect Helper' button when first setting up the database. When viewing the published page, you should see a group of server settings displayed. If the first line is 'Connected OK' then the database credentials set in Dynamic Content: Credentials Setup > Set/Upd DBCred are correct and the scripts can see the database. If not, then check that all values have been entered correctly without any extra spaces before or after and make sure you don't need to use a Custom URL to connect to the database.

'EasyDB Users Field Found'

This warning may show on the page prior to Database Setup v3.0.1 & will prevent any other content from showing, due to this field being abandoned in favor of the dcusers field. Simply follow the instructions to remove the field in your phpMyAdmin control panel, or upgrade to allow the field to be automatically removed.

Max Variable Limit

Some servers put unusually low limits on how many variables can be passed to them. This can cause setup & viewing problems when a large number of fields are set up. To check your server settings, in Dynamic Content: Database Setup, enable the 'Connect Helper' and on your published page, note the 'Max variable limit' shown.

Back in RW, in Database Setup, enable the Setup/Upd DB button and scroll down to the bottom of the stack in the main edit window. There will be a simple formula for 'Max Variable Count' displayed in the bottom-right corner of the stack. Calculate the formula and compare it to the 'Max variable limit'.

If the count is larger than the limit, then in Database Setup enable 'Change Max Variables' and in 'Max to Use', enter a number a little bit larger than the count, publish, visit the page, then come back to RW and disable 'Change Max Variables' and republish again. This process will set the count high enough to allow all fields to be processed.

Note: if you add any fields later on, you may need to check the 'Max variable limit' again & adjust, as necessary.

Grid

If you get alert 'Fields do Not Match', then there may be the possibility that there is a difference in fields between Database Setup & Grid. Also check to make sure the 'Field Type' set up in Grid matches those in Database Setup. Make sure for 'Small Text' that the character lengths match. Make sure the 'Field Formatter' for each field is set to match the type of formatting the data is to have.

Note: You may see 'Fields do Not Match' when you are publishing the fixes mentioned above, just continue on with the setup process and the changes will be applied after the page is fully setup.

If you place more than one Grid on a page:
• The login button will show below the lowest Grid stack
• Place only the first Database Setup & related Grid on the page & run through the two-step setup till you see the grid displayed. Then disable the first Grid & related Database Setup by selecting those stacks and in the stacks right-panel under Responsive dropdown, enable 'Don't publish this stack'. Then place and do the two-step setup on the second set of stacks till you see the second grid is displayed, you can then disable the 'Don't publish this stack' for the first set and publish a final time to see them both on the page.

Field Visibility

If you visit a Dynamic Content Pro page and some fields are not visible, or showing 'N/A' or images are showing a default hidden Dynamic Content image, it's possible that the user that you are currently using (probably Visitor) has not been granted permissions to see those newly added fields. It's also possible that the user permissions have not been set for that page by an admin.

Simply login as an admin user and then in the users pane, verify the record & field permissions for each of the users and Visitor and then click the Update button in the lower right corner of the user pane. Logout and clear the history/browser cache and see if field visibility has changed.

CSV File Import

The first row of the file should contain field names.
If this file was not initially exported from Dynamic Content: The first column must be a column named 'id' w/ sequential numbers in every row. The second column must be a column named 'dcusers' or 'easydbusers' (older EasyDB) and should contain a comma-separated list of any users that are setup as 'View Only User Records'.

If this file is exported from Dynamic Content: the first column will be named 'dcusers' or 'easydbusers' (older EasyDB)

When saving the csv file, be sure all extra rows & extra columns are removed before saving. Some columns like integer, date & time may throw errors as the spreadsheet is trying to change the format from what is seen. Simply try setting the format on the affected columns to automatic to clear the import errors.

JS Errors

Left-hand side of operator...

Left hand side of operator must be a reference when building the dataset. This is due to the dataset name having a non-alpha numeric character in it.

200 Error

The 200 error usually mentions Ajax Load Error - SyntaxError: JSON Parse error: Unexpected identifier 'Table'. This is caused by the Table Name not being set properly between database & other layout stacks. Also, check to make sure that your browser's privacy settings are set to allow data from the website.

403 Error

The 403 error on a resources folder is normally caused because directory indexing for a website is disabled for privacy and security. This is normally caused by incorrect file paths. Check in fields that contain image, file or optional file paths and make sure they are correct. It's recommended to only place image/file names in fields. If however, 'Path in Field' is used, make sure the fields contain the correct paths and the image/file name. If 'Resources' is used, make sure the image/file is in the resources folder as expected.

If the image/file is actually showing, then this error is thrown due to the browser reading the path before the image has been loaded into the page - just ignore these errors.

404 Error

The 404 error on image resources is normally caused because image paths are initially generated w/ variables and then dynamically updated to the actual paths - just ignore these errors.