Ajout d'une image alignée droite / gauche dans une news

[Mak-B]

Voili, une question qui je pense devraient en intéréssé plus d'un!
Je suis intéréssé par le système de News De SMF, cad que seuls les admins et certains membres du groupe ne peuvent que poster et les autres seulement y répondre! Tout celà j'y arrive mais là maintenant où je bloque, c'est la Mise en forme de mes news!! J'aimerais que mes news puissent arriver comme cela sur ma page d'accueil:
http://www.presence-pc.com/news/n4647.html (ceci est un exemple)
Donc en fait ce que je n'arrive pas a reproduire sr SMF c'est d'avoir mon image sur la droite ainsi que l'espace entre le texte et l'image!
Si je vais sur leur forum regarder la source:

<p align="justify"><img style="MARGIN: 6px" alt="" src="http://www.presence-pc.com/images/apple-logo-red.jpg" align="right" border="0" />La société américaine ......</p>

J'ai activé l'option Html basique mais rien n'y fait, j'ai essayé plusieurs combinaisons même mais rien n'y fait!
Si quelqu'un aurait une solution, car cette option m'interesse grandement car elle donne un aspect propre a la news.
Par ailleurs, en meme temps que je cherchais la solution je me suis appercu qu'il n'y avait pas l'option icone "justify". Simple oubli ou est ce normal?
Merci d'avance!!!!!




[size=0]# Edit par Ap2: changement de titre, plus explicite [/size]

[evolus]

Je suis curieux de connaitre la solution, toutes ces options intéractives ne sont en effet pas bien claires...
Et ca m'interesse également beaucoup de connaitre tout ceci

[Percherie]

Je viens de me prendre la tete sur ton probleme, je ne pensse pas avoir répondu entièrement à ta question mais aprés ça tu me dira ce qu'il te manque parceque j'ai pas tout saisi

