Discussion :

[grinder59]

Bonjour,

je suis en train de me former à Symfony2 et je galère un peu sur des trucs qui pourtant me semblent tout simples. J'ai un layout de base (nommé base.html.twig) enregistré dans Symfony/app/Resources/views.

Les vues de mes bundles héritent de cette base pour retrouver la mise en forme général du site. Par contre, dans le twig base, j'ai un fichier css. Où dois-je le mettre et comment l'appeler via asset ? de cette façon là : {{ asset('url_complete_vers_fichier'); }} ?

De même, où placer les icones et images générales de mon site et comment les appeler ? Si à chaque fois que j'ai une icone ou une image je dois appeler l'url complète, ça va être un peu galère ! Quelle est la meilleure des façons de faire ? Je n'ai pas trouvé beaucoup de réponses sur le web sur ce sujet (en tous cas des pas claires !)

Dernier truc, j'ai lu qu'il était recommandé de faire un bundle de décoration qui gérait le css global et les images et ensuite de faire hériter les autres bundles de ce bundles. Mais comment faire dans mes bundles fils pour afficher le css et les images gérés par le bundle de déco ? En outre, mes controllers héritant de la classe Controller de Symfony, comment ajouter l'héritage du bundle de déco, sachant que l'héritage mutltiple n'est pas possible ?

Merci de votre aide à un jeune padawan un peu paumé !

[dukoid]

salut,

entraine toi et un jour tu pourra faire léviter un vaisseau par la force de la pensée ..... oups je m'égare


je ne suis pas au courant d'un bundle de décoration, je laisse le soin à d'autre personne de te répondre.

la hierarchie des vues est la suivante :
base
layout
les templates

il y a 3 niveaux, un template peut heriter d'un layout qui lui même hérite d'une base.



mes fichiers CSS, images, js se trouvent dans un répertoire du bundle concerné:
xxxBundle/resources/public/css
xxxBundle/resources/public/js
xxxBundle/resources/public/image


* dans mon template de base, j'ai cette ligne :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
        {% stylesheets  '@AcmeXxxBundle/Resources/public/css/*' filter='cssrewrite' %}

ce qui veut dire que tous les fichiers qui se trouve dans /css doivent être chargé


* on peut aussi nommer un fichier que l'on veut charger

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
 {% stylesheets  '@AcmeXxxBundle/Resources/public/css/monfichier.css' filter='cssrewrite' %}

[gototog]

Tu peux meme descendre dans l'heritage de template aussi loin que tu veux.
Personnellement j'ai un bundle CommonBundle qui contient mes css, javascripts et images, et d'autres objets/services qui sont commun a tout l'appli.

Pour les images, ta racine c'est le dossier web. c'est simple tu peux utiliser

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<img src="/images/somwhere/title.png"></img>

ou

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<img src="{{ asset('bundles/monBundle/images/logo.png') }}" />

On oublie pas phpapp/console assets:install pour mettre nos ressources de bundles dans le dossier web

[grinder59]

Merci de vos réponses.

Personnellement j'ai un bundle CommonBundle qui contient mes css, javascripts et images, et d'autres objets/services qui sont commun a tout l'appli.

Supposons que j'ai 2 bundle :
- CommonBundle
- BlogBundle

De ce que je comprends, c'est via le controller de CommonBundle qu'on va pouvoir rendre la vue principale avec les images et css utilisées sur toutes les pages de mon site. J'ai bon ?
Le controller Blog permet d'afficher, par exemple, un article de mon blog.

Mais comment lier les 2 (CommonBundle et BlogBundle) pour obtenir un article de mon blog, affiché dans mon site avec tout le css et les images générales (qui s'affichent sur toutes les pages de mon blog) ?

[gototog]

le layout de base (app/.../base.html.twig) Contient la mise en forme générale du site.
Après, ton bundle blog a une page index.

Dans le controlleur, on appelle bien le template twig qui correspond:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
//controller
return $this->render('YourBlogBundle:Blog:index.html.twig', array(/* ... */ );

Jusque la il retrouve bien tout ce que tu veux.
Maintenant, pourquoi/comment va il étendre le layout?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
//blogBundle/Ressources/view/blog/index.html.twig
{% extends '::base.html.twig' %}
{% trans_default_domain "blog_messages" %}

{% block title %}
{{ parent() }} - {% trans %}blog.index.page_title{% endtrans %}
{% endblock %}

{% block content %}
    /*code de l'index*/
{% endblock content %}

La on dit d'abord au template twig d'étendre le layout de base grace a {% extends '::base.html.twig' %}Puis on lui dit quelle portions on utilise. Ici on utilise un block title, et on rajoute a son contenu (parent()) un suffixe de page.
Puis on remplace tout le contenu du block content (car il n'y a pas parent() ) par le contenu de notre bundles.

Mais comment sait on quels blocs vont où?
Et bien, les blocs correspondent a ceux du layout base.html.twig


Jusque la tout va bien, mais si on veut que blog bundle affiche dans son index la liste des derniers utilisateurs inscrits, contenu dans un bundle user?
Et bien, on appelle la méthode render Controller

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

{{ render(controller('UserBundle:Subscribe:recentUsers', { 'max': 5 })) }}

Symfony ira donc appeler ce controlleur et retournera du code twig a cet emplacement.

[grinder59]

Mais, dans cet exemple, tu ne fais pas intervenir le CommonBundle qui contient les css, javascript, images communes ?
Comment est-ce que le css général va être pris en compte par le layout de base ?

Supposons que mon css général soit :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
* {
    background : #cccccc;
}
div{
    background : #444444;
}

oui, je sais c'est light, mais c'est pour l'exemple ;-)

Ou placer le fichier MainStyle.css ? et comment y faire référence ? dans mon layout de base ? via le CommeBundle ?