Fork me on GitHub




(1) 2 »


Afficher les membres sur la page d'accueil avec carouselle
Aspirant
Inscrit: 02/07/2010 00:11
Messages: 30
Bonjour,
Je voudrais savoir comment afficher les mermbres de mon site sur la page d'accueil avec effet de carouselle (je pense que c'est avec jquery)
Comme sur ce site de rencontre pour ados

Merci

Posté le : 02/07/2010 02:29
Partager Twitter Partagez cette article sur GG+
Re: Afficher les membres sur la page d'accueil avec carouselle
Semi pro
Inscrit: 01/08/2005 19:06
Messages: 1851
bonjour sa doit etre possible

pour affiché l'avatar des membres

src="<{$xoops_url}>/uploads/<{$member_info.user_avatar}>"


ensuite si on prend le code html du block nouveau utilisateur on a ceci:

<table cellspacing="1" class="outer">
  <{foreach 
item=user from=$block.users}>
    <
tr class="<{cycle values="even,odd"}>" valign="middle">
      <
td align="center">
      <{if 
$user.avatar != ""}>
      <
img src="<{$user.avatar}>" alt="<{$user.name}>" width="32" /><br />
      <{/if}>
      <
a href="<{$xoops_url}>/userinfo.php?uid=<{$user.id}>" title="<{$user.name}>"><{$user.name}></a>
      </
td>
      <
td align="center"><{$user.joindate}></td>
    </
tr>
  <{/foreach}>
</
table>


et pour le carousel avec jquery le voci

http://sorgalla.com/jcarousel/

donc avec tous sa tu dois pouvoir te faire ton carousel

Posté le : 02/07/2010 13:08
Partager Twitter Partagez cette article sur GG+
Re: Afficher les membres sur la page d'accueil avec carouselle
Aspirant
Inscrit: 02/07/2010 00:11
Messages: 30
Merci beaucoup !!
Je vais essayer ça demain et je vous dirais si ça fonctionne.

Posté le : 02/07/2010 13:38
Partager Twitter Partagez cette article sur GG+
Re: Afficher les membres sur la page d'accueil avec carouselle
Aspirant
Inscrit: 02/07/2010 00:11
Messages: 30
Tien je dois mettre ce code dans quel fichier.
Et pour lier avec la bibliothèque jquery je supose que je dois le mettre dans le header de la template que j'utilise.
Merci

Posté le : 02/07/2010 14:37
Partager Twitter Partagez cette article sur GG+
Re: Afficher les membres sur la page d'accueil avec carouselle
Aspirant
Inscrit: 02/07/2010 00:11
Messages: 30
Pour moi ca ne fonctionne pas
J'ai créer mon bloc avec le code que vous m'avez fourni.
J'ai créer des membres de test avec photo mais il s'affiche comme ceci
Voir photo

P.S. Désolé mais je suis tout débutant avec xoops et je ne comprend pas encore grand chose

Posté le : 02/07/2010 19:50
Partager Twitter Partagez cette article sur GG+
Re: Afficher les membres sur la page d'accueil avec carouselle
Semi pro
Inscrit: 01/08/2005 19:06
Messages: 1851
je n'est dit en aucun cas de recopier tous le code j'ai dit juste qu'il faut ce basé la dessus

je donne le code php pour afficher un avatar de membres ensuite dans le code du block nouveau membre ce block affiche les dernier membres inscrit il suffit d'adapter ce code a ton script carousel.

apres je dit pas que cela et facile a réalisé mais deja avec sa suis certain que cela et possible

Posté le : 02/07/2010 20:20
Partager Twitter Partagez cette article sur GG+
Re: Afficher les membres sur la page d'accueil avec carouselle
Semi pro
Inscrit: 01/08/2005 19:06
Messages: 1851
bon je vient de faire un teste en local dans un block perso html et sa fonctionne le carousel

alors j'ai fait comme sa dans un block personnalisé en html j'ai mi ceci

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
>
<
html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-us">
<
head>
<
title>jCarousel Examples</title>
<
link href="../style.css" rel="stylesheet" type="text/css" />
<!--
  
jQuery library
-->
<
script type="text/javascript" src="../lib/jquery-1.4.2.min.js"></script>
<!--
  jCarousel library
-->
<script type="text/javascript" src="../lib/jquery.jcarousel.min.js"></script>
<!--
  jCarousel skin stylesheet
-->
<link rel="stylesheet" type="text/css" href="../skins/tango/skin.css" />

<script type="text/javascript">

jQuery(document).ready(function() {
    jQuery('#mycarousel').jcarousel();
});

</script>

</head>
<body>
<div id="wrap">
  <h1>jCarousel</h1>
  <h2>Riding carousels with jQuery</h2>

  <h3>Simple carousel</h3>
  <p>
    This is the most simple usage of the carousel with no configuration options.
  </p>

  <ul id="mycarousel" class="jcarousel-skin-tango">
    <li><img src="uploads/<{$user.avatar}>" width="75" height="75" alt="" /></li>
    <li><img src="uploads/<{$user.avatar}>" width="75" height="75" alt="" /></li>
    <li><img src="uploads/<{$user.avatar}>" width="75" height="75" alt="" /></li>
    <li><img src="uploads/<{$user.avatar}>" width="75" height="75" alt="" /></li>
    <li><img src="uploads/<{$user.avatar}>" width="75" height="75" alt="" /></li>
    <li><img src="uploads/<{$user.avatar}>" width="75" height="75" alt="" /></li>
    <li><img src="uploads/<{$user.avatar}>" width="75" height="75" alt="" /></li>
    <li><img src="uploads/<{$user.avatar}>" width="75" height="75" alt="" /></li>
    <li><img src="uploads/<{$user.avatar}>" width="75" height="75" alt="" /></li>
    <li><img src="uploads/<{$user.avatar}>" width="75" height="75" alt="" /></li>
    <li><img src="uploads/<{$user.avatar}>" width="75" height="75" alt="" /></li>
   
  </ul>