Donc pour afficher des news venant de ton forum voici ce que tu doit faire pour que ça fonctionne (le peut que j'ai compris est ci-dessous) :

- Crée une salle où seul une certaine catégorie de membre peut poster pour eviter les abus, par exemple admin et global modérateur
- relève le numéro de ta salle, indiqué dans l'URL de cette façon dans cet exemple j'ai pris cette salle qui est la numéro 14

http://www.simplemachines.org/community/index.php?board=14.0

- pour inclure ta news utilise cette portion de code (l'adresse du require est un exemple) :

Code Select Expand


<?php 
require("c:\program files\easyphp1-7\www\forum/SSI.php");
ssi_boardNews(1.0,2,0,0);
?>


ce qui ce trouve dans "ssi_boardNews(1.0,2,0,0)" ce compose comme suis et est séparé par des virgules :
Position 01 : n° du forum (ici 1.0)
Position 02 : nbr de news à afficher (ici 2)
Position 03 : n° de la première new (si y en a plusieurs) 0 pour la dernière, 1 pour l'avant dernière et ainsi de suite
Position 04 : nbr de caractère affichés avec "0" pour aucune limite

Il existe un 5° parametre permettant de choisir la façon dont est envoyer la news, par default avec la fonction echo( ) mais je ne vois pas encore l'utilité de changer ce parametre.

Faite des tests et si aprés tout ça il y a encore des questions, faite moi signe

[Alexandre P.]

En ce qui concerne l'ajout de l'image, je crois bien que c'est impossible d'origine.  Après tout, il est vrai que originalement SMF n'est pas un système de news, mais bien un script de forum.

Ce que je te propose, c'est d'ajouter un tag BBCode pour aligner une image sur la gauche ou sur la droite.

Dans /Sources/Subs.php, ajouter à la ligne 776:

Code Select Expand

// BBCode - Images sur les côtés
'/\[img pos=l\](?:<br \/>)?(.+?)(?:<br \/>)?\[\/img\]/i',
'/\[img pos=r\](?:<br \/>)?(.+?)(?:<br \/>)?\[\/img\]/i',
'/\[img width=([0-9]+) height=([0-9]+)\s* pos=l\](?:<br \/>)?(.+?)(?:<br \/>)?\[\/img\]/i',
'/\[img width=([0-9]+) height=([0-9]+)\s* pos=r \](?:<br \/>)?(.+?)(?:<br \/>)?\[\/img\]/i',
et, toujours dans /Sources/Subs.php, à la ligne 860:

Code Select Expand

                        // Translation - Image sur les côté
                        '<div style="float: left; margin: 6px"><img src="$1" alt="" border="0" /></div>',
                        '<div style="float: right; margin: 6px"><img src="$1" alt="" border="0" /></div>',
                        '<div style="float: left; width: '.$1.'px height: '.$2.'px; margin: 6px"><img src="$3" alt="" border="0" width="$1" height="$2" /></div>',
                        '<div style="float: right; width: '.$1.'px height: '.$2.'px; margin: 6px"><img src="$3" alt="" border="0" width="$1" height="$2" /></div>',



Ce qui te permettra d'insérer des images flotantes à gauche ou à droite, avec un des tag suivant:

Code Select Expand

[img pos=l]http://www.monsite.com/monimage.png[/img]
[img pos=r]http://www.monsite.com/monimage.png[/img]
[img width=(largeur) height=(hauteur) pos=l]http://www.monsite.com/monimage.png[/img]
[img width=(largeur) height=(hauteur) pos=r ]http://www.monsite.com/monimage.png[/img]

J'ai pas testé, mais ça devrait fonctionner

[Mak-B]

Merci Percherie pour tes explications de plus sur le SSI, je ne voyais pas la chose ainsi et je me tortuais avec les exemples, et là tu me donnes vraiment ce que je voulais! Un grand merci!!!
AP2, j'ai appliqué tes codes et le résultat ne fonctionnait pas, par contre j'ai réutilisait tes prtions de codes et j'ai fait ça:

Dans /Sources/Subs.php, ajouter à la ligne 776:

Code Select Expand

// BBCode - Images sur les côtés
'/\[img pos=l\](?:<br \/>)?(.+?)(?:<br \/>)?\[\/img\]/i',
'/\[img pos=r\](?:<br \/>)?(.+?)(?:<br \/>)?\[\/img\]/i',

Dans /Sources/Subs.php, ajouter à la ligne 776:

Code Select Expand

                     // Translation - Image sur les côté
'<img src="$1" style="MARGIN: 6px" alt="" border="0" align="left" />',
'<img src="$1" style="MARGIN: 6px" alt="" border="0" align="right" />',

Code a rentrer sur votre page:

Code Select Expand

[img pos=l]http://www.monsite.com/image.jpg[/img]Votre image sera calé a gauche blabla bla bla blabalbalbla blabla bla bla blabalbalbla blabla bla bla blabalbalbla blabla bla bla blabalbalbla blabla bla bla blabalbalbla blabla bla bla blabalbalbla blabla bla bla blabalbalbla

ou

[img pos=r]http://www.monsite.com/image.jpg[/img]ici votre image a droite blabla bla bla blabalbalbla blabla bla bla blabalbalbla blabla bla bla blabalbalbla blabla bla bla blabalbalbla blabla bla bla blabalbalbla blabla bla bla blabalbalbla blabla bla bla blabalbalbla
et là le résultat marche!!! Reste plus qu'a rajouter le code pour changer la valeur du margin dans la balise img!!
Une chose impérative pour que cela marche:
Metter votre balise IMG avant le texte et non pas apres ou entre sinon le résultat n'ait pas le même!!!
Voilà reste plus qu'a essayer avec la fonction SSI pour voir si l'image remonte bien...
Enjoy les amis
Un grand merci a AP2 et Percherie pour l'aide et le dévellopement de ce forum
Dommage que je ne puisse pas attacher l'image du résultat sur la page, tout le monde aurait compris l'intérêt de cette fonction.... en tout cas je crois qu'elle devrait remonter aux oreilles des devellopeurs, ce serait un plus pour le forum!
J'ai vu des images du portail et on dirait qu'ils ont bien rajouté la fonction "Justifié" en tout cas sur la RC1 c'est pas encore le cas!!! Vais voir si on peut pas le rajouter en fonction, j'ai du mal a y croire vu mes compétances en programmation!!! Elle irait bien avec ce systeme de news justement, le texte collerait mieux à l'image!

PS:
Le forum est sortit en RC1 pour le public, et là GLOUP les fonctions dans le sub ne sont pas les mêmes...AP2, je crois que je vais avoir besoin encore de ton aide!!! Et encore merci pour tout!

[Mak-B]

Je viens de tester l'option SSI en local avec le code suivant:

Code Select Expand

<?php 
require("c:\program files\easyphp1-7\www\forum/SSI.php");
ssi_boardNews(1.0,2,0,0);
?>

ET l'option marche parfaitement!!!
Je m'en vais de ce pas créer des options pour la balise alt et Margin!
Bref c'est impeccable, nul besoin de passer sous un autre forum!!
SMF Powaaaaaaaaaaaaaa

[Mak-B]

Bon,  j'ai trouvé  la ligne à modifier sur la version RC1 car je pense que la version finale adoptera ce code (espérons le):
Ligne 811 dans le Subs.php:

Code Select Expand

// An image.  Width and height can be are optional.
'~\[img(\s+width=([\d]+))?(\s+height=([\d]+))?\s*\](?:<br />)*(.+?)(?:<br />)*\[/img\]~ei' => '\'<img src="$5" alt=""\' . (\'$2\' != \'\' ? \' width="$2"\' : \'\') . (\'$4\' != \'\' ? \' height="$4"\' : \'\') . \' border="0" />\'',

Rajouter a la ligne 813, toujours dans le Subs.php:

Code Select Expand

// Image calé a droite ou a gauche
'~\[img pos=(.+?)\](.+?)\[/img\]~ei' => '\'<img src="$2" style="MARGIN: 6px" alt="" border="0" align="$1"/>\'',
Changer la valeur du margin pour que votre texte colle plus ou moins a votre image!!!!

Je l'ai vite fait, mais cette option vise a ce que vous soyez vigilant quand vous taperez votre code dans votre sujet:
Pour l'image à droite:

Code Select Expand

[img pos=right]http://site.com/image.jpg[/img]Votre texte
pour l'image à gauche:

Code Select Expand

[img pos=left]http://site.com/image.jpg[/img]Votre texte
En attendant une autre solution sur laquelle je planche en y ajoutant la largeur et hauteur, ce ci est une bonne alternative, qui de plus est marche aussi sur le SSI!!!

[andrea]

Did I understand right that you modified "Sources/Subs.php" for images alignment of your news? Quite sure you can achieve your alignement without source modifications.

[Alexandre P.]

What Mak-B wanted to do it to have an image aligned right or left to the text of his news, for example like on www.slashdot.org.  There are images next to the text.  Is there a way to add something like that wothout modifying anything?

What I suggested, is to create a specific BBCode for that function.  And the creation of a new BBCode needs to modify Subs.php...

[[Unknown]]

Bon,  j'ai trouvé  la ligne à modifier sur la version RC1 car je pense que la version finale adoptera ce code (espérons le):
Ligne 811 dans le Subs.php:

Code Select Expand

// An image.  Width and height can be are optional.
'~\[img(\s+width=([\d]+))?(\s+height=([\d]+))?\s*\](?:<br />)*(.+?)(?:<br />)*\[/img\]~ei' => '\'<img src="$5" alt=""\' . (\'$2\' != \'\' ? \' width="$2"\' : \'\') . (\'$4\' != \'\' ? \' height="$4"\' : \'\') . \' border="0" />\'',

Rajouter a la ligne 813, toujours dans le Subs.php:

Code Select Expand

// Image calé a droite ou a gauche
'~\[img pos=(.+?)\](.+?)\[/img\]~ei' => '\'<img src="$2" style="MARGIN: 6px" alt="" border="0" align="$1"/>\'',
Changer la valeur du margin pour que votre texte colle plus ou moins a votre image!!!!

Je l'ai vite fait, mais cette option vise a ce que vous soyez vigilant quand vous taperez votre code dans votre sujet:
Pour l'image à droite:

Code Select Expand

[img pos=right]http://site.com/image.jpg[/img]Votre texte
pour l'image à gauche:

Code Select Expand

[img pos=left]http://site.com/image.jpg[/img]Votre texte
En attendant une autre solution sur laquelle je planche en y ajoutant la largeur et hauteur, ce ci est une bonne alternative, qui de plus est marche aussi sur le SSI!!!

I may warn you that this could cause possible security problems.  I suggest:

Code Select Expand

'~\[img pos=(?:left|right)\](.+?)\[/img\]~i' => '<img src="$2" style="margin: 6px; float: $1;" alt="" border="0" />',

-[Unknown]

[Percherie]

Je sais pas ce qui ce passe avec ce post mais ça fait planter Mozilla 1.6, tout le pc bloque et je peut visiter ce msg qu'avec IE

[Alexandre P.]

I may warn you that this could cause possible security problems. I suggest:

Code Select Expand

'~\[img pos=(?:left|right)\](.+?)\[/img\]~i' => '<img src="$2" style="margin: 6px; float: $1;" alt="" border="0" />',

-[Unknown]

Ok, thanks,

Pour ceux qui n'auraient pas compris, la solution de Mak-B peut causer des problèmes de sécurité.  Le code suivant devrait faire l'affaire:

Code Select Expand

'~\[img pos=(?:left|right)\](.+?)\[/img\]~i' => '<img src="$2" style="margin: 6px; float: $1;" alt="" border="0" />',

Toutjours accessible donc de la manière [img pos=left] ou [img pos=right]

Je sais pas ce qui ce passe avec ce post mais ça fait planter Mozilla 1.6, tout le pc bloque et je peut visiter ce msg qu'avec IE

Upgrade à Mozilla 1.7.2, pour deux raisons:
1) C'est le même problème qu'avec Firefox 0.8: ce sont les balises de code qui causent le problème.  Le problème a été réglé dans FF 0.9 et Mozilla 1.7.
2) Des problèmes de sécurité importants ont été découverts dans Firefox 0.9.1 et 0.9.2 et Mozilla 1.7 et 1.7.1 pour Windows.  Ils sont corrigés dans Firefox 0.9.3 et Mozilla 1.7.2.

