Pour pouvoir finaliser un site sur lequel je travaille actuellement (Les Mémoires du Touradon) j’avais besoin de trouver une solution pour mettre en page les articles afin qu’ils entrent parfaitement dans la mise en forme graphique du site.
Pour cela j’ai besoin de découper l’article en deux colonnes, l’une se trouvant sur la partie droite de la page et l’autre sur la partie gauche.
En cherchant sur le site de SPIP et celui de SPIP-CONTRIB j’ai trouvé cette solution [1].
Comme elle n’est pas complètement présentée sur le forum je me propose de le faire ici afin qu’elle puisse servir à tous ...
Pour voir la chose en action ...
Méthode utilisant un tableau pour l’affichage en 2 colonnes
1 - Créer le fichier mes_fonctions.php3 (si vous ne connaissez pas on en parle ici)
2 - Puis à l’intérieur de ce fichier copier/coller le code suivant :
3 - Enfin dans votre page article.html, au sein de votre squelette, vous remplacez le #TEXTE par [(#TEXTE*|afficher_en_colonnes|propre)].
4 - Lors de la rédaction de votre article, la césure de texte se fera en plaçant 5 tirets consécutifs dans votre texte.
5 - L’affichage actuel en tableau est généré par le code HTML compris dans le code contenu dans le fichier mes_fonctions.php3, j’y ai mis un espacement de 10% entre les deux colonnes. Il vous est possible de modifier cette mise en page en modifiant ces éléments.
Méthode utilisant une feuille de style pour l’affichage en 2 colonnes
1 - Créer le fichier mes_fonctions.php3 (si vous ne connaissez pas on en parle ici)
2 - Puis à l’intérieur de ce fichier copier/coller le code suivant :
3 - Enfin dans votre page article.html, au sein de votre squelette, vous remplacez le #TEXTE par [(#TEXTE*|afficher_en_colonnes_css|propre)].
4 - Puis installez ce code CSS dans l’un des fichiers de style que vous utilisez sur votre site (moi je l’ai mis dans le fichier habillage.css) afin de pouvoir diposer de la mise en page :
div.buzz span.colonnes {
float: left;
text-align: justify;
width: 42%;
padding: 3%;
}5 - La mise en page de vos colonnes ont tout intérêt à être vérifié après avoir écrit votre article afin que la première partie soit plus longue que la seconde (facilité de lecture) ...
Pour cela il vous suffit de placer correctement les 5 tirets qui feront la césure de votre texte.
Vos commentaires
# Le 27 avril 2010 à 09:06, par argotheme
En réponse à : Article sur 2 colonnes
Bonjour.
Je suis intéressé par la présentation des articles de la page d’accueil sommaire.html, en 2 colonnes, ET NON les articles entier sur leur page publique.
Comme vous le savez, en original la présentation des articles est un alignement : un après l’autre sous forme de liste avec le dernier publié en haut.
Je suis avec SPIP 1.9.1 et vraiment novice et « bidouilleur » avec des bouts de script. J’interviens avec Dreamveawer.
Mon modeste site est POPULI-SCOOP url : http://www.argotheme.com/organecyberpresse/
Capture d’écran en image ci-jointe
Merci d’avance.
# Le 21 août 2010 à 22:51, par argotheme
En réponse à : Article sur 2 colonnes
Salut...
C’est sur le sommaire.html et NON article.html que je suis intéressé par les 2 COLONNES.
Comme le montre la présentation (image) de l’accueil, c’est le sommaire pour qui c’est mieux présentable de mettre 2 colonnes.
Je cherche toujours le bout de script... Et l’emplacement exact où le mettre.
# Le 24 décembre 2011 à 13:05, par Michel
En réponse à : Article sur 2 colonnes
Bonjour...
J’arrive peut-être un peu tard... Quoique, je viens de cliquer sur le site il et toujours sur une colonne....
Voilà ma solution "provisoire.. un peu de bon vieux html dans le squelette sommaire.html. (dans le « bloc-contenu »)
On peut bien sûr mettre directement ses boucles dans le squelette, mais cette solution est plus élégante.
Cela implique aussi de modifier (dans le fichier de style) la largeur de l’ensemble .. (au moins 950 pixels sinon, les 2 colonnes seront trop étroites si on conserve la 3° colonne de droite existante)
Je réfléchis à une solution encore plus élégante en CSS (en appelant pour ce squelette des divisions à l’intérieur du bloc-contenu), mais je me suis heurté pour le moment aux incompatibilités de IE.... donc je laisse en l’état... mais si quelqu’un a une solution, je suis preneur !!!
Répondre à ce message
# Le 20 septembre 2009 à 01:03, par ?
En réponse à : Article sur 2 colonnes
Bonjour,
Comme cette fonction a l’air de fonctionner sous toutes les versions de SPIP, je l’essaye donc sous la 2.0.9. Or, il s’avère que je ne parviens pas à faire fonctionner la bête. J’ai droit à un beau cadre Erreur : filtre « afficher_en_colonnes » non défini sur la page article.
Or, dites moi si je me trompe, je prends le code tel qu’il est et je le place dans un fichiers mes_fonctions.php dans le répertoire de mon squelette. Est bien ça ?
Merci d’avance pour vos réponses.
Honorius
Répondre à ce message
# Le 5 juillet 2005 à 12:30, par Le Joker
En réponse à : > oui mais
ca oblige d’ajouter « à la main » une césure (-----) au milieu de l’article !
Sur un site de 10000 articles, tu vois le boulot ???
sur le site du herald tribune ( les stories) ils ont trouvé une solution en javascript qui permet un affichage 3 colonnes de manière dynamique. Je me casse le nez dessus pour le moment mais si je trouve le moyen de coder un équivalent en php, il y aura un beau filtre à la clé
# Le 23 décembre 2006 à 21:44, par robomatix
En réponse à : > oui mais
As tu réussi à créer ce filtre miracle ?
Si oui, je suis intérressé !
Répondre à ce message
# Le 24 mars 2007 à 17:09, par poiraud
En réponse à : Article sur 2 colonnes
Bonjour
C’est la page plan.html que je voudrais mettre en deux colonnes
alors je N’ai nulle part #TEXTE
donc je ne sais pas où appliquer le filtre !
Comment puis-je faire ?
Merci !
b.poiraud@wanadoo.fr
# Le 24 mars 2007 à 20:53, par buzz
En réponse à : Article sur 2 colonnes
Salut !
Ce filtre n’est pas conçu à l’origine pour la mise en page en 2 colonnes d’une page plan d’un site sous SPIP mais plutôt pour une page article voir même une page rubrique incluant un article ...
Pour faire une mise en page de ta page plan il va falloir jongler plus sur les définitions de tes boucles et un peu de css pour faire apparaître ça sur 2 colonnes !
Répondre à ce message
# Le 31 mars 2006 à 15:22, par fredbref
En réponse à : Article sur 2 colonnes
N’y a t il pas moyen d’éviter les 5 tirets ? et que le texte se divise automatiquement ?
Si je mets 5 tirets « trop tôt » par exemple, dans la colonne de gauche j’aurais un blanc qui pourrait paraître inoportun alors que la colonne de droite irait bien jusqu’au bout de ma page...
# Le 31 mars 2006 à 20:52, par buzz
En réponse à : Article sur 2 colonnes
Salut !
Non je n’ai pas cherché à faire ce genre de modifications.
Répondre à ce message
# Le 15 février 2006 à 22:35, par Nicolas Krebs
En réponse à : Article sur 2 colonnes
Je précise que ma proposition de solution était elle-même inspirée de Découper un article en plusieurs pages.
Répondre à ce message
# Le 9 novembre 2005 à 23:45, par Eric02
En réponse à : Article sur 2 colonnes
Bonsoir Buzz
J’utilise ta contrib sur un site, j’ai opté pour la solution via les css ...
Alors que cela fonctionne nickel sous fifox ... je n’ai qu’une colonne (de la largeur voulu dans le css) sous IE.
De quoi cela peut il provenir ?
Amicalement
eric
Répondre à ce message
# Le 20 juin 2005 à 15:24, par ?
En réponse à : > Article sur 2 colonnes
Bonjour
Je viens de lire ton article et tout de suite une question ...
2 colonnes ... mais ce n’est pas limitatif, ??? Si je veux trois col ?
Autre plus en modifiant non pas le squel de l’aricle mais d’une rubrique ton filtre est il aussi applicable ou necessite il une adaptation, je pense que tu as du tester cela
Merci pour le « beau travail »
Amicalement
eric
Répondre à ce message