Modification de l'apparence de la page d'accueil

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Modification de l'apparence de la page d'accueil

Message par ipodjeremy le Mar 1 Déc - 16:23

Détails techniques


Version du forum : invision
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Mozilla Firefox, Google Chrome, Internet Explorer, Opera, Safari, Autre
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://guilde-wanted-test.taguilde.net/ (Oui, j'utilise un forum de test, pour éviter de tous casser en grattant partout)

Description du problème

Bonjour,

C'est relativement simple, ce que je recherche.

Le forum actuel à cette apparence :
image:

Et je voudrais qu'il soit comme ceci :
image:
( adaptation via paint pour mon forum à partir de ce forum qui utilise cette apparence : http://irydae.forumactif.org/ )

Ne connaissant pas du tout comment fonctionne les templates et quoi sert à quoi, j'ai bien besoin de votre aide Wink


Bien cordialement


Dernière édition par ipodjeremy le Ven 4 Déc - 0:39, édité 3 fois

ipodjeremy
**

Masculin
Messages : 89
Inscrit(e) le : 24/07/2012

http://chudoku.superforum.fr/
ipodjeremy a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification de l'apparence de la page d'accueil

Message par Feuilla' le Mar 1 Déc - 17:22

Bonjour,
déjà pour les images en fond des descriptions des forums : dans la description de chaque, rajoutez des balises autour, comme ceci :
Code:
<div class="forumun">Nom du forum</div>
Le "forumun" est changeable par un autre mot. Wink
Pour le suivant, on peut mettre "forumdeux" etc. .
Dans la Feuille de style, collez ceci :
Code:
div.forumun {background-image:url("adressedemonimage")}
Il faut mettre une vraie adresse bien sûr. Smile Puis faire pour chaque forum/sous-forum le code, par exemple :
Code:
div.forumdeux {background-image:url("adressedemonimage")}
div.forumtrois {background-image:url("adressedemonimage")}
etc. etc. . Wink
Warning Attention car il faut que les mots soient les mêmes (pour le premier forum par exemple, si l'on met "exemple" dans la description, alors il faudra mettre "exemple" aussi dans le CSS).
Bonne journée !

Feuilla'
Membre habitué(e)

Messages : 1388
Inscrit(e) le : 26/07/2015

Feuilla' a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification de l'apparence de la page d'accueil

Message par ipodjeremy le Mar 1 Déc - 17:51

Yeah, pour les images, sa fonctionne bien. J'ai fait le test avec ce que j'avais, mais sa fonctionne, c'est le principal.



Concernant l'apparence des catés, je vais tenter des bidouillages en attendant une aide Wink

ipodjeremy
**

Masculin
Messages : 89
Inscrit(e) le : 24/07/2012

http://chudoku.superforum.fr/
ipodjeremy a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification de l'apparence de la page d'accueil

Message par Feuilla' le Mar 1 Déc - 18:24

Re,
que voudriez-vous pour les titres des catégories, précisément ? (modifier quoi, changer quoi ?) Smile

Feuilla'
Membre habitué(e)

Messages : 1388
Inscrit(e) le : 26/07/2015

Feuilla' a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification de l'apparence de la page d'accueil

Message par ipodjeremy le Mar 1 Déc - 18:36

Sans prendre en compte les images et les couleurs, mais seulement l'apparence ou du moins la structure de la page en elle même je voudrais que le forum ne ressemble plus au premier screen, mais au deuxième.

Par conséquent, je pense que tout est a modifier. Si j'ai bien suivi ( oui c'est dur) tous ce passe ici : Template / index_box

ipodjeremy
**

Masculin
Messages : 89
Inscrit(e) le : 24/07/2012

http://chudoku.superforum.fr/
ipodjeremy a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification de l'apparence de la page d'accueil

Message par Neptunia le Mar 1 Déc - 20:21

Bonjour ^^


Ce que vous recherchez, ças'appelle des catégories en bloc.
Vous trouverez un tutoriel ici :
Right Catégories en blocs avec effets de transition - Version phpBB2

Le rendu en image :

Ici on a 3 forums par ligne mais il suffit de modifier une seule ligne de CSS pour passer à 2 ou 4

Un tutoriel équivalent est aussi disponible sur Never Utopia au cas où vous y auriez déjà un compte.
avatar

Neptunia
Membre actif

Féminin
Messages : 11689
Inscrit(e) le : 08/08/2010

https://www.galaxie-series.net/
Neptunia a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification de l'apparence de la page d'accueil

Message par ipodjeremy le Mer 2 Déc - 6:49

Bonjour Neptunia,

Merci beaucoup ! Le fait d'avoir un nom sur ce que je cherche m'a en effet permit de trouver bien de l'aide sur internet, dont un tutoril plutôt sympa. Ceux que tu m'as donné, même inscrit, j'ai pas les accès pour ces parties du forum. Je suis donc aller ici (pas besoin d'inscription) : Lien du tuto

