La tambouille des râleuses
Vous souhaitez réagir à ce message ? Créez un compte en quelques clics ou connectez-vous pour continuer.
-20%
Le deal à ne pas rater :
Ecran PC GIGABYTE 28″ LED M28U 4K ( IPS, 1 ms, 144 Hz, FreeSync ...
399 € 499 €
Voir le deal

Aller en bas
Anonymous
Invité
Invité

[commande] Image+ texte en page d'accueil Empty [commande] Image+ texte en page d'accueil

Sam 26 Aoû 2023 - 16:06
Type de commande (modification de templates, en-tête, qeel, mise en page de messages, pub, autres) : image+texte
Pour quel forum :bubblegum.forumactif.com
Maquette graphique/schéma/croquis :https://zupimages.net/up/23/34/ab2i.png
Informations utiles (couleurs, images, etc, …) :couleur de fond : #CFF5FF image : https://zupimages.net/up/23/34/fssz.png police Open sans 25px couleur #000000 (1er ligne en majuscule)
[Pour les modifications de templates] Version du forum (PhpBB2, PhpBB3, PunBB, Invision, ModernBB ou AwesomeBB) :AwesomeBB
Le code pourra-t-il être mis en libre service ensuite ? Non

Bonjour la Tambouille j'ai encore besoin de vos services pour mettre en place une image avec un texte en page d'accueil. pitié J'ai mis un exemple en image directement sur le forum concerné afin de bien visualiser les proportions et la position de l'image+texte.
Merci par avance.
Mäven
Mäven
Râleuse (Admin)
Informations : Très peu présente en ce moment Sad
----
Idea Viens papoter avec nous sur le discord

Messages : 4055
https://tambouille-raleuses.forumactif.com/

[commande] Image+ texte en page d'accueil Empty Re: [commande] Image+ texte en page d'accueil

Sam 26 Aoû 2023 - 21:36
Hello @éléna

Je vais m'en occuper Smile Je te propose quelque chose rapidement =)
Anonymous
Invité
Invité

[commande] Image+ texte en page d'accueil Empty Re: [commande] Image+ texte en page d'accueil

Dim 27 Aoû 2023 - 9:54
Coucou Mäven, merci beaucoup. Bon dimanche. Copains
Mäven
Mäven
Râleuse (Admin)
Informations : Très peu présente en ce moment Sad
----
Idea Viens papoter avec nous sur le discord

Messages : 4055
https://tambouille-raleuses.forumactif.com/

[commande] Image+ texte en page d'accueil Empty Re: [commande] Image+ texte en page d'accueil

Jeu 31 Aoû 2023 - 20:03
Coucou !

Je ne t'ai pas oublié hein, je fais ça dans le week-end normalement =)
Mäven
Mäven
Râleuse (Admin)
Informations : Très peu présente en ce moment Sad
----
Idea Viens papoter avec nous sur le discord

Messages : 4055
https://tambouille-raleuses.forumactif.com/

[commande] Image+ texte en page d'accueil Empty Re: [commande] Image+ texte en page d'accueil

Sam 2 Sep 2023 - 21:48
Hello !

J'ai commencé et tu peux voir un aperçu ici : https://commandes-maven-tamb.forumactif.com/

Cependant il me manque plusieurs infos :
- y a t-il un contour ou c'est juste sur l'image ?
- cela doit-il prendre 100% de la page ou alors la même largeur que les catégories ?


Bonne soirée =)
Anonymous
Invité
Invité

[commande] Image+ texte en page d'accueil Empty Re: [commande] Image+ texte en page d'accueil

Dim 3 Sep 2023 - 11:18
Re Mâven, aucun contour et cela doit prendre 100% de la page stp. l'image est en fond transparent.

Calin
Mäven
Mäven
Râleuse (Admin)
Informations : Très peu présente en ce moment Sad
----
Idea Viens papoter avec nous sur le discord

Messages : 4055
https://tambouille-raleuses.forumactif.com/

[commande] Image+ texte en page d'accueil Empty Re: [commande] Image+ texte en page d'accueil

Dim 3 Sep 2023 - 16:49
OK donc comme ça ça te va ?
https://commandes-maven-tamb.forumactif.com/
Anonymous
Invité
Invité

[commande] Image+ texte en page d'accueil Empty Re: [commande] Image+ texte en page d'accueil

Dim 3 Sep 2023 - 17:27
Oui c'est très bien comme ça. Copains
Mäven
Mäven
Râleuse (Admin)
Informations : Très peu présente en ce moment Sad
----
Idea Viens papoter avec nous sur le discord

Messages : 4055
https://tambouille-raleuses.forumactif.com/

[commande] Image+ texte en page d'accueil Empty Re: [commande] Image+ texte en page d'accueil

Mer 6 Sep 2023 - 13:33
Hello !

Alors, on va commencer par créer une page HMTL : PA -> Modules -> Gestion des pages HTML
Créer une nouvelle en mode avancé, cocher "non" aux 2 questions et puis coller ce contenu :
Code:
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
     
