You can develop and test custom HTML for a Turnkey ViewModel page without uploading the model after every HTML change; this page is for developers refining page markup while the ViewModel structure is already available in the running application.

Choose a development workflow

Use a browser resource override when you want to replace a resource locally in Chrome while testing a running application. Use a local Turnkey page override when you can edit the Turnkey site files and want Turnkey to detect saved changes.

Workflow	Use it when	What changes locally	Important limit
Chrome Resource Override	You want to experiment in Chrome without changing files on the Turnkey site.	The browser substitutes a locally edited resource for the resource requested by the application.	The override is local to the browser setup. It is not a deployed application change.
Turnkey Views/XOverridePages override	You have access to the Turnkey installation and want a file-based page-development loop.	A .cshtml page override for a ViewModel.	You must later place the completed override in the appropriate deployed Turnkey site and manage it as part of that site.

Neither workflow changes the model. If you add, remove, or rename ViewModel columns, actions, or other model definitions, make that change in MDriven Designer and update the running model through your normal workflow.

Use Chrome Resource Override for local experiments

The Resource Override Chrome extension can replace a requested resource with local content. This lets you edit HTML, save it, and reload the page without a model upload.

1. Install Resource Override for Chrome.
2. Open the Turnkey application and navigate to the ViewModel page whose HTML you want to test.
3. Configure the extension to override the page resource with your local HTML or override file.
4. Edit the local HTML, save it, and reload the ViewModel page to inspect the result.
5. Keep the model unchanged while you iterate on markup, layout, and styling.
6. When the page is ready, move the finished markup into the maintained Turnkey override or other project location used for deployment.

For example, you can change a heading, a surrounding <div>, or a CSS class in the local override and reload the page to evaluate the visual result. The ViewModel must already expose the data and controls that the markup uses; a browser override cannot add a missing ViewModel column.

Keep browser overrides temporary

A browser override affects the developer's browser, not other users. Record where the accepted HTML will live before considering the change complete. Disable or remove obsolete overrides when switching application versions so that you do not test an old local page by mistake.

Use a local Turnkey page override

A local Turnkey installation can load page overrides from a special folder. This is useful when you want to edit a ViewModel page as a file and have Turnkey react to each saved change.

1. Locate the Turnkey site directory.
2. Open its Views directory.
3. Create XOverridePages if it does not already exist.
4. Create a Razor page file in that folder. Name the file after the ViewModel and use the .cshtml extension.
5. Add the HTML and any supported Turnkey page tags that you need.
6. Save the file and reload the application page. Turnkey watches the override file and signals the page to refresh when you save changes.

For a ViewModel named ViewOne, the override file is named ViewOne.cshtml. Start with visible markup such as:

<h1>Hello world</h1>

After you save the file and refresh the ViewModel page, the override renders instead of the standard page definition. This makes it practical to make a small change, save, and immediately inspect the result.

Control the page shell and ViewModel content

A page override can use Turnkey tags interpreted in the view. For example, the tag %NoMenu.Control% removes the main menu and gives the page a blank layout area. This is useful for a kiosk-style page or a page where you supply the full layout.

Do not start with a blank page unless that is your intent. A full page replacement can omit standard controls and navigation. Bring ViewModel content into the override deliberately, and verify that labels, inputs, and actions still appear and behave as required.

Work locally with a Local TurnkeyPrototyper

For a fast local development loop, set up the Local TurnkeyPrototyper. It runs a local Turnkey site against your model and mirrors a folder named <YourModel>_AssetsTK next to the model. The local site refreshes when the model changes, and the asset folder is intended for local development of page overrides, controls, and Angular directives.

Use this workflow when your HTML work also depends on local CSS or other Turnkey assets. It avoids repeatedly uploading the model to an MDrivenServer during development, but you still need a deployment process for the accepted model and site files.

Know when this is not a page override

Do not use a page override merely to display HTML stored in a data value. If a ViewModel column contains HTML that the browser should render, use render data as HTML and the DataIsHtml tagged value described in Documentation:Column.DataIsHtml.

For example, an administrator might edit formatted content in a Blob field through TinyMCE. A column tagged DataIsHtml=true can render that stored content and update when the bound HTML changes. That is data-driven HTML, not a replacement for the ViewModel page template.

If you need to generate an HTML document from a reporting ViewModel, use HtmlReport instead. For a guided example of data-dependent HTML and SVG-style graphics in a ViewModel column, see Training:Bootcamp:Chapter 13.

Check your result

After each change, verify the following:

• The intended ViewModel page is being overridden, not a similarly named page.
• The page still exposes the ViewModel data, inputs, and actions that users need.
• Navigation is present unless you intentionally used %NoMenu.Control%.
• The override is disabled or removed when you need to compare it with the standard generated page.
• The final HTML, CSS, and related assets have a defined project and deployment location; a Chrome-only override is not a release artifact.

See also

• Documentation:Faster prototyping with Turnkey
• Documentation:UI&Styling
• Documentation:Render data as html
• Documentation:Column.DataIsHtml
• Documentation:HtmlReport