TYPO3 v15 dev-main snapshot ()
@@ -0,0 +1 @@
|
||||
/vendor/
|
||||
@@ -0,0 +1,81 @@
|
||||
<?php
|
||||
|
||||
declare(strict_types=1);
|
||||
|
||||
/*
|
||||
* This file is part of the TYPO3 CMS project.
|
||||
*
|
||||
* It is free software; you can redistribute it and/or modify it under
|
||||
* the terms of the GNU General Public License, either version 2
|
||||
* of the License, or any later version.
|
||||
*
|
||||
* For the full copyright and license information, please read the
|
||||
* LICENSE.txt file that was distributed with this source code.
|
||||
*
|
||||
* The TYPO3 project - inspiring people to share!
|
||||
*/
|
||||
|
||||
namespace TYPO3\CMS\FluidStyledContent\ViewHelpers\Link;
|
||||
|
||||
use Psr\Http\Message\ServerRequestInterface;
|
||||
use TYPO3\CMS\Core\Resource\FileInterface;
|
||||
use TYPO3\CMS\Core\TypoScript\TypoScriptService;
|
||||
use TYPO3\CMS\Core\Utility\GeneralUtility;
|
||||
use TYPO3\CMS\Frontend\ContentObject\ContentObjectRenderer;
|
||||
use TYPO3Fluid\Fluid\Core\ViewHelper\AbstractViewHelper;
|
||||
|
||||
/**
|
||||
* ViewHelper for creating a link for an image popup.
|
||||
*
|
||||
* ```
|
||||
* <ce:link.clickEnlarge image="{image}" configuration="{settings.images.popup}"><img src=""></ce:link.clickEnlarge>
|
||||
* ```
|
||||
*
|
||||
* @internal this is not part of TYPO3 Core API.
|
||||
*/
|
||||
final class ClickEnlargeViewHelper extends AbstractViewHelper
|
||||
{
|
||||
/**
|
||||
* @var bool
|
||||
*/
|
||||
protected $escapeOutput = false;
|
||||
|
||||
public function __construct(
|
||||
private readonly TypoScriptService $typoScriptService,
|
||||
) {}
|
||||
|
||||
public function initializeArguments(): void
|
||||
{
|
||||
$this->registerArgument('image', FileInterface::class, 'The original image file', true);
|
||||
$this->registerArgument(
|
||||
'configuration',
|
||||
'array',
|
||||
'TypoScript properties for the "imageLinkWrap" function',
|
||||
true
|
||||
);
|
||||
}
|
||||
|
||||
public function render(): string
|
||||
{
|
||||
/** @var FileInterface $image */
|
||||
$image = $this->arguments['image'];
|
||||
$request = $this->renderingContext->getAttribute(ServerRequestInterface::class);
|
||||
$contentObjectRenderer = GeneralUtility::makeInstance(ContentObjectRenderer::class);
|
||||
$contentObjectRenderer->setRequest($request);
|
||||
$contentObjectRenderer->start($request->getAttribute('frontend.page.information')->getPageRecord(), 'pages');
|
||||
$contentObjectRenderer->setCurrentFile($image);
|
||||
$objDataBackup = null;
|
||||
if ($this->renderingContext->getVariableProvider()->exists('data')) {
|
||||
$objDataBackup = $contentObjectRenderer->data;
|
||||
$contentObjectRenderer->data = $this->renderingContext->getVariableProvider()->get('data');
|
||||
}
|
||||
$configuration = $this->typoScriptService->convertPlainArrayToTypoScriptArray($this->arguments['configuration']);
|
||||
$content = $this->renderChildren();
|
||||
$configuration['enable'] = true;
|
||||
$result = $contentObjectRenderer->imageLinkWrap((string)$content, $image, $configuration);
|
||||
if ($objDataBackup) {
|
||||
$contentObjectRenderer->data = $objDataBackup;
|
||||
}
|
||||
return $result;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,8 @@
|
||||
services:
|
||||
_defaults:
|
||||
autowire: true
|
||||
autoconfigure: true
|
||||
public: false
|
||||
|
||||
TYPO3\CMS\FluidStyledContent\:
|
||||
resource: '../Classes/*'
|
||||
@@ -0,0 +1 @@
|
||||
name: typo3/fluid-styled-content
|
||||
@@ -0,0 +1,152 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<xliff xmlns="urn:oasis:names:tc:xliff:document:1.2" version="1.2">
|
||||
<file source-language="en" datatype="plaintext" original="EXT:fluid_styled_content/Configuration/Sets/FluidStyledContent/labels.xlf" date="2024-09-05T08:00:00Z" product-name="fluid_styled_content">
|
||||
<header/>
|
||||
<body>
|
||||
<trans-unit id="label">
|
||||
<source>Fluid Styled Content</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="categories.fsc">
|
||||
<source>Fluid Styled Content</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="categories.fsc.templates">
|
||||
<source>Templates</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="categories.fsc.content">
|
||||
<source>Content Elements</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.defaultHeaderType">
|
||||
<source>Default Header type</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.description.styles.content.defaultHeaderType">
|
||||
<source>Enter the number of the header layout to be used by default</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.shortcut.tables">
|
||||
<source>List of accepted tables</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.image.lazyLoading">
|
||||
<source>Default settings for browser-native image lazy loading</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.description.styles.content.image.lazyLoading">
|
||||
<source>Can be `lazy` (browsers could choose to load images later), `eager` (load images right away) or `auto` (browser will determine whether the image should be lazy loaded or not)</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.image.lazyLoading.enum.lazy">
|
||||
<source>Lazy</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.image.lazyLoading.enum.eager">
|
||||
<source>Eager</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.image.lazyLoading.enum.auto">
|
||||
<source>Auto</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.image.imageDecoding">
|
||||
<source>Default settings for an image decoding hint to the browser</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.description.styles.content.image.imageDecoding">
|
||||
<source>Can be `sync` (synchronously for atomic presentation with other content), `async` (asynchronously to avoid delaying presentation of other content), `auto` (no preference in decoding mode) or an empty value to omit the usage of the decoding attribute (same as `auto`)</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.image.imageDecoding.enum.sync">
|
||||
<source>Sync</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.image.imageDecoding.enum.async">
|
||||
<source>Asynchronous</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.image.imageDecoding.enum.auto">
|
||||
<source>Auto</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.textmedia.maxW">
|
||||
<source>Max Image/Media Width</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.description.styles.content.textmedia.maxW">
|
||||
<source>This indicates that maximum number of pixels (width) a block of media elements inserted as content is allowed to consume</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.textmedia.maxWInText">
|
||||
<source>Max Image/Media Width (Text)</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.description.styles.content.textmedia.maxWInText">
|
||||
<source>Same as above, but this is the maximum width when text is wrapped around an block of media elements. Default is 50% of the normal Max Media Item Width</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.textmedia.columnSpacing">
|
||||
<source>Advanced, Column space</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.description.styles.content.textmedia.columnSpacing">
|
||||
<source>Horizontal distance between media elements in a block in content elements of type "Media & Images". If you change this manually in your CSS, you need to adjust this setting accordingly</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.textmedia.rowSpacing">
|
||||
<source>Advanced, Row space</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.description.styles.content.textmedia.rowSpacing">
|
||||
<source>Vertical distance after each media elements row in content elements of type "Text & Media". If you change this manually in your CSS, you need to adjust this setting accordingly</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.textmedia.textMargin">
|
||||
<source>Advanced, Margin to text</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.description.styles.content.textmedia.textMargin">
|
||||
<source>Horizontal distance between an imageblock and text in content elements of type "Text & Images"</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.textmedia.borderColor">
|
||||
<source>Media element border, color</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.description.styles.content.textmedia.borderColor">
|
||||
<source>Bordercolor of media elements in content elements when "Border"-option for an element is set</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.textmedia.borderWidth">
|
||||
<source>Media element border, thickness</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.description.styles.content.textmedia.borderWidth">
|
||||
<source>Thickness of border around media elements in content elements when "Border"-option for element is set</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.textmedia.borderPadding">
|
||||
<source>Media element border, padding</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.description.styles.content.textmedia.borderPadding">
|
||||
<source>Padding left and right to the media element, around the border</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.textmedia.linkWrap.width">
|
||||
<source>Click-enlarge Media Width</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.description.styles.content.textmedia.linkWrap.width">
|
||||
<source>This specifies the width of the enlarged media element when click-enlarge is enabled</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.textmedia.linkWrap.height">
|
||||
<source>Click-enlarge Media Height</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.description.styles.content.textmedia.linkWrap.height">
|
||||
<source>This specifies the height of the enlarged media element when click-enlarge is enabled</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.textmedia.linkWrap.newWindow">
|
||||
<source>Advanced, New window</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.description.styles.content.textmedia.linkWrap.newWindow">
|
||||
<source>If set, every click-enlarged media element will open in it's own popup window and not the current popup window (which may have a wrong size for the media element to fit in)</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.textmedia.linkWrap.lightboxEnabled">
|
||||
<source>Lightbox click-enlarge rendering</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.description.styles.content.textmedia.linkWrap.lightboxEnabled">
|
||||
<source>Whether media elements with click-enlarge checked should be rendered lightbox-compliant</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.textmedia.linkWrap.lightboxCssClass">
|
||||
<source>Lightbox CSS class</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.description.styles.content.textmedia.linkWrap.lightboxCssClass">
|
||||
<source>Which CSS class to use for lightbox links (only applicable if lightbox rendering is enabled)</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.content.textmedia.linkWrap.lightboxRelAttribute">
|
||||
<source>Lightbox rel="" attribute</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.description.styles.content.textmedia.linkWrap.lightboxRelAttribute">
|
||||
<source>Which `rel=""` attribute to use for lightbox links (only applicable if lightbox rendering is enabled)</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.templates.templateRootPath">
|
||||
<source>Path of Fluid Templates for all defined content elements</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.templates.partialRootPath">
|
||||
<source>Path of Fluid Partials for all defined content elements</source>
|
||||
</trans-unit>
|
||||
<trans-unit id="settings.styles.templates.layoutRootPath">
|
||||
<source>Path of Fluid Layouts for all defined content elements</source>
|
||||
</trans-unit>
|
||||
</body>
|
||||
</file>
|
||||
</xliff>
|
||||
@@ -0,0 +1,100 @@
|
||||
categories:
|
||||
fsc: ~
|
||||
fsc.templates:
|
||||
parent: fsc
|
||||
fsc.content:
|
||||
parent: fsc
|
||||
|
||||
settings:
|
||||
styles.content.defaultHeaderType:
|
||||
default: 2
|
||||
type: int
|
||||
category: fsc.content
|
||||
styles.content.shortcut.tables:
|
||||
default: tt_content
|
||||
type: string
|
||||
category: fsc.content
|
||||
styles.content.image.lazyLoading:
|
||||
default: lazy
|
||||
type: string
|
||||
enum:
|
||||
- lazy
|
||||
- eager
|
||||
- auto
|
||||
category: fsc.content
|
||||
styles.content.image.imageDecoding:
|
||||
default: ''
|
||||
type: string
|
||||
enum:
|
||||
- sync
|
||||
- async
|
||||
- auto
|
||||
category: fsc.content
|
||||
styles.content.textmedia.maxW:
|
||||
default: 600
|
||||
type: int
|
||||
category: fsc.content
|
||||
styles.content.textmedia.maxWInText:
|
||||
default: 300
|
||||
type: int
|
||||
category: fsc.content
|
||||
styles.content.textmedia.columnSpacing:
|
||||
default: 10
|
||||
type: int
|
||||
category: fsc.content
|
||||
styles.content.textmedia.rowSpacing:
|
||||
default: 10
|
||||
type: int
|
||||
category: fsc.content
|
||||
styles.content.textmedia.textMargin:
|
||||
default: 10
|
||||
type: int
|
||||
category: fsc.content
|
||||
styles.content.textmedia.borderColor:
|
||||
default: '#000000'
|
||||
type: color
|
||||
category: fsc.content
|
||||
styles.content.textmedia.borderWidth:
|
||||
default: 2
|
||||
type: int
|
||||
category: fsc.content
|
||||
styles.content.textmedia.borderPadding:
|
||||
default: 0
|
||||
type: int
|
||||
category: fsc.content
|
||||
styles.content.textmedia.linkWrap.width:
|
||||
default: 800m
|
||||
type: string
|
||||
category: fsc.content
|
||||
styles.content.textmedia.linkWrap.height:
|
||||
default: 600m
|
||||
type: string
|
||||
category: fsc.content
|
||||
styles.content.textmedia.linkWrap.newWindow:
|
||||
default: false
|
||||
type: bool
|
||||
category: fsc.content
|
||||
styles.content.textmedia.linkWrap.lightboxEnabled:
|
||||
default: false
|
||||
type: bool
|
||||
category: fsc.content
|
||||
styles.content.textmedia.linkWrap.lightboxCssClass:
|
||||
default: lightbox
|
||||
type: string
|
||||
category: fsc.content
|
||||
styles.content.textmedia.linkWrap.lightboxRelAttribute:
|
||||
default: 'lightbox[{field:uid}]'
|
||||
type: string
|
||||
category: fsc.content
|
||||
styles.templates.templateRootPath:
|
||||
default: ''
|
||||
type: string
|
||||
category: fsc.templates
|
||||
styles.templates.partialRootPath:
|
||||
default: ''
|
||||
type: string
|
||||
category: fsc.templates
|
||||
styles.templates.layoutRootPath:
|
||||
default: ''
|
||||
type: string
|
||||
category: fsc.templates
|
||||
@@ -0,0 +1 @@
|
||||
@import 'EXT:fluid_styled_content/Configuration/TypoScript/setup.typoscript'
|
||||
@@ -0,0 +1,4 @@
|
||||
name: typo3/fluid-styled-content-css
|
||||
label: Fluid Styled Content CSS
|
||||
dependencies:
|
||||
- typo3/fluid-styled-content
|
||||
@@ -0,0 +1 @@
|
||||
@import 'EXT:fluid_styled_content/Configuration/TypoScript/Styling/setup.typoscript'
|
||||
@@ -0,0 +1,14 @@
|
||||
<?php
|
||||
|
||||
defined('TYPO3') or die();
|
||||
|
||||
\TYPO3\CMS\Core\Utility\ExtensionManagementUtility::addStaticFile(
|
||||
'fluid_styled_content',
|
||||
'Configuration/TypoScript/',
|
||||
'Fluid Content Elements'
|
||||
);
|
||||
\TYPO3\CMS\Core\Utility\ExtensionManagementUtility::addStaticFile(
|
||||
'fluid_styled_content',
|
||||
'Configuration/TypoScript/Styling/',
|
||||
'Fluid Content Elements CSS (optional)'
|
||||
);
|
||||
@@ -0,0 +1,31 @@
|
||||
# Bullet List:
|
||||
# A single bullet list.
|
||||
#
|
||||
# CType: bullets
|
||||
|
||||
tt_content.bullets =< lib.contentElement
|
||||
tt_content.bullets {
|
||||
templateName = Bullets
|
||||
dataProcessing {
|
||||
10 = split
|
||||
10 {
|
||||
if {
|
||||
value = 2
|
||||
isLessThan.field = bullets_type
|
||||
}
|
||||
fieldName = bodytext
|
||||
removeEmptyEntries = 1
|
||||
as = bullets
|
||||
}
|
||||
20 = comma-separated-value
|
||||
20 {
|
||||
fieldName = bodytext
|
||||
if {
|
||||
value = 2
|
||||
equals.field = bullets_type
|
||||
}
|
||||
fieldDelimiter = |
|
||||
as = bullets
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,9 @@
|
||||
# Divider:
|
||||
# This element inserts a visual divider, which is by default a horizontal line.
|
||||
#
|
||||
# CType: div
|
||||
|
||||
tt_content.div =< lib.contentElement
|
||||
tt_content.div {
|
||||
templateName = Div
|
||||
}
|
||||
@@ -0,0 +1,9 @@
|
||||
# Header Only:
|
||||
# Adds a header only.
|
||||
#
|
||||
# CType: header
|
||||
|
||||
tt_content.header =< lib.contentElement
|
||||
tt_content.header {
|
||||
templateName = Header
|
||||
}
|
||||
@@ -0,0 +1,9 @@
|
||||
# Plain HTML:
|
||||
# With this element you can output raw HTML code on the page.
|
||||
#
|
||||
# CType: html
|
||||
|
||||
tt_content.html =< lib.contentElement
|
||||
tt_content.html {
|
||||
templateName = Html
|
||||
}
|
||||
@@ -0,0 +1,23 @@
|
||||
# Image:
|
||||
# ...
|
||||
#
|
||||
# CType: image
|
||||
|
||||
tt_content.image =< lib.contentElement
|
||||
tt_content.image {
|
||||
templateName = Image
|
||||
dataProcessing {
|
||||
10 = files
|
||||
10 {
|
||||
references.fieldName = image
|
||||
}
|
||||
20 = gallery
|
||||
20 {
|
||||
maxGalleryWidth = {$styles.content.textmedia.maxW}
|
||||
maxGalleryWidthInText = {$styles.content.textmedia.maxWInText}
|
||||
columnSpacing = {$styles.content.textmedia.columnSpacing}
|
||||
borderWidth = {$styles.content.textmedia.borderWidth}
|
||||
borderPadding = {$styles.content.textmedia.borderPadding}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,22 @@
|
||||
# Menu of subpages of selected pages including abstracts:
|
||||
# ...
|
||||
#
|
||||
# CType: menu_abstract
|
||||
|
||||
tt_content.menu_abstract =< lib.contentElement
|
||||
tt_content.menu_abstract {
|
||||
templateName = MenuAbstract
|
||||
dataProcessing {
|
||||
10 = menu
|
||||
10 {
|
||||
special = directory
|
||||
special.value.field = pages
|
||||
dataProcessing {
|
||||
10 = files
|
||||
10 {
|
||||
references.fieldName = media
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,30 @@
|
||||
# Content elements for selected categories:
|
||||
# ...
|
||||
#
|
||||
# CType: menu_categorized_content
|
||||
|
||||
tt_content.menu_categorized_content =< lib.contentElement
|
||||
tt_content.menu_categorized_content {
|
||||
templateName = MenuCategorizedContent
|
||||
dataProcessing {
|
||||
10 = database-query
|
||||
10 {
|
||||
table = tt_content
|
||||
selectFields = DISTINCT {#tt_content}.*
|
||||
pidInList.data = leveluid : 0
|
||||
recursive = 99
|
||||
join.data = field:selected_categories
|
||||
join.wrap = {#sys_category_record_mm} ON uid = {#sys_category_record_mm}.{#uid_foreign} AND {#sys_category_record_mm}.{#uid_local} IN(|)
|
||||
where.data = field:category_field
|
||||
where.wrap = {#tablenames}='tt_content' and {#fieldname}='|'
|
||||
orderBy = tt_content.sorting
|
||||
as = content
|
||||
dataProcessing {
|
||||
10 = files
|
||||
10 {
|
||||
references.fieldName = image
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,27 @@
|
||||
# Pages for selected categories:
|
||||
# ...
|
||||
#
|
||||
# CType: menu_categorized_pages
|
||||
|
||||
tt_content.menu_categorized_pages =< lib.contentElement
|
||||
tt_content.menu_categorized_pages {
|
||||
templateName = MenuCategorizedPages
|
||||
dataProcessing {
|
||||
10 = menu
|
||||
10 {
|
||||
special = categories
|
||||
special {
|
||||
value.field = selected_categories
|
||||
relation.field = category_field
|
||||
sorting = title
|
||||
order = asc
|
||||
}
|
||||
dataProcessing {
|
||||
10 = files
|
||||
10 {
|
||||
references.fieldName = media
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,22 @@
|
||||
# Menu of selected pages:
|
||||
# ...
|
||||
#
|
||||
# CType: menu_pages
|
||||
|
||||
tt_content.menu_pages =< lib.contentElement
|
||||
tt_content.menu_pages {
|
||||
templateName = MenuPages
|
||||
dataProcessing {
|
||||
10 = menu
|
||||
10 {
|
||||
special = list
|
||||
special.value.field = pages
|
||||
dataProcessing {
|
||||
10 = files
|
||||
10 {
|
||||
references.fieldName = media
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,26 @@
|
||||
# Recently updated pages:
|
||||
# ...
|
||||
#
|
||||
# CType: menu_recently_updated
|
||||
|
||||
tt_content.menu_recently_updated =< lib.contentElement
|
||||
tt_content.menu_recently_updated {
|
||||
templateName = MenuRecentlyUpdated
|
||||
dataProcessing {
|
||||
10 = menu
|
||||
10 {
|
||||
special = updated
|
||||
special {
|
||||
value.field = pages
|
||||
maxAge = 3600*24*7
|
||||
excludeNoSearchPages = 1
|
||||
}
|
||||
dataProcessing {
|
||||
10 = files
|
||||
10 {
|
||||
references.fieldName = media
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,26 @@
|
||||
# Related pages (based on keywords):
|
||||
# ...
|
||||
#
|
||||
# CType: menu_related_pages
|
||||
|
||||
tt_content.menu_related_pages =< lib.contentElement
|
||||
tt_content.menu_related_pages {
|
||||
templateName = MenuRelatedPages
|
||||
dataProcessing {
|
||||
10 = menu
|
||||
10 {
|
||||
special = keywords
|
||||
special {
|
||||
value.field = pages
|
||||
excludeNoSearchPages = 1
|
||||
}
|
||||
alternativeSortingField = title
|
||||
dataProcessing {
|
||||
10 = files
|
||||
10 {
|
||||
references.fieldName = media
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,57 @@
|
||||
# Section index (page content marked for section menus):
|
||||
# ...
|
||||
#
|
||||
# CType: menu_section
|
||||
|
||||
tt_content.menu_section =< lib.contentElement
|
||||
tt_content.menu_section {
|
||||
templateName = MenuSection
|
||||
dataProcessing {
|
||||
10 = menu
|
||||
10 {
|
||||
// Always activate includeNotInMenu for a section menu of the current page
|
||||
includeNotInMenu.override = 1
|
||||
includeNotInMenu.override.if.isFalse.field = pages
|
||||
special = list
|
||||
special {
|
||||
value {
|
||||
field = pages
|
||||
override {
|
||||
data = page:uid
|
||||
if {
|
||||
isFalse.field = pages
|
||||
}
|
||||
|
||||
// Currrent page uses content of another page
|
||||
override {
|
||||
data = page:content_from_pid
|
||||
if {
|
||||
isTrue.data = page:content_from_pid
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
dataProcessing {
|
||||
10 = files
|
||||
10 {
|
||||
references.fieldName = media
|
||||
}
|
||||
20 = database-query
|
||||
20 {
|
||||
table = tt_content
|
||||
pidInList.field = uid
|
||||
as = content
|
||||
where = {#sectionIndex} = 1
|
||||
orderBy = sorting
|
||||
dataProcessing {
|
||||
10 = files
|
||||
10 {
|
||||
references.fieldName = image
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,36 @@
|
||||
# Menu of subpages of selected pages including sections:
|
||||
# ...
|
||||
#
|
||||
# CType: menu_section_pages
|
||||
|
||||
tt_content.menu_section_pages =< lib.contentElement
|
||||
tt_content.menu_section_pages {
|
||||
templateName = MenuSectionPages
|
||||
dataProcessing {
|
||||
10 = menu
|
||||
10 {
|
||||
special = directory
|
||||
special.value.field = pages
|
||||
dataProcessing {
|
||||
10 = files
|
||||
10 {
|
||||
references.fieldName = media
|
||||
}
|
||||
20 = database-query
|
||||
20 {
|
||||
table = tt_content
|
||||
pidInList.field = uid
|
||||
where = {#sectionIndex} = 1
|
||||
orderBy = sorting
|
||||
as = content
|
||||
dataProcessing {
|
||||
10 = files
|
||||
10 {
|
||||
references.fieldName = image
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,21 @@
|
||||
# Sitemap:
|
||||
# ...
|
||||
#
|
||||
# CType: menu_sitemap
|
||||
|
||||
tt_content.menu_sitemap =< lib.contentElement
|
||||
tt_content.menu_sitemap {
|
||||
templateName = MenuSitemap
|
||||
dataProcessing {
|
||||
10 = menu
|
||||
10 {
|
||||
levels = 7
|
||||
dataProcessing {
|
||||
10 = files
|
||||
10 {
|
||||
references.fieldName = media
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,23 @@
|
||||
# Sitemaps of selected pages:
|
||||
# ...
|
||||
#
|
||||
# CType: menu_sitemap_pages
|
||||
|
||||
tt_content.menu_sitemap_pages =< lib.contentElement
|
||||
tt_content.menu_sitemap_pages {
|
||||
templateName = MenuSitemapPages
|
||||
dataProcessing {
|
||||
10 = menu
|
||||
10 {
|
||||
special = directory
|
||||
special.value.field = pages
|
||||
levels = 7
|
||||
dataProcessing {
|
||||
10 = files
|
||||
10 {
|
||||
references.fieldName = media
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,22 @@
|
||||
# Menu of subpages of selected pages:
|
||||
# ...
|
||||
#
|
||||
# CType: menu_subpages
|
||||
|
||||
tt_content.menu_subpages =< lib.contentElement
|
||||
tt_content.menu_subpages {
|
||||
templateName = MenuSubpages
|
||||
dataProcessing {
|
||||
10 = menu
|
||||
10 {
|
||||
special = directory
|
||||
special.value.field = pages
|
||||
dataProcessing {
|
||||
10 = files
|
||||
10 {
|
||||
references.fieldName = media
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,16 @@
|
||||
# Insert records:
|
||||
# This element embeds other content elements.
|
||||
#
|
||||
# CType: shortcut
|
||||
|
||||
tt_content.shortcut =< lib.contentElement
|
||||
tt_content.shortcut {
|
||||
templateName = Shortcut
|
||||
|
||||
# Keep this, since the "conf" option can be used
|
||||
variables.shortcuts = RECORDS
|
||||
variables.shortcuts {
|
||||
source.field = records
|
||||
tables = {$styles.content.shortcut.tables}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,32 @@
|
||||
# Table:
|
||||
# A simple table.
|
||||
#
|
||||
# CType: table
|
||||
|
||||
tt_content.table =< lib.contentElement
|
||||
tt_content.table {
|
||||
templateName = Table
|
||||
dataProcessing {
|
||||
10 = comma-separated-value
|
||||
10 {
|
||||
fieldName = bodytext
|
||||
fieldDelimiter.char.cObject = TEXT
|
||||
fieldDelimiter.char.cObject {
|
||||
field = table_delimiter
|
||||
}
|
||||
fieldEnclosure.char.cObject = TEXT
|
||||
fieldEnclosure.char.cObject {
|
||||
field = table_enclosure
|
||||
}
|
||||
fieldEnclosure {
|
||||
if {
|
||||
value = 0
|
||||
equals.field = table_enclosure
|
||||
negate = 1
|
||||
}
|
||||
}
|
||||
maximumColumns.field = cols
|
||||
as = table
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,9 @@
|
||||
# Regular Text Element:
|
||||
# A regular text element with header and bodytext fields.
|
||||
#
|
||||
# CType: text
|
||||
|
||||
tt_content.text =< lib.contentElement
|
||||
tt_content.text {
|
||||
templateName = Text
|
||||
}
|
||||
@@ -0,0 +1,23 @@
|
||||
# Text & Media:
|
||||
# Any number of media wrapped right around a regular text element.
|
||||
#
|
||||
# CType: textmedia
|
||||
|
||||
tt_content.textmedia =< lib.contentElement
|
||||
tt_content.textmedia {
|
||||
templateName = Textmedia
|
||||
dataProcessing {
|
||||
10 = files
|
||||
10 {
|
||||
references.fieldName = assets
|
||||
}
|
||||
20 = gallery
|
||||
20 {
|
||||
maxGalleryWidth = {$styles.content.textmedia.maxW}
|
||||
maxGalleryWidthInText = {$styles.content.textmedia.maxWInText}
|
||||
columnSpacing = {$styles.content.textmedia.columnSpacing}
|
||||
borderWidth = {$styles.content.textmedia.borderWidth}
|
||||
borderPadding = {$styles.content.textmedia.borderPadding}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,23 @@
|
||||
# Text and Images:
|
||||
# Text with images.
|
||||
#
|
||||
# CType: textpic
|
||||
|
||||
tt_content.textpic =< lib.contentElement
|
||||
tt_content.textpic {
|
||||
templateName = Textpic
|
||||
dataProcessing {
|
||||
10 = files
|
||||
10 {
|
||||
references.fieldName = image
|
||||
}
|
||||
20 = gallery
|
||||
20 {
|
||||
maxGalleryWidth = {$styles.content.textmedia.maxW}
|
||||
maxGalleryWidthInText = {$styles.content.textmedia.maxWInText}
|
||||
columnSpacing = {$styles.content.textmedia.columnSpacing}
|
||||
borderWidth = {$styles.content.textmedia.borderWidth}
|
||||
borderPadding = {$styles.content.textmedia.borderPadding}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,18 @@
|
||||
# File Links:
|
||||
# Makes a list of files for download.
|
||||
#
|
||||
# CType: uploads
|
||||
|
||||
tt_content.uploads =< lib.contentElement
|
||||
tt_content.uploads {
|
||||
templateName = Uploads
|
||||
dataProcessing {
|
||||
10 = files
|
||||
10 {
|
||||
references.fieldName = media
|
||||
collections.field = file_collections
|
||||
sorting.field = filelink_sorting
|
||||
sorting.direction.field = filelink_sorting_direction
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,46 @@
|
||||
# Default configuration for content elements which are using FLUIDTEMPLATE directly
|
||||
lib.contentElement >
|
||||
lib.contentElement = FLUIDTEMPLATE
|
||||
lib.contentElement {
|
||||
templateName = Default
|
||||
templateRootPaths {
|
||||
0 = EXT:fluid_styled_content/Resources/Private/Templates/
|
||||
10 = {$styles.templates.templateRootPath}
|
||||
}
|
||||
partialRootPaths {
|
||||
0 = EXT:fluid_styled_content/Resources/Private/Partials/
|
||||
10 = {$styles.templates.partialRootPath}
|
||||
}
|
||||
layoutRootPaths {
|
||||
0 = EXT:fluid_styled_content/Resources/Private/Layouts/
|
||||
10 = {$styles.templates.layoutRootPath}
|
||||
}
|
||||
settings {
|
||||
defaultHeaderType = {$styles.content.defaultHeaderType}
|
||||
media {
|
||||
lazyLoading = {$styles.content.image.lazyLoading}
|
||||
imageDecoding = {$styles.content.image.imageDecoding}
|
||||
popup {
|
||||
bodyTag = <body style="margin:0; background:#fff;">
|
||||
wrap = <a href="javascript:close();"> | </a>
|
||||
width = {$styles.content.textmedia.linkWrap.width}
|
||||
height = {$styles.content.textmedia.linkWrap.height}
|
||||
crop.data = file:current:crop
|
||||
JSwindow = 1
|
||||
JSwindow {
|
||||
newWindow = {$styles.content.textmedia.linkWrap.newWindow}
|
||||
if.isFalse = {$styles.content.textmedia.linkWrap.lightboxEnabled}
|
||||
}
|
||||
directImageLink = {$styles.content.textmedia.linkWrap.lightboxEnabled}
|
||||
linkParams.ATagParams.dataWrap = class="{$styles.content.textmedia.linkWrap.lightboxCssClass}" rel="{$styles.content.textmedia.linkWrap.lightboxRelAttribute}"
|
||||
}
|
||||
additionalConfig {
|
||||
no-cookie = 1
|
||||
api = 0
|
||||
}
|
||||
}
|
||||
}
|
||||
dataProcessing {
|
||||
1770716912 = record-transformation
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,80 @@
|
||||
plugin.tx_frontend._CSS_DEFAULT_STYLE (
|
||||
.ce-align-left { text-align: left; }
|
||||
.ce-align-center { text-align: center; }
|
||||
.ce-align-right { text-align: right; }
|
||||
|
||||
.ce-table td, .ce-table th { vertical-align: top; }
|
||||
|
||||
.ce-textpic, .ce-image, .ce-nowrap .ce-bodytext, .ce-gallery, .ce-row, .ce-uploads li, .ce-uploads div { overflow: hidden; }
|
||||
|
||||
.ce-left .ce-gallery, .ce-column { float: left; }
|
||||
.ce-center .ce-outer { position: relative; float: right; right: 50%; }
|
||||
.ce-center .ce-inner { position: relative; float: right; right: -50%; }
|
||||
.ce-right .ce-gallery { float: right; }
|
||||
|
||||
.ce-gallery figure { display: table; margin: 0; }
|
||||
.ce-gallery figcaption { display: table-caption; caption-side: bottom; }
|
||||
.ce-gallery img { display: block; }
|
||||
.ce-gallery iframe { border-width: 0; }
|
||||
.ce-border img,
|
||||
.ce-border iframe {
|
||||
border: {$styles.content.textmedia.borderWidth}px solid {$styles.content.textmedia.borderColor};
|
||||
padding: {$styles.content.textmedia.borderPadding}px;
|
||||
}
|
||||
|
||||
.ce-intext.ce-right .ce-gallery, .ce-intext.ce-left .ce-gallery, .ce-above .ce-gallery {
|
||||
margin-bottom: {$styles.content.textmedia.textMargin}px;
|
||||
}
|
||||
.ce-image .ce-gallery { margin-bottom: 0; }
|
||||
.ce-intext.ce-right .ce-gallery { margin-left: {$styles.content.textmedia.textMargin}px; }
|
||||
.ce-intext.ce-left .ce-gallery { margin-right: {$styles.content.textmedia.textMargin}px; }
|
||||
.ce-below .ce-gallery { margin-top: {$styles.content.textmedia.textMargin}px; }
|
||||
|
||||
.ce-column { margin-right: {$styles.content.textmedia.columnSpacing}px; }
|
||||
.ce-column:last-child { margin-right: 0; }
|
||||
|
||||
.ce-row { margin-bottom: {$styles.content.textmedia.rowSpacing}px; }
|
||||
.ce-row:last-child { margin-bottom: 0; }
|
||||
|
||||
.ce-above .ce-bodytext { clear: both; }
|
||||
|
||||
.ce-intext.ce-left ol, .ce-intext.ce-left ul { padding-left: 40px; overflow: auto; }
|
||||
|
||||
/* Headline */
|
||||
.ce-headline-left { text-align: left; }
|
||||
.ce-headline-center { text-align: center; }
|
||||
.ce-headline-right { text-align: right; }
|
||||
|
||||
/* Uploads */
|
||||
.ce-uploads { margin: 0; padding: 0; }
|
||||
.ce-uploads li { list-style: none outside none; margin: 1em 0; }
|
||||
.ce-uploads img { float: left; padding-right: 1em; vertical-align: top; }
|
||||
.ce-uploads span { display: block; }
|
||||
|
||||
/* Table */
|
||||
.ce-table { width: 100%; max-width: 100%; }
|
||||
.ce-table th, .ce-table td { padding: 0.5em 0.75em; vertical-align: top; }
|
||||
.ce-table thead th { border-bottom: 2px solid #dadada; }
|
||||
.ce-table th, .ce-table td { border-top: 1px solid #dadada; }
|
||||
.ce-table-striped tbody tr:nth-of-type(odd) { background-color: rgba(0,0,0,.05); }
|
||||
.ce-table-bordered th, .ce-table-bordered td { border: 1px solid #dadada; }
|
||||
|
||||
/* Space */
|
||||
.frame-space-before-extra-small { margin-top: 1em; }
|
||||
.frame-space-before-small { margin-top: 2em; }
|
||||
.frame-space-before-medium { margin-top: 3em; }
|
||||
.frame-space-before-large { margin-top: 4em; }
|
||||
.frame-space-before-extra-large { margin-top: 5em; }
|
||||
.frame-space-after-extra-small { margin-bottom: 1em; }
|
||||
.frame-space-after-small { margin-bottom: 2em; }
|
||||
.frame-space-after-medium { margin-bottom: 3em; }
|
||||
.frame-space-after-large { margin-bottom: 4em; }
|
||||
.frame-space-after-extra-large { margin-bottom: 5em; }
|
||||
|
||||
/* Frame */
|
||||
.frame-ruler-before:before { content: ''; display: block; border-top: 1px solid rgba(0,0,0,0.25); margin-bottom: 2em; }
|
||||
.frame-ruler-after:after { content: ''; display: block; border-bottom: 1px solid rgba(0,0,0,0.25); margin-top: 2em; }
|
||||
.frame-indent { margin-left: 15%; margin-right: 15%; }
|
||||
.frame-indent-left { margin-left: 33%; }
|
||||
.frame-indent-right { margin-right: 33%; }
|
||||
)
|
||||
@@ -0,0 +1,56 @@
|
||||
styles.templates {
|
||||
# cat=content/templates/b1; type=string; label= Path of Fluid Templates for all defined content elements
|
||||
templateRootPath =
|
||||
# cat=content/templates/b2; type=string; label= Path of Fluid Partials for all defined content elements
|
||||
partialRootPath =
|
||||
# cat=content/templates/b3; type=string; label= Path of Fluid Layouts for all defined content elements
|
||||
layoutRootPath =
|
||||
}
|
||||
|
||||
styles.content {
|
||||
# cat=content/cHeader/h0; type=int[1-5]; label=Default Header type: Enter the number of the header layout to be used by default
|
||||
defaultHeaderType = 2
|
||||
|
||||
# cat=content/cShortcut/t0; type=string; label=List of accepted tables
|
||||
shortcut.tables = tt_content
|
||||
|
||||
# cat=content/cImage/a0; type=options[lazy,eager,auto,]; label=Default settings for browser-native image lazy loading: Can be "lazy" (browsers could choose to load images later), "eager" (load images right away) or "auto" (browser will determine whether the image should be lazy loaded or not)
|
||||
image.lazyLoading = lazy
|
||||
|
||||
# cat=content/cImage/a1; type=options[sync,async,auto,]; label=Default settings for an image decoding hint to the browser: Can be "sync" (synchronously for atomic presentation with other content), "async" (asynchronously to avoid delaying presentation of other content), "auto" (no preference in decoding mode) or an empty value to omit the usage of the decoding attribute (same as "auto")
|
||||
image.imageDecoding =
|
||||
|
||||
textmedia {
|
||||
# cat=content/cTextmedia/b1; type=int+; label= Max Image/Media Width: This indicates that maximum number of pixels (width) a block of media elements inserted as content is allowed to consume
|
||||
maxW = 600
|
||||
# cat=content/cTextmedia/b2; type=int+; label= Max Image/Media Width (Text): Same as above, but this is the maximum width when text is wrapped around an block of media elements. Default is 50% of the normal Max Media Item Width
|
||||
maxWInText = 300
|
||||
|
||||
# cat=content/cTextmedia/g1; type=int[0-100]; label= Advanced, Column space: Horizontal distance between media elements in a block in content elements of type "Media & Images". If you change this manually in your CSS, you need to adjust this setting accordingly
|
||||
columnSpacing = 10
|
||||
# cat=content/cTextmedia/g2; type=int[0-100]; label= Advanced, Row space: Vertical distance after each media elements row in content elements of type ""Text & Media". If you change this manually in your CSS, you need to adjust this setting accordingly
|
||||
rowSpacing = 10
|
||||
# cat=content/cTextmedia/g3; type=int[0-100]; label= Advanced, Margin to text: Horizontal distance between an imageblock and text in content elements of type "Text & Images"
|
||||
textMargin = 10
|
||||
|
||||
# cat=content/cTextmedia/i1; type=color; label= Media element border, color: Bordercolor of media elements in content elements when "Border"-option for an element is set
|
||||
borderColor = #000000
|
||||
# cat=content/cTextmedia/i2; type=int[0-100]; label= Media element border, thickness: Thickness of border around media elements in content elements when "Border"-option for element is set
|
||||
borderWidth = 2
|
||||
# cat=content/cTextmedia/i3; type=int+; label= Media element border, padding: Padding left and right to the media element, around the border
|
||||
borderPadding = 0
|
||||
|
||||
# cat=content/cTextmedia/c1; type=string; label= Click-enlarge Media Width: This specifies the width of the enlarged media element when click-enlarge is enabled
|
||||
linkWrap.width = 800m
|
||||
# cat=content/cTextmedia/c2; type=string; label= Click-enlarge Media Height: This specifies the height of the enlarged media element when click-enlarge is enabled
|
||||
linkWrap.height = 600m
|
||||
# cat=content/cTextmedia/c3; type=boolean; label= Advanced, New window: If set, every click-enlarged media element will open in it's own popup window and not the current popup window (which may have a wrong size for the media element to fit in)
|
||||
linkWrap.newWindow = 0
|
||||
# cat=content/cTextmedia/c4; type=boolean; label= Lightbox click-enlarge rendering: Whether media elements with click-enlarge checked should be rendered lightbox-compliant
|
||||
linkWrap.lightboxEnabled = 0
|
||||
# cat=content/cTextmedia/c5; type=string; label= Lightbox CSS class: Which CSS class to use for lightbox links (only applicable if lightbox rendering is enabled)
|
||||
linkWrap.lightboxCssClass = lightbox
|
||||
# cat=content/cTextmedia/c6; type=string; label= Lightbox rel="" attribute: Which rel="" attribute to use for lightbox links (only applicable if lightbox rendering is enabled)
|
||||
linkWrap.lightboxRelAttribute = lightbox[{field:uid}]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,28 @@
|
||||
# Include setup
|
||||
@import './Helper/ContentElement.typoscript'
|
||||
|
||||
# Typical content elements
|
||||
@import './ContentElement/Bullets.typoscript'
|
||||
@import './ContentElement/Div.typoscript'
|
||||
@import './ContentElement/Header.typoscript'
|
||||
@import './ContentElement/Html.typoscript'
|
||||
@import './ContentElement/Image.typoscript'
|
||||
@import './ContentElement/Shortcut.typoscript'
|
||||
@import './ContentElement/Table.typoscript'
|
||||
@import './ContentElement/Text.typoscript'
|
||||
@import './ContentElement/Textmedia.typoscript'
|
||||
@import './ContentElement/Textpic.typoscript'
|
||||
@import './ContentElement/Uploads.typoscript'
|
||||
|
||||
# Menu content elements
|
||||
@import './ContentElement/MenuAbstract.typoscript'
|
||||
@import './ContentElement/MenuCategorizedContent.typoscript'
|
||||
@import './ContentElement/MenuCategorizedPages.typoscript'
|
||||
@import './ContentElement/MenuPages.typoscript'
|
||||
@import './ContentElement/MenuSubpages.typoscript'
|
||||
@import './ContentElement/MenuSection.typoscript'
|
||||
@import './ContentElement/MenuSectionPages.typoscript'
|
||||
@import './ContentElement/MenuRecentlyUpdated.typoscript'
|
||||
@import './ContentElement/MenuRelatedPages.typoscript'
|
||||
@import './ContentElement/MenuSitemap.typoscript'
|
||||
@import './ContentElement/MenuSitemapPages.typoscript'
|
||||
@@ -0,0 +1,12 @@
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
.. _adding-your-own-content-elements:
|
||||
|
||||
================================
|
||||
Adding Your Own Content Elements
|
||||
================================
|
||||
|
||||
.. attention::
|
||||
|
||||
This page has been merged into :ref:`TYPO3 Explained <t3coreapi:adding-your-own-content-elements>`
|
||||
since Core version 8.7.
|
||||
@@ -0,0 +1,46 @@
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
.. _constant-editor:
|
||||
|
||||
===============
|
||||
Constant Editor
|
||||
===============
|
||||
|
||||
.. versionchanged:: 13.1
|
||||
:ref:`Site sets <site-sets>` have been introduced. The
|
||||
:ref:`settings of the site set <site-set-fluid-styled-content-settings>`
|
||||
superseded using TypoScript constants. Using TypoScript constants is
|
||||
still possible for compatibility reasons.
|
||||
|
||||
.. tip::
|
||||
If :ref:`Site sets <t3coreapi:site-sets>` are used, the constant editor might be disabled. You can then edit
|
||||
the settings in the :ref:`settings-editor`.
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/TypoScript/ConstantEditor.rst.txt
|
||||
|
||||
.. rst-class:: bignums-xxl
|
||||
|
||||
1. The :guilabel:`Constant Editor` can be found in the
|
||||
:guilabel:`Sites > TypoScript` module.
|
||||
|
||||
2. Select the page in the page tree which contains the root Typoscript record
|
||||
of your website.
|
||||
|
||||
3. Select :guilabel:`Constant Editor` in the dropdown at the top of the
|
||||
:guilabel:`Sites > TypoScript` module.
|
||||
|
||||
4. In the dropdown list select the category :guilabel:`CONTENT`.
|
||||
|
||||
5. This will give you a list with all the constants of this extension.
|
||||
All constants are described and can be edited by clicking the pencil in
|
||||
front of the current value or by editing the available field.
|
||||
|
||||
6. Do not forget to save the new values. The new values will be stored in the
|
||||
"Constants" field of the root template of your website.
|
||||
|
||||
.. note::
|
||||
If you use the :guilabel:`Constant Editor` the configuration gets written
|
||||
to the database and cannot be kept under version control. You can cut all
|
||||
values from the constants field of the root TypoScript record and move them
|
||||
to a file in your site package extension. This way you can keep the values
|
||||
under version control.
|
||||
@@ -0,0 +1,30 @@
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
.. _configuration:
|
||||
|
||||
=============
|
||||
Configuration
|
||||
=============
|
||||
|
||||
Configuring content elements can be done for the frontend and the backend.
|
||||
|
||||
The appearance of the content elements can be changed by overriding the
|
||||
:ref:`default settings <site-set-fluid-styled-content-settings>` provided
|
||||
by the site set :ref:`"Fluid Styled Content" <site-set-fluid-styled-content>`.
|
||||
|
||||
You can also :ref:`override the Fluid
|
||||
templates <overriding-fluid-templates>` provided by this extension.
|
||||
|
||||
For the backend, fields can be shown or hidden, depending on the fields you are using or
|
||||
the fields an editor is allowed to use. Configuration like this is done using
|
||||
*Page TSconfig* or *User TSconfig*.
|
||||
|
||||
.. toctree::
|
||||
:titlesonly:
|
||||
:glob:
|
||||
|
||||
Sets/Index
|
||||
SettingsEditor/Index
|
||||
ConstantEditor/Index
|
||||
TypoScript/Index
|
||||
OverridingFluidTemplates/Index
|
||||
@@ -0,0 +1,75 @@
|
||||
:navigation-title: Overriding templates
|
||||
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
.. _overriding-fluid-templates:
|
||||
|
||||
==============================
|
||||
Overriding the Fluid templates
|
||||
==============================
|
||||
|
||||
At :ref:`typoscript` we have described the way content elements are rendered.
|
||||
|
||||
By default these settings are done in the :file:`setup.typoscript` file which can be found in the
|
||||
:file:`EXT:fluid_styled_content/Configuration/TypoScript/` folder.
|
||||
|
||||
.. _overriding-fluid-templates-using-site-sets:
|
||||
|
||||
Using the site settings
|
||||
=======================
|
||||
|
||||
.. versionadded:: 13.1
|
||||
You can now use :ref:`site settings <t3coreapi:sitehandling-settings>` to
|
||||
override the template paths.
|
||||
|
||||
In order to override the templates used in `fluid_styled_content` you need a
|
||||
custom :ref:`site package <t3sitepackage:start>`.
|
||||
|
||||
You can override the default template paths from the
|
||||
:ref:`site-set-fluid-styled-content` in your site configuration:
|
||||
|
||||
.. literalinclude:: _site-settings.yaml
|
||||
:caption: EXT:site_package/Configuration/Sets/SitePackage/settings.yaml
|
||||
|
||||
Now copy the Fluid templates that you want to override into your site package at
|
||||
the path configured in the site settings.
|
||||
|
||||
.. _overriding-fluid-templates-using-lib-fluidcontent:
|
||||
|
||||
Using lib.contentElement
|
||||
========================
|
||||
|
||||
.. versionchanged:: 13.1
|
||||
It is recommended to use
|
||||
:ref:`site settings <overriding-fluid-templates-using-site-sets>` instead of
|
||||
:typoscript:`lib.contentElement` to override the template paths.
|
||||
|
||||
This option gives you the ability to add another `templateRootPath` and can be defined
|
||||
the same as `partialRootPaths` and `layoutRootPaths`:
|
||||
|
||||
.. code-block:: typoscript
|
||||
|
||||
lib.contentElement {
|
||||
templateRootPaths {
|
||||
200 = EXT:your_extension_key/Resources/Private/Templates/
|
||||
}
|
||||
partialRootPaths {
|
||||
200 = EXT:your_extension_key/Resources/Private/Partials/
|
||||
}
|
||||
layoutRootPaths {
|
||||
200 = EXT:your_extension_key/Resources/Private/Layouts/
|
||||
}
|
||||
}
|
||||
|
||||
A content element is using a `templateName`, which is defined in :file:`setup.typoscript`. You
|
||||
can override this value, but the template from the extension *fluid_styled_content* will
|
||||
not be loaded as its name is still the default value.
|
||||
|
||||
.. code-block:: typoscript
|
||||
|
||||
tt_content {
|
||||
bullets {
|
||||
templateName = ChangedName
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,5 @@
|
||||
styles:
|
||||
templates:
|
||||
templateRootPath: EXT:my_site_package/Resources/Private/Extensions/FluidStyledContent/Templates/
|
||||
partialRootPath: EXT:my_site_package/Resources/Private/Extensions/FluidStyledContent/Partials/
|
||||
layoutRootPath: EXT:my_site_package/Resources/Private/Extensions/FluidStyledContent/Layouts/
|
||||
@@ -0,0 +1,38 @@
|
||||
:navigation-title: Fluid Styled Content
|
||||
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
.. _site-set-fluid-styled-content:
|
||||
|
||||
===============================
|
||||
Site set "Fluid Styled Content"
|
||||
===============================
|
||||
|
||||
.. versionadded:: 13.1
|
||||
:ref:`Site sets <t3coreapi:site-sets>` have been added to the extension :composer:`typo3/cms-fluid-styled-content`.
|
||||
See :ref:`include-site-set` on how to use them.
|
||||
|
||||
The site set "Fluid Styled Content" includes all TypoScript required to
|
||||
display the :ref:`content elements <content-elements>` provided by
|
||||
:composer:`typo3/cms-fluid-styled-content`.
|
||||
|
||||
Some settings in these content elements like image positions or space settings
|
||||
require certain CSS styles. If you want to use the default CSS styles provided
|
||||
by TYPO3, include :ref:`site-set-fluid-styled-content-css` in addition to this
|
||||
site set.
|
||||
|
||||
If you depend on this site set directly instead of :ref:`site-set-fluid-styled-content-css`
|
||||
you should provide the missing CSS yourself or disable all `tt_content` fields
|
||||
via page TSconfig that lose their function due to missing CSS.
|
||||
|
||||
.. _site-set-fluid-styled-content-settings:
|
||||
|
||||
Settings provided by site set "Fluid Styled Content"
|
||||
====================================================
|
||||
|
||||
These settings can be adjusted in the :ref:`settings-editor`.
|
||||
|
||||
.. typo3:site-set-settings:: PROJECT:/Configuration/Sets/FluidStyledContent/settings.definitions.yaml
|
||||
:name: fluid-styled-content
|
||||
:type:
|
||||
:Label: Settings of "Fluid Styled Content"
|
||||
@@ -0,0 +1,25 @@
|
||||
:navigation-title: Fluid Styled Content CSS
|
||||
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
.. _site-set-fluid-styled-content-css:
|
||||
|
||||
===================================
|
||||
Site set "Fluid Styled Content CSS"
|
||||
===================================
|
||||
|
||||
.. versionadded:: 13.1
|
||||
:ref:`Site sets <t3coreapi:site-sets>` have been added to the extension :composer:`typo3/cms-fluid-styled-content`.
|
||||
See :ref:`include-site-set` on how to use them.
|
||||
|
||||
This site set depends on the :ref:`site-set-fluid-styled-content`. Additionally it
|
||||
includes the :confval:`_CSS_DEFAULT_STYLE <t3tsref:plugin-css-default-style>`.
|
||||
|
||||
The styles provided by this site set enable the display of settings in content
|
||||
elements, including frame styles like `.frame-space-before-large`, styles
|
||||
for headlines like `.ce-headline-center` and styles for images like
|
||||
`.ce-intext.ce-left`.
|
||||
|
||||
If you do not depend on this site set you should provide the according CSS yourself
|
||||
or disable all fields in the TCA table that lose their function due to missing
|
||||
CSS styles.
|
||||
@@ -0,0 +1,41 @@
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
.. _site-sets:
|
||||
|
||||
=========
|
||||
Site sets
|
||||
=========
|
||||
|
||||
.. versionadded:: 13.1
|
||||
:ref:`Site sets <t3coreapi:site-sets>` have been added to the extension
|
||||
:composer:`typo3/cms-fluid-styled-content`.
|
||||
See :ref:`include-site-set` on how to use them.
|
||||
|
||||
The extension :composer:`typo3/cms-fluid-styled-content` offers two site sets
|
||||
that can be included via the Site module or required by your
|
||||
:ref:`site package's site set <t3sitepackage:site_set>`.
|
||||
|
||||
The settings provided by these sets can be adjusted in the :ref:`settings-editor`.
|
||||
|
||||
.. card-grid::
|
||||
:columns: 1
|
||||
:columns-md: 2
|
||||
:gap: 4
|
||||
:class: pb-4
|
||||
:card-height: 100
|
||||
|
||||
.. card:: :ref:`"Fluid Styled Content" <site-set-fluid-styled-content>`
|
||||
|
||||
The site set "Fluid Styled Content" includes all TypoScript required to
|
||||
display the content elements provided by `fluid_styled_content`.
|
||||
|
||||
.. card:: :ref:`"Fluid Styled Content CSS" <site-set-fluid-styled-content-css>`
|
||||
|
||||
This site set extends the :ref:`"Fluid Styled Content" <site-set-fluid-styled-content>`
|
||||
site set with default CSS.
|
||||
|
||||
.. toctree::
|
||||
:glob:
|
||||
:hidden:
|
||||
|
||||
*
|
||||
@@ -0,0 +1,23 @@
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
.. _settings-editor:
|
||||
|
||||
===============
|
||||
Settings editor
|
||||
===============
|
||||
|
||||
When the :ref:`site sets of fluid_styled_content <include-site-set>` are included,
|
||||
the settings provided by those sets become available in the editor.
|
||||
|
||||
You can find the available site settings in module
|
||||
:guilabel:`Sites > Setup > Settings`
|
||||
|
||||
You can change individual settings here. If the site settings are writable
|
||||
you can hit the :guilabel:`Save` button and the settings will be written
|
||||
directly to the site settings.
|
||||
|
||||
If the settings are not writable you can click the :guilabel:`YAML export`
|
||||
button to export the settings. These can then be added by a developer with
|
||||
sufficient rights.
|
||||
|
||||
The available settings are also described in detail in :ref:`site-sets`.
|
||||
@@ -0,0 +1,96 @@
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
.. _typoscript:
|
||||
|
||||
==========
|
||||
TypoScript
|
||||
==========
|
||||
|
||||
At the section :ref:`include-site-set` you have already added the TypoScript by
|
||||
depending on the site set.
|
||||
|
||||
The TypoScript of the site set includes files located
|
||||
in the directory :file:`EXT:fluid_styled_content/Configuration/TypoScript/`.
|
||||
|
||||
.. figure:: /Images/ExternalScreenshots/TypoScriptFileStructure.png
|
||||
:alt: Structure of the TypoScript files
|
||||
|
||||
Structure of the TypoScript files
|
||||
|
||||
In this folder there are two files:
|
||||
|
||||
* :file:`constants.typoscript` - This file is only used when for compatibility
|
||||
reasons the TypoScript is included via import or `TypoScript` module in the
|
||||
outdated fashion.
|
||||
* :file:`setup.typoscript` - This file will first include some other files
|
||||
which are located in the :file:`Setup/` folder in the same directory. More
|
||||
about these files later.
|
||||
|
||||
In the folder :file:`ContentElement/` there are files which are included by the file
|
||||
:file:`setup.typoscript` as mentioned above. These files contain the rendering definitions of all
|
||||
content elements that are provided by the TYPO3 Core. These are:
|
||||
|
||||
- :file:`Bullets.typoscript` - Configuration for content element "Bullet List"
|
||||
|
||||
- :file:`Div.typoscript` - Configuration for content element "Divider"
|
||||
|
||||
- :file:`Header.typoscript` - Configuration for content element "Header Only"
|
||||
|
||||
- :file:`Html.typoscript` - Configuration for content element "Plain HTML"
|
||||
|
||||
- :file:`Image.typoscript` - Configuration for content element "Image"
|
||||
|
||||
- :file:`List.typoscript` - Configuration for content element "General Plugin"
|
||||
|
||||
- :file:`MenuAbstract.typoscript` - Configuration for content element "Menu of subpages of selected pages including abstracts"
|
||||
|
||||
- :file:`MenuCategorizedContent.typoscript` - Configuration for content element "Content elements for selected categories"
|
||||
|
||||
- :file:`MenuCategorizedPages.typoscript` - Configuration for content element "Pages for selected categories"
|
||||
|
||||
- :file:`MenuPages.typoscript` - Configuration for content element "Menu of selected pages"
|
||||
|
||||
- :file:`MenuRecentlyUpdated.typoscript` - Configuration for content element "Recently updated pages"
|
||||
|
||||
- :file:`MenuRelatedPages.typoscript` - Configuration for content element "Related pages (based on keywords)"
|
||||
|
||||
- :file:`MenuSection.typoscript` - Configuration for content element "Section index (page content marked for section menus)"
|
||||
|
||||
- :file:`MenuSectionPages.typoscript` - Configuration for content element "Menu of subpages of selected pages including sections"
|
||||
|
||||
- :file:`MenuSitemap.typoscript` - Configuration for content element "Sitemap"
|
||||
|
||||
- :file:`MenuSitemapPages.typoscript` - Configuration for content element "Sitemaps of selected pages"
|
||||
|
||||
- :file:`MenuSubpages.typoscript` - Configuration for content element "Menu of subpages of selected pages"
|
||||
|
||||
- :file:`Shortcut.typoscript` - Configuration for content element "Insert records"
|
||||
|
||||
- :file:`Table.typoscript` - Configuration for content element "Table"
|
||||
|
||||
- :file:`Text.typoscript` - Configuration for content element "Regular Text Element"
|
||||
|
||||
- :file:`Textmedia.typoscript` - Configuration for content element "Text and Media"
|
||||
|
||||
- :file:`Textpic.typoscript` - Configuration for content element "Text and Images"
|
||||
|
||||
- :file:`Uploads.typoscript` - Configuration for content element "File Links"
|
||||
|
||||
Since we move away from TypoScript as much as possible, these rendering
|
||||
definitions only declare the following:
|
||||
|
||||
- Can :ref:`FLUIDTEMPLATE <t3tsref:cobj-fluidtemplate>` be used immediately or
|
||||
do we need data processing first?
|
||||
|
||||
A processor is sometimes used to do some data manipulation before all the data is sent
|
||||
to the Fluid template.
|
||||
|
||||
- Assigning the Fluid template file for each type of content element separately.
|
||||
|
||||
In the folder :file:`Helper/` there are files which are included by the file
|
||||
:file:`setup.typoscript` as mentioned above. These are:
|
||||
|
||||
- :file:`ContentElement.typoscript` - Default configuration for content
|
||||
elements using :ref:`FLUIDTEMPLATE <t3tsref:cobj-fluidtemplate>`
|
||||
|
||||
- :file:`ParseFunc.typoscript` - Creates persistent ParseFunc setup for non-HTML content
|
||||
@@ -0,0 +1,35 @@
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
.. _content-element-bullets:
|
||||
|
||||
===========
|
||||
Bullet list
|
||||
===========
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentOverview/BulletTypicalPageContent.rst.txt
|
||||
|
||||
With this content element you can provide unordered and ordered bullet lists, but also a
|
||||
definition list, in the frontend.
|
||||
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentElements/BulletsBackend.rst.txt
|
||||
|
||||
The type of list can be defined with the field :guilabel:`Type of bullets`.
|
||||
|
||||
The content is added in the field :guilabel:`Bullet List`, where each new line
|
||||
is a new bullet.
|
||||
|
||||
.. code-block:: none
|
||||
|
||||
Bullet 1
|
||||
Bullet 2
|
||||
Bullet 3
|
||||
|
||||
For definition lists you use one line for a single definition which starts with the term,
|
||||
followed by the description, separated by a vertical bar "|".
|
||||
|
||||
.. code-block:: none
|
||||
|
||||
Term 1|Description 1
|
||||
Term 2|Description 2
|
||||
Term 3|Description 3
|
||||
@@ -0,0 +1,12 @@
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
|
||||
.. _content-element-div:
|
||||
|
||||
=======
|
||||
Divider
|
||||
=======
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentOverview/DividerPageContent.rst.txt
|
||||
|
||||
Nothing more than a horizontal rule.
|
||||
@@ -0,0 +1,15 @@
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
.. _content-element-header:
|
||||
|
||||
======
|
||||
Header
|
||||
======
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentOverview/HeaderTypicalPageContent.rst.txt
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentElements/HeaderBackend.rst.txt
|
||||
|
||||
The content element "Header" will render a header, which can be linked. There is the
|
||||
possibility to add a subheader and a date. The fields used for this content elements are
|
||||
the same as :ref:`content-elements-general-header`, but with a field for the subheader.
|
||||
@@ -0,0 +1,14 @@
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
.. _content-element-html:
|
||||
|
||||
====
|
||||
HTML
|
||||
====
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentOverview/HTMLPageContent.rst.txt
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentElements/HtmlBackend.rst.txt
|
||||
|
||||
Insert HTML directly using this content element.
|
||||
|
||||
@@ -0,0 +1,116 @@
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
.. _content-elements:
|
||||
|
||||
====================
|
||||
The content elements
|
||||
====================
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentOverview/TypicalPageContent.rst.txt
|
||||
|
||||
This chapter describes the default set of content elements provided by TYPO3's
|
||||
Core. It will show you a description and screenshots of the backend fields.
|
||||
|
||||
.. _content-elements-general:
|
||||
|
||||
General fields
|
||||
==============
|
||||
|
||||
These are fields which are used by (almost) every content element.
|
||||
|
||||
|
||||
.. _content-elements-general-header:
|
||||
|
||||
Header
|
||||
------
|
||||
|
||||
Almost every content element can contain a header, which consists of the following parts:
|
||||
|
||||
Header
|
||||
The text of the header
|
||||
|
||||
Type
|
||||
The type of heading (heading 1, heading 2, heading 3 ... or if the header is hidden).
|
||||
When not choosing an option, the default heading will be used, which can be configured
|
||||
at :ref:`constant-editor`.
|
||||
|
||||
Date
|
||||
Have the possibility to group the header with a date
|
||||
|
||||
Link
|
||||
Link wrapping the header text. This can be a TYPO3 CMS page, an external page, an email
|
||||
address or a link to a file.
|
||||
|
||||
The header fields can be found in the :guilabel:`General` tab of a content element.
|
||||
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentElements/HeaderBackend.rst.txt
|
||||
|
||||
|
||||
.. _content-elements-general-show-in-section-menus:
|
||||
|
||||
Show in Section Menus
|
||||
----------------------
|
||||
|
||||
Using this option will only be visible when using menu's based on sections. This will be
|
||||
described in the chapter :ref:`content-element-menu`.
|
||||
|
||||
This field can be found in the :guilabel:`Appearance` tab.
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentElements/ShowInSectionMenus.rst.txt
|
||||
|
||||
A :guilabel:`Section Menu`, which is in turn a content element itself
|
||||
produces an output including the headlines of all content elements
|
||||
with the flag :guilabel:`Show in Section Menus` set.
|
||||
|
||||
.. _content-elements-general-link-to-top:
|
||||
|
||||
Append with Link to Top of Page
|
||||
-------------------------------
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentElements/AppendWithLinkToTopOfPage.rst.txt
|
||||
|
||||
When checked, this will render a link below the content element to bring the visitor the
|
||||
top of the page. This will be very convenient for your visitors when having long pages.
|
||||
|
||||
.. _content-elements-general-access:
|
||||
|
||||
Access
|
||||
------
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentElements/AccessTab.rst.txt
|
||||
|
||||
These fields define if and when a visitor has access to this content element. The access
|
||||
fields all reside in the :guilabel:`Access` tab:
|
||||
|
||||
Visibility of content element
|
||||
By checking this option the content element will not be visible to any visitor.
|
||||
|
||||
Publish Date
|
||||
The date on which the content has to be published, which means making visible at a
|
||||
certain date.
|
||||
|
||||
Expiration Date
|
||||
The date on which the content will be expired, which means the content will be hidden
|
||||
on a certain date
|
||||
|
||||
Usergroup Access Rights
|
||||
Here you can select whether the content element only is available to a certain
|
||||
frontend user group, if it has to be visible only when the visitor is logged in or if
|
||||
it has to be hidden at a login.
|
||||
|
||||
.. toctree::
|
||||
:maxdepth: 5
|
||||
:titlesonly:
|
||||
:glob:
|
||||
|
||||
Header/Index
|
||||
TextMedia/Index
|
||||
Bullets/Index
|
||||
Table/Index
|
||||
Uploads/Index
|
||||
Menu/Index
|
||||
Shortcut/Index
|
||||
List/Index
|
||||
Div/Index
|
||||
Html/Index
|
||||
@@ -0,0 +1,18 @@
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
.. _content-element-list:
|
||||
|
||||
=============
|
||||
Insert plugin
|
||||
=============
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentOverview/PluginContentElements.rst.txt
|
||||
|
||||
Extensions often provide plugins to render frontend output. They are essentially the
|
||||
same as content elements. When an extension depends on a plugin, select the
|
||||
plugin in this content element. The fields might change depending on the plugin.
|
||||
|
||||
For example, the system extension *indexed_search* provides the *Indexed Search*
|
||||
plugin which does not offer any additional fields:
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentElements/PluginBackend.rst.txt
|
||||
@@ -0,0 +1,96 @@
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
.. _content-element-menu:
|
||||
|
||||
=====
|
||||
Menus
|
||||
=====
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentOverview/MenuContentElements.rst.txt
|
||||
|
||||
In websites, menus are often created outside the content element scope, because they have
|
||||
to reappear within every page. These could be the main menu, a sub menu, a bread crumb or
|
||||
a language menu. However, there are situations where you would like to create a menu
|
||||
specifically on one page. The following content elements will give you some options to render
|
||||
a menu. These available content elements are:
|
||||
|
||||
Menu of selected pages
|
||||
The menu consists of links to the selected pages in the TYPO3 CMS backend.
|
||||
|
||||
Menu of subpages of selected pages
|
||||
The menu consists of links to the subpages of the selected pages in the TYPO3 CMS
|
||||
backend.
|
||||
|
||||
Menu of subpages of selected pages including abstracts
|
||||
The same as above, but showing the abstract of these pages as well, when not empty.
|
||||
|
||||
Menu of subpages of selected pages including sections
|
||||
This will render a menu of the subpages of the selected pages. Below each subpage an
|
||||
extra menu will be showing the titles of content elements which belong to that certain
|
||||
subpage, which have the option "Show in Section Menus" in the :guilabel:`Appearance` tab enabled.
|
||||
This makes it possible for the website visitor to jump to the selected content element,
|
||||
within that page, immediately.
|
||||
|
||||
Sitemap
|
||||
Render a full sitemap of the website, starting at the root page.
|
||||
|
||||
Sitemaps of selected pages
|
||||
Render one or more sitemaps at once. The starting point of each site map will be a
|
||||
single selected page.
|
||||
|
||||
Section index (page content marked for section menus)
|
||||
Menu of content elements within the selected page, which have the option "Show in
|
||||
Section Menus" in the :guilabel:`Appearance` tab enabled. This makes it possible for the website
|
||||
visitor to jump to the selected content element, within that page, immediately.
|
||||
|
||||
Recently updated pages
|
||||
Shows a list of pages which are updated in the last 7 days. Updated only means a
|
||||
change in the page properties, not the content on the page.
|
||||
|
||||
Related pages (based on keywords)
|
||||
Shows a list of the selected page and all other pages, which have one or more keywords,
|
||||
entered in the page properties, in common.
|
||||
|
||||
Pages for selected categories
|
||||
Displays a menu of all pages which have been assigned one or more of the selected
|
||||
categories.
|
||||
|
||||
Content elements for selected categories
|
||||
Displays a menu of all content elements which have been assigned one or more of the
|
||||
selected categories.
|
||||
|
||||
The availability of links in each type of menu will depend on access rights. If a website
|
||||
visitor has no access to a certain part (with a frontend login), the link will not be
|
||||
shown.
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentElements/MenuBackend.rst.txt
|
||||
|
||||
In case no pages are selected, the menu will be rendered from the
|
||||
current page where the menu is put on.
|
||||
|
||||
Styling of the current page in a menu
|
||||
======================================
|
||||
|
||||
.. versionadded:: 12.0
|
||||
All menu content elements related to page navigation reflect the "current"
|
||||
state of a page now.
|
||||
|
||||
If the current page is displayed within a menu the aria attribute
|
||||
:html:`aria-current="page"` is added to the a-tag of a menu-item.
|
||||
|
||||
For styling with CSS the attribute of the link can be used:
|
||||
|
||||
.. code-block:: css
|
||||
:caption: EXT:site_package/Public/Css/menu.css
|
||||
|
||||
[aria-current="page"] {
|
||||
/* Special style for the current page link */
|
||||
}
|
||||
[aria-current="page"]:hover {
|
||||
/* Special style for the current page link when hovered */
|
||||
}
|
||||
[aria-current="page"]::before {
|
||||
/* Special virtual element for additions like chevrons, etc. */
|
||||
}
|
||||
|
||||
The default styling of contains no style for the current page.
|
||||
@@ -0,0 +1,28 @@
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
.. _content-element-shortcut:
|
||||
|
||||
==============
|
||||
Insert Records
|
||||
==============
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentOverview/InsertRecordsPageContent.rst.txt
|
||||
|
||||
Ever have content on one page that you want to reference on another page? But you don't want to have to
|
||||
maintain both and keep them both in sync? And you don't want to show the whole content from one
|
||||
page on another. Using insert records you can add one content element from a page or all
|
||||
the content elements from a page. You can also add content elements from several pages.
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentElements/InsertRecordsBackend.rst.txt
|
||||
|
||||
Just select the content elements you want to display and if necessary, put them in the
|
||||
right order.
|
||||
|
||||
In the frontend the referenced content elements will show up the same as the original one
|
||||
(if the styling is not different for that page)
|
||||
|
||||
.. note::
|
||||
|
||||
This is the only content element still using a small amount of TypoScript in the rendering
|
||||
process. This is done because you can add different rendering for records from
|
||||
different tables. Take a look at :typoscript:`tt_content.shortcut.20`.
|
||||
@@ -0,0 +1,42 @@
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
.. _content-element-table:
|
||||
|
||||
=====
|
||||
Table
|
||||
=====
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentOverview/TableTypicalPageContent.rst.txt
|
||||
|
||||
The :guilabel:`Table` content element can be used to display tabular data.
|
||||
|
||||
.. hint::
|
||||
In the database the data is saved as comma separated values (CSV), a
|
||||
plain text format for storing table data (numbers and text). This format
|
||||
can be used to import data from external sources.
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentElements/TableBackend.rst.txt
|
||||
|
||||
By default the :guilabel:`Field delimiter` is a vertical bar "|", the
|
||||
:guilabel:`Text enclosure` set to **none**.
|
||||
|
||||
A :guilabel:`Table caption` can be provided as a heading for the table.
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentElements/TableAppearanceBackend.rst.txt
|
||||
|
||||
Also some appearance options are available for the table. These can be found in the
|
||||
:guilabel:`Appearance` tab:
|
||||
|
||||
Columns
|
||||
The maximum amount of columns. Even when more columns are defined in the
|
||||
:guilabel:`Table content` field, the table will only show the maximum amount of columns.
|
||||
|
||||
Table class
|
||||
Some predefined classes to style the table output.
|
||||
|
||||
Table header position
|
||||
The first row or the first column can be used as a table header.
|
||||
|
||||
Use table footer
|
||||
The last row will be used to group the table's footer area (which may be a summary, an
|
||||
addition of column values, or some call to action based on the preceding content).
|
||||
@@ -0,0 +1,36 @@
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
.. _content-element-textmedia:
|
||||
|
||||
=============
|
||||
Text & Images
|
||||
=============
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentOverview/TextMediaTypicalPageContent.rst.txt
|
||||
|
||||
This content element allows you to combine text and images. Additionally there
|
||||
is also a content element for :guilabel:`Text & Media` where you can use videos
|
||||
or Audio. There are also separate content elements for :guilabel:`Text`
|
||||
or :guilabel:`Images` individually. These offer no advantage over the content element
|
||||
:guilabel:`Text & Images` except that some fields are missing and the backend form
|
||||
is less cluttered.
|
||||
|
||||
The text can be entered in the rich text editor of the :guilabel:`General`
|
||||
tab.
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentElements/RteBackend.rst.txt
|
||||
|
||||
The media elements can be added in the :guilabel:`Images` tab. In this tab
|
||||
there is also the option to turn the *enlarge on click* behaviour on for images.
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentElements/MediaBackend.rst.txt
|
||||
|
||||
Multiple images and movies are combined as a gallery, which can be configured
|
||||
using the :guilabel:`Gallery Settings`. In some installations there are
|
||||
specific settings for width or height for each element, if a border
|
||||
should be shown around each element, the position of the gallery in relation
|
||||
to the text and the amount of columns which should be used for the gallery.
|
||||
|
||||
The maximum width of the gallery can be different when the gallery is on
|
||||
top or bottom of the text, or inside the text. This can be set using the
|
||||
:ref:`constant-editor`.
|
||||
@@ -0,0 +1,39 @@
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
.. _content-element-uploads:
|
||||
|
||||
==========
|
||||
File links
|
||||
==========
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentOverview/FileLinksPageContent.rst.txt
|
||||
|
||||
This content element gives you the opportunity to offer downloadable files to the visitors
|
||||
of your website.
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/ContentElements/UploadsBackend.rst.txt
|
||||
|
||||
You can add or select single files but also use a file collection. A file collection can
|
||||
be one of the following:
|
||||
|
||||
- A static selection of files
|
||||
- A folder within a storage, holding the files
|
||||
- A file selection by category
|
||||
|
||||
When combining both methods, single files and file collections, all files from these
|
||||
methods will be presented to the website visitor.
|
||||
|
||||
At the bottom of the tab :guilabel:`General` you will find several options how
|
||||
the files will be presented:
|
||||
|
||||
Display file/icon/thumbnail
|
||||
In this dropdown you can select if you only want to show the file name, the file name
|
||||
and a corresponding icon, based on the file extension, or the file name with a
|
||||
thumbnail, if it is possible for TYPO3 CMS to generate a thumbnail from the file.
|
||||
|
||||
Display file size information
|
||||
Will show the file size calculated from the amount of bytes and presented as a human
|
||||
readable string with the proper unit (B, KB, MB ...).
|
||||
|
||||
Display description
|
||||
Will display the description of each file, if available.
|
||||
@@ -0,0 +1,83 @@
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
.. _include-default-typoscript:
|
||||
.. _using-the-rendering-definitions:
|
||||
|
||||
=======================
|
||||
Use TypoScript includes
|
||||
=======================
|
||||
|
||||
.. versionchanged:: 13.1
|
||||
If you included the :ref:`site sets <include-site-set>`, skip this step.
|
||||
|
||||
To use the default rendering definitions provided by *fluid_styled_content*, you
|
||||
have to add the extension's TypoScript set to your root TypoScript record.
|
||||
|
||||
When you are using a site package you can add the following lines to your site
|
||||
packages constants.typoscript and setup.typoscript:
|
||||
|
||||
.. code-block:: typoscript
|
||||
:caption: my_sitepackage/Configuration/TypoScript/constants.typoscript
|
||||
|
||||
# Import the default constants of EXT:fluid_styled_content
|
||||
@import 'EXT:fluid_styled_content/Configuration/TypoScript/constants.typoscript'
|
||||
|
||||
.. code-block:: typoscript
|
||||
:caption: my_sitepackage/Configuration/TypoScript/setup.typoscript
|
||||
|
||||
# Import the default setup of EXT:fluid_styled_content
|
||||
@import 'EXT:fluid_styled_content/Configuration/TypoScript/setup.typoscript'
|
||||
|
||||
# Import the default CSS of EXT:fluid_styled_content
|
||||
@import 'EXT:fluid_styled_content/Configuration/TypoScript/Styling/setup.typoscript'
|
||||
|
||||
This is the recommended way as the import of TypoScript can be kept under
|
||||
version control this way.
|
||||
|
||||
Alternative: Include the TypoScript set in the root TypoScript record
|
||||
=====================================================================
|
||||
|
||||
It is also still possible to include the TypoScript set directly into
|
||||
a TypoScript record. However there are draw backs:
|
||||
The import is then stored in the database and not the file system and cannot be
|
||||
kept under version control.
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/TypoScript/EditTemplateRecord.rst.txt
|
||||
|
||||
.. rst-class:: bignums-xxl
|
||||
|
||||
1. Go to the module :guilabel:`Sites > TypoScript`.
|
||||
|
||||
2. In the page tree, select the page which contains the root TypoScript
|
||||
record of your website.
|
||||
|
||||
3. Select :guilabel:`Edit TypoScript Record` in the dropdown at the top of the
|
||||
:guilabel:`Sites > TypoScript` module.
|
||||
|
||||
4. Click the :guilabel:`Edit the whole TypoScript record`. This will
|
||||
open all the settings of the root TypoScript record:
|
||||
|
||||
.. include:: /Images/AutomaticScreenshots/TypoScript/IncludeTypoScriptTemplate.rst.txt
|
||||
|
||||
Go to the tab :guilabel:`Includes` and select
|
||||
:guilabel:`Fluid Content Elements` in the
|
||||
:guilabel:`Available items` under :guilabel:`Include TypoScript sets`.
|
||||
The selection will move to the :guilabel:`Selected items`.
|
||||
|
||||
TYPO3 is now using the rendering definitions of *fluid_styled_content* for
|
||||
the default set of content elements. This is essentially unstyled HTML5 markup.
|
||||
|
||||
You can additionally select :guilabel:`Fluid Content Elements CSS (optional)`.
|
||||
This TypoScript set adds some CSS styling to make sure all
|
||||
the parts of a content elements have some styling, this will include alignment and positioning.
|
||||
This set of styles will not add any colors, make any changes to typography or anything else related to
|
||||
your website's visual style. This TypoScript set is optional, as it is common for integrators to
|
||||
override the basic styling.
|
||||
|
||||
Save the TypoScript record by using the save button at the top of the module.
|
||||
|
||||
Next step
|
||||
=========
|
||||
|
||||
:ref:`Display the content elements <inserting-content-page-template>` in your
|
||||
site package template.
|
||||
@@ -0,0 +1,75 @@
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
.. _inserting-content-page-template:
|
||||
|
||||
=======================================
|
||||
Inserting content in your page template
|
||||
=======================================
|
||||
|
||||
To get the different columns from the backend displayed in the frontend
|
||||
you can use predefined :ref:`CONTENT <t3tsref:cobj-content>` objects or
|
||||
the :ref:`DatabaseQueryProcessor <t3tsref:DatabaseQueryProcessor>`.
|
||||
|
||||
It is advised to make all your changes in a custom extension, visit the
|
||||
:doc:`site package documentation <t3sitepackage:Index>` to find out more.
|
||||
|
||||
.. _inserting-content-page-template-fluidtemplate:
|
||||
|
||||
Based on the FLUIDTEMPLATE content object (cObj)
|
||||
================================================
|
||||
|
||||
.. code-block:: typoscript
|
||||
|
||||
lib.dynamicContent = COA
|
||||
lib.dynamicContent {
|
||||
10 = LOAD_REGISTER
|
||||
10.colPos.cObject = TEXT
|
||||
10.colPos.cObject {
|
||||
field = colPos
|
||||
ifEmpty.cObject = TEXT
|
||||
ifEmpty.cObject {
|
||||
value.current = 1
|
||||
ifEmpty = 0
|
||||
}
|
||||
}
|
||||
20 = CONTENT
|
||||
20 {
|
||||
table = tt_content
|
||||
select {
|
||||
orderBy = sorting
|
||||
where = {#colPos}={register:colPos}
|
||||
where.insertData = 1
|
||||
}
|
||||
}
|
||||
90 = RESTORE_REGISTER
|
||||
}
|
||||
|
||||
page = PAGE
|
||||
page {
|
||||
10 = FLUIDTEMPLATE
|
||||
10 {
|
||||
templateName = Default
|
||||
templateRootPaths {
|
||||
0 = EXT:example_package/Resources/Private/Templates/Page/
|
||||
}
|
||||
partialRootPaths {
|
||||
0 = EXT:example_package/Resources/Private/Partials/Page/
|
||||
}
|
||||
layoutRootPaths {
|
||||
0 = EXT:example_package/Resources/Private/Layouts/Page/
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.. code-block:: html
|
||||
|
||||
<f:layout name="Default" />
|
||||
<f:section name="Main">
|
||||
<f:cObject typoscriptObjectPath="lib.dynamicContent" data="{colPos: '0'}" />
|
||||
</f:section>
|
||||
|
||||
Next step
|
||||
=========
|
||||
|
||||
You can start :ref:`adding content elements <content-elements>` or make further
|
||||
:ref:`configurations <configuration>`.
|
||||
@@ -0,0 +1,18 @@
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
.. _first_steps:
|
||||
|
||||
===========
|
||||
First steps
|
||||
===========
|
||||
|
||||
|
||||
.. toctree::
|
||||
:maxdepth: 5
|
||||
:titlesonly:
|
||||
:glob:
|
||||
|
||||
SiteSets
|
||||
DefaultTemplate
|
||||
DisplayContent
|
||||
|
||||
@@ -0,0 +1,65 @@
|
||||
:navigation-title: Site set inclusion
|
||||
|
||||
.. include:: /Includes.rst.txt
|
||||
|
||||
.. _include-site-set:
|
||||
|
||||
======================================
|
||||
Include one of the available site sets
|
||||
======================================
|
||||
|
||||
.. versionadded:: 13.1
|
||||
:ref:`Site sets <t3coreapi:site-sets>` have been introduced and are the recommended method to include
|
||||
TypoScript. If you do not want to use site sets, you can still use
|
||||
:ref:`TypoScript includes <include-default-typoscript>` to include the
|
||||
default TypoScript.
|
||||
|
||||
To use the default rendering definitions provided by *fluid_styled_content*, you
|
||||
should add one of the two :ref:`site sets <site-sets>` provided by this extension
|
||||
to your :ref:`site configuration <include-site-set-site>`
|
||||
or depend on it in your :ref:`site package's site set <include-site-set-sitepackage>`.
|
||||
|
||||
.. _include-site-set-site:
|
||||
|
||||
Add the site set to your site configuration
|
||||
===========================================
|
||||
|
||||
This is the recommended way to include the "Fluid Styled Content" site set into
|
||||
basic TYPO3 sites without a custom site package. See also
|
||||
:ref:`site sets <t3coreapi:site-sets>`.
|
||||
|
||||
.. figure:: /Images/ManualScreenshots/SiteSet.png
|
||||
|
||||
Add the site set of Fluid Styled Content
|
||||
|
||||
When saving, the GUI then automatically updates your site configuration:
|
||||
|
||||
.. literalinclude:: _site_config.diff
|
||||
:caption: config/sites/my-site/config.yaml (diff)
|
||||
|
||||
.. _include-site-set-sitepackage:
|
||||
|
||||
Add the site set to your custom site package
|
||||
============================================
|
||||
|
||||
If your installation has a custom :ref:`site package <t3sitepackage:start>`,
|
||||
it is recommended to depend on the "Fluid Styled Content CSS" site set with your
|
||||
site package's site set:
|
||||
|
||||
.. literalinclude:: _site_package_config.yaml
|
||||
:caption: EXT:my_site_package/Configuration/Sets/MySet/config.yaml
|
||||
|
||||
Edit the settings
|
||||
=================
|
||||
|
||||
.. _include-site-set-editor:
|
||||
|
||||
All settings of this extension are now available in the :ref:`settings-editor`.
|
||||
|
||||
.. _include-default-site-set-next:
|
||||
|
||||
Next step
|
||||
=========
|
||||
|
||||
:ref:`Display the content elements <inserting-content-page-template>` in your
|
||||
site package template.
|
||||
@@ -0,0 +1,6 @@
|
||||
base: https://example.ddev.site
|
||||
+ dependencies:
|
||||
+ - typo3/fluid-styled-content-css
|
||||
languages:
|
||||
-
|
||||
title: English
|
||||
@@ -0,0 +1,4 @@
|
||||
name: myvendor/my-site-package
|
||||
label: My sitepackage set
|
||||
dependencies:
|
||||
- typo3/fluid-styled-content-css
|
||||
|
After Width: | Height: | Size: 51 KiB |
@@ -0,0 +1,9 @@
|
||||
.. =========================================================
|
||||
.. Automatically generated by the TYPO3 Screenshots project.
|
||||
.. https://github.com/TYPO3-Documentation/t3docs-screenshots
|
||||
.. =========================================================
|
||||
|
||||
.. figure:: /Images/AutomaticScreenshots/ContentElements/AccessTab.png
|
||||
:class: with-shadow
|
||||
|
||||
The Access tab with all its fields
|
||||
|
After Width: | Height: | Size: 42 KiB |
@@ -0,0 +1,9 @@
|
||||
.. =========================================================
|
||||
.. Automatically generated by the TYPO3 Screenshots project.
|
||||
.. https://github.com/TYPO3-Documentation/t3docs-screenshots
|
||||
.. =========================================================
|
||||
|
||||
.. figure:: /Images/AutomaticScreenshots/ContentElements/AppendWithLinkToTopOfPage.png
|
||||
:class: with-shadow
|
||||
|
||||
The field "Append with link to top of page"
|
||||
|
After Width: | Height: | Size: 48 KiB |
@@ -0,0 +1,9 @@
|
||||
.. =========================================================
|
||||
.. Automatically generated by the TYPO3 Screenshots project.
|
||||
.. https://github.com/TYPO3-Documentation/t3docs-screenshots
|
||||
.. =========================================================
|
||||
|
||||
.. figure:: /Images/AutomaticScreenshots/ContentElements/BulletsBackend.png
|
||||
:class: with-shadow
|
||||
|
||||
The most important fields of the content element
|
||||
|
After Width: | Height: | Size: 57 KiB |
@@ -0,0 +1,9 @@
|
||||
.. =========================================================
|
||||
.. Automatically generated by the TYPO3 Screenshots project.
|
||||
.. https://github.com/TYPO3-Documentation/t3docs-screenshots
|
||||
.. =========================================================
|
||||
|
||||
.. figure:: /Images/AutomaticScreenshots/ContentElements/BulletsFrontend.png
|
||||
:class: with-shadow
|
||||
|
||||
Bullet list examples in the frontend
|
||||
|
After Width: | Height: | Size: 48 KiB |
@@ -0,0 +1,9 @@
|
||||
.. =========================================================
|
||||
.. Automatically generated by the TYPO3 Screenshots project.
|
||||
.. https://github.com/TYPO3-Documentation/t3docs-screenshots
|
||||
.. =========================================================
|
||||
|
||||
.. figure:: /Images/AutomaticScreenshots/ContentElements/HeaderBackend.png
|
||||
:class: with-shadow
|
||||
|
||||
The content element "Header" in the backend
|
||||
|
After Width: | Height: | Size: 41 KiB |
@@ -0,0 +1,9 @@
|
||||
.. =========================================================
|
||||
.. Automatically generated by the TYPO3 Screenshots project.
|
||||
.. https://github.com/TYPO3-Documentation/t3docs-screenshots
|
||||
.. =========================================================
|
||||
|
||||
.. figure:: /Images/AutomaticScreenshots/ContentElements/HeaderFrontend.png
|
||||
:class: with-shadow
|
||||
|
||||
Header examples in the frontend
|
||||
|
After Width: | Height: | Size: 5.9 KiB |
@@ -0,0 +1,9 @@
|
||||
.. =========================================================
|
||||
.. Automatically generated by the TYPO3 Screenshots project.
|
||||
.. https://github.com/TYPO3-Documentation/t3docs-screenshots
|
||||
.. =========================================================
|
||||
|
||||
.. figure:: /Images/AutomaticScreenshots/ContentElements/HeaderWithLinkFrontend.png
|
||||
:class: with-shadow
|
||||
|
||||
Header with link
|
||||
|
After Width: | Height: | Size: 78 KiB |
@@ -0,0 +1,9 @@
|
||||
.. =========================================================
|
||||
.. Automatically generated by the TYPO3 Screenshots project.
|
||||
.. https://github.com/TYPO3-Documentation/t3docs-screenshots
|
||||
.. =========================================================
|
||||
|
||||
.. figure:: /Images/AutomaticScreenshots/ContentElements/HtmlBackend.png
|
||||
:class: with-shadow
|
||||
|
||||
The content element :guilabel:`Plain HTML` in the backend
|
||||
|
After Width: | Height: | Size: 50 KiB |
@@ -0,0 +1,9 @@
|
||||
.. =========================================================
|
||||
.. Automatically generated by the TYPO3 Screenshots project.
|
||||
.. https://github.com/TYPO3-Documentation/t3docs-screenshots
|
||||
.. =========================================================
|
||||
|
||||
.. figure:: /Images/AutomaticScreenshots/ContentElements/InsertRecordsBackend.png
|
||||
:class: with-shadow
|
||||
|
||||
The content element :guilabel:`Insert Records`
|
||||
|
After Width: | Height: | Size: 65 KiB |
@@ -0,0 +1,9 @@
|
||||
.. =========================================================
|
||||
.. Automatically generated by the TYPO3 Screenshots project.
|
||||
.. https://github.com/TYPO3-Documentation/t3docs-screenshots
|
||||
.. =========================================================
|
||||
|
||||
.. figure:: /Images/AutomaticScreenshots/ContentElements/MediaBackend.png
|
||||
:class: with-shadow
|
||||
|
||||
TextImages in the content element :guilabel:`Text & Images`
|
||||
|
After Width: | Height: | Size: 41 KiB |
@@ -0,0 +1,9 @@
|
||||
.. =========================================================
|
||||
.. Automatically generated by the TYPO3 Screenshots project.
|
||||
.. https://github.com/TYPO3-Documentation/t3docs-screenshots
|
||||
.. =========================================================
|
||||
|
||||
.. figure:: /Images/AutomaticScreenshots/ContentElements/MenuBackend.png
|
||||
:class: with-shadow
|
||||
|
||||
The most important fields of the content element
|
||||
|
After Width: | Height: | Size: 32 KiB |
@@ -0,0 +1,9 @@
|
||||
.. =========================================================
|
||||
.. Automatically generated by the TYPO3 Screenshots project.
|
||||
.. https://github.com/TYPO3-Documentation/t3docs-screenshots
|
||||
.. =========================================================
|
||||
|
||||
.. figure:: /Images/AutomaticScreenshots/ContentElements/MenuFrontend.png
|
||||
:class: with-shadow
|
||||
|
||||
Menu example in the frontend
|
||||
|
After Width: | Height: | Size: 21 KiB |
@@ -0,0 +1,9 @@
|
||||
.. =========================================================
|
||||
.. Automatically generated by the TYPO3 Screenshots project.
|
||||
.. https://github.com/TYPO3-Documentation/t3docs-screenshots
|
||||
.. =========================================================
|
||||
|
||||
.. figure:: /Images/AutomaticScreenshots/ContentElements/PluginBackend.png
|
||||
:class: with-shadow
|
||||
|
||||
The plugin :guilabel:`Indexed Search`
|
||||
|
After Width: | Height: | Size: 70 KiB |
@@ -0,0 +1,9 @@
|
||||
.. =========================================================
|
||||
.. Automatically generated by the TYPO3 Screenshots project.
|
||||
.. https://github.com/TYPO3-Documentation/t3docs-screenshots
|
||||
.. =========================================================
|
||||
|
||||
.. figure:: /Images/AutomaticScreenshots/ContentElements/RteBackend.png
|
||||
:class: with-shadow
|
||||
|
||||
The content element rich text editor in the content element :guilabel:`Text`
|
||||
|
After Width: | Height: | Size: 51 KiB |
@@ -0,0 +1,9 @@
|
||||
.. =========================================================
|
||||
.. Automatically generated by the TYPO3 Screenshots project.
|
||||
.. https://github.com/TYPO3-Documentation/t3docs-screenshots
|
||||
.. =========================================================
|
||||
|
||||
.. figure:: /Images/AutomaticScreenshots/ContentElements/SectionMenuFrontend.png
|
||||
:class: with-shadow
|
||||
|
||||
Section menu examples in the frontend
|
||||
|
After Width: | Height: | Size: 42 KiB |
@@ -0,0 +1,9 @@
|
||||
.. =========================================================
|
||||
.. Automatically generated by the TYPO3 Screenshots project.
|
||||
.. https://github.com/TYPO3-Documentation/t3docs-screenshots
|
||||
.. =========================================================
|
||||
|
||||
.. figure:: /Images/AutomaticScreenshots/ContentElements/ShowInSectionMenus.png
|
||||
:class: with-shadow
|
||||
|
||||
The field "Show In Section Menu's"
|
||||
|
After Width: | Height: | Size: 42 KiB |
@@ -0,0 +1,9 @@
|
||||
.. =========================================================
|
||||
.. Automatically generated by the TYPO3 Screenshots project.
|
||||
.. https://github.com/TYPO3-Documentation/t3docs-screenshots
|
||||
.. =========================================================
|
||||
|
||||
.. figure:: /Images/AutomaticScreenshots/ContentElements/TableAppearanceBackend.png
|
||||
:class: with-shadow
|
||||
|
||||
The content element :guilabel:`Table` in the backend, tab :guilabel:`Appearance`
|
||||
|
After Width: | Height: | Size: 67 KiB |
@@ -0,0 +1,9 @@
|
||||
.. =========================================================
|
||||
.. Automatically generated by the TYPO3 Screenshots project.
|
||||
.. https://github.com/TYPO3-Documentation/t3docs-screenshots
|
||||
.. =========================================================
|
||||
|
||||
.. figure:: /Images/AutomaticScreenshots/ContentElements/TableBackend.png
|
||||
:class: with-shadow
|
||||
|
||||
The content element :guilabel:`Table` in the backend
|
||||
|
After Width: | Height: | Size: 44 KiB |