Membres connectés récemment
[PHPBB3] Photos ayant reçu 1 j'aime (Best)
2 participants
Page 1 sur 1
- Version du forum :PHPBB3
- Templates modifiés :oui
- Navigateur :Firefox
Bonjour à tous les milouziens,
Un moment que je n'avais pas fait de demande, faute de nouvelles idées pour mon forum.
En espérant que celle-ci soit réalisable.
Serait-il possible d'ajouter un bouton sur la page d'accueil au niveau du forum phototest?
Ce bouton aurait pour fonction lorsque l'on clique dessus de faire apparaitre sur une page les photos de ce forum ayant reçu au moins 1 j'aime (baptisé Best sur mon fofo).
Les photos présentées feraient 300px maxi de haut sur 300px de large maxi.
L'image du bouton:
Au passage de la souris sur ce bouton, l'infobulle serait: "Voir les photos ayant reçu un Best".
Merci pour votre aide.
Un moment que je n'avais pas fait de demande, faute de nouvelles idées pour mon forum.
En espérant que celle-ci soit réalisable.
Serait-il possible d'ajouter un bouton sur la page d'accueil au niveau du forum phototest?
- Spoiler:
Ce bouton aurait pour fonction lorsque l'on clique dessus de faire apparaitre sur une page les photos de ce forum ayant reçu au moins 1 j'aime (baptisé Best sur mon fofo).
Les photos présentées feraient 300px maxi de haut sur 300px de large maxi.
L'image du bouton:
Au passage de la souris sur ce bouton, l'infobulle serait: "Voir les photos ayant reçu un Best".
Merci pour votre aide.
Bonjour Philippe,
Ravi de revenir par ici.
Le lien du forum phototest:
https://photoclic.forum-pro.fr/f4-phototest#M14
Ravi de revenir par ici.
Le lien du forum phototest:
https://photoclic.forum-pro.fr/f4-phototest#M14
Ravi de te revoir aussi sur le fofo,
je m'ennuyais de tes photos .
En espérant qu'il n'y ait qu'une photo sur le premier message car j'ai fait mes essais ainsi.
Alors par contre, on va importer les photos ayant reçu au moins 1 Best
mais juste sur la première page de cette liste de sujets:
https://photoclic.forum-pro.fr/f4-phototest
Comme on importe avec un get:
la deuxième page étant ainsi:
https://photoclic.forum-pro.fr/f4p30-phototest
On ne pourra pas faire autrement Serge .
Le résultat imagé:
Chaque widget aura le titre et son lien et au survol affichera le titre du sujet car j'ai pensé a ajuster le titre en fonction de sa longueur.
Alors il faut créer une page html :
Titre * : Importation Photos best ( ou autre chose)
Voulez-vous utiliser le haut et le bas de page de votre forum ? Oui
Utiliser cette page en tant que page d'accueil ? Non
Déposes tout ce contenu:
Penses a valider la nouvelle page créée en cliquant sur
J'ai pensé aussi à écarter ta fameuse div ayant la class:(M14_reception_photos)
Repères ensuite l'url de la page html:
Exemple:
https://testphpbb3.1fr1.net/h35-importation-photos-best
Puis le script ou il faudra modifier le lien ci-dessus par le lien de ta page html:
Modules/HTML&JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript
Mets un titre explicite.
Coches sur l'index.
Déposes ceci:
Penses a cliquer sur le bouton
Puis on place le bouton:
Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style
Ajoutes ceci:
Penses a cliquer sur le bouton
Et voilou
je m'ennuyais de tes photos .
En espérant qu'il n'y ait qu'une photo sur le premier message car j'ai fait mes essais ainsi.
Alors par contre, on va importer les photos ayant reçu au moins 1 Best
mais juste sur la première page de cette liste de sujets:
https://photoclic.forum-pro.fr/f4-phototest
Comme on importe avec un get:
- Code:
$.get('/f4-phototest' , function(data){
la deuxième page étant ainsi:
https://photoclic.forum-pro.fr/f4p30-phototest
On ne pourra pas faire autrement Serge .
Le résultat imagé:
Chaque widget aura le titre et son lien et au survol affichera le titre du sujet car j'ai pensé a ajuster le titre en fonction de sa longueur.
Alors il faut créer une page html :
Titre * : Importation Photos best ( ou autre chose)
Voulez-vous utiliser le haut et le bas de page de votre forum ? Oui
Utiliser cette page en tant que page d'accueil ? Non
Déposes tout ce contenu:
- Code:
<div class="M14_best_like">Les bests ayant reçu un Best</div>
<style>
/*Le titre en haut de page*/
.M14_best_like{width:100%;text-align:center;color:#20aec8;font-size:18px;display: inline-block;height: 30px;line-height: 30px;margin: 15px 0px 15px 0px;}
#main-content{height:auto;}
/*le bloc recevant les widgets*/
.M14_importation{width:100%;min-height:750px;max-height:3000px;height:auto;text-align:center;}
/*Les widgets*/
div.M14_importation_widget{float:left;width:350px;height:370px;margin:2px;text-align:center;border:2px solid #20aec8;}
/*Les titres de sujet*/
a.M14_link
{
color:#20aec8!important;
font-size:12px!important;
width:300px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
display: inline-block;
}
/*les photos*/
img.M14_photo{max-width:300px;max-height:300px;margin-top: 20px;}
/*les pseudos*/
span.M14_auteur{color:#20aec8!important;font-size:12px!important;top: 15px;position: relative;}
/*la fenetre patienter*/
.M14_load{color:#20aec8;font-size:24px;}
</style>
<script>
$(function(){
var $this=$('.M14_importation');
$.get('/f4-phototest' , function(data){
$(data).find('ul.topiclist.topics.bg_none li').each(function(){
var a=$(this).find('a.topictitle').attr('href');
$.get(a, function(data){
$(data).find('div[class*="post--"]:first').each(function(){
var b=$(this).find('.postbody h2.topic-title a[href^="/t"]').text();
var link=$(this).find('.postbody h2.topic-title a[href^="/t"]').attr('href');
var c=$(this).find('.fa_like_list a[href^="/u"]').length;
var photo=$(this).find('.postbody .content div:not(.M14_reception_photos) img:not([longdesc])').attr('src');
var auteur=$(this).find('.postbody').find('p.author a[href^="/u"]').text();
if(c&&photo)
{
$('.M14_load').fadeOut();
$this.append('<div class="M14_importation_widget"><a class="M14_link"href="'+link+'" title="Voir le Best: '+b+'">'+b+'</a><br /><img class="M14_photo"src="'+photo+'"/><br /><span class="M14_auteur">Posté par: '+auteur+'</span></div>');
}
});});});});
});
</script>
<div class="M14_importation"><span class="M14_load">Merci de patienter..</span></div>
Penses a valider la nouvelle page créée en cliquant sur
J'ai pensé aussi à écarter ta fameuse div ayant la class:(M14_reception_photos)
Repères ensuite l'url de la page html:
Exemple:
https://testphpbb3.1fr1.net/h35-importation-photos-best
Puis le script ou il faudra modifier le lien ci-dessus par le lien de ta page html:
Modules/HTML&JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript
Mets un titre explicite.
Coches sur l'index.
Déposes ceci:
- Code:
$(function(){
$('ul.topiclist.forums').each(function(){
var $this=$(this);
var a=$(this).find('.forumtitle[href="/f4-phototest#M14"]').length;
if(a)
{
$this.find('dd.dterm div').after('<a href="https://testphpbb3.1fr1.net/h35-importation-photos-best"><img class="M14_get_PhotOs" src="https://i.servimg.com/u/f31/19/32/37/01/27357311.png" title="Voir les photos ayant reçu un Best"/></a>');
}
});});
Penses a cliquer sur le bouton
Puis on place le bouton:
Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style
Ajoutes ceci:
- Code:
img.M14_get_PhotOs
{
margin-top: -26px;
position: absolute;
margin-left: 40%;
}
Penses a cliquer sur le bouton
Et voilou
Ravi de te retrouver aussi Philippe.
Toujours aussi rapide et efficace tu es.
Alors c'est en place et tu es en mode admin si tu veux voir.
Pas de souci pour ne prendre que sur la première page.
Il peut y avoir plusieurs photos sur le 1ier message, mais ne prendre que la première n'est pas génant.
Le css ne s'appliquait pas pour le bouton, il manquait le a pour la classe du bouton. Je l'ai ajouté.
Par contre, le bouton s'affiche sur tous les forums de la catégorie et pas seulement sur le forum Phototest.
Dans le html, le titre de la photo s'affiche en double.
Quand la photo est en mode paysage et celle d'à coté en mode portrait (plus haute que large), "Posté par; l'auteur" sort du cadre.
Voila Phil après mes 1ier essai, et un grand merci pour ce nouveau développement.
Toujours aussi rapide et efficace tu es.
Alors c'est en place et tu es en mode admin si tu veux voir.
Pas de souci pour ne prendre que sur la première page.
Il peut y avoir plusieurs photos sur le 1ier message, mais ne prendre que la première n'est pas génant.
Le css ne s'appliquait pas pour le bouton, il manquait le a pour la classe du bouton. Je l'ai ajouté.
- Code:
a img.M14_get_PhotOs
Par contre, le bouton s'affiche sur tous les forums de la catégorie et pas seulement sur le forum Phototest.
Dans le html, le titre de la photo s'affiche en double.
Quand la photo est en mode paysage et celle d'à coté en mode portrait (plus haute que large), "Posté par; l'auteur" sort du cadre.
Voila Phil après mes 1ier essai, et un grand merci pour ce nouveau développement.
Re Serge,
alors j'ai corrigé le code permettant d'importer les widgets car
il y avait le lien d'une image de smileys .
La page html est de nouveau fonctionnelle serge et je t'ai rajouté le nombre de like a côté du sujet.
Tu peux faire un best sur ce cas de figure Serge que je regarde
Ne touche pas à la page html
Ah ben merdouille je me disais aussi
alors j'ai corrigé le code permettant d'importer les widgets car
il y avait le lien d'une image de smileys .
La page html est de nouveau fonctionnelle serge et je t'ai rajouté le nombre de like a côté du sujet.
Quand la photo est en mode paysage et celle d'à coté en mode portrait (plus haute que large), "Posté par; l'auteur" sort du cadre.
Tu peux faire un best sur ce cas de figure Serge que je regarde
Ne touche pas à la page html
Je viens de comprendre pourquoi le lien en haut de la photo ne s'affiche pas.
Il faut écrire le mot best en minuscule car en majuscule le texte est transformé car il correspond à un smiley.
Ah ben merdouille je me disais aussi
Impec l'ajout du nombre de like
Je n'ai plus ce souci Philippe. Cela était provoqué par le problème sur le Best vu comme un smiley car le texte du lien était affiché et faisait déborder le div.
Tout me semble ok à présent Phil.
Je ferais d'autres tests dans la soirée avec plus de sujets likés et passerait ensuite résolu.
Un grand merci à nouveau l'ami pour tout ce superbe développement
Quand la photo est en mode paysage et celle d'à coté en mode portrait (plus haute que large), "Posté par; l'auteur" sort du cadre.
Je n'ai plus ce souci Philippe. Cela était provoqué par le problème sur le Best vu comme un smiley car le texte du lien était affiché et faisait déborder le div.
Tout me semble ok à présent Phil.
Je ferais d'autres tests dans la soirée avec plus de sujets likés et passerait ensuite résolu.
Un grand merci à nouveau l'ami pour tout ce superbe développement
Oui j'avais bien vu et l'ai mentionné d'ailleurs pour ce satané smiley .
Ensuite dans la page html, j'ai ajouté ceci dans la feuille de style afin de masquer ce qui gêne plus ou moins l'affichage:
De rien mon ami et plus tard alors .
Ensuite dans la page html, j'ai ajouté ceci dans la feuille de style afin de masquer ce qui gêne plus ou moins l'affichage:
- Code:
/*ON MASQUE CE QUI NOUS GENE SUR LA PAGE HTML*/
#page-header, #widget-arrows,.M14_open_Panneau,.M14_close_Panneau{display:none;}
De rien mon ami et plus tard alors .
https://www.milouze14.com/t32939-phpbb3-photos-ayant-recu-1-j-aime-best#628282Tiens, je n'ai pas le haut de page sur la page html ni la barre de navigation.
J'ai 4 photos mise en best et je n'en vois que 3. Bizarre ça.
Je verrais cela demain Serge, mais assures toi avant que le best ajouté soit bien sur la première page de la liste des sujets.
Oui pas de souci, aucune urgence Phil.
Ah oui, j'ai vu pour le header.
J'ai corrigé le css (donc remis le haut de page) pour avoir la barre de navigation.
(ou alors ouvrir la page html dans une autre fenêtre, mais je préfère ainsi avec la barre de navigation.)
Ce serait peut-être le bas de page qui serait éventuellement à retirer.
Oui, il s'agit bien de photos de la première page. il y en a 4 ou 5 avec le like (best) et seulement 3 présentées.
edit;
Je crois avoir compris pourquoi il n'y en avait que 3 sujets de pris.
Les photos ne sont pas prises quand il y a un smiley avant la photo comme sur ce sujet par exemple:
https://photoclic.forum-pro.fr/t22902-noir_et_blanc-sur-le-chemin-ajout-ajout#289585
Quand j'enlève le smiley en haut avant la photo, elle apparait.
Par ailleurs, j'ai ajouté ça dans le JS pour ne pas présenter le bouton aux invités:
A demain l'ami. Bonne soirée.
Ah oui, j'ai vu pour le header.
J'ai corrigé le css (donc remis le haut de page) pour avoir la barre de navigation.
(ou alors ouvrir la page html dans une autre fenêtre, mais je préfère ainsi avec la barre de navigation.)
Ce serait peut-être le bas de page qui serait éventuellement à retirer.
Oui, il s'agit bien de photos de la première page. il y en a 4 ou 5 avec le like (best) et seulement 3 présentées.
edit;
Je crois avoir compris pourquoi il n'y en avait que 3 sujets de pris.
Les photos ne sont pas prises quand il y a un smiley avant la photo comme sur ce sujet par exemple:
https://photoclic.forum-pro.fr/t22902-noir_et_blanc-sur-le-chemin-ajout-ajout#289585
Quand j'enlève le smiley en haut avant la photo, elle apparait.
Par ailleurs, j'ai ajouté ça dans le JS pour ne pas présenter le bouton aux invités:
- Code:
if(!_userdata["session_logged_in"])return;
A demain l'ami. Bonne soirée.
Coucou Serge,
alors pour le bas de page ce sera:
et ajouter un hack !important au display none.
Effectivement le script choppe la première photo .
J'ai donc modifié dans le script de la page la recherche de la photo ainsi :
Tu as bien fait pour mettre le bouton juste pour la communauté Serge
alors pour le bas de page ce sera:
- Code:
#page-footer
et ajouter un hack !important au display none.
Effectivement le script choppe la première photo .
J'ai donc modifié dans le script de la page la recherche de la photo ainsi :
- Code:
var photo=$(this).find('.postbody .content div:not(.M14_reception_photos) img:not([longdesc]):first').attr('src');
Tu as bien fait pour mettre le bouton juste pour la communauté Serge
Sujets similaires
Créer un compte ou se connecter pour répondre
Vous devez être membre pour répondre.
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum