SPIP-Contrib

SPIP-Contrib

عربي | Deutsch | English | Español | français | italiano | Nederlands

289 Plugins, 197 contribs sur SPIP-Zone, 65 visiteurs en ce moment

Accueil > Squelettes > Squelettes pour blog > Japibas > Japibas, squelette responsive

Japibas, squelette responsive

11 octobre 2013 – par AMBG – 113 commentaires

35 votes

Japibas est un squelette responsive, multilingue (français, anglais et espagnol), dont l’habillage conviendrait à un site de type blog ou webzine.

Le graphisme est inspiré du template Wordpress Japibas réalisé par Jesper Johansen et distribué sous licence GNU.

Voir le site de démo.

Téléchargement

Lien de téléchargement depuis la zone :
https://files.spip.net/spip-zone/japibas.zip

Installation et dépendances

Le squelette se présente sous forme de plugin et s’installe donc comme tous les plugins

Il intègre le plugin Menu déroulant 2 qu’il faudra également installer.

Pour s’assurer que tout fonctionne, on pensera à vider le cache.

A propos du layout

Le plugin reprend les squelettes et css de la dist et y ajoute de nouvelles classes. Ces dernières se trouvent pour l’essentiel à la fin du document css/layout.css.

Iconographie

Les icones auteur, date, messages ainsi que les boules de pagination sont affichées par une police de caractères.

La police utilisée est spip-icons.ttf (avec sa version eot) produite par nos soins et distribuée sous licence GNU. Elle se trouve dans le dossier css/fonts.

Ce choix permet de modifier l’aspect des icones (dimensions, couleurs etc.) sans passer par un logiciel d’édition d’images.