</div>
</body>
</html>


ensuite a la racine de mon théme j'ai mi les dossiers
images
thickbox
lib
skins
et le style.css du carousel que j'ai renomé en style2.css

et tu pourra t'apercevoir que sa fonction ensuite reste plus cas trouver la solution pour affiché les avatars des 10 dernier membres inscrit comme sur le block nouveau membres.
Voila j'espere t'avoir aider

Posté le : 02/07/2010 20:45
Partager Twitter Partagez cette article sur GG+
Re: Afficher les membres sur la page d'accueil avec carouselle
Aspirant
Inscrit: 02/07/2010 00:11
Messages: 30
Je me permet de revenir sur ce post
Car depuis longtemps j'essaye de réussir à afficher les avatars de mes membres sur le carousel mais je n'y arrive pas
Voici la capture d'écran : Open in new window


et le code source affiche ceci
<div id="wrap"
<
center
  <
ul id="mycarousel" class="jcarousel-skin-tango"
    <
li><img src="http://localhost/www/mon-site/uploads" width="75" height="75" alt="" /></li>

mais la variable <{$user.avatar}> ne fait aucun effet
Pourquoi ?

Posté le : 15/10/2010 13:32
Partager Twitter Partagez cette article sur GG+
Re: Afficher les membres sur la page d'accueil avec carouselle
Semi pro
Inscrit: 10/11/2004 13:40
Messages: 1659
Bonsoir Mateo

- Pour mettre le carousel , dans le bloc "Nouveaux membres", il faut mettre les fichiers css, js "style.css, jquery-1.4.2.min.js, jquery.jcarousel.min.js, skin.css" (dans l'emplacement indiqué ci-dessous),

- Il faut aussi mettre dans leur emplacement les images indiquées dans le skin.css, il faut indiquer le chemin complet, par exemple :
backgroundtransparent url(http://localhost/xoops-2.4.5fr/js/next-horizontal.png) no-repeat 0 0;


- Dans le template modules/system/templates/blocks/system_block_newusers.html
<link href="<{$xoops_url}>/js/style.css" rel="stylesheet" type="text/css" />
<!--
  
jQuery library
-->
<
script type="text/javascript" src="<{$xoops_url}>/js/jquery-1.4.2.min.js"></script>
<!--
  jCarousel library
-->
<script type="text/javascript" src="<{$xoops_url}>/js/jquery.jcarousel.min.js"></script>
<!--
  jCarousel skin stylesheet
-->
<link rel="stylesheet" type="text/css" href="<{$xoops_url}>/js/skin.css" />


<script type="text/javascript">

jQuery(document).ready(function() {
    jQuery('#mycarousel').jcarousel();
});

</script>
<div id="wrap">
<ul id="mycarousel" class="jcarousel-skin-tango">
<{foreach item=user from=$block.users}>
<{if $user.avatar != ""}>
<li><img src="<{$user.avatar}>" width="75" height="75" alt="" /></li>
<{/if}>
<{/foreach}>
</ul>

</div>


voila un exemple d'intégration

Posté le : 15/10/2010 23:31

PS : Toujours faire une sauvegarde des fichiers avant de les modifier !
-------------------------------------------
http://www.aideordi.com
Partager Twitter Partagez cette article sur GG+
Re: Afficher les membres sur la page d'accueil avec carouselle
Aspirant
Inscrit: 02/07/2010 00:11
Messages: 30
Un grand merci ça fonctionne
Moi j'avais créé le bloc dans le thème et la variable
<{$user.avatar}> fessais aucun effet
Pouvez-vous me dire dans quel répertoire de xoops la variable <{$user.avatar}> est active
uniquement dans le module système ?
dans tout les modules ?
ou autres répertoires
Merci d'avance

Posté le : 16/10/2010 22:56
Partager Twitter Partagez cette article sur GG+

 Haut   Précédent   Suivant
(1) 2 »



Vous pouvez voir les sujets.
Vous ne pouvez pas débuter de nouveaux sujets.
Vous ne pouvez pas répondre aux contributions.
Vous ne pouvez pas éditer vos contributions.
Vous ne pouvez pas effacez vos contributions.
Vous ne pouvez pas ajouter de nouveaux sondages.
Vous ne pouvez pas voter en sondage.
Vous ne pouvez pas attacher des fichiers à vos contributions.
Vous ne pouvez pas poster sans approbation.

Propulsé avec XOOPS | Graphisme adapté par Tatane, Grosdunord, Montuy337513

66 Personne(s) en ligne (54 Personne(s) connectée(s) sur Forum) | Utilisateur(s): 0 | Invité(s): 66 | Plus ...