comment integrer un theme boostraap avec symfony???
avez vous des exemples de mémoire fin d'étude sur symfony
comment integrer un theme boostraap avec symfony???
avez vous des exemples de mémoire fin d'étude sur symfony
sur symfony ou ailleurs, c'est pareil...
des links, des chargement de lib javascript ... non ? pourquoi ça serait différent ?
à question vague, réponse vague.....
On commence par comprendre de quoi il s'agit d'abord .
Commence par lire le premier lien que tut trouve lorsque tu tape " bootstrap " dans google.fr
Une fois tu as compris c'est quoi bootstrap tu va pas troouver des problemes que ce sois avec symfony ou autre.
Pour une question vague il ya pas vraiment de réponses précises![]()
l'intégration d'un Template en bootstrap ou autre framework de CSS est facile en SF , il suffit de choisir langage tu dois utilisé dans views .
En SF il existe le moteur de templates on trouve : twig (plus efficace, rapide et moins de code dans les views) ou bien tu utilise le langage php comme une application développée en php.
Note: le framework SF basé sur le langage PHP (OO et MVC) seulement les views que tu as la possibilité de choisir "twig" ou "php".
Je vous montré un exemple pour savoir la différence entre les deux:
Pour l'intégration du template en SF avec l'utilisation de twig, il faut mettre tous vos fichiers de CSS, JS , font dans le dossier "web" qui se trouve dans l'application.Puis tu dois défini la structure de base de votre site ( je parle de header/footer) dans une view nommée par exemple "base.html.twig" donc cette page sera présenté comme une page mère pour les autres pages. voilà la structure de cette page:
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29 // EN PHP <?php include 'inc/header.php'; ?> <?php $articlesQuery = $db->query('SELECT * FROM blog'); $articles = $articlesQuery->fetchAll(); $template = $twig->loadTemplate('blog.twig'); echo $template->render(array( 'articles' => $articles, )); ?> <?php include 'inc/footer.php'; ?> -------------------------------------------------------------------------------------------------- // en Twig, il est basé sur {{ ..... }} pour les variables // {% .... %} pour les boucles/include/ extends {% for key, article in articles %} <div class="article"> <div class="title">{{ article.title }}</div> <div class="content"> {{ article.content }} </div> </div> {% endfor %}
Pour la page suivante par exemple "index.twig.html"
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33 // cette structure applicable pour les views <html> <head> {% block title %}ici le titre de votre page{% endblock %} {% block stylesheet %} //ici l'intégration de vos fichiers CSS en utlisation la fonction asset() du SF // dans ce cas j'ai mes fichiers de CSS dans web/template/css/bootstrap.min.css <link href="{{ asset('template/css/bootstrap.min.css') }}" rel="stylesheet"> {% endblock %} </head> <body> <div> //ce block sera appelée dans les autres pages car ceci sera remplacé a chaque fois {% block body %} ...{% endblock %} </div> ...... {% block javascripts %} // ici l'intégration de vos fichiers JS , ils sont intégrés de la méme façon des fichiers CSS <script src="{{ asset('template/js/jquery.min.js') }}"></script> {% endblock %} </body> </html>
- l'héritage de la page mère permet a chaque fois d'utiliser tous les fichiers (CSS, js..) et le code que tu a défini sans besoin de redéfini lors de la création de votre nouvelle page
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11 // on hérite ici la page mère pour intégrer le contenu de la page "base.html.twig" (structure de base de votre site). on mit "::" car on suppose que cette page se trouve dans "app/ressources/views" {% extends "::base.html.twig" %} {% block body %} // si tu as besoin d'intégrer un pseudo code défini dans une autre page par exemple dans le bundle Acm /default tu dois défini la structure suivante {% include "AcmBundle:Defult:message.html.twig" %} // cette page contient "<div> ... </div>" on mit ce qu'on a besoin du code ici ... il sera remplacé par le bloc qui se trouve dans "base.html.twig" (page mère) {% endblock %}
Ceci réduit le temps d’exécution de la page ainsi que la bonne organisation du code.
Voici ce document contient tous les informations sur le moteur twig ICI et ICI
Bon travail
Partager