De plus en plus de sites utilisent le Responsive Web Design afin d’assurer leur affichage sur l’ensemble des appareils, dont par exemple Mashable, The next web..etc. Malgré quelques lacunes perfectibles, il s’agit d’une tendance d’avenir pour certains professionnels du Web.

Ces templates responsives ont donc pour but d'améliorer l'expérience des internautes sur votre blog, et l'adapter pour les différentes résolutions des appareils ( PC, Tablette et smartphone ).

Je vous ai choisi ci-dessous les meilleurs templates responsives conçues pour Blogger, et pour voir l'effet que ça fait, redimenssionez votre navigateur pour voire ce que ça donne sur tablette et smartphone ;-)

1 - Main Photo Responsive:




C'est une des meilleurs templates responsives, avec un design simple, minimaliste et épuré. Je la recommande pour son slider automatique ( geré seulement par les libellés ), mais aussi car elle est très simple de modification, puisqu'on peut la modifier via l'outil de création de modèles de Blogger.


2 - Extra News



Inspiré de la template du même nom de Wordpress, c'est une des plus réussies pour les blogs magazines ou news. Cette template dispose aussi d'une partie featured automatique très originale ( Inspirée de TheVerge ),  et une bonne gestion des widget sur les différents screens


3 - Pinfinity



Un clone de Pinterest pour Blogger, combinant élégance et simplicité. Cette template comporte un menu déroulant, les boutons des réseaux sociaux et une seule sidebar.


4 - Spray Mag ( Payante )



Une template magazine créée par CoolBThemes, malheureusement payante ( 10$ ), mais c'est une des templates reponsives les plus profesionnelles, avec un résumé automatique ( sans déformation des photos ), boutons des réseaux sociaux, 3 sidebars. Le seul inconvénient est que le slider n'est pas automatique.


5 - Johny Goreng

responsive template

Mon ami Maskolis propose désormais des templates responsives. Connu pour ses thèmes très sophistiqués, et très simples, cette template responsive ne l'est pas moins.


6 - Simplex Orgmag



Simplex lance sa première template responsive, sous le nom de OrgMag, elle est d'un design plutôt agréable et très epuré. On peut compter sur un slider automatique et une bonne organisation des posts.


Voilà, c'était les 6 meilleurs templates responsives que j'ai pu trouver sur internet.
Cependant, la collection des templates responsives ne s'arrête pas là, je vous recommande donc le lien ci dessous pour les dernières templates responsives de Ivy templates (qui en propose régulièrement), et les templates de Maskolis.

http://www.ivythemes.com/search/label/Responsive
http://www.maskolis.com/search/label/template

PS: Les pages d'instructions sont en anglais, si vous avez un problème lors de la modification d'une de ces templates, n'hésitez pas à laisser un commentaire ci-dessous :-)

