Menu

Découpage et Intégration d'une maquette

Introduction

Nous allons dans ce tuto voir comment découper une maquette et l’intégrer dans une page web

Découpage

  1. Sélection du calque
  2. Dupliquer les calques
  3. Création d'un nouveau document
  4. Afficher l’élément dans le nouveau document
  5. Rognage (suppression des parties vides dans notre image)
  6. Enregistrement (sous l’extension png24)
Répéter ses 6 étapes pour les 11 élément du maquette

Intégration


Dans cette partie nous allons diviser la page web en utilisant la balise <div> les 3 blocs principaux sont :

  • Header (entête de la page)
  • Container (corps de la page)
  • Footer (pied de la page)


Merci Pour votre Attention


Application Symfony2 Part 9 : Créer un Système de Pagination

Introduction :

Nous allons voir dans ce Tuto comment créer un system de pagination ( KnpPaginatorBundle ) pour gérer le nombre de film à afficher dans une page web.

Installation et Configuration du KnpPaginatorBundle : 

Nous allons rendre visite au site http://knpbundles.com/ ou il y a plus que 2700 bundles à utiliser et intégrer dans notre applicationDans la zone de recherche tapez KnpPaginatorBundle
http://knpbundles.com/KnpLabs/KnpPaginatorBundle

  1. Tapez cette ligne de commande dans CMD
    php composer.phar require knplabs/knp-paginator-bundle
  2. Copier la configuration dans fichier config.yml de votre application.
    knp_paginator: page_range: 5 # default page range used in pagination control default_options: page_name: page # page query parameter name sort_field_name: sort # sort field query parameter name sort_direction_name: direction # sort direction query parameter name distinct: true # ensure distinct results, useful when ORM queries are using GROUP BY statements template: pagination: KnpPaginatorBundle:Pagination:sliding.html.twig # sliding pagination controls template sortable: KnpPaginatorBundle:Pagination:sortable_link.html.twig # sort link template
  3. Activer le bundle dans Appkernel.php

    public function registerBundles() { return array( // ... new Knp\Bundle\PaginatorBundle\KnpPaginatorBundle(), // ... ); }
  4. Ajouter la fonction de pagination dans Controller

    public function indexAction() { $em = $this->getDoctrine()->getManager(); $request=$this->getRequest(); $listefilms = $em->getRepository('FilmoBundle:Film')->findAll(); $entities = $this->get('knp_paginator')->paginate(
    $listefilms,
    $request->query->get('page', 1)/*page number*/,
    6/*limit per page*/
    );
    return $this->render('FilmoBundle:Film:index.html.twig', array(
    'entities' => $entities, )); } Dans cette exemple nous allons appliquée le system de pagination à la $listeFilms pour afficher 6 films par page commençant par la page 1
  5. Implémenter le system de pagination dans View 

    {# display navigation #} <div class="navigation"> {{ knp_pagination_render(entities) }} </div>

Voici le vidéo de l'exemple :




Merci pour Votre Attention

x