</head>
<body>

    <div id="message_accueil">
      <img src="https://zupimages.net/up/23/34/fssz.png" alt="Bienvenue !" />
      <div>
         TU VEUX FAIRE PARTIE DE LA COMMUNAUTE BUBBLEGUM ?
        <br />
        Rien de plus simple !
        <br />
        Crée ton profil et retrouve tes amis sur les fifférents salons de discussion.
      </div>
  </div>

 
 
</body>
</html>

Ensuite, tu enregistres, et tu récupères l'url de ta page. Pour moi c'est cela :
Code:
https://commandes-maven-tamb.forumactif.com/h3-accueil-bubblegum   
Ce qui va être important ça va être le "/h3-a" ici.

Ensuite, on va aller modifier le template index_body (PA -> Affichage -> Template -> général -> Index_body)
Et juste après :

Code:
 <!-- END message_admin_index -->
tu vas coller ceci :

Code:
<div id="emplacementAccueil">
</div>
Tu enregistres et n'oublies pas de publier ton template.

Maintenant on va aller faire un peu de javascript pour appeler la page HTML au bon endroit.
PA -> Modules -> Gestion des codes javascript.

Tu en crées un nouveau que tu appliques uniquement sur l'index.
Et tu vas y coller ceci :

Code:
$(document).ready(function(){
  $('#emplacementAccueil').load('/h3-a');
});
En remplaçant correctement le
Code:
/h3-a
par ce que tu as toi Wink

Et enfin, un peu de CSS, dans Affichage -> Couleurs et CSS -> Feuille de style CSS
Code:
#message_accueil{
 display:flex;
  justify-content:center;
  align-items:center;
  background :  #CFF5FF;
  font-family: 'Open Sans';
  font-size:25px;
}

Et voilà, tout devrait être bon Wink
Anonymous
Invité
Invité

[commande] Image+ texte en page d'accueil Empty Re: [commande] Image+ texte en page d'accueil

Jeu 7 Sep 2023 - 10:03
Coucou Mäven merci beaucoup. Calin Néanmoins un soucis avec les widgets.
[commande] Image+ texte en page d'accueil Zj7p

je mets ce code
Code:
#sidebar {
  margin-top: 300px;
}
ce qui modifie la hauteur mais le message+image ne se positionne pas sur toute la largeur comme je l'avais demandé.

[commande] Image+ texte en page d'accueil 7jr6

Ton code fonctionne seulement si j'enlève les widgets.

[commande] Image+ texte en page d'accueil Jjc1

Ce qui me dérange le plus c'est cette pub. Je sais bien qu'elle n'est pas supprimable mais peut-on la mettre en dessous de la page d'accueil ?

Mäven
Mäven
Râleuse (Admin)
Informations : Très peu présente en ce moment Sad
----
Idea Viens papoter avec nous sur le discord

Messages : 4055
https://tambouille-raleuses.forumactif.com/

[commande] Image+ texte en page d'accueil Empty Re: [commande] Image+ texte en page d'accueil

Jeu 7 Sep 2023 - 11:13
Hello !

Je n'avais pas l'info pour les widget Wink

Alors ce que tu peux faire c'est le retirer du template index_body et plutôt aller le mettre dans overall_header juste AVANT :
Code:
    <!-- BEGIN html_validation -->

Comme ceci :
Code:
  <div id="emplacementAccueil">
</div>
    <!-- BEGIN html_validation -->

Et ça sera bon Wink
Anonymous
Invité
Invité

[commande] Image+ texte en page d'accueil Empty Re: [commande] Image+ texte en page d'accueil

Jeu 7 Sep 2023 - 12:09
Parfait Mâven. applause Une dernière question. Si je change de design et donc d'image si elle est de dimension différente par exemple. Dois-je modifier quelque chose ? Encore merci pour ton aide. Copains
Mäven
Mäven
Râleuse (Admin)
Informations : Très peu présente en ce moment Sad
----
Idea Viens papoter avec nous sur le discord

Messages : 4055
https://tambouille-raleuses.forumactif.com/

[commande] Image+ texte en page d'accueil Empty Re: [commande] Image+ texte en page d'accueil

Jeu 7 Sep 2023 - 13:58
Non tout se mettra bien automatiquement Wink

Par contre j'ai oublié mais tu peux retirer cela de la css :
Code:
  background :  #CFF5FF;
Comme ça ça s'adaptera à ton design =)
Anonymous
Invité
Invité

[commande] Image+ texte en page d'accueil Empty Re: [commande] Image+ texte en page d'accueil

Jeu 7 Sep 2023 - 14:34
Oh encore merci ! C'est le top ! applause Tu es la petite fée du codage. Tu peux archiver stp.
Contenu sponsorisé

[commande] Image+ texte en page d'accueil Empty Re: [commande] Image+ texte en page d'accueil

Revenir en haut
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum
Les coups de ♥ des Râleuses

Post-It des Râleuses