définir les mises en page frontend pour les arbres de la page

J'utilise le champ Frontend-Layout à TYPO3 7.6 -Backend. Parce que mon site Web aura quatre départements différents avec des couleurs différentes en frontend.définir les mises en page frontend pour les arbres de la page

Je suis en utilisant:

TCEFORM { 
    pages { 
     layout { 
      altLabels { 
       0 = [ blue] 
       1 = [ orange ] 
       2 = [ green] 
       3 = [ yellow] 
      } 
     } 
    } 

} ### TCEFORM

À mon FLUIDTEMPLATE Je conclurai une <div> -wrapper, pour définir mes différentes langues dans le monde à ma feuille de style. f.e. div.wrap.blue { background-color:blue;}

<div class="wrap 
{f:if(condition:'{data.layout} == 0',then:'blue')} 
{f:if(condition:'{data.layout} == 1',then:'orange')} 
{f:if(condition:'{data.layout} == 2',then:'green')} 
{f:if(condition:'{data.layout} == 3',then:'yellow')}"> 
...

Cela fonctionne parfaitement pour moi. Mais comment puis-je faire glisser (ou hériter) le frontend-layout-info de ma page parent vers les sous-pages de mon pagetree? Je ne veux pas choisir la mise en page frontend dans les propriétés de la page à chaque fois, si je vais ajouter une nouvelle page dans mon pagetree. Cela doit fonctionner automatiquement. Est-ce possible? Avec slide?

Par exemple

*ROOT 
    + parent blue 
    ~~ sub blue 1 /* these pages also have frontend layout 0 */ 
    ~~ sub blue 2 
    + parent orange 
    ~~ sub orange 1 
    + parent green 
    ... 
    + parent yellow 
    ...

Thebks pour votre avis ou des conseils ..

Source

2016-06-16 user2310852

Je ne suis pas sûr que vous pouvez définir cette mise en page de manière récursive. Pour contourner votre problème, je voudrais créer quatre modèles de pages différents que vous pouvez facilement configurer pour être utilisé pour les sous-pages. –

Voulez-vous dire quatre mises en page backend différentes? Vous pouvez ensuite sélectionner la disposition du backend pour le parent et les sous-pages. J'y ai pensé, mais essayez d'utiliser des mises en page frontend. peut-être qu'il vaudra mieux utiliser les mises en page backend (fluide). Merci pour votre conseil. – user2310852

C'est exactement ce que je veux dire. J'aime la sélection de mise en page pour des conditions très spécifiques dans les éléments de contenu. –

Je ne pense pas qu'il est mort simple à mettre la disposition {data.layout} récursive sans manipuler la base de données. Trois solutions me viennent à l'esprit pour résoudre votre problème:

1) Créez quatre mises en page de backend que vous pouvez sélectionner pour vos pages actuelles et vos pages enfants. (Rincer Au fond et répéter ce que vous avez fait pour votre première mise en page de back-end)

2) Utilisation de vos modes de mise en page, vous pouvez essayer de définir une classe de corps en utilisant typoscript comme si (je n'ai pas testé cela):

page.bodyTag > 
page.bodyTagCObject = TEXT 
page.bodyTagCObject.field = data.layout 
page.bodyTagCObject.wrap = <body class="color-|">

3) Utiliser un typoscript similaire, mais mettre à jour la valeur en utilisant des conditions telles que TypoScript [pidInRootline]

page.bodyTag > 
page.bodyTagCObject = TEXT 
page.bodyTagCObject.wrap = <body class="blue"> 

[PIDinRootline = 1] 
page.bodyTagCObject.wrap = <body class="orange"> 
[global] 

[PIDinRootline = 2] 
page.bodyTagCObject.wrap = <body class="green"> 
[global] 
# and so on

Source

2016-06-16 15:12:51

Salut, c'est une réponse complète. Merci beaucoup. J'ai oublié la solution via les conditions de typo et PIDinRootline. – user2310852

J'ai eu votre même problème et ce typoscript a bien fonctionné pour moi, le résultat est ce que vous vouliez atteindre.

que vous pouvez voir le 20,10 objet est utilisé lorsque la mise en frontend est défini sur la page, tandis que le 20,20 objet est utilisé lors de la mise en page frontend il n'est pas réglé et prend en mode diapositive:

page { 
    bodyTagCObject > 
    bodyTagCObject = COA 
    bodyTagCObject { 
     stdWrap.noTrimWrap = |<body |>| 
     20 = COA 
     20 { 
      wrap = class="|" 
      10 = TEXT 
      10 { 
       if.isTrue.data = page:layout 
       data = page:layout 
       noTrimWrap = |page-layout-| | 
      } 
      20 = TEXT 
      20 { 
      if.isFalse.data = page:layout 
      data = levelfield:-2, layout, slide 
      noTrimWrap = |page-layout-| 
      } 
     } 
    } 
}

J'espère avoir été utile.

Source

2018-02-05 18:32:51

définir les mises en page frontend pour les arbres de la page

Répondre

Questions connexes