12 Commentaires

  1. Bonjour, J’étais ravie de découvrir vos conseils super bien faits et super utiles. J’ai crée un mag, www.lavieestbellemag.com au format Feuilletable-Sur-Ecrans. Le site est actuellement en cours de refonte complète par un ami web master. Comme je ne peux pas traiter toutes les infos sur le FSE, je voulais avoir un blog associé. (actuellement il y a en plusieurs sur Blogger). Comme je n’en peux plus de leur mocheté, j’ai trouvé que Extra News serait super. Mais IMPOSSIBLE de mettre en place la template. J’ai bien compris qu’il fallait retourner aux anciennes versions. Mais après rien des explications données ne coïncide avec ce qui s’affiche à l’écran. Je serai ravie d’être idée sur ce-coup là. Car là, on dépasse mes compétences !!! Rghhh ! Merci de votre retour. Judith

    RépondreSupprimer
    Réponses
    1. Salut Judith,
      J'avoue que Extra News est une super template. N'empêche, qu'il y a aussi de très bonnes templates premium, style magazine chez ketemplate: http://www.ketemplate.com/ .
      Je n'ai pas bien saisi ton problème, tu peux bien détailler ton problème:
      -Tu as un problème de mettre en place la template?
      -Un problème avec une section spécifique?
      -Les articles n'apparaissent pas là où tu veux?

      Supprimer
  2. Bonjour,
    Merci beaucoup du retour. Première étape : j’ai réussi à télécharger et à mettre la template.
    Mais à l’affichage, j’ai une seule colonne par exemple. 2 colonnes s’affichent le temps d’un éclair puis ensuite j’ai une seule colonne.. Les photos sont déformées. Dans mise en page sous Blogger, je ne peux même pas corriger les superpositions. J’ai testé sur un blog sans intérêt. Voici le lien, ce sera plus clair qu’un long discours. On est loin du beau résultats d’extra news… lol !
    Tout est du bolo bolo… http://quimaimemelit.blogspot.fr/
    Faut-il absolument connaitre le code HTML pour faire les modifs ?
    Si oui, c’est mort, je n’y connais rien…

    RépondreSupprimer
    Réponses
    1. Il a mis un tuto pour ça: http://bloggeritems.com/templates/easy-news-responsive-magazine-blogger-template

      Les sections ne s'ajoutent pas elle mêmes, mais il faut configurer, selon le libellé que tu souhaites, ce n'est pas très difficile, juste suis son tuto ;-)

      Supprimer
    2. 1000 mercis de l’info. Je vais me plonger dedans. A bientôt j’espère. Je te donnerai des nouvelles.

      Supprimer
  3. Bonjour,

    Je souhaiterais installer le templates numéro 1 sur mon blog mais, je ne comprend pas comment faire ?!!

    J'ai téléchargé le fichier, j'ai essayé de l'ouvrir sur le bloc note et de copier son contenu pour le coller dans blogger-modele-modification code HTML mais, cela ne marche pas. Donc j'ai essyer de charger le ficher dans blogger-modele-sauvegarde/restaurer-Importer un modèle à partir d'un fichier sur votre disque dur mais, toujours aucun résultat... je désespère un peu ... peut tu m'aider ???

    RépondreSupprimer
    Réponses
    1. Salut Justine.
      Il faut bien choisir le fichier finissant par ".xml"
      Si tu le choisis, tu peux procéder utilisant les 2 méthodes, qui sont tous deux valables.

      Supprimer
    2. Re-bonjour,

      Le problème c'est que lorsque je télécharge le contenu je ne voie qu'une seul fichier appeler "Main Photo by ireng_ajah",son type de fichier est "fichier rar" et il pèse 29KO. Est-ce normal ?

      Supprimer
    3. Oui, c'est normal, tu dois juste le dézipper pour afficher les fichier dedans.
      Il y a le logiciel winrar pour ça, ou sinon si tu es sous windows 7 ou 8, fait un clic droit et clique sur extraire les fichiers.

      Supprimer
  4. Bonjour, j'ai téléchargé le théme Johny Goreng mais je n'arrive pas à mettre les images sur la page d'accueuil qui présente les articles. J'ai la description et le titre de chaque article mais je n'ai pas d'image comme sur la photo. A la place j'ai une carré avec écrit "image unavailable". Quelqu'un est-il arrivé à mettre une image ou à régler le probleme s'il vous plait?

    RépondreSupprimer
    Réponses
    1. Euh, à mon avis, cette erreur est due aux images utilisées dans ton blog.
      Pour faire un résumé automatique, cette template agit sur les images hébergées sur ton blog, qui ont généralement ce format: http://1.bp.blogspot.com/-VYc_atOKRm8/UQcN0JY6KSI/AAAAAAAACM8/q-HuEoheH5w/s320/ScreenShot171.jpg

      Si tu utilises une image hébergée autre part, elle ne peut le reconnaître, et sera considérée comme non existante avec ce script de résumé automatique.

      Voilà, je peux te recommander quelques templates qui n'agissent pas de cette sorte; comme:
      AWESOME: http://www.templateism.com/2014/03/awesome-mag-responsive-blogger-template.html
      PLAZIFY: http://www.templateify.com/2013/10/plazify-responsive-blogger-template.html

      Supprimer
  5. merci de l’info. Je vais me plonger dedans. A bientôt j’espère. Je te donnerai des nouvelles.

    RépondreSupprimer

Enregistrer un commentaire