Benutzer-Werkzeuge

Webseiten-Werkzeuge


en:webedition:beginners-guide:images

Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen gezeigt.

Link zu dieser Vergleichsansicht

Beide Seiten der vorigen Revision Vorhergehende Überarbeitung
en:webedition:beginners-guide:images [2019/02/08 16:49]
Rudolf Horbas
en:webedition:beginners-guide:images [2019/02/09 22:23] (aktuell)
Sascha Nemecek
Zeile 1: Zeile 1:
 ===== Images ===== ===== Images =====
  
-Your editors ​can always insert images in a WYSIWYG-textarea:​ +Editors ​can always insert images in a WYSIWYG-textarea:​ 
-<​code><​we:​textarea name="​content"​ wysiwyg="​true"​ /></​code>​+<​code ​html><​we:​textarea name="​content"​ wysiwyg="​true"​ /></​code>​
  
-But this leads to "​homegrown"​ layout and can look ugly quickly, so better ​give them image fields in the template:+But this leads to "​homegrown" ​and inconsistent ​layout and can quickly ​look ugly. A better ​approach is to define ​image fields in the template:
  
 //An article with an optional image above, as seen by the editor:// //An article with an optional image above, as seen by the editor://
-<​code>​+<​code ​html>
 <​we:​ifEditmode>​ <​we:​ifEditmode>​
     <we:img name="​image"​ thumbnail="​Article header"/>​     <we:img name="​image"​ thumbnail="​Article header"/>​
Zeile 14: Zeile 14:
 </​code>​ </​code>​
  
-The above is the editor'​s view. They can choose an image, which is automatically resized to the size of the thumbnail with the name "​Article header"​.+The above is the editor'​s view. They can choose an image, which is automatically resized to the size of the pre-defined ​thumbnail with the name "​Article header"​.
  
 //Frontend code:// //Frontend code://
-<​code>​+<​code ​html>
     <​we:​ifNotEditmode>​     <​we:​ifNotEditmode>​
         <​we:​ifNotEmpty name="​image"​ type="​image">​         <​we:​ifNotEmpty name="​image"​ type="​image">​
Zeile 33: Zeile 33:
 ==== Thumbnails ==== ==== Thumbnails ====
  
-Often, editors just upload any image material straight from the camera. These images are way too large to display them on a website. webEdition lets You define thumbnail formats in various sizes (and filters) for use in various areas on the website: ​Lists, articles, galleries, etc.+Often, editors just upload any image material straight from the camera. These images are way too large to display them on a website. webEdition lets you define thumbnail formats in various sizes (and filters) for use in various areas on the website: ​lists, articles, galleries, etc.
  
-The module ​is in "​Settings -> Thumbnails":​ Create a new thumbnail with the name "​Icon"​ and give it the width of 240 (pixels). This thumbnail can be used in a listview ​like so:+The module ​can be found in "​Settings -> Thumbnails":​ Create a new thumbnail with the name "​Icon"​ and give it the width of 240 (pixels). This thumbnail can be used in a listview, e.g.:
  
-<​code>​+<​code ​html>
     <​we:​listview type="​document">​     <​we:​listview type="​document">​
         <​we:​repeat>​         <​we:​repeat>​
Zeile 49: Zeile 49:
 => The resized image is displayed. => The resized image is displayed.
  
-In the document itself, ​You'd use a larger thumbnail:​ +In the document itself, a larger thumbnail ​can be used
-<​code><​we:​img name="​image"​ thumbnail="​Article header"/></​code>​ +<​code ​html><​we:​img name="​image"​ thumbnail="​Article header"/></​code>​ 
-(You have to define a thumbnail "​Article header",​ of course.)+(the thumbnail "​Article header" ​has to be defined, of course)
en/webedition/beginners-guide/images.txt · Zuletzt geändert: 2019/02/09 22:23 von Sascha Nemecek

Recent changes RSS feed