Ça prend forme déjà , on verra la suite pour la beauté Wink


Cependant, je suis bloqué sur la 2ème partie. Celle concernant l'intégration des éléments dans les cadres.

Une petite image d'où j'en suis :
image:

Mais sur les templates, je regarde, mais je ne vois pas du tout, ou je dois apporter la modification suivante :

Code:
 <div class="forum">
    
    <!-- titre du forum -->
    <div class="forumlink"><a href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></div>
    
    <!-- icone des messages -->
    <div class="forum_icone"><img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" /></div>
    
    <!-- description -->
    <div class="forum_description">{catrow.forumrow.FORUM_DESC}</div>
    
    <!-- sous forum -->
    <div class="sous_forum">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</div>
    
    <!-- stats -->
    <div class="forum_stats"><span class="stats1">{catrow.forumrow.TOPICS}</span><span class="stats2">{catrow.forumrow.POSTS}</span></div>
    
    <!-- dernier message -->
    <div class="dernier_mess">{catrow.forumrow.LAST_POST}</div>  
  
   </div>

Si vous savez dans quel templates, je dois faire ça, je prends Wink

ipodjeremy
**

Masculin
Messages : 89
Inscrit(e) le : 24/07/2012

http://chudoku.superforum.fr/
ipodjeremy a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification de l'apparence de la page d'accueil

Message par Neptunia le Mer 2 Déc - 8:11

C'est le template index_box qu'il faut modifier !

C'est d'ailleurs précisé dans le tuto que vous mentionnez.
avatar

Neptunia
Membre actif

Féminin
Messages : 11689
Inscrit(e) le : 08/08/2010

https://www.galaxie-series.net/
Neptunia a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification de l'apparence de la page d'accueil

Message par ipodjeremy le Mer 2 Déc - 8:25

Suis-Je bête, au début il le dit. Si il précise pas sur la deuxième partie, c'est que c'est la même chose.

Mais du coup, je colle ce code à la suite de l'autre ou il faut l'insérer à un endroit précis dans le code déjà existant ?

ipodjeremy
**

Masculin
Messages : 89
Inscrit(e) le : 24/07/2012

http://chudoku.superforum.fr/
ipodjeremy a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification de l'apparence de la page d'accueil

Message par Neptunia le Mer 2 Déc - 14:37

Là encore, ilsuffit de lire attentivement le tutoriel.

Vous devez dans un premier temps "nettoyer" votre template. C'est à dire que vous allez remplacer l'intégralité du template par le premier code fourni. Ensuite il reste à suivre pas à pas chaque instruction.

Mais du coup, je colle ce code à la suite de l'autre ou il faut l'insérer à un endroit précis dans le code déjà existant ?
Autant pour du CSS vous pouvez le mettre à peu près dans l'ordre qui vous chante, en matière de HTML il faut l'insérer exactement là où on le demande.
avatar

Neptunia
Membre actif

Féminin
Messages : 11689
Inscrit(e) le : 08/08/2010

https://www.galaxie-series.net/
Neptunia a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification de l'apparence de la page d'accueil

