diff --git a/Classes/Controller/PluginController.php b/Classes/Controller/PluginController.php
index c0bc93935cc33ee7466168fff2734e1209c03b24..37867f40492b05c79ad25a547876374d5c018e98 100644
--- a/Classes/Controller/PluginController.php
+++ b/Classes/Controller/PluginController.php
@@ -29,6 +29,7 @@ use SGalinski\DfTabs\DataProvider\AbstractBaseDataProvider;
 use SGalinski\DfTabs\Domain\Repository\TabRepository;
 use SGalinski\DfTabs\Service\ConfigurationService;
 use SGalinski\DfTabs\View\TypoScriptView;
+use SGalinski\DfTabs\View\FluidView;
 use TYPO3\CMS\Core\Page\PageRenderer;
 use TYPO3\CMS\Core\Utility\GeneralUtility;
 use TYPO3\CMS\Frontend\ContentObject\ContentObjectRenderer;
@@ -82,17 +83,25 @@ class PluginController extends AbstractPlugin {
 	 * Returns an instance of the renderer
 	 *
 	 * @param string $tabId
-	 * @return TypoScriptView
+	 * @return FluidView
 	 */
 	protected function getRenderer($tabId) {
 		/** @var TypoScriptFrontendController $tsfe */
 		$tsfe = $GLOBALS['TSFE'];
 
-		/** @var $renderer TypoScriptView */
-		$renderer = GeneralUtility::makeInstance(TypoScriptView::class);
-		$renderer->injectPluginConfiguration($this->pluginConfiguration, $tabId);
-		$renderer->injectPageRenderer(GeneralUtility::makeInstance(PageRenderer::class));
-		$renderer->injectContentObject($this->cObj);
+		if ($this->pluginConfiguration['renderer'] === 'TypoScript' || !$this->pluginConfiguration['renderer']) {
+			/** @var $renderer TypoScriptView */
+			$renderer = GeneralUtility::makeInstance(TypoScriptView::class);
+			$renderer->injectPluginConfiguration($this->pluginConfiguration, $tabId);
+			$renderer->injectPageRenderer(GeneralUtility::makeInstance(PageRenderer::class));
+			$renderer->injectContentObject($this->cObj);
+			$repository = $this->getTabRepository();
+			$records = $repository->getRecords();
+			$renderer->addInlineJavaScriptCode($records, $this->pluginConfiguration['mode'], $tabId);
+		} else if ($this->pluginConfiguration['renderer'] === 'Fluid') {
+			/** @var $renderer FluidView */
+			$renderer = GeneralUtility::makeInstance(FluidView::class);
+		}
 
 		return $renderer;
 	}
@@ -149,7 +158,6 @@ class PluginController extends AbstractPlugin {
 			$records = $repository->getRecords();
 			$tabElements = $repository->buildTabElements($this->pluginConfiguration['titles'] ?? [], $records);
 			$content .= $renderer->renderTabs($tabElements, $tabId);
-			$renderer->addInlineJavaScriptCode($records, $this->pluginConfiguration['mode'], $tabId);
 
 		} catch (\Exception $exception) {
 			$content = $exception->getMessage();
diff --git a/Classes/Service/ConfigurationService.php b/Classes/Service/ConfigurationService.php
index 4a58c1d67301f19f9ba23cc264530f4c1e0c3ff6..d43758adf5b10b17357f221f03b8a3b4dbaf3cd4 100644
--- a/Classes/Service/ConfigurationService.php
+++ b/Classes/Service/ConfigurationService.php
@@ -176,6 +176,11 @@ class ConfigurationService {
 			$configuration['hashName'] = $value;
 		}
 
+		$value = \trim($this->controllerContext->pi_getFFvalue($data, 'renderer'));
+		if ($value !== '') {
+			$configuration['renderer'] = $value;
+		}
+
 		return $configuration;
 	}
 }
