> ## Documentation Index
> Fetch the complete documentation index at: https://dokumentation.websale.de/llms.txt
> Use this file to discover all available pages before exploring further.

# E-PIA_ (Einzelansicht und Bewertung)

> Ein einzelnes Kundenfoto groß anzeigen und bewerten lassen: Einzelansicht, Bewertungsformular, Durchschnittsnote als Zahl und als Grafik.

Klickt ein Besucher in der Galerie auf ein Vorschaubild, gelangt er in die Einzelansicht. Dort steht das Bild in Normalgröße, dazu die Angaben zum Einsender und das Formular, mit dem andere Kunden das Bild bewerten.

Dasselbe Template zeigt auch alle Bilder eines Produktes. Welche der beiden Ansichten erscheint, entscheidet der Aufruf: mit `techname` die Einzelansicht, mit `pi` die Produktgalerie. Eingetragen wird das Template in der Shopkonfiguration `shop.config` im Abschnitt `<ProductsInAction>` beim Parameter `Product`.

Wegweiser: [ProductsInAction anbieten](https://dokumentation.websale.de/v8s/interaktive-funktionen/productsinaction-modul.md)

## Die beiden Ansichten trennen

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{E-PIA_SHOW-SINGLE}
   <!-- ein einzelnes Bild groß, mit Bewertungsformular -->
{/E-PIA_SHOW-SINGLE}

{!E-PIA_SHOW-SINGLE}
   {E-PIA_DATA}
      {@E-PIA_DATA}
         <!-- alle Bilder dieses Produktes als Vorschaubilder -->
      {/@E-PIA_DATA}
   {/E-PIA_DATA}
{/!E-PIA_SHOW-SINGLE}
```

Beide Zweige gehören in dasselbe Template. Das spart eine eigene Seite für die Produktgalerie und hält Gestaltung und Navigation an einer Stelle.

> [!WARNING]
>
> `E-PIA_SHOW-SINGLE` greift nur, wenn der Aufruf eine gültige technische Kennung mitbringt. Bei einer unbekannten Kennung fällt ProductsInAction stillschweigend auf die Produktgalerie zurück, sofern ein Produktindex vorliegt. Fehlt auch der, bleibt die Seite leer.

## Das Bild und seine Angaben

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{E-PIA_SHOW-SINGLE}
   <img src="~E-PIA_Action-Image~" alt="">

   <p>Foto von ~E-PIA_Username~, eingesendet am ~E-PIA_CreateDate~</p>
   {E-PIA_Comment}<p class="bildkommentar">~E-PIA_Comment~</p>{/E-PIA_Comment}

   <p>
      (~E-PIA_RatingVotes~ Bewertungen)
      <img src="~E-PIA_RatingScoreImg~" alt="Durchschnitt ~E-PIA_RatingScore~ von 5">
   </p>
{/E-PIA_SHOW-SINGLE}
```

Die Tags für Einsender, Datum, Kommentar und Produkt stehen auf einer eigenen Seite: Referenz: E-PIA\_ (Bilddaten)

### Die Bewertung anzeigen

| Tag | Liefert |
| - | - |
| `E-PIA_RatingVotes` | die Anzahl der abgegebenen Bewertungen |
| `E-PIA_RatingScore` | die Durchschnittsnote als Zahl |
| `E-PIA_RatingScoreImg` | die Adresse der passenden Bewertungsgrafik |
| `E-PIA_UserRatingScore` | die Adresse der Grafik zur eben abgegebenen Bewertung |

Die Grafiken selbst hinterlegen Sie in der Shopkonfiguration `shop.config` im Abschnitt `<ProductsInAction>` bei den Parametern `RatingImg-00` bis `RatingImg-05`. Sie müssen im Verzeichnis `benutzer/templates` liegen.

`E-PIA_RatingScoreImg` rundet für Sie. Bis 1,5 wählt das Tag `RatingImg-01`, bis 2,5 die Zwei und so weiter, ein noch unbewertetes Bild bekommt `RatingImg-00`. Sie brauchen im Template also keine Fallunterscheidung über die Note.

Mit einem Parameter gibt `E-PIA_RatingScoreImg()` gezielt eine der sechs Grafiken aus, unabhängig von der Note des Bildes. `~E-PIA_RatingScoreImg(5)~` liefert immer die Grafik für fünf Punkte, etwa für die Beschriftung der Auswahlknöpfe im Bewertungsformular.

`E-PIA_RatingScore` lässt sich außerdem klammern, um auf eine bestimmte Note zu reagieren. Die Klammerung greift, wenn die Durchschnittsnote im Bereich einer halben Note um den Wert liegt.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{E-PIA_RatingScore(5)}
   <p class="auszeichnung">Ein Spitzenfoto unserer Kunden.</p>
{/E-PIA_RatingScore(5)}
```

> [!WARNING]
>
> `E-PIA_RatingScore` hat keine negative Klammerung. `{!E-PIA_RatingScore(5)}` bleibt wirkungslos und steht anschließend unaufgelöst in der Seite. Prüfen Sie stattdessen positiv auf die Noten, die Sie hervorheben möchten.
>
> `E-PIA_RatingVotes` ist ein reines Einzel-Tag. Eine Klammerung `{E-PIA_RatingVotes}` für den Fall "schon bewertet" gibt es nicht. Verwenden Sie dafür `{E-PIA_RatingScore}` ohne Parameter, das greift, sobald eine Note vorliegt.

## Das Bewertungsformular

`E-PIA_RATING-ALLOWED` greift nur, wenn alle drei Bedingungen erfüllt sind.

* Der Besucher ist im Shop angemeldet.
* Er hat das Bild nicht selbst hochgeladen.
* Er hat dieses Bild noch nicht bewertet.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{E-PIA_SHOW-SINGLE}

   {!ST-LoggedIn}
      <p>Möchten Sie dieses Bild ebenfalls bewerten? Dann melden Sie sich bitte an.</p>
   {/!ST-LoggedIn}

   {ST-LoggedIn}
      <form action="~FORM-Template(ws_actionimage_picture.htm)~" method="get">
         <input type="hidden" name="pi" value="~E-PIA_PR-ProdIndex~">
         ~E-PIA_HiddenTags(rating)~

         {E-PIA_RATING-OK}
            <p>~E-PIA_InfoMsg~</p>
            <p>Ihre Bewertung: <img src="~E-PIA_UserRatingScore~" alt=""></p>
         {/E-PIA_RATING-OK}

         {E-PIA_RATING-ALLOWED}
            <fieldset>
               <legend>Bewerten Sie dieses Bild</legend>
               <label><input type="radio" name="ws_actimg_rating" value="5"> 5 Sterne</label>
               <label><input type="radio" name="ws_actimg_rating" value="4"> 4 Sterne</label>
               <label><input type="radio" name="ws_actimg_rating" value="3"> 3 Sterne</label>
               <label><input type="radio" name="ws_actimg_rating" value="2"> 2 Sterne</label>
               <label><input type="radio" name="ws_actimg_rating" value="1"> 1 Stern</label>
               <button type="submit">Jetzt bewerten</button>
            </fieldset>
         {/E-PIA_RATING-ALLOWED}

         {!E-PIA_RATING-ALLOWED}
            {!E-PIA_RATING-OK}
               {E-PIA_IS-OWNER}
                  <p>Das ist Ihr eigenes Foto. Vielen Dank, dass Sie es eingesendet haben.</p>
               {/E-PIA_IS-OWNER}
               {!E-PIA_IS-OWNER}
                  <p>Sie haben dieses Bild bereits bewertet.</p>
               {/!E-PIA_IS-OWNER}
            {/!E-PIA_RATING-OK}
         {/!E-PIA_RATING-ALLOWED}
      </form>
   {/ST-LoggedIn}

{/E-PIA_SHOW-SINGLE}
```

| Tag | Greift, wenn |
| - | - |
| `E-PIA_RATING-ALLOWED` | der Besucher dieses Bild bewerten darf |
| `E-PIA_RATING-OK` | er gerade eine Bewertung abgegeben hat |
| `E-PIA_IS-OWNER` | das Bild von ihm selbst stammt |

> [!WARNING]
>
> Ohne `E-PIA_HiddenTags(rating)` im Formular schlägt die Bewertung fehl. Das Tag setzt den Sitzungsschlüssel, ohne den ProductsInAction den Versand mit der Meldung `LimitExceeded` abweist.

`E-PIA_IS-OWNER` trennt die beiden Gründe, aus denen `E-PIA_RATING-ALLOWED` nicht greift. Ohne diese Unterscheidung bekäme der Einsender seines eigenen Fotos den Hinweis, er habe bereits bewertet, was ihn zu Recht irritiert.

> [!WARNING]
>
> Zulässig sind die Noten 1 bis 5. Ein fehlender oder ein Wert außerhalb dieses Bereichs führt zu den Meldungen `NoRating` beziehungsweise `RatingOutOfRange` aus dem Abschnitt `<ProductsInAction-Txt>`, die Bewertung wird nicht gespeichert.

Die Anmeldeprüfung übernimmt `ST-LoggedIn` und nicht ProductsInAction. `E-PIA_RATING-ALLOWED` greift zwar auch bei einem nicht angemeldeten Besucher nicht, kann aber nicht sagen, warum. Erst die Klammerung mit `ST-LoggedIn` erlaubt den Hinweis auf die Anmeldung.

Referenz: [ST-LoggedIn](https://dokumentation.websale.de/v8s/referenz/tags/st/seitenzustand-und-navigation.md)

## Fehler und Hinweise

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{E-PIA_ErrorMsg}
   <p class="fehler">~E-PIA_ErrorMsg~</p>
{/E-PIA_ErrorMsg}
```

`E-PIA_ErrorMsg` und `E-PIA_InfoMsg` gelten in allen drei ProductsInAction-Templates und sind zugleich Bereichs-Tag und Einzel-Tag. Die Klammerung sorgt dafür, dass der Rahmen nur erscheint, wenn es wirklich etwas zu melden gibt.

## Die Tags im Überblick

| Tag | Einzel-Tag | Bereichs-Tag | negatives Bereichs-Tag | Schleifen-Tag |
| - | - | - | - | - |
| `E-PIA_SHOW-SINGLE` | – | ja | ja | – |
| `E-PIA_RATING-ALLOWED` | – | ja | ja | – |
| `E-PIA_RATING-OK` | – | ja | ja | – |
| `E-PIA_IS-OWNER` | – | ja | ja | – |
| `E-PIA_RatingScore()` | ja | ja | – | – |
| `E-PIA_RatingScoreImg()` | ja | – | – | – |
| `E-PIA_RatingVotes` | ja | – | – | – |
| `E-PIA_UserRatingScore` | ja | – | – | – |

Zulässig sind alle Tags dieser Seite im Detailansichts-Template für ProductsInAction. `E-PIA_RatingScore()`, `E-PIA_RatingScoreImg()` und `E-PIA_RatingVotes` gelten zusätzlich im Galerie-Template.

## Verwandte Themen

* Wegweiser: ProductsInAction anbieten
* Referenz: [Abschnitt ProductsInAction](https://dokumentation.websale.de/v8s/referenz/konfigurationen/shopkonfiguration-shop-config/produkte-katalog-und-suche.md#productsinaction)
* Referenz: [E-PIA\_ (Bilddaten)](https://dokumentation.websale.de/v8s/referenz/tags/e-pia/bilddaten.md)
* Referenz: [E-PIA\_ (Galerie)](https://dokumentation.websale.de/v8s/referenz/tags/e-pia/galerie.md)
* Referenz: [E-PIA\_ (Upload)](https://dokumentation.websale.de/v8s/referenz/tags/e-pia/upload.md)


## Related topics

- [E-PIA_ (Bilddaten)](https://dokumentation.websale.de/v8s/referenz/tags/e-pia/bilddaten.md)
- [E-PIA_ (Galerie)](https://dokumentation.websale.de/v8s/referenz/tags/e-pia/galerie.md)
- [E-PIA_ (Upload)](https://dokumentation.websale.de/v8s/referenz/tags/e-pia/upload.md)
- [ProductsInAction-Modul](https://dokumentation.websale.de/v8s/interaktive-funktionen/productsinaction-modul.md)
- [PIA- (ProductsInAction)](https://dokumentation.websale.de/v8s/referenz/tags/pia-productsinaction.md)


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.