in Pixel String alt Alternativtext String mode Darstellungsmodus [default|crop|cropTop|cropRight|cropBottom|cropLeft|embed|embedTop|embedRight|embedBottom|embedLeft|embedTopLeft|embedTopRight|embedBottomRight|embedBottomLeft|force] default
2009 thumbnail vorschaubild embed modus Der Modus "embed" erstellt ein Bild, dass immer die angegebene Größe hat und den restlichen Raum auffüllt
11. Mai 2010 Änderungsdatum: 04. April 2023 thumbnail vorschaubild modus mode default crop force embed Dieser Artikel beschreibt, was die einzelnen Modus-Einstellungen zur Erstellung von Vorschaubildern (Thumbnails)
per JavaScript nachladen 07. März 2023 embedPage einbetten einfügen wOpenURL embedListEntrySelf Listeneinträge embedListEntry Über die Javascriptfunktion wOpenURL können Sie aus anderen Seiten des Projektes Inhalte in die aktuelle Seite
Höhe des zu erstellenden Vorschaubildes mode Darstellungsmodus [default|crop|cropTop|cropRight|cropBottom|cropLeft|embed|embedTop|embedRight|embedBottom|embedLeft|embedTopLeft|embedTopRight|embedBottomRight|embedBottomLeft|force] default
gegen Clickjacking Veröffentlichungsdatum: 12. Mai 2020 Änderungsdatum: 04. Februar 2022 weblication cms iframe frame embed object layer antwortheader header kopfzeilen x-frame-options sameorigin Über eine Einstellung in den HTTP
Höhe des zu erstellenden Vorschaubildes mode Darstellungsmodus [default|crop|cropTop|cropRight|cropBottom|cropLeft|embed|embedTop|embedRight|embedBottom|embedLeft|embedTopLeft|embedTopRight|embedBottomRight|embedBottomLeft|force] default
Wie crop mit Ausrichtung right cropBottom Wie crop mit Ausrichtung unten cropLeft Wie crop mit Ausrichtung links embed Das Bild wird so weit verkleinert, dass beide Seiten in die Vorgabe passen und der ggf. entstehende Leerraum
Beschreibung Einsatzgebiet no|yes Zeigt das Auswahlfeld zur Definition des Modus der Vorschaubilder an (crop, default, embed) default.wFilelist.php Beispiele / Anwendungsfälle Beispiel 1: Blendet das Auswahlfeld zur Definition des Modus der
die Banner-Variante 60 den Listeneintrag über Ajax eingebettet .listBannerSlider_var60 .listEntries .listEntry { -w-embedtype: ajax; /* ... */ ;} Weiterführende Links weblics.de: BannerSlider Variante 60 Zu beachten: Diese CSS-Only Referenz
Logo Mouseover rot; caption-en: SVG Weblication logo mouseover red} */ .elementPicture_var2000 { /* ... */ ; -w-embedIfLocalSVG: yes} .elementPicture_var2000 svg { width: 100%; height: auto} .elementPicture_var2000 svg rect.cls-2 { fill: #0050a0}
in das HTML OBJECT-Tag ein: name= " wmode " value= " transparent "/> ... ... Fügen Sie dann folgenden Parameter dem EMBED Tag hinzu: wmode="transparent" Diese Einstellung behebt auch das Problem im Internet Explorer, wenn aufgrund eines
CSS formatierbar". CSS-Only der SVG-Bildvariante, um SVG Icons mit fixer Größe per CSS formatierbar einzubetten -w-embedSVG: yes; /* SVG-Bild einbetten [yes (Ja) |no (Nein) ] */ -w-embedSVG-width: 96; /* Breite des eingebetteten SVG-Bildes */
cut = "{wd:extension/wd:meta/wd:thumbnail/@area}" src = " { $thumbnail } " width = "60" height = "45" mode = "embed" alt = "{php:functionString('wStringconverter::maskQuotes', wd:extension/wd:meta/wd:title/text())}" /> < p class=
des zu erstellenden Vorschaubildes height Höhe des zu erstellenden Vorschaubildes mode Darstellungsmodus [default|embed|crop|] default Das Bild wird so weit verkleinert, dass beide Seiten in die Vorgabe passen und der ggf. entstehende
" CSS-Optimierung "/> <!-- ... --> description= " Benötigte CSS-Definitionen im Kopfbereich einbetten " key= " embedOnlyUsedCss_active " type= " char.yesno "> yes Dadurch werden Seiten auf mobilen Geräten in der Regel schneller nutzbar, da beim ersten
/* Seitenverhältnis Bild */ -w-option-picture-mode: crop; /* Bildmodus [crop (Zugeschnitten auf Seitenverhältnis) |embed (Eingebettet) |default (Standard) ]*/ } /*@wCssFragment { class: listDefaultMyAspectRatio; variant: 1; caption:
Mögliche Werte Beschreibung Einsatzgebiet [default| crop|cropTop|cropRight|cropBottom|cropLeft| embed|embedTop|embedRight|embedBottom|embedLeft| embedTopLeft|embedTopRight|embedBottomRight|embedBottomLeft| force] Definiert den Bildmodus
fontSize => Schriftgröße Größe der zu verwendenden Schrift colors => array(array(r, g, b)*) Eigene Farben embed [0|1] Definiert, ob das Bild direkt eingebettet werden soll Beispiel: Gut lesbares Captcha Quelltext <?php
Vorschaubildes die gewünschte Endung mitgeben. $pathThumbnail = wThumbnail :: createThumbnail ( $pathImage , 32 , 32 , 'embedTop' , array( 'extension' => 'gif'
'/wGlobal/content/misc/logo.php'), $xPathWidth) " /> test= " $wLogoWidth != '' "> mode= " embedTopLeft " alt= " Logo "> name= " src "> select= " $srcLogo " /> name= " width "> select= " $wLogoWidth " /> src= "
.listEntryThumbnailOuter { overflow: hidden; margin: 0 0 0} .listDefault_var10999 .listEntryThumbnail { -w-picture-mode: embed; margin: 0; width: 100%; -w-add-classes: wglFancybox;} .listDefault_var10999 .listEntryTitle { display: block; opacity:
CSS-Variablen (siehe Einstellungsmöglichkeiten oben) navigation.js hinsichtlich der JavaScript-Funktionen embed.wDocument.php für die eingebettete Anzeige der Inhalte aus der Seite (Ausgabe gefiltert über die navigations.js )
.listEntries .listEntryImage { display: block; width: 100%; height: auto; -w-aspectratio: 1.333; -w-picture-mode: embed; -w-picture-background-color: #ffffcc} /* ... */ Beachten Sie je nach Webserver bzw. PHP die Hintergrundfarbe für ein
werden sollen. Einbinden der Detailseite per AJAX über CSS-Only in der Listenvariante definiert -w-option-linkTarget: embedListNextRow; /* Bindet die Detailseite direkt in die nächste Zeile der Liste über HTML ein */ Über das Datenattribut data-embedroot
Rand bzw. unteren Rand anzuzeigen 18.12.2024 17:05 BASE für Version 19: BASE JavaScript Dateien 1.0.298: Die Funktion EmbedPage unterstützt nun auch die Optimierung von Hintergrundbildern. 17.12.2024 11:55 BASE für Version 19: Inhaltsbereich
als XML direkt im Quelltext ein, um diese über CSS formatieren zu können .listDefault_varXY { ... -w-option-picture-embedSVG: 1; /* SVG-Bilder einbetten [0
bei kleinen Bildschirmen */ -w-option-picture-mode: crop; /* Bildmodus [crop (Zugeschnitten auf Seitenverhältnis) |embed (Eingebettet) |default (Standard) ]*/ -w-option-picture-backgroundColor: ''; /* Hintergrundfarbe bei transparenten
#cookieNoticeCloser { display: block; } #cookieNotice.blockPage { pointer-events: auto; background: rgba (0, 0, 0, 0.2) ; } #embed_cookieNotice { display: none; } Die Definition innerhalb der Projektkonfiguration finden Sie weiter oben beschrieben. Für das
14:23 BASE (Mobile First) für Version 16: Bild 1.0.43: Falls kein picture genutzt werden soll, kann Über -w-embedSVGElementOuter:span; ein umschließender Elementname (z.B. span) beim eingebetteten SVG-Bild genutzt werden. 16.05.2022 10:04 BASE
07.09.2018 Falls nur die benötigten CSS-Definitionen im Kopfbereich eingebettet werden, lässt sich über $preVars['embedOnlyUsedCssLimit'] = 2; in der pre.php angeben, wieviele Inhaltsbereiche berücksichtigt werden sollen. Ist kein Wert definiert werden die
Vorschaubild in Listenvariante 0 (ab CMS 11.x nutzbar) .listDefault_var0 .listEntryThumbnail { -w-picture-mode: embed !important; -w-aspectratio: 0.7777; -w-picture-background-color: #f0f0f0;} Weiterführende Links WSL-Tagreferenz:
-w-editmaskExtended-thumbnailmode Zeigt das Auswahlfeld zur Definition des Modus der Vorschaubilder an (crop, default, embed) -w-editmaskExtended-thumbnailswidth Zeigt das Eingabefeld zur Definition der Vorschaubildbreite an
automatisch übersetzen ... 18 Dezember BASE für Version 19: BASE JavaScript Dateien 1.0.298: Die Funktion EmbedPage unterstützt nun auch die Optimierung von Hintergrundbildern. 17 Dezember BASE für Version 19: Inhaltsbereich (mit