diff --git a/Classes/View/FluidView.php b/Classes/View/FluidView.php
new file mode 100644
index 0000000000000000000000000000000000000000..7b7579e53f64880949d7a5e28567d16ab7da93ed
--- /dev/null
+++ b/Classes/View/FluidView.php
@@ -0,0 +1,129 @@
+<?php
+
+namespace SGalinski\DfTabs\View;
+
+/***************************************************************
+ *  Copyright notice
+ *
+ *  (c) sgalinski Internet Services (https://www.sgalinski.de)
+ *  All rights reserved
+ *
+ *  This script is part of the TYPO3 project. The TYPO3 project is
+ *  free software; you can redistribute it and/or modify
+ *  it under the terms of the GNU General Public License as published by
+ *  the Free Software Foundation; either version 2 of the License, or
+ *  (at your option) any later version.
+ *
+ *  The GNU General Public License can be found at
+ *  http://www.gnu.org/copyleft/gpl.html.
+ *
+ *  This script is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *  GNU General Public License for more details.
+ *
+ *  This copyright notice MUST APPEAR in all copies of the script!
+ ***************************************************************/
+
+use SGalinski\DfTabs\Domain\Model\Tab;
+use TYPO3\CMS\Core\Context\Context;
+use TYPO3\CMS\Core\Page\PageRenderer;
+use TYPO3\CMS\Core\SingletonInterface;
+use TYPO3\CMS\Core\Utility\GeneralUtility;
+use TYPO3\CMS\Core\Utility\VersionNumberUtility;
+use TYPO3\CMS\Extbase\Utility\LocalizationUtility;
+use TYPO3\CMS\Frontend\ContentObject\ContentObjectRenderer;
+
+/**
+ * Renders the content
+ */
+class FluidView implements SingletonInterface {
+	/**
+	 * @var array
+	 */
+	protected $pluginConfiguration = [];
+
+	/**
+	 * Page Renderer Instance
+	 *
+	 * @var PageRenderer
+	 */
+	protected $pageRenderer;
+
+	/**
+	 * @var ContentObjectRenderer
+	 */
+	protected $contentObject;
+
+	/**
+	 * Internal plugin counter
+	 *
+	 * @var int
+	 */
+	protected $counter = 1;
+
+	/**
+	 * Internal container that holds the used hashes
+	 *
+	 * @var array
+	 */
+	protected $usedHashes = [];
+
+	/**
+	 * Injects the plugin configuration
+	 *
+	 * @param array $configuration
+	 * @param string $tabId
+	 * @return void
+	 */
+	public function injectPluginConfiguration(array $configuration, $tabId) {
+		$this->pluginConfiguration[$tabId] = $configuration;
+
+		$this->pluginConfiguration[$tabId]['counter'] = $this->counter;
+		if (\in_array($this->pluginConfiguration[$tabId]['hashName'], $this->usedHashes)) {
+			$this->pluginConfiguration[$tabId]['hashName'] = 'tab' . $this->counter . '-';
+		}
+		$this->usedHashes[] = $this->pluginConfiguration[$tabId]['hashName'];
+
+		++$this->counter;
+	}
+
+	/**
+	 * Injects the page renderer
+	 *
+	 * @param PageRenderer $pageRenderer
+	 * @return void
+	 */
+	public function injectPageRenderer($pageRenderer) {
+		$this->pageRenderer = $pageRenderer;
+	}
+
+	/**
+	 * Injects the content object
+	 *
+	 * @param ContentObjectRenderer $contentObject
+	 * @return void
+	 */
+	public function injectContentObject($contentObject) {
+		$this->contentObject = $contentObject;
+	}
+
+
+	/**
+	 * Renders the tabs
+	 *
+	 * @param array $tabElements
+	 * @param string $tabId
+	 * @return string
+	 */
+	public function renderTabs($tabElements, $tabId) {
+		$fluidView = GeneralUtility::makeInstance(\TYPO3\CMS\Fluid\View\StandaloneView::class);
+		$fluidView->setTemplateRootPaths([
+			GeneralUtility::getFileAbsFileName('EXT:df_tabs/Resources/Private/Templates')
+		]);
+		$fluidView->setTemplate('Tabs.html');
+		$fluidView->assign('tabElements', $tabElements);
+		return $fluidView->render();
+	}
+
+}
diff --git a/Configuration/TypoScript/constants.typoscript b/Configuration/TypoScript/constants.typoscript
index 9bed25387cf10ae5616b7ff026839c3f1b5f149b..971b95095d84d87a458ef2b01adcc7b8956237b3 100644
--- a/Configuration/TypoScript/constants.typoscript
+++ b/Configuration/TypoScript/constants.typoscript
@@ -4,6 +4,8 @@ plugin.tx_dftabs_plugin1 {
 		jqueryApp = EXT:df_tabs/Resources/Public/Scripts/jquery.tabs.js
 	}
 
