Odaiba

Présentation

Odaiba est un squelette minimal en 2 colonnes sous Bootstrap4.

Ce squelette est idéal pour présenter sur quelques pages une association, un portfolio personnel.

Aperçu

URL de démo: https://www.alma63.fr/

Installation

Les plugins Fulltext, Favicon, Court-circuit 2 peuvent être installés en complément.

Court-circuit 2 est fortement recommandé pour limiter les pages intermédiaires et les clics inutiles pour accéder aux articles.

A l’installation, le plugin crée aussi

  • un champs extra pour gérer les tris des rubriques

Lorsque votre site passe en production, il est recommandé d’activer la compression des fichiers Javascript et CSS pour avoir un site rapide à charger.

Configuration

Le squelette est configurable

Choix des contenus (articles, moteur de recherche, liens dans le pied de page) et des couleurs principales

Liens vers la page démo

Le logo figurant dans le menu est le logo du site SPIP qui peut être renseigné via le menu Configuration > Identité du site

Il est conseillé de choisir un format carré avec de la marge blanche car le logo est affiché sous forme ronde.

Le menu haut est constitué des rubriques à la racine listés par numéros
Exemple: 10. Actualités, 20. Contact, ....

On cache les rubriques dont le titre commence par 99. ...

Dans le menu configuration, vous pouvez choisir l’aspect du menu en version responsive

  • soit un menu fixe placé en haut déroulant
  • soit un menu placé à gauche glissant
Menu responsive gaucheMenu responsive haut

Page d’accueil

La page d’accueil est un article SPIP.
Vous pouvez le choisir depuis le menu de configuration.

Personnaliser Odaiba

Vous pouvez surcharger les feuilles de style du squelette en ajoutant la vôtre.
Cette feuille de style devra s’appeler css/perso.css.
Il est recommandé de la déposer dans le répertoire squelettes/

Remarques

Le squelette est sur la zone. N’hésitez pas à contribuer en conservant à l’esprit de laisser le squelette aussi générique que possible.

updated on 28 April 2020

Discussion

