# \[IGN-12948\] WebUIComponent Example?

**URL:** <https://forum.inductiveautomation.com/t/ign-12948-webuicomponent-example/103072>\
**Category:** Ignition 8.3 Early Access\
**Created:** [February 28, 2025, 8:58pm UTC](https://forum.inductiveautomation.com/t/ign-12948-webuicomponent-example/103072 "2025-02-28T20:58:00Z")\
**Posts on this page:** 1\
**Showing post:** 10

<div class="post-metadata">

**Author:** ![mazeyrat](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mazeyrat/32/10955_2.png) [@mazeyrat](https://forum.inductiveautomation.com/u/mazeyrat)\
**Post date:** [July 30, 2025, 5:55pm UTC](https://forum.inductiveautomation.com/t/ign-12948-webuicomponent-example/103072/10 "2025-07-30T17:55:09Z")

</div>

really interested for an example to replace 8.1 gateway config pages !  
We use them for several modules...

GatewayHook

```python
	/**
	 * This sets up the config panel
	 */
	public static final ConfigCategory CONFIG_CATEGORY = new ConfigCategory("BYES MODULES UTILS", "ByesModulesUtils.nav.header");//, 700);

	@Override
	public List<ConfigCategory> getConfigCategories() {
		return Collections.singletonList(CONFIG_CATEGORY);
	}

	public static final IConfigTab BYES_SCRIPTING_CONFIG_ENTRY = DefaultConfigTab.builder()
			.category(CONFIG_CATEGORY)
			.name("settings")
			.i18n("ByesModulesUtils.nav.settings.title")
			.page(ByesModulesUtilsSettingsPage.class)
			.terms("Byes Modules Utils settings")
			.build();

	@Override
	public List<? extends IConfigTab> getConfigPanels() {
		return Arrays.asList(
				BYES_SCRIPTING_CONFIG_ENTRY
		);
	}

```

ByesModulesUtilsSettingsPage

```python
package com.bouyguesenergiesservices.ignition.gateway.utils.pages;

import com.bouyguesenergiesservices.ignition.gateway.utils.records.ByesModulesUtilsSettingsRecord;
import com.inductiveautomation.ignition.gateway.model.IgnitionWebApp;
import com.inductiveautomation.ignition.gateway.web.components.RecordEditForm;
import com.inductiveautomation.ignition.gateway.web.models.LenientResourceModel;
import com.inductiveautomation.ignition.gateway.web.pages.IConfigPage;
import org.apache.commons.lang3.tuple.Pair;
import org.apache.wicket.Application;

public class ByesModulesUtilsSettingsPage extends RecordEditForm {

    public ByesModulesUtilsSettingsPage(final IConfigPage configPage){

        super(configPage, null, new LenientResourceModel("ByesModulesUtils.nav.settings.panelTitle"),
                ((IgnitionWebApp) Application.get()).getContext().getPersistenceInterface().find(ByesModulesUtilsSettingsRecord.META, 0L));
    }

    @Override
    public Pair<String, String> getMenuLocation() {
        return Pair.of("BYES MODULES UTILS", "settings");
    }
}

```

---

_[View the full topic](https://forum.inductiveautomation.com/t/ign-12948-webuicomponent-example/103072)._