+	renderer = TypoScript
+
 	# typoscript specific options
 	enableJavascript = 1
 	defaultTabTitle = Tab
diff --git a/Configuration/TypoScript/setup.typoscript b/Configuration/TypoScript/setup.typoscript
index c57a8a246fe16b48d63c3f3f7d0014e571a72129..5d3a115f1e36e052951a5acb1695b77c37838be6 100644
--- a/Configuration/TypoScript/setup.typoscript
+++ b/Configuration/TypoScript/setup.typoscript
@@ -30,6 +30,7 @@ plugin.tx_dftabs_plugin1 {
 	titles = {$plugin.tx_dftabs_plugin1.titles}
 	pages = {$plugin.tx_dftabs_plugin1.pages}
 	tt_content = {$plugin.tx_dftabs_plugin1.tt_content}
+	renderer = {$plugin.tx_dftabs_plugin1.renderer}
 
 	# javascript events
 	events {
diff --git a/README.md b/README.md
index a365970d8f78755185bfe4e29acf2f9ed2a9096b..da0ea9a100cd5b06375031293695b8f721e2e841 100644
--- a/README.md
+++ b/README.md
@@ -8,11 +8,11 @@ Repository: https://gitlab.sgalinski.de/typo3/df_tabs
 
 Please report bugs here: https://gitlab.sgalinski.de/typo3/df_tabs
 
-TYPO3 version: >7.6 
+TYPO3 version: >7.6
 
 ## About
 
-This extension adds a new plugin to the content element wizard that provides the user the possibility to define other content elements and pages as tab based content. 
+This extension adds a new plugin to the content element wizard that provides the user the possibility to define other content elements and pages as tab based content.
 Furthermore you can define an auto-play mechanism with a custom interval to implement an auto-sliding effect.
 
 ## Installation
@@ -28,17 +28,31 @@ Furthermore you can define an auto-play mechanism with a custom interval to impl
 
 ### Configuration
 
-#### TypoScript Constants
+#### Fluid Renderer
+
+If you want to use the new Fluid Renderer, very little configuration is necessary. Just overwrite the following in your TypoScript Configuration:
+
+```
+plugin.tx_dftabs_plugin1.renderer = Fluid
+```
+
+The output can be completely controlled from within the Fluid-Template ```(EXT:df_tabs/Resources/Private/Templates/Standard/Tabs.html)```. Just overwrite it to adjust it to your needs.
+
+Please note that the Fluid Renderer does not come with preconfigured CSS or JavaScript. You have to add this on your own.
+
+#### TypoScript Renderer (deprecated)
+
+##### TypoScript Constants
 	# The css file that should be used.
 	css = EXT:df_tabs/Resources/Public/StyleSheets/df_tabs.css
-	
+
 	js {
 		# Javascript file that implements the back button for tabs
 		history = EXT:df_tabs/Resources/Public/Scripts/History/History.js
-	
+
 		# Router Javascript file (see above)
 		historyRouting = EXT:df_tabs/Resources/Public/Scripts/History/History.Routing.js
-		
+
 		# Javascript that implements the default tab functionality
 		app = EXT:df_tabs/Resources/Public/Scripts/df_tabs.js
 
@@ -51,83 +65,83 @@ Furthermore you can define an auto-play mechanism with a custom interval to impl
 
 	# Default tab title if the given information is empty
 	defaultTabTitle = Tab
-	
+
 	#
 	classPrefix = tx-dftabs-
-	
+
 	# Prefix for classes and ids to prevent html errors and styling problems if multiple plugins are used on the same page
 	hashName = tab
-	
+
 	# Polling interval (in ms) to detect url changes for the history functionality
 	pollingInterval = 1000
-	
+
 	# Animation speed in ms (if a transition effect between the tabs is used)
 	animationSpeed = 400
-	
+
 	# the tab index where the animation should start (starts with 0)
 	startIndex = 0
-	
+
 	#
 	forceUsageOfLeft = false
-	
+
 	# Node type that is used for the tab menu
 	menuNodeType = li
-	
+
 	# Node type that is used for the tab content
 	contentNodeType = div
-	
+
 	# Javascript callback function that is triggered for the tab switches. The default is no animation
 	animationCallback =
-		
+
 	# Remove a substring from all tab-title. Can be either a string, or a regex. This example will remove the string
 	# 'Foo' if is found at the end of the title.
 	removeFromTitle = Foo$
 
 	# flexform options for the plugin usage with plain typoscript
-	
+
 	# Enables the autoplay functionality
 	enableAutoPlay = 0
-	
+
 	# Interval of the autoplay functionality in ms
 	autoPlayInterval = 7000
-	
+
 	# Enables the mouseover event for tab switches instead of simple clicks
 	enableMouseOver = 0
-	
+
 	# Data Provider Mode: tt_content, pages, combined and typoscript
 	mode = tt_content
-	
+
 	# Comma separated list of preferred menu titles
 	titles =
-	
+
 	# Comma-separated list of ids related to the mode; not needed for the typoscript mode; combined mode requires the table name as a prefix of the id (e.g. pages_12,tt_content_14)
 	data =
 
 	# pages mode related configuration settings
 	pages {
-	
+
 		# Limit of fetched content elements from a page
 		limit = 999
-		
+
 		# Order clause for the content elements
 		orderBy = colPos,sorting
-		
+
 		# Extra filter for content elements from a page
 		additionalWhere = AND colPos >= 0
 
 		# Title field for the tab menu
 		titleField = title
-		
+
 		# Link field for links
 		linkField = uid
 	}
 
 	# tt_content mode related configuration settings
 	tt_content {
-	
+
 		# Title field for the tab menu
 		titleField = header
-		
+
 		# Link field for links
 		linkField = header_link
 	}
diff --git a/Resources/Private/Language/de.locallang.xlf b/Resources/Private/Language/de.locallang.xlf
index bc8475b75505827f5b74f8dc6fd11b458b62a716..869c4f999bb0204639e93dfeffaebf1023ce45e9 100644
--- a/Resources/Private/Language/de.locallang.xlf
+++ b/Resources/Private/Language/de.locallang.xlf
@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="utf-8" standalone="yes" ?>
 <xliff version="1.0">
-	<file source-language="en" target-language="de" datatype="plaintext" original="messages" date="2012-02-17T17:44:27Z">
+	<file source-language="en" target-language="de" datatype="plaintext" original="messages" date="2019-05-23T11:42:32Z">
 		<header>
 			<type>module</type>
 			<description>Language labels for plugin &quot;tx_dftabs_plugin1&quot;</description>
@@ -9,66 +9,66 @@
 			<authorEmail>stefan.galinski@gmail.com</authorEmail>
 		</header>
 		<body>
-		<trans-unit id="flexform.sheets.general.autoPlayInterval" approved="yes">
-			<source>Autoplay Interval</source>
-			<target>Auto-Play-Intervall</target>
-		</trans-unit>
-		<trans-unit id="flexform.sheets.general.data" approved="yes">
-			<source>Pages and content that should be rendered as tabs</source>
-			<target>Seiten und Inhalte, welche als Tabs gerendert werden sollen</target>
-		</trans-unit>
-		<trans-unit id="flexform.sheets.general.enableAutoPlayInterval" approved="yes">
-			<source>Enable Autoplay</source>
-			<target>Auto-Play aktivieren</target>
-		</trans-unit>
-		<trans-unit id="flexform.sheets.general.enableMouseOver" approved="yes">
-			<source>Enable MouseOver Navigation</source>
-			<target>MouseOver-Navigation aktivieren</target>
-		</trans-unit>
-		<trans-unit id="flexform.sheets.general.hash" approved="yes">
-			<source>Hash</source>
-			<target>Hash</target>
-		</trans-unit>
-		<trans-unit id="flexform.sheets.general.mode" approved="yes">
-			<source>Mode</source>
-			<target>Modus</target>
-		</trans-unit>
-		<trans-unit id="flexform.sheets.general.mode.0" approved="yes">
-			<source>Show Content Elements</source>
-			<target>Zeige Inhaltselemente</target>
-		</trans-unit>
-		<trans-unit id="flexform.sheets.general.mode.1" approved="yes">
-			<source>Show Pages</source>
-			<target>Zeige Seiten</target>
-		</trans-unit>
-		<trans-unit id="flexform.sheets.general.mode.2" approved="yes">
-			<source>Combined</source>
-			<target>Kombiniert</target>
-		</trans-unit>
-		<trans-unit id="flexform.sheets.general.titles" approved="yes">
-			<source>Override Tab Titles (separation with newlines)</source>
-			<target>Titel der Reiter überschreiben (Trennung per Zeilenumbruch)</target>
-		</trans-unit>
-		<trans-unit id="noContentFound" approved="yes">
-			<source>Didn't found any content for rendering of the tabs. Please check your plugin configuration.</source>
-			<target>Es wurde kein Inhalt für das Rendering der Tabs gefunden. Bitte überprüfen Sie die Plugin-Konfiguration.</target>
-		</trans-unit>
-		<trans-unit id="plugin1_plus_wiz_description" approved="yes">
-			<source>Show pages or content elements like tabs</source>
-			<target>Darstellung von Seiten oder Inhaltselementen als Tabs.</target>
-		</trans-unit>
-		<trans-unit id="plugin1_title" approved="yes">
-			<source>Pages/Content Elements In Tabs</source>
-			<target>Seiten/Inhalte in Tabs</target>
-		</trans-unit>
-		<trans-unit id="tt_content.list_type_plugin1" approved="yes">
-			<source>Pages/Content Elements In Tabs</source>
-			<target>Seiten/Inhaltselemente in Tabs</target>
-		</trans-unit>
-		<trans-unit id="tt_content.list_type_plugin1">
-			<source>[ContentTabs] Pages/Content Elements In Tabs</source>
-			<target>[Inhaltstabs] Seiten/Inhalte in Tabs</target>
-		</trans-unit>
+			<trans-unit id="flexform.sheets.general.autoPlayInterval" approved="yes">
+				<source><![CDATA[Autoplay Interval]]></source>
+				<target><![CDATA[Auto-Play-Intervall]]></target>
+			</trans-unit>
+			<trans-unit id="flexform.sheets.general.data" approved="yes">
+				<source><![CDATA[Pages and content that should be rendered as tabs]]></source>
+				<target><![CDATA[Seiten und Inhalte, welche als Tabs gerendert werden sollen]]></target>
+			</trans-unit>
+			<trans-unit id="flexform.sheets.general.enableAutoPlayInterval" approved="yes">
+				<source><![CDATA[Enable Autoplay]]></source>
+				<target><![CDATA[Auto-Play aktivieren]]></target>
+			</trans-unit>
+			<trans-unit id="flexform.sheets.general.enableMouseOver" approved="yes">
+				<source><![CDATA[Enable MouseOver Navigation]]></source>
+				<target><![CDATA[MouseOver-Navigation aktivieren]]></target>
+			</trans-unit>
+			<trans-unit id="flexform.sheets.general.hash" approved="yes">
+				<source><![CDATA[Hash]]></source>
+				<target><![CDATA[Hash]]></target>
+			</trans-unit>
+			<trans-unit id="flexform.sheets.general.mode" approved="yes">
+				<source><![CDATA[Mode]]></source>
+				<target><![CDATA[Modus]]></target>
+			</trans-unit>
+			<trans-unit id="flexform.sheets.general.mode.0" approved="yes">
+				<source><![CDATA[Show Content Elements]]></source>
+				<target><![CDATA[Zeige Inhaltselemente]]></target>
+			</trans-unit>
+			<trans-unit id="flexform.sheets.general.mode.1" approved="yes">
+				<source><![CDATA[Show Pages]]></source>
+				<target><![CDATA[Zeige Seiten]]></target>
+			</trans-unit>
+			<trans-unit id="flexform.sheets.general.mode.2" approved="yes">
+				<source><![CDATA[Combined]]></source>
+				<target><![CDATA[Kombiniert]]></target>
+			</trans-unit>
+			<trans-unit id="flexform.sheets.general.titles" approved="yes">
+				<source><![CDATA[Override Tab Titles (separation with newlines)]]></source>
+				<target><![CDATA[Titel der Reiter überschreiben (Trennung per Zeilenumbruch)]]></target>
+			</trans-unit>
+			<trans-unit id="frontend.buttonLabelMore" approved="yes">
+				<source><![CDATA[More]]></source>
+				<target><![CDATA[Mehr]]></target>
+			</trans-unit>
+			<trans-unit id="noContentFound" approved="yes">
+				<source><![CDATA[Didn't found any content for rendering of the tabs. Please check your plugin configuration.]]></source>
+				<target><![CDATA[Es wurde kein Inhalt für das Rendering der Tabs gefunden. Bitte überprüfen Sie die Plugin-Konfiguration.]]></target>
+			</trans-unit>
+			<trans-unit id="plugin1_plus_wiz_description" approved="yes">
+				<source><![CDATA[Show pages or content elements like tabs.]]></source>
+				<target><![CDATA[Darstellung von Seiten oder Inhaltselementen als Tabs.]]></target>
+			</trans-unit>
+			<trans-unit id="plugin1_title" approved="yes">
+				<source><![CDATA[Pages/Content Elements In Tabs]]></source>
+				<target><![CDATA[Seiten/Inhalte in Tabs]]></target>
+			</trans-unit>
+			<trans-unit id="tt_content.list_type_plugin1" approved="yes">
+				<source><![CDATA[[ContentTabs] Pages/Content Elements In Tabs]]></source>
+				<target><![CDATA[[Inhaltstabs] Seiten/Inhalte in Tabs]]></target>
+			</trans-unit>
 		</body>
 	</file>
-</xliff>
+</xliff>
\ No newline at end of file
diff --git a/Resources/Private/Language/locallang.xlf b/Resources/Private/Language/locallang.xlf
index 8bf3eb25223fd0897bb53e6951e466cd3b700392..e90f3c955b4ac432fde30fb9a47060b72f867c20 100644
--- a/Resources/Private/Language/locallang.xlf
+++ b/Resources/Private/Language/locallang.xlf
@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="utf-8" standalone="yes" ?>
 <xliff version="1.0">
-	<file source-language="en" datatype="plaintext" original="messages" date="2012-02-17T17:44:27Z">
+	<file source-language="en" datatype="plaintext" original="messages" date="2019-05-23T11:42:32Z">
 		<header>
 			<type>module</type>
 			<description>Language labels for plugin &quot;tx_dftabs_plugin1&quot;</description>
@@ -9,51 +9,51 @@
 			<authorEmail>stefan.galinski@gmail.com</authorEmail>
 		</header>
 		<body>
-		<trans-unit id="flexform.sheets.general.autoPlayInterval">
-			<source>Autoplay Interval</source>
-		</trans-unit>
-		<trans-unit id="flexform.sheets.general.data">
-			<source>Pages and content that should be rendered as tabs</source>
-		</trans-unit>
-		<trans-unit id="flexform.sheets.general.enableAutoPlayInterval">
-			<source>Enable Autoplay</source>
-		</trans-unit>
-		<trans-unit id="flexform.sheets.general.enableMouseOver">
-			<source>Enable MouseOver Navigation</source>
-		</trans-unit>
-		<trans-unit id="flexform.sheets.general.hash">
-			<source>Hash</source>
-		</trans-unit>
-		<trans-unit id="flexform.sheets.general.mode">
-			<source>Mode</source>
-		</trans-unit>
-		<trans-unit id="flexform.sheets.general.mode.0">
-			<source>Show Content Elements</source>
-		</trans-unit>
-		<trans-unit id="flexform.sheets.general.mode.1">
-			<source>Show Pages</source>
-		</trans-unit>
-		<trans-unit id="flexform.sheets.general.mode.2">
-			<source>Combined</source>
-		</trans-unit>
-		<trans-unit id="flexform.sheets.general.titles">
-			<source>Override Tab Titles (separation with newlines)</source>
-		</trans-unit>
-		<trans-unit id="noContentFound">
-			<source>Didn't found any content for rendering of the tabs. Please check your plugin configuration.</source>
-		</trans-unit>
-		<trans-unit id="plugin1_plus_wiz_description">
-			<source>Show pages or content elements like tabs.</source>
-		</trans-unit>
-		<trans-unit id="plugin1_title">
-			<source>Pages/Content Elements In Tabs</source>
-		</trans-unit>
-		<trans-unit id="tt_content.list_type_plugin1">
-			<source>Pages/Content Elements In Tabs</source>
-		</trans-unit>
-		<trans-unit id="tt_content.list_type_plugin1">
-			<source>[ContentTabs] Pages/Content Elements In Tabs</source>
-		</trans-unit>
+			<trans-unit id="flexform.sheets.general.autoPlayInterval">
+				<source><![CDATA[Autoplay Interval]]></source>
+			</trans-unit>
+			<trans-unit id="flexform.sheets.general.data">
+				<source><![CDATA[Pages and content that should be rendered as tabs]]></source>
+			</trans-unit>
+			<trans-unit id="flexform.sheets.general.enableAutoPlayInterval">
+				<source><![CDATA[Enable Autoplay]]></source>
+			</trans-unit>
+			<trans-unit id="flexform.sheets.general.enableMouseOver">
+				<source><![CDATA[Enable MouseOver Navigation]]></source>
+			</trans-unit>
+			<trans-unit id="flexform.sheets.general.hash">
+				<source><![CDATA[Hash]]></source>
+			</trans-unit>
+			<trans-unit id="flexform.sheets.general.mode">
+				<source><![CDATA[Mode]]></source>
+			</trans-unit>
+			<trans-unit id="flexform.sheets.general.mode.0">
+				<source><![CDATA[Show Content Elements]]></source>
+			</trans-unit>
+			<trans-unit id="flexform.sheets.general.mode.1">
+				<source><![CDATA[Show Pages]]></source>
+			</trans-unit>
+			<trans-unit id="flexform.sheets.general.mode.2">
+				<source><![CDATA[Combined]]></source>
+			</trans-unit>
+			<trans-unit id="flexform.sheets.general.titles">
+				<source><![CDATA[Override Tab Titles (separation with newlines)]]></source>
+			</trans-unit>
+			<trans-unit id="frontend.buttonLabelMore">
+				<source><![CDATA[More]]></source>
+			</trans-unit>
+			<trans-unit id="noContentFound">
+				<source><![CDATA[Didn't found any content for rendering of the tabs. Please check your plugin configuration.]]></source>
+			</trans-unit>
+			<trans-unit id="plugin1_plus_wiz_description">
+				<source><![CDATA[Show pages or content elements like tabs.]]></source>
+			</trans-unit>
+			<trans-unit id="plugin1_title">
+				<source><![CDATA[Pages/Content Elements In Tabs]]></source>
+			</trans-unit>
+			<trans-unit id="tt_content.list_type_plugin1">
+				<source><![CDATA[[ContentTabs] Pages/Content Elements In Tabs]]></source>
+			</trans-unit>
 		</body>
 	</file>
-</xliff>
+</xliff>
\ No newline at end of file
diff --git a/Resources/Private/Templates/Standard/Tabs.html b/Resources/Private/Templates/Standard/Tabs.html
new file mode 100644
index 0000000000000000000000000000000000000000..fee3536f5c253ccaab7848fe476dcebcfaa78dc6
--- /dev/null
+++ b/Resources/Private/Templates/Standard/Tabs.html
@@ -0,0 +1,17 @@
+<div class="default-content-element m-tabs" data-more-label="{f:translate(key: 'frontend.buttonLabelMore', extensionName: 'df_tabs')}">
+	<div class="m-tabs__tablist" role="tablist">
+		<f:for each="{tabElements}" as="tab" iteration="iterator">
+			<button class="m-tabs__tab" role="tab" aria-controls="panel-{tab.record}-{iterator.index}" id="tab-{tab.record}-{iterator.index}" aria-selected="{f:if(condition: iterator.isFirst, then: 'true', else: 'false')}">
+				{tab.title}
+			</button>
+		</f:for>
+	</div>
+
+	<div class="m-tabs__panellist">
+		<f:for each="{tabElements}" as="tab" iteration="iterator">
+			<div class="m-tabs__panel {f:if(condition: iterator.isFirst, else: 'm-tabs__panel--closed')}" role="tabpanel" aria-labelledby="tab-{tab.record}-{iterator.index}" id="panel-{tab.record}-{iterator.index}">
+				{tab.content -> f:format.raw()}
+			</div>
+		</f:for>
+	</div>
+</div>