HTML5UP Hyperspace V3

This contribution or plugin is actually being tested. Issues may occur, don’t hesitate to report those in following post’s comments.

Adaptation pour SPIP du squelette «Hyperspace» de html5up https://html5up.net/hyperspace

Accueil
Accueil
Article
Article

Installation

Ce plugin s’installe comme tous les plugins. Voir http://www.spip.net/fr_article3396.html

Il nécessite les plugins Adaptive Images, Saisies, PROGRAMME (en chantier) et ZCore.

Notes importantes :
Pour fonctionner, il faut activer les URL « propres » dans SPIP (menu Configuration > Configurer les URLs) et activer le fichier .htaccess de SPIP. Il faut également que le plugin Adaptive images soit configuré pour utiliser la méthode srcset + (HTML5).

Configuration

La configuration du plugin est accessible via le menu Squelettes > HTML5up Hyperspace

Page d’accueil

Il est possible de choisir l’image d’entête : via la médiathèque (menu Édition > Documents), ajouter un nouveau document puis, dans la page de configuration, indiquer le numéro de ce document.

Il est possible de choisir la rubrique qui sera affichée sous forme de grille ainsi que l’ordre d’affichage de ses articles en inverse chronologique par exemple pour une rubrique actualités ou blog.

Personnalisation

La feuille de style css/perso.css sera prise en compte pour personnaliser l’affichage sans perdre les mises à jour possibles. Idem pour les javascripts avec le fichier javascript/perso.js-

Modèles

Les modèles bouton et icone permettent d’afficher, dans le contenu, des boutons et icônes avec Font Awesome (liste des icônes disponibles).

Bouton (icône et texte avec lien dans un bloc encadré)

<bouton|icone=fa-heart|primary=oui|iconetexte=le texte|lien=https://www.domaine.net>

Icône (icône avec lien et texte alternatif)

<icone|icone=fa-heart|iconetexte=le texte|lien=https://www.domaine.net>

Plugins facultatifs

Identité Extra

L’activation du plugin Identité Extra affichera, en bas de la page, les informations de contacts.

Liens sociaux

Le plugin Liens vers les réseaux sociaux permet d’utiliser des liens et des icônes adéquates vers les réseaux utilisés.
Note : Il faut “Activer l’habillage graphique de la barre de liens avec la feuille de style basée sur la police socicon”.

Formulaire de contact

Le plugin Formulaire de contact avancé permet d’ajouter facilement un formulaire en pied de page de la page d’accueil.

Mailsubscribers / Newsletter

Si le plugin Mailsubscribers est installé, on affiche le formulaire d’inscription à la newsletter. A votre charge de créer la liste newsletter (voir la doc de Newsletters)

Le Plugin Menus permet d’ajouter un menu dans le pied de page : créer un nouveau menu avec l’identifiant pied et il apparaîtra automatiquement.

Les autres squelettes HTML5 UP

Le site html5up.net propose de beaux thèmes dont certains ont été adaptés pour SPIP. Voyez la liste des squelettes HTML5Up adaptés pour SPIP.

updated on 30 April 2020

Discussion

Une discussion

  • 8

    Bonjour,
    J’ai suivi précisément le mode d’installation.
    Je coince à “La configuration du plugin est accessible via le menu Squelettes > HTML5up Hyperspace”.
    Je ne vois pas Hyperspace dans la liste des plugins.
    Je ne vois pas Hyperspace dans le menu Squelettes.
    SPIP 3.2.7, tous plugins mis à jour.
    /plugins/auto/html5up_hyperspace.
    J’ai oublié quelque chose ?
    Merci.

    • Je ne comprends pas non plus ce que signifie la demande d’installation du plugin “PROGRAMME (en chantier) [de]” qui amène vers une page de texte.
      Merci.

    • Bonjour Perline,

      si le plugin n’apparait pas dans la liste des plugins, c’est qu’il n’est pas installé (problème à l’installation, au téléchargement...). Retente peut-être la manip.
      Est-ce que tu as une adresse que je regarde ?

      Pour ce qui est de la demande d’installation, ça n’est pas lié au plugin, tu peux voir les seuls par là https://git.spip.net/spip-contrib-squelettes/html5up_hyperspace/src/branch/master/paquet.xml#L20

    • Après une bonne sieste, donc, si j’ai bien le plugin activé et tout ça.
      En revanche, dès la page d’accueil j’ai des erreurs du plugin zcore :
      1 Aucun squelette head/ n’est disponible... plugins/auto/zcore/v2.8.7/structure.html/14
      2 Aucun squelette head_js/ n’est disponible... plugins/auto/zcore/v2.8.7/structure.html/14
      3 Aucun squelette footer/ n’est disponible... plugins/auto/html5up_hyperspace/body.html

      Quel serait le problème ?
      Merci.

    • Je viens de tester une installation et je ne reproduis pas le problème.
      Est-ce un SPIP neuf ? Est-ce qu’il y a d’autres plugins installés ? ou un fichier mes_options.php ou mes_fonctions.php qui serait en conflit ?

    • Non, ce n’est pas un SPIP neuf, j’ai annulé le dossier /squelettes, donc pas de surcharge à ce niveau
      là.
      Oui, il y a de nombreux autres plugins.
      Pas de fichier mes_options.php ou mes_fonctions.php.
      Le cache a été vidé.
      De plus, la page d’accueil affiche une erreur 404.
      Y a-t’il un rapport ?
      Merci.

    • Dans l’erreur

      Aucun squelette footer/ n’est disponible
      plugins/auto/html5up_hyperspace/body.html	
      boucle  /  	
      page 20

      La ligne 20 est

      <INCLURE{fond=footer/#ENV{type-page},env} />

      Et je ne vois pas où serait le squelette footer.html
      Il y a bien un dossier /footer mais dedans un fichier dist.html.

    • Il semble y avoir un autre problème non lié à Hyperspace. Il faudrait d’abord le régler en désactivant tous les autres plugins avant de l’installer, puis les remettre un par un pour comprendre d’où vient le souci.

    • En effet, les plugins Zpip-dist v1 et Bazar créent des erreurs.
      Certes, vous allez me dire qu’ils ne sont pas utiles quand on utilise hyperspace, mais comme j’ai fait des tests de plusieurs squelettes (avant que cette version d’hyperspace que j’avais et que j’aime bien ne soit mise à jour), je n’ai pas enlevé les plugins dont je n’avais pas besoin.
      Sinon il semble bien que tout marche correctement.
      Désolée du dérangement.
      Et merci beaucoup de cette mise à jour :)

    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