[Mak-B]

Heureux que les devellopeurs s'interessent a mon post, en tout cas la réponse que m'a donné Unknown ne marche pas, avrai dire l'image ne s'affiche pas et pour cause voici la source de mon post au niveau de la balise IMG!
Code tapé dans le subs:

Code Select Expand

'~\[img pos=(?:left|right)\](.+?)\[/img\]~i' => '<img src="$2" style="margin: 6px; float: $1;" alt="" border="0" />',
Code taper dans mon post:

Code Select Expand

[img pos=right]http://localhost/smf/Mak-B.jpg[/img]
Résultat dans ma page (source):

Code Select Expand

<img src="" style="margin: 6px; float: http://boombastic/smf/Mak-B.jpg;" alt="" border="0" />

Je cherche d'ou cela peut venir!!!!

[Mak-B]

Je viens de trouver l'erreur et me suis inspiré des balises color
ce n'est pas

Code Select Expand

'~\[img pos=(?:left|right)\](.+?)\[/img\]~i' => '<img src="$2" style="margin: 6px; float: $1;" alt="" border="0" />',
mais

Code Select Expand

'~\[img pos=(left|right)\](.+?)\[/img\]~i' => '<img src="$2" style="margin: 6px; float: $1;" alt="" border="0" />',
Bref sans le ?:, et là tout refonctionne a merveille, par contre je voudrais savoir si ma rectification du code est bien valide, pas comme la premiere que j'avais fait vite fait!!
Tanks Everybody