Message par ipodjeremy le Mer 2 Déc - 22:34

Bonsoir !

Voilà, concernant les blocs, tout fonctionne très bien !

J'ai quelques finitions à demander :

Un petit screen pour mieux voir ce que je demande :
image:

ROSE : Supprimer le soulignement
Vert : Faire un angle arrondi
Bleu : mettre un - entre les deux chiffres qui correspond aux sujets et aux messages
Rouge : Supprimer le cadre du forum pour qu'il soit transparent afin de voir entièrement l'image de fond. J'ai voulu tenter avec une opacité, mais sa assombri l'ensemble du forum.



Bien cordialement

ipodjeremy
**

Masculin
Messages : 89
Inscrit(e) le : 24/07/2012

http://chudoku.superforum.fr/
ipodjeremy a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification de l'apparence de la page d'accueil

Message par R-max le Mer 2 Déc - 23:04

bonsoir > un ptit coup de pouce ! Mouais

rouge >
Code:
.bodyline {
    background-color: transparent;
    border: 0px;
}

rose et vert >
Code:
.forumlink a {
  text-decoration: none!important;
border-radius: 25px 25px 0px 0px;
}

bleu>
chercher ce morceau dans le template modifier
Code:
<div class="forum_stats"><span class="stats1">{la variable}</span><span class="stats2">{la variable}</span></div>

et ajouter
Code:
&nbsp;-&nbsp;

ce qui donne ceci
Code:
<div class="forum_stats"><span class="stats1">{la variable}</span>&nbsp;-&nbsp;<span class="stats2">{la variable}</span></div>


avatar

R-max
Membre habitué(e)

Masculin
Messages : 1609
Inscrit(e) le : 08/01/2015

http://www.milouze14.com/
R-max a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification de l'apparence de la page d'accueil

Message par ipodjeremy le Mer 2 Déc - 23:50

Merci beaucoup, R-Max

Tout fonctionne à souhait Wink



Il me manque donc plus que le dernier détail et mettre le sujet en résolu Smile

Il faudrait que je passe les couleurs : bleu, jaune rouge, orange, gris et violet en transparent pour pouvoir à la place du blanc, mettre une image.

D'ailleurs en parlant d'image, les angles sont fait automatiquement ainsi que si je prend une image trop grande, elle sera redimensionné pour s'adapter au cadre ?

ipodjeremy
**

Masculin
Messages : 89
Inscrit(e) le : 24/07/2012

http://chudoku.superforum.fr/
ipodjeremy a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification de l'apparence de la page d'accueil

Message par Feuilla' le Jeu 3 Déc - 16:58

Re-Bonjour,
dans la Feuille de style, pour les parties rouges :
Code:
div.forum_description {
  background-color:transparent;
  background-image:url("url_de_l'image");
}
pour les parties bleues :
Code:
.forumlink {
  background-color:transparent;
  background-image:url("url_de_l'image");
}
pour les parties violettes :
Code:
div.sous_forum {
  background-color:transparent;
  background-image:url("url_de_l'image");
}
pour les parties oranges :
Code:
div.dernier_mess {
  background-color:transparent;
  background-image:url("url_de_l'image");
}
et pour les parties jaunes :
Code:
div.forum-icone {
  background-color:transparent;
  background-image:url("url_de_l'image");
}
Il suffit de remplacer à chaque fois "url_de_l'image" par la vraie URL. Wink
Bonne journée !

Feuilla'
Membre habitué(e)

Messages : 1388
Inscrit(e) le : 26/07/2015

Feuilla' a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification de l'apparence de la page d'accueil

Message par ipodjeremy le Ven 4 Déc - 0:38

C'est vraiment super ! C'est parfait !

Je vous remercie tous les deux pour votre aide.

Je passe le sujet en résolu Wink

ipodjeremy
**

Masculin
Messages : 89
Inscrit(e) le : 24/07/2012

http://chudoku.superforum.fr/
ipodjeremy a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum