Using Media
Demonstrated Features
- Image URL (Beginner Level)
- Column Renderer
Required Skills
- Beginner Level
- JavaScript Hooks
Required License
- Premium
The Image URL feature can be applied to columns in tables (docs) and forms (docs). This feature only works if the table column contains the full image path or a relative path. When the form is opened in view mode, the image appears. When the form is opened in edit mode, an editable field is displayed.
Transactions are prohibited for anonymous users. Any attempt to insert, update, or delete data results in an "Unauthorized" error message.
Technical Insights
Using the App Builder requires no coding. Hooks are an optional feature meant for users who want to go beyond the basic App Builder functionality to add their own custom logic, fine-tune app behavior, extend features, and integrate with custom workflows. If you are not interested in hooks, you can skip these technical tutorials.
Column Render Hook for the Description Column
This renderer adds a link beneath the description content.
((columnName, originalValue, renderedValue, row) => {
if (renderedValue === null || renderedValue === "") {
return null;
}
const productImage = row.product_image;
const hyperlink = `<a href="https://wpdataaccess.com/${productImage}" target="_blank">🔍︎ View image in new tab</a>`;
return `<div>${renderedValue}</div><br>${hyperlink}`;
})