9 discussions

  • 4

    Bonjour,
    Sur SPIP 3.2.8 [24473], la mise à jour du plugin « Métas + » (version : 2.3.8) mets le bazar avec le plugin « Odaiba » (version : 1.0.7).

    Fatal error: Can't use function return value in write context in /../../../../plugins/auto/metasplus/v2.3.8/metasplus_pipelines.php on line 47

    D’avance merci.

    • On dirait plutôt une erreur de metas+ .... Merci de consulter le forum de plugin metas+
      Cela ressemble à une erreur due à une vieille version de PHP

    • Oui, le pauvre Odaiba n’y est pour rien :)
      Ça sera corrigé dans la prochaine version de Métas +.

      (Quelle version de php au fait, pour être sûr ?)

    • Oui de « Métas + ». C’est bien une erreur de PHP. Merci pour la réactivité. Bien cordialement.

    • Je n’avais pas configuré PHP sur mon hébergement IONOS. Par défaut, il était sur PHP 5.4. Odaiba et Métas + fonctionnent à présent avec PHP 7.0 mais pas au-dessus. En tout cas pas chez IONOS. J’attends la prochaine version de Métas +, et je t’informe. si tu le souhaites.

    Reply to this message

  • 3

    Bonjour,
    merci pour ce très beau squelette. J’ai réussi à l’installer mais je ne comprends pas pourquoi le forum associé aux articles ne s’affiche pas. Merci d’avance pour votre aide.

    • Bonjour

      Pour l’instant, le squelette est vraiment minimal et ne gère pas les forums ....
      Si vous en avez vraiment besoin, on peut intégrer relativement facilement en reprenant les forums de squelette de base. Dites-moi.

    • OK, merci pour votre réponse.
      J’ai ajouté une balise #FORMULAIRE_FORUM au fichier inc_article_full.html et ça fonctionne !
      Par contre c’est un peu moche (voir PJ) et je ne sais pas trop comment améliorer cela ...

    • Regarde le squelettes-dist/article.html , il faut ajouter à inc/inc_article_full.html

      [(#REM) Forum de l'article ]
      <INCLURE{fond=inclure/forum,id_article} />
      [<h2 class="forum-titre"><:forum:form_pet_message_commentaire:></h2>
      (#FORMULAIRE_FORUM)]

      pour l’habillage, ajouter les CSS correspondantes à l ’habillage du forum que tu peux trouver dans squelettes-dist/css/theme.css

      N’hésitez pas à proposer cela sur le git du projet si c’est assez générique
      Bonne chance

    Reply to this message

  • 4
    cyrille daumesnil

    Bonjour,
    Je n’arrive plus en ce 27 avril 2020 à télécharger le fichier ZIP du plugin ? Merci.

    Reply to this message

  • 4
    Filipe

    Cher erational,

    Merci pour ce squelette. Simples et très beau. Premiere chose, j’ai traduit le fichier lang vers le portugais du Brésil. Comment envoyer le fichier traduit? Deuxièmement, je n’ai pas encore très bien compris comment montrer d’autres articles d’une rubrique dans un site construit sous Odaiba, comme l’exemple de l’image do site Alma. Comment ces belles puces apparaissent elles?

    • Hello Filipe

      Pour ajouter le fichier de langue, si tu connais git, tu peux la proposer sur
      https://git.spip.net/spip-contrib-squelettes/odaiba

      (Sinon je t’envoie un email perso)

      Pour les puces, il s’agit d’une simple astuce CSS

      dans style.css

      .article-preview-titre:before {
      	content: "▣ ";
      	color: #70a7d9;
      }
    • Filipe

      Salut erational,

      Merci pour la réponse. Est-ce que tu pourrais nous expliquer avec un peu plus de détail comment le plugin court circuit fonctionne avec Odaiba? Je ne comprends pas la navigation du site Alma63. Les liens du menu envoient toujours vers de articles? Pour la traduction, je peux t’envoyer par mail.

    • Le menu d’Odaiba liste uniquement les rubriques.

      Parfois on souhaite faire apparaitre 1 article dans le menu
      donc l’astuce consiste alors à avoir une rubrique avec un seul article mais cela génère une page intermédiaire avec un clic inutile

      Le plugin court-circuit permet d’éviter ce prblème en activant l’option “rediriger si la rubrique contient un seul article” (on peut mettre les autres options sur “non”)

      Ce qui donne la capture suivante.

    • Filipe Martins Aléssio

      Super! Merci beaucoup.

    Reply to this message

  • 1

    Bonsoir,
    J’ai pas encore testé ce squelette mais ça viendra.. le lien

    URL de démo : https://www.alma63.fr/ .
    semble mort.

    Reply to this message

  • 5

    Bonjour, je suis un débutant absolu,

    je connais un peu le fonctionnement des squelettes (html et css) et je voulais juste changer la couleur de la barre latérale, bleue, parce qu’elle ne va pas du tout avec mon logo (rouge vif) et je voulais savoir comment faire ? si j’ai bien compris passer par une feuille css nommée css/perso.css. mais après comment faire ?

    • Bonjour

      Il faut créer un nouveau fichier /squelettes/css/perso.css

      Pour passer en rouge, on “surcharge” (= on reprogramme) les éléments du squelette qui étaient en bleu en rouge.
      Ce qui donne

      /******************************************
       *
       * personnalisation du squelette odaiba
       *
       *
       *******************************************/
       
       
       
      /* barre laterale */
      .odaiba-aside {
      	background-color:#ff0000;
      }
       
      /* barre haute fixe */
      .navbar {
      	background-color: rgba(255, 0, 0, 0.77);
      }
       
      /* champs ps */
      .ps-wrapper {
      	background-color: #ffe1e1;
      	color: #aa0606;
      }
       
      /* liens */
      a {
      	color: #ef2b04;
      }
       
      a:hover {
      	color: #931800;
      }

      Ensuite, il faut vider le cache et recalculer ta page et ton site passe en rouge :)

    • Merci beaucoup erational, je fonce essayer ça !

    • énorme merci erationale ça a fonctionné parfaitement !

      http://litteralutte.com/

      par contre j’ai juste un problème avec la page d’accueil, j’ai défini la page que je voudrais dans le plugin odaiba, mais ça continue à m’afficher un 404...

      désolé pour le dérangement et encore merci !

    • c’est corrigé avec la version odaiba 1.0.5.

      Pensez bien à vider l’historique de votre navigateur pour avoir la bonne redirection de la page d’accueil sur l’article désigné comme article d’accueil.

    • La version 1.0.7 permet de personnaliser les couleurs principales directement dans le menu de configuration :)

    Reply to this message

  • Bonjour,

    Bravo, je viens de le tester en local en rajoutant les filtres pour le multilinguisme. Et ça marche parfaitement. Encore Bravo.

    Reply to this message

  • 5

    A l’installation, le plugin crée aussi

    un champs extra pour gérer les tris des rubriques

    pourquoi ne pas utiliser https://contrib.spip.net/Tri-des-articles-par-rubrique

    • Je n’ai pas testé le plugin tri des rubriques.
      Mais c’est une bonne suggestion.... j’essaie de l’intégrer à mon prochain squelette :)

      Edit: Cela me dérange un peu d’ajouter des plugins qui sont hors-zone. La démarche est un peu compliqué pour les ajouter dans SVP pour les débutants.

    • effectivement il n’y a pas de version 2.3.2 des cryaons. J’ai corrigé le plugin. Il faut attendre que la nouvelle version du zip soit corrigé, et cela devrait être bon.

    • Merci pour l’information.

    • installé aujourd’hui sans aucun problème. La correction de Maïeul a été prise en compte !
      Ce squelette est un petit bijou de simplicité. Comme toujours avec erational, c’est parfait. Merci.

    • Merci pour le retour :)

    Reply to this message

  • 2

    Bonjour, à l’activation du plugin, il m’est renvoyé le message ci-après :
    Le plugin Odaiba dépend du plugin CRAYONS ≥ 2.3.2.

    Reply to this message

Ajouter un commentaire

Who are you?
[Log in]

To show your avatar with your message, register it first on gravatar.com (free et painless) and don’t forget to indicate your Email addresse here.

Enter your comment here

This form accepts SPIP shortcuts {{bold}} {italic} -*list [text->url] <quote> <code> and HTML code <q> <del> <ins>. To create paragraphs, just leave empty lines.

Add a document

Follow the comments: RSS 2.0 | Atom