diff --git a/Plugin.php b/Plugin.php
index 858604e..1d10c4c 100644
--- a/Plugin.php
+++ b/Plugin.php
@@ -3,7 +3,7 @@
 namespace Silva\Adrema;
 
 use Backend;
-use Silva\Adrema\Components\EventOverview;
+use Silva\Adrema\Components\EventIndex;
 use Silva\Adrema\Models\Settings;
 use System\Classes\PluginBase;
 
@@ -49,7 +49,7 @@ class Plugin extends PluginBase
     public function registerComponents()
     {
         return [
-            EventOverview::class => 'adrema_event_overview',
+            EventIndex::class => 'adrema_event_index',
         ];
     }
 
diff --git a/assets/vendor/adrema-form b/assets/vendor/adrema-form
index 93df5ba..e629345 160000
--- a/assets/vendor/adrema-form
+++ b/assets/vendor/adrema-form
@@ -1 +1 @@
-Subproject commit 93df5bac1d1a7ed971a5d98477b25514a75a59e0
+Subproject commit e62934504bf2d33b65d0282a8d311df9cecb178e
diff --git a/components/EventIndex.php b/components/EventIndex.php
new file mode 100644
index 0000000..4d8141f
--- /dev/null
+++ b/components/EventIndex.php
@@ -0,0 +1,113 @@
+<?php
+
+namespace Silva\Adrema\Components;
+
+use Cms\Classes\ComponentBase;
+use Cms\Classes\Page;
+use Silva\Adrema\Exceptions\ComponentException;
+use Silva\Adrema\Models\Settings;
+
+class EventIndex extends ComponentBase
+{
+
+    public $settings;
+
+    /** @var string The active event */
+    public ?string $event;
+
+    public function componentDetails()
+    {
+        return [
+            'name' => 'EventOverview Component',
+            'description' => 'No description provided yet...'
+        ];
+    }
+
+    public function onRun()
+    {
+        $this->addJs('assets/vendor/adrema-form/dist/main.js');
+
+        $this->settings = [
+            'primary_color' => Settings::get('primary_color'),
+            ...$this->resolvePageUrls(),
+        ];
+        $this->event = $this->property('event');
+    }
+
+    /**
+     * @return array<string, string>
+     */
+    protected function resolvePageUrls(): array
+    {
+        $indexPage = $this->getPageFromProperty('indexPage');
+        $singlePage = $this->getPageFromProperty('singlePage');
+        $registerPage = $this->getPageFromProperty('registerPage');
+
+        throw_if(!str($singlePage->url)->contains(':slug'), ComponentException::class, 'slug_not_found');
+        throw_if(!str($registerPage->url)->contains(':slug'), ComponentException::class, 'slug_not_found');
+
+        return [
+            'indexUrl' => $indexPage->url,
+            'singleUrl' => $singlePage->url,
+            'registerUrl' => $registerPage->url,
+        ];
+    }
+
+    protected function getPageFromProperty(string $property): Page
+    {
+        throw_if(!$this->property('indexPage') || !$this->property('singlePage') || !$this->property('registerPage'), ComponentException::class, 'not_all_pages_set');
+
+        $page = Page::find($this->property($property));
+        throw_if($page === null, ComponentException::class, 'page_not_found');
+
+        return $page;
+    }
+
+    public function defineProperties()
+    {
+        return [
+            'indexPage' => [
+                'title' => __('properties.index_page_title'),
+                'type' => 'dropdown',
+                'default' => null,
+            ],
+            'singlePage' => [
+                'title' => __('properties.single_page_title'),
+                'type' => 'dropdown',
+                'default' => null,
+            ],
+            'registerPage' => [
+                'title' => __('properties.register_page_title'),
+                'type' => 'dropdown',
+                'default' => null,
+            ],
+            'event' => [
+                'title' => __('properties.event_title'),
+                'type' => 'text',
+                'default' => null,
+            ],
+        ];
+    }
+
+    public function getIndexPageOptions(): array
+    {
+        return $this->pageOptions();
+    }
+
+    public function getSinglePageOptions(): array
+    {
+        return $this->pageOptions();
+    }
+
+    public function getRegisterPageOptions(): array
+    {
+        return $this->pageOptions();
+    }
+
+    private function pageOptions(): array
+    {
+        return Page::get()
+            ->mapWithKeys(fn ($page) => [$page->fileName => $page->title])
+            ->toArray();
+    }
+}
diff --git a/components/EventOverview.php b/components/EventOverview.php
deleted file mode 100644
index 42ce204..0000000
--- a/components/EventOverview.php
+++ /dev/null
@@ -1,41 +0,0 @@
-<?php
-
-namespace Silva\Adrema\Components;
-
-use Cms\Classes\ComponentBase;
-use Silva\Adrema\Models\Settings;
-
-/**
- * EventOverview Component
- *
- * @link https://docs.octobercms.com/3.x/extend/cms-components.html
- */
-class EventOverview extends ComponentBase
-{
-
-    public $settings;
-
-    public function componentDetails()
-    {
-        return [
-            'name' => 'EventOverview Component',
-            'description' => 'No description provided yet...'
-        ];
-    }
-
-    public function onRun(): void
-    {
-        $this->addJs('assets/vendor/adrema-form/dist/main.js');
-        $this->settings = [
-            'primary_color' => Settings::get('primary_color'),
-        ];
-    }
-
-    /**
-     * @link https://docs.octobercms.com/3.x/element/inspector-types.html
-     */
-    public function defineProperties()
-    {
-        return [];
-    }
-}
diff --git a/components/eventindex/default.htm b/components/eventindex/default.htm
new file mode 100644
index 0000000..4bf8120
--- /dev/null
+++ b/components/eventindex/default.htm
@@ -0,0 +1,8 @@
+<event-index
+    style="--primary: {{__SELF__.settings.primary_color}}; --primaryfg: #d1f8ff; --secondary: #800a19; --font: hsl(181, 84%, 78%); --circle: hsl(181, 86%, 16%)"
+    index-url="{{__SELF__.settings.indexUrl}}"
+    single-url="{{__SELF__.settings.singleUrl}}"
+    register-url="{{__SELF__.settings.registerUrl}}"
+    url="/api/silva_adrema_event_overview"
+    {% if __SELF__.event %} event="{{__SELF__.event }}" {% endif %}
+></event-index>
diff --git a/components/eventoverview/default.htm b/components/eventoverview/default.htm
deleted file mode 100644
index 1b3bc95..0000000
--- a/components/eventoverview/default.htm
+++ /dev/null
@@ -1,40 +0,0 @@
-{% set iconClass="w-3 h-3 flex-none text-dpsgred-700 mr-2" %}
-
-<div class="md:-mt-12" x-data="{
-    ...eventoverview,
-    state: '{{__SELF__.state}}',
-    reloadRequestHandler: '{{__SELF__.alias}}::onReload',
-    popupRequestHandler: '{{__SELF__.alias}}::onShowPopup'
-}">
-
-    <!-- ************************** heading and buttons ************************** -->
-<!--
-    <div class="flex justify-center md:justify-end">
-        <a href="#" class="block btn btn-primary btn-shine px-8 flex" @click.prevent="showPast">
-            <span class="absolute hidden items-center ml-2 top-0 left-0 h-full " :class="{'hidden': !loading, 'flex': loading}">
-                <span class="w-5 h-5 border-primaryfg spinner-ring">
-                  <span class="bounce1"></span>
-                  <span class="bounce2"></span>
-                  <span class="bounce3"></span>
-                </span>
-            </span>
-            <span x-text="past ? 'Nur aktuelle anzeigen' : 'Vergangene anzeigen'">Vergangene anzeigen</span>
-        </a>
-    </div>
-
--->
-    <!-- ****************************** event grid ******************************* -->
-    <div class="mt-4 md:mt-6 grid gap-4 grid-cols-[repeat(auto-fill,minmax(250px,1fr))]" id="eventoverview-wrapper">
-        {% partial __SELF__.alias ~ '::events.htm' events=__SELF__.events %}
-    </div>
-
-<div class="pt-12"></div>
-        <event-overview
-            style="--primary: {{__SELF__.settings.primary_color}}; --primaryfg: #d1f8ff; --secondary: #800a19; --font: hsl(181, 84%, 78%); --circle: hsl(181, 86%, 16%)"
-            url-pattern="/anmeldung/{slug}"
-            overview-url="/anmeldung"
-            url="/api/silva_adrema_event_overview"
-        ></event-overview>
-
-    <!-- ********************************* popup ********************************* -->
-</div>
diff --git a/components/eventoverview/events.htm b/components/eventoverview/events.htm
deleted file mode 100644
index c3f52ac..0000000
--- a/components/eventoverview/events.htm
+++ /dev/null
@@ -1,29 +0,0 @@
-{% set iconClass="w-3 h-3 flex-none text-dpsgred-700 mr-2" %}
-
-{% for i, event in events %}
-
-    {% partial 'site/components/box'
-        image=event.header_image
-        image_size='calc(50vw - 2rem)|845:calc(33vw - 1.666rem)|1112:calc(25vw - 1.5rem)|1375:calc(20vw - 1.4rem)|1568:282px'
-        header=event.name
-        image_rounded=0
-        link={'link': '#', 'title': 'Zur Veranstaltung'}
-        buttonring=1
-        body
-    %}
-        {% put tagextend %} href="#" @click.prevent="showDetail({{event.id}})" data-backstop-event-box {% endput %}
-        <span>
-            <span class="flex items-baseline text-sm">
-                {{'calendar'|sprite(iconClass)}}
-                <span class="text-sm font-semibold text-gray-800"> {{ event.formattedDates }} </span>
-            </span>
-            {% if event.formattedTimes %}
-            <span class="flex items-baseline text-sm">
-                {{'clock'|sprite(iconClass)}}
-                <span class="text-sm font-semibold text-gray-800"> {{ event.formattedTimes }} </span>
-            </span>
-            {% endif %}
-        </span>
-        <span class="flex-grow c text-sm mt-3">{{event.excerpt}}</span>
-    {% endpartial %}
-{% endfor %}
diff --git a/components/eventoverview/popup.htm b/components/eventoverview/popup.htm
deleted file mode 100644
index 5c505f0..0000000
--- a/components/eventoverview/popup.htm
+++ /dev/null
@@ -1,16 +0,0 @@
-{% set iconClass="w-3 h-3 flex-none text-dpsgred-700 mr-2" %}
-
-<h3 class="text-primary-700 font-arvo">{{event.name}}</h3>
-<div class="time flex items-baseline text-sm">
-    {{'calendar' | sprite(iconClass)}}
-    <div class="text-sm font-semibold text-gray-800">{{event.formattedDates}}</div>
-    <span>{{'clock'|sprite(iconClass ~ ' ml-2')}}</span>
-    <div class="text-sm font-semibold text-gray-800">{{event.formattedTimes}}</div>
-</div>
-<div class="c text-sm mt-3">{{event.content | raw }}</div>
-{% if event.can_register %}
-<a href="{{event.registration_url}}" {% if event.is_foreign_url %} target="_BLANK"  {% endif %} class="mt-2 md:mt-4 btn btn-primary inline-block btn-shine btn-sm">Zur Anmeldung</a>
-{% endif %}
-<a class="absolute block mt-3 mr-3 right-0 top-0" href="#" @click.prevent="hideDetail">
-    {{'close'|sprite('w-4 h-4 text-gray-700')}}
-</a>
diff --git a/exceptions/ComponentException.php b/exceptions/ComponentException.php
new file mode 100644
index 0000000..dae8629
--- /dev/null
+++ b/exceptions/ComponentException.php
@@ -0,0 +1,19 @@
+<?php
+
+namespace Silva\Adrema\Exceptions;
+
+use App;
+use ApplicationException;
+use Lang;
+use Throwable;
+
+class ComponentException extends ApplicationException
+{
+
+    public function __construct($message = "", $code = 0, Throwable $previous = null)
+    {
+        $translations = json_decode(file_get_contents(__DIR__ . '/../lang/en.json'), true);
+
+        parent::__construct($translations['errors.' . $message] ?? $message, $code, $previous);
+    }
+}
diff --git a/lang/de.json b/lang/de.json
index e79b7d5..60d436f 100644
--- a/lang/de.json
+++ b/lang/de.json
@@ -1,7 +1,9 @@
 {
     "setting_description": "App für DPSG-NaMi",
-    "url_pattern_comment": "Die Page-URL, auf der einzelne Veranstaltungen angezeigt werden. {slug} wird mit dem Bezeichner der Veranstaltung ersetzt.",
-    "url_pattern_label": "URL für einzelne Veranstaltungen",
     "base_url_label": "Base-URL",
-    "base_url_comment": "Die Domain (app_url), auf der deine Adrema läuft"
+    "base_url_comment": "Die Domain (app_url), auf der deine Adrema läuft",
+    "properties.index_page_title": "Seite für Übersicht",
+    "properties.single_page_title": "Seite für Einzelansicht",
+    "properties.register_page_title": "Seite zum anmelden",
+    "properties.event_title": "Veranstaltung slug"
 }
diff --git a/lang/en.json b/lang/en.json
new file mode 100644
index 0000000..7f83962
--- /dev/null
+++ b/lang/en.json
@@ -0,0 +1,12 @@
+{
+    "setting_description": "App for DPSG-NaMi",
+    "base_url_label": "Base-URL",
+    "base_url_comment": "The domain (APP_URL) of the Adrema application.",
+    "properties.index_page_title": "Page for overview",
+    "properties.single_page_title": "Page for single view",
+    "properties.register_page_title": "Page for registration",
+    "properties.event_title": "Event slug",
+    "errors.not_all_pages_set": "You didn't assign all pages. Please edit your components.",
+    "errors.page_not_found": "One page cannot be found. Event component cannot be rendered.",
+    "errors.slug_not_found": "You need to set a placeholder in page urls to set the event slug (\":slug\")"
+}