La classe css qui la gère est (css/layout.css) :

  1. .spip-icons {
  2.     font-family: spip-icons !important;
  3.     font-size: 1.8em;
  4.     color: #000;
  5.     vertical-align: middle; }
  6.  
  7. .spip-icons:hover {
  8.     color: #8CA429; }

Télécharger

Et l’appel dans le squelette :

  1. <span class="spip-icons">A</span>

affichera l’icone .

  1. <span class="spip-icons">H</span>

affichera l’icone .

Tableau des correspondances icones > caractères.

Voir en ligne : https://plugins.spip.net/japibas

Dernière modification de cette page le 18 janvier 2018

Retour en haut de la page

Tout afficher

Vos commentaires

  • Le 16 avril à 17:11, par Pierre COLLENOT En réponse à : Japibas, squelette responsive

    Bonjour,
    Etant en plein développement d’un site avec Japibas, je souffre beaucoup de devoir attendre 24h pour voir le résultat d’une modification de fichier css.
    J’ai suspendu temporairement le cache de spip par l’interface privée : aucun résultat
    J’ai réinitialisé la liste de tous les travaux, par l’interface privée : aucun résultat
    Dans mes précédents sites (sans Japibas), de réglais cela très simplement par l’interface privée spip.
    Visiblement, Japibas ignore les paramètres de spip.
    J’ai beau chercher dans les fichiers de Japibas, je ne trouve rien qui me donne la moindre indication.
    AU SECOURS

    Merci pour une aide

    • Le 17 avril à 19:04, par Manu En réponse à : Japibas, squelette responsive

      SPIP et son cache n’ont sans doute rien à voir dans cette histoire de prise en compte des css par le navigateur.
      C’est une affaire directe entre le fichier css et le navigateur. Sur mac OS, un cmd+R (je crois que c’est F5 sur un PC - à confirmer) provoque un rafraîchissement immédiat de la page prenant en compte les css tels qu’ils sont enregistrés.

    • Le 19 avril à 03:32, par Pierre COLLENOT En réponse à : Japibas, squelette responsive

      bonjour

      Pour le cache, c’est super, ça marche. Merci

      Il reste pour moi un sujet en suspens :

      je suis confronté à un problème d’affichage des images dans les pages de mon site.
      je voudrais qu’elles s’affichent en plus grandes dimensions qu’actuellement. Elles occupent environ 60% de la largeur disponible, et je voudrais qu’elle en occupent au moins 90%.
      je pense avoir identifié ce code css comme la source de mon problème

      .ajustable

      width : 86% !important ;

      height : auto ;

      border : 0 ;

      c’est une séquence qui se répète à plusieurs reprises dans le fichier layout.css
      l’expression «  !important » me fait redouter le pire si j’y touche
      il doit bien y avoir une méthode

      à l’aide

      il faut me parler gentiment sur ce sujet, car je connais peu de choses dans les css (j’ai beau avoir 75 balais, il faut faire comme si j’en avais 12 - OK ?)

      comme il y a plusieurs séquences comme celle que j’ai indiqué ci-dessus, merci de me dire quelle est celle qu’il faut modifier.

    Répondre à ce message

  • Le 19 mars 2016 à 15:03, par Pierre COLLENOT En réponse à : Japibas, squelette responsive

    Bonjour,
    J’ai un souci au sujet de la taille des images.
    Comment faire pour que les images d’une page s’affichent à leur taille réelle, et pas à une taille agrandie ?
    Par exemple, sur cette page de mon site, les images ont une taille réelle de 80 x 77 px, et elles s’affichent en 500 x 481, ce qui donne un résultat catastrophique.
    J’ai vu que les images sont « class=ajustable ». Je suppose que c’est ce paramètre qui pose problème.
    Comment peut-on régler ce paramètre pour que les images conservent au maximum leur taille d’origine, et se réduisent éventuellement selon la taille de l’écran ?

    • Le 21 mars 2016 à 00:29, par Pierre COLLENOT En réponse à : Japibas, squelette responsive

      Je complète mon message au sujet de la taille d’affichage des images par une précision.

      Les images qui s’affichent en taille 500px au lieu de leur taille réelle sont celles qui sont situées dans les cellules d’un tableau spip (délimitées par le caractère | ).

      Celles qui sont dans une zone de texte standard s’affichent correctement.

      Comment faire pour que les images situées dans les cases d’un tableau s’affichent à leur taille réelle ?

    • Le 22 mars 2017 à 19:03, par Amire En réponse à : Japibas, squelette responsive

      Salut Pierre ,

      A tu résolu le problème de la taille des images ? de mon coté le problème est seulement sur chrome v 57. Avec les pages en arabe donc écriture du droite vers la gauche !

    • Le 24 mars 2017 à 12:10, par Amire En réponse à : Japibas, squelette responsive

      Salut Pierre,

      J’ai une bonne nouvelle pour toi. Pour faire paraitre les images avec le code il faut aller à layout.css dans le dossier css (le bloc_logo_article) est modifier la largeur « width » comme ci-dessous :

      .bloc_logo_article
      position : relative ;
      float : right ;
      margin : 0 2% 2% 3% ;
      padding : 0 ;
      width : 50% ;
      height : auto ;
      border : solid 4px #FFF ;
      -moz-box-shadow : 0px 0px 5px 1px #cfcfcf ;
      -webkit-box-shadow : 0px 0px 5px 1px #cfcfcf ;
      box-shadow : 0px 0px 5px 1px #cfcfcf ;
      filter : progid:DXImageTransform.Microsoft.Shadow(color=#cfcfcf, Direction=NaN, Strength=5) ;

    • Le 24 mars 2017 à 12:47, par Amire En réponse à : Japibas, squelette responsive

      c’est encore mieux comme çà :

      1.     width: auto /*  j'ai passé de 35% à auto pour mieux afficher le logo   */
      2.     height: 50%; /*  j'ai passé d'auto' à 50% pour mieux afficher le logo   */

      Télécharger

    • Le 11 avril à 19:03, par Pierre COLLENOT En réponse à : Japibas, squelette responsive

      Bonjour
      J’avais, en 2016, envoyé 2 posts au sujet du redimensionnement des images en utilisant Japibas.
      La réponse qui m’a été donnée ne m’a pas permis de réaliser ce que je cherchais à faire. En désespoir de cause, j’ai effacé les lignes des fichiers css qui donnaient un mauvais résultat, et je me suis contenté du classique code de SPIP qui me donnait les résultats espérés.

      Mais, on vient de me commander plusieurs sites, que je construis avec Japibas. Alors je voudrais conserver le maximum de ce plugin.
      J’ai toujours besoin de redimensionner des images, au fil des pages, avec une méthode compatible avec Japibas, sans bidouiller dans les css, et qui soit du genre de celle de spip, avec un truc en plus qui me permette de redimensionner individuellement chaque image d’une page sans avoir à créer autant de lignes de css qu’il y a d’images dans mon site.

      Un truc du genre image n° longueur hauteur comme on on trouve plein sur spipcontrib. Mais aucun de ceux que j’ai essayé ne fonctionne avec Japibas.
      Ou, au pis aller, un truc du genre image dans un tableau spip qui permette au minimum d’avoir des images affichées à leur taille réelle.

      A titre d’exemple, mon site le plus important. Il s’appelle Histoire Passion Saintonge . j’y ai effacé des lignes de css, mais j’ai encore des tas de soucis avec mes images, mais comme il y en a plus de 10000, je renonce à traiter chacune individuellement.

      Une réponse me rendrait un très grand service
      Alors, merci d’avance.
      Pierre

    Répondre à ce message

  • Le 25 mars à 21:09, par Ludo En réponse à : Japibas, squelette responsive

    Bonsoir

    après avoir fini mon site sur une plate-forme de test, j’ai voulu le mettre en ligne officiellement.
    Et sur ma page d’accueil (sommaire.html), j’ai un bug avec la classe « hentry clearfix ». Je n’ai plus les articles récents dans des rectangles blancs, qui sont réduits (même un titre trop long ne rentre pas entièrement dedans), les boutons « lire la suite » sont décalés aussi.
    j’ai désactivé au préalable les plugins non utilisés, par contre j’avais déjà des articles avec des logos, je ne vois que cette seule différence, pensez-vous que ça puisse venir de là ? Ou alors une table de la base mysql doit être modifiée (colonne en + ou en -) ?

    PS : pas de problème pour l’affichage des articles...

    Merci pour votre aide

    Répondre à ce message

  • Le 5 mars à 22:29, par Ludo En réponse à : Japibas, squelette responsive

    Bonsoir

    J’ai installé le plugin social tag pour permettre le partage d’articles sur les réseaux sociaux.
    mais je n’arrive pas à afficher la barre des boutons des réseaux sociaux malgré le rajout de la div

    dans article.html

    De plus, quels sont les css me permettant de modifier le hover du bouton Go ! et les hover des sous-rubriques du menu (j’ai trouvé pour les hover de « lire la suite » et pour le hover des rubriques dans le menu).

    merci

    • Le 7 mars à 21:50, par david En réponse à : Japibas, squelette responsive

      bonsoir si c’est pour changer le texte ou certaines petites choses j’ai vue ça dans formulaire recherche après dans css layout css y a pas mal de chose on peut modifier pour les articles par exemple et autres pour le plugin des réseaux sociaux j’utilise pas j’utilise un plugin de modèle Facebook.

    • Le 7 mars à 22:03, par Ludo En réponse à : Japibas, squelette responsive

      Ok merci David

    • Le 13 mars à 13:34, par Ludo En réponse à : Japibas, squelette responsive

      Excuse-moi de te déranger encore une fois mais dans la boucle des articles à la une (page sommaire.html), qui fait apparaître ce qui ressemble à un slider, y-a-t-il possibilité de passer d’un article en 1 à un autre automatiquement ? Ou doit-on installer un autre plugin ?

    • Le 13 mars à 13:53, par david En réponse à : Japibas, squelette responsive

      Oui c’est possible en utilisant anythink slider comme plugin ensuite tu créé une boucle slip
      pour la boucle si tu sais pas comment faire donne moi ton adresse email je t’enverrais ça

    • Le 13 mars à 15:02, par Ludo En réponse à : Japibas, squelette responsive

      Oui j’ai téléchargé le plugin, j’ai voulu intégrer la boucle slider dans la boucle des articles à la une mais je n’ai pas eu la réaction voulue.
      Je veux bien en effet ton code, en te remerciant une nouvelle fois pour ta réactivité et ton partage de connaissances.
      ludo_demathieu@yahoo.fr

    • Le 13 mars à 15:31, par david En réponse à : Japibas, squelette responsive

      je t’ai envoyé un mail hésite pour tout autre infos directement sur mon mail si tu veux

    Répondre à ce message

  • Le 27 février à 11:42, par Ludo En réponse à : Japibas, squelette responsive

    Bonjour

    Quelle page html est à modifier pour afficher les brèves (dans le bloc de droite, qui affiche par défaut les articles les + lus...) ?

    Merci

    • Le 27 février à 12:17, par david En réponse à : Japibas, squelette responsive

      Bonjour tu trouvera ça Dans le dossier inclure et un fichier qui s’appelle aside-content.html
      tu as juste a ajouter ta boucle que tu désire pour les brèves

    • Le 27 février à 15:35, par Ludo En réponse à : Japibas, squelette responsive

      Merci pour ta réactivité je vais regarder

    Répondre à ce message

  • Le 11 novembre 2017 à 16:43, par Amire En réponse à : Japibas, squelette responsive

    Bonjour,

    Est ce que quelqu’un parmi vous a mit à jour vers spip 3.2 ? si oui est que les squelettes Japibas sont compatible ? Merci.

    • Le 22 novembre 2017 à 09:01, par tétralemme En réponse à : Japibas, squelette responsive

      Non, ce n’est pas compatible avec 3.2, c’est dommage...

    • Le 22 novembre 2017 à 10:14, par Maïeul En réponse à : Japibas, squelette responsive

      Plus précisement, la compatibilité 3.2 n’a pas été testé. Pour tester la compatibilité 3.2, changer

      compatibilite="[3.0.0;3.1.*]"

      en

      compatibilite="[3.0.0;3.2.*]"

      dans le fichier paquet.xml

      Cela permettra d’activer le plugin. Ensuite il faudra vérifier que tout fonctionne correctement, et nous le signaler. Si c’est bien le cas, on modifiera la version distribuée.

    • Le 22 novembre 2017 à 11:30, par tétralemme En réponse à : Japibas, squelette responsive

      Ah, oui, ça a l’air de marcher, MERCI !`
      http://www.recherche-clinique-psy.com

    Répondre à ce message

  • Le 17 avril 2017 à 13:25, par Amire En réponse à : Japibas, squelette responsive

    Bonjour,

    J’utilise Spip 3.1 le plugin lecteur multimédia. Le problème c’est que la vidéo déborde sur les petits écrans une partie de l’écran est caché et ça influence aussi le conteneur du site. J’ai appliqué des conseils que j’ai trouvé sur ce site.. Sans aboutir à la résolution de mon problème. Vos conseils seront les bienvenu. Merci.

    Répondre à ce message

  • Le 15 avril 2017 à 14:49, par Amire En réponse à : Japibas, squelette responsive

    Bonjour,

    J’utilise « Menu-deroulant » avec spip 3.1 et les squelettes Japibas pour un site multilingue.

    Chaque langue est représenté par une rubrique principale, exemple (Français) et les sou rubriques de la même langue. Le problème c’est quand je suis sur la page du français par exemple et je clique sur l’icône « English » qui représente la rubrique « anglais » et ses sou-rubrique. Une partie de la page (aside , le formulaire de contact reste en français) j’ai fais des essais avec le critère lang mais ça ne change rien. Voilà si vous pouvez aider svp. Merci.

    Répondre à ce message

  • Le 21 mars 2017 à 19:21, par Amire En réponse à : Japibas, squelette responsive

    Bonjour,

    Merci pour ce travail. je ne novice dans ce domaine ; le squelette est bien multilingue. pour le sens de l’écriture il reste toujours de la gauche vers la droite même pour la langue arabe. Aussi en concernant les traductions d’article. comment faire pour les afficher avec les titres des articles svp ? Merci.

    • Le 21 mars 2017 à 20:40, par Amire En réponse à : Japibas, squelette responsive

      C’est bon pour les traductions, j’ai utilisé le plugin « Traduction d’articles autrement »

      Pour la personnalisation des squelettes : j’ai crée un dossier squelettes à la racine de mon site et j’ai mis dedans les dossiers et les fichiers à personnaliser en commentant les lignes que j’ai changé (pour se rappeler ultérieurement).

    • Le 22 mars 2017 à 14:37, par Amire En réponse à : Japibas, squelette responsive

      Je poursuis,la personnalisation

      j’ai envie de changer la taille du texte dans mes paragraphes. quelqu’un sait sur quelle feuille je fais çà, et s’il y a de l’aide pour personnaliser les fonds ça sera bien aussi. Merci.

    Répondre à ce message

  • Le 7 janvier 2017 à 12:49, par Régis D En réponse à : Japibas, squelette responsive

    Je n’arrive pas à afficher les articles syndiqués de sites extérieurs référencés et syndiqués.
    Ils devraient s’afficher en bas de la page d’accueil à la rubrique « nouveautés sur le web ». Merci pour votre aide.

    Répondre à ce message

Répondre à cet article

Qui êtes-vous ?

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici Les choses à faire avant de poser une question (Prolégomènes aux rapports de bugs. )
Ajouter un document

Retour en haut de la page

Ça discute par ici

  • ORR v2

    21 mai 2013 – 105 commentaires

    ORR, le plugin d’Organisation des Réservations et des Ressources passe en version 2, avec quelques nouveautés attendues. Je ne reprendrai pas les explications données dans la version 1. Les nouveautés : 1. Gestion des autorisations Le principe (...)

  • Speedsyndic pour SPIP 2 et SPIP 3

    11 octobre 2010 – 32 commentaires

    Ce plugin est une version compatible spip 2.0.x / 2.1 / 3.1 du plugin Speedsyndic Note : Une bonne partie du texte ci-dessous a été pompé de cet article, expliquant la version précédente du plugin. je n’ai fait qu’adapter le code pour spip 2, ajouter (...)

  • Personnalisation graphique du squelette SoyezCréateurs

    19 août 2009 – 110 commentaires

    Il est possible de personnaliser l’affichage du squelette SoyezCréateurs de manière plus ou moins profonde. Changement dans les couleurs via CFG La page de CFG des couleurs de SoyezCreateurs : ecrire/ ?exec=cfg&cfg=soyezcreateurs_couleurs (...)

  • Visualiser un PDF dans un article

    13 juin – commentaires

    SoyezCréateurs utilise un modèle pour afficher un PDF dans e corps d’un article Un peu d’histoire Avant, les navigateurs n’incluaient pas de lecteur PDF nativement ce qui avait conduit à la création du plugin Lecteur pdf javascript pdf.js. Mais, (...)