à tous !
J'envisage sérieusement de refaire le design de mon site web : http://4-games.fr pour le début des vacances.
Seulement ce n'est pas la première fois que j'envisage de le faire. Il y a déjà longtemps, j'avais demandé sur le support wordpress comment faire pour disposer mes articles sur deux colonnes. J'ai eu des réponses et j'ai fais comme ils ont dit mais ça n'a jamais fonctionné
Je demande maintenant ici sur le forum de jeuxvideo.com.
J'aimerais donc, comme dit ci-dessus, mettre mes articles sur deux colonnes. J'aimerais aussi que le première article soit étendu sur la largeur des deux colonnes. Pour ce dernier truc, je ne pense pas que ça soit trop compliqué, il me semble qu'il faille juste toucher au loop de wordpress. Mais pour les articles sur deux colonnes, c'est vraiment impossible pour moi.
Pourriez vous s'il vous plait, me dire en détail comment procéder, ou alors me donner un thème vraiment très basique qui a déjà cette fonction afin que je puisse le personnaliser par la suite. Ou alors carrément me donner le codage tout fait pour que je le met au bon emplacement.
d'avance
Voila le schéma de ce que je voudrais faire : http://s3.noelshack.com/uploads/images/16155168391593_shma.jpg
A priori, tu auras sur ta page index.php deux boucles :
<?php $my_query = new WP_Query('showposts=1');
while ($my_query->have_posts()) : $my_query->the_post();
$do_not_duplicate = $post->ID;?>
<!-- Faire des trucs... -->
<?php endwhile; ?>
<?php if (have_posts()) : while (have_posts()) : the_post();
if( $post->ID == $do_not_duplicate ) continue; update_post_caches($posts); ?>
<!-- Faire des trucs... -->
<?php endwhile; endif; ?>
La première affiche le dernier post et la seconde affiche tous les articles sauf celui qui est déjà affiché plus haut.
A vérifier car je nesuis pas un pro de wordpress. Bon il y aura des trucs a adapter à ton cas hein mais ça peut peut être t'éclairer un peu ...
pour cette réponse rapide ![]()
Bien, il me semble aussi que c'est ça.
Reste à savoir pour les articles sur deux colonnes. Ce qu'il va se passer dans la loop.
PS : sur le support ils m'ont toujours dit qu'il n'y avait pas besoin de toucher au loop pour faire 2 colonnes. Mais avec cette méthode je n'ai jamais réussi.
Alors pour ça c'est relativement simple, tu as ton loop qui n'affiche qu'un article dans un bloc, dont tu définis la largeur.
Et en dessous tu as un deuxième bloc qui contient tes articles a priori si tu met un "float: left" aux articles contenus dans ce bloc en CSS et en définissant la largeur ça devrait fonctionner, faut voir dans tout les cas ça se réglera en CSS.
Encore une fois tu devras certainement tatonner un peu pour que ça marche mais ça devrait pas être trop loin de ça ![]()
Bon je pense que tu es dans le véridique puisqu'au support on m'a dit exactement la même chose.
Je vais donc réessayer encore une fois.
Si jamais vous avez d'autres astuces ou même un thème n'hésitez pas.
beaucoup KillahBlup pour tes deux réponses éclairs
C'est vraiment plaisant parce que sur ce forum j'ai jamais eu l'habitude d'obtenir une réponse le jour même ![]()
^^ de rien, après c'est vrai que le forum "création de site web" est beaucoup moins actif que celui de CoD Black Ops ^^
Enfin si tu rencontre d'autres soucis n'hésite pas.
KillahBlup
J'ai réussi à coller mes deux articles
J'en reviens pas.
beaucoup ![]()
Comme ça, ça semble bizarre mais dit toi que j'avais cherché pendant un mois et je n'avais jamais trouvé. Là, je demande par hasard sur JV.com et j'y arrive ! Bon j'essaierais pour le changement de loop demain mais normalement ça ne devrait pas poser de problème ![]()
xD ben content que tu aies réussi ![]()
C'est jamais très compliqué, c'est une logique a prendre.
Bon courage puis tiens moi au courant ^^
Bon c'est bon j'ai réussi ![]()
J'ai eu un peu de mal au début, c'est pourquoi ce je me suis aidé de ce tuto (pour ceux qui auraient le même problème que moi) : http://www.fran6art.com/tutoriels/tutoriels-wordpress-modifier-lapparence-de-la-page-daccueil-1ere-partie/
Ceci dit j'aurais deux autres questions qui ne concernent pas tout à fait mes questions initiales. Donc je ne sais pas si je vais avoir des réponses, auquel cas je referais un topic :
J'aimerais réaliser un slideshow, mais je ne trouve aucun tuto "bien" sur google. Auriez vous un tuto à me donner, ou alors pourriez vous m'expliquer ?
J'aimerais que lorsque l'on passe la souris sur le logo de mon site, le logo change de couleur. Bon alors là je me suis dit aucun problème ! J'ai juste à faire une image et faire un "truc:hover". Le problème c'est que j'ai inséré mon image dans du code HTML. Donc si je fais un "truc:hover" et que je met un background l'image du "hover" va en dessous de l'image initiale. C'est assez logique
Mais moi j'aimerais qu'elle soit au dessus
Pourriez vous m'expliquer comment faire
Ou alors, est-ce que je me trompe de méthode ?
d'avance !
Heum faire un slideshow en partant de rien c'est relativement compliqué. A mon avis tu devrais en trouver un sur le net (y'en a à foison ^^) qui ressemble a peu près à ce que tu envisage de faire. Puis de le modifier en conséquence.
Ensuite pour le logo alors la technique la plus efficace que je connaisse c'est en fait de mettre les deux logos sur une même image l'une au dessus (ou a côté) de l'autre, comme ça :
http://mirabellezaden.eu/images/navigation/nav_a_move.jpg
Ensuite dans le css tu définis la taille de ton logo de façon à ce qu'on ne voit que le premier logo, il sera mis en background. Pour afficher le premier logo il suffit de modifier la position du background ...
Je te donne un exemple ça sera plus clair :
h1 a {
background:url('ton_logo.png') no-repeat;
width: 456px;
height: 32px;
display:block; (très important)
}
h1 a:hover {
background-position : 0 32px 0 0;
}
Ca ressemblera a quelque chose comme ça, le h1 évidement à adapter mais il me semble que sur Wordpress le logo est dans le h1.
Bref donc je t'explique maintenant que tu as le code sous les yeux ^^
Le width et le height correspondent à la hauteur et à la largeur de ton logo (donc pour qu'on en voit qu'un). Le display block permet de fermer le bloc image et d'empêcher que ça ne dépasse.
Et pour finir le Backgound-position du hover permet de redonner une position a ton image, c'est à dire qu'il bougera ton background de tant de pixels. SI ton logo fais 40pixel de hauteur ça donnera : -40px 0 0 0; ou 0 0 40px 0; (je pense que les deux fonctionnent mais à tester).
Voila j’espère que ça t'aidera un peu
pour ta réponse
En ce qui concerne le slideshow, j'avais cherché avant de demander mais j'en ai trouvé aucun "tout fait". Enfin, peut être que si mais comme tous les liens sont en anglais je ne comprend pas très bien. Enfin bon je vais recherché et je finirais pas trouver. Au pire je chercherais du côté du support wordpress. Après si jamais vous en avez un en stock je suis preneur
Sinon pour l'image, c'est vrai que c'est super astucieux ! Je n'y avais pas du tout pensé.
Mais je ne sais pas si ça va fonctionner puisque mon logo est inséré via du code HTML. Comme ça :
<div id="logo"><a href="http://4-games.fr"><img
src="http://img10.hostingpics.net/pics/2858184game
s.png" width="737" height="143" /></a></div>
Et non comme ça :
background-image: url(url);
}
Ca pose pas de soucis, il suffit de l'insérer en CSS. c'est aussi pour ça que le "display: block;" à son importance. 9a ne changera rien visuellement, mais dans ton code si.
Du coup dans ta balise <div id="logo"></div> tu n'auras rien. Ce qui ne pose aucun soucis
. Enfin évidement ça implique que tu télécharges l'image pour la rebalancée sur ton serveur.
En ce qui concerne le slideshow je regarderais ce que j'ai
mais je garanti rien ^^
beaucoup.
Pour ce qui est du titre, ça fonctionne parfaitement ![]()
Mais il y a encore un truc que j'aimerais faire la dessus. Avant, lorsque je passais pas souris dessus, la flèche de la souris formait une main afin de cliquer et d'être redirigé vers l'accueil. Maintenant que j'ai tous mis en CSS, le lien apparait comme ça mais n'est pas intégré dans l'image. Et c'est normal. Mais alors pourriez vous me dire comment faire pour l’intégrer ![]()
du double post ![]()
euh si j'ai bien compris ta juste a mettre cursor:pointer; dans ta div #logo
pour ta réponse. Mais ce n'est pas encore terminé
Code HTML :
<div id="logo"><a href="http://4-games.fr"></a></div>
CSS :
background-image:
url(http://img10.hostingpics.net/pics/2858184games
.png);
float: left;
width: 739px;
height: 143px;
display: block;
cursor: pointer;
}
Donc là, à la rencontre de l'image le curseur se transforme en main mais si je clique aucun lien ne vient.
Comment faire pour qu'un lien vienne ![]()
c'est dans ton code HTML, en fait pour t'expliquer que tu comprennes ce que tu fais ^^
Tous tes attributs CSS sont actifs sur ton <div id="logo"> donc enfait la seule chose a faire c'est de tout mettre sur le <a>
ce qui donne dans ton HTML :
<div><a id="logo" href="tonlien.fr"></a></div>
tous tes paramètres se retrouvent donc sur ton lien et non plus sur le <div> qui encadre ton lien ^^
Normalement le reste ne devrait pas bouger
vouala vouala
Ah bah oui maintenant ça fonctionne
beaucoup pour toute l'aide apportée dans ma quête ![]()
xD de rien, bon courage pour la suite ^^