Modification des css pour mise en page dans un theme et capacha

stevanovichstevanovich Member
juin 2017 modifié dans Entraide
Bonjour à tous.
J'aimerais avoir votre avis et aussi vos conseils avisés pour ne pas faire fausse route et m'affliger d'autres soucis ultérieurs ... :D

Mes modifications concernent le theme kataklimt

Dans la partie commentaire , j'aurais souhaité aligné les "label" et les "inputs" pour avoir cet aspect :
capcha_et_commentaires.jpg

Voilà ce que j'ai fait :
dans plucss.css , rajout de ".contact_form"
[== CSS ==]
label {
	display: block;
	padding-bottom: .3rem;
}
.contact_form{
  display: inline-block;
  width: 250px;
} 



dans commentaires.php j'ai rajouté la classe contact_form
[== HTML ==]
<label class="contact_form" for="id_name"><?php $plxShow->lang('NAME') ?> :</label>

Maintenant je suis bloqué sur le capacha ... :(

Trop complexe pour moi, je ne sais pas vraiment quoi modifié , sous peine de faire plus de dégats que d'améliorations ...

Réponses

  • StéphaneStéphane Member, Former PluXml Project Manager
    Bonjour
    Regarde la doc de PluCSS, la partie formulaire, il a exactement ce que tu veux faire (avec pas grand chose à rajouter)

    http://plucss.pluxml.org/#form

    Consultant PluXml

    Ancien responsable et développeur de PluXml (2010 à 2018)

  • Stéphane a écrit:
    Bonjour
    Regarde la doc de PluCSS, la partie formulaire, il a exactement ce que tu veux faire (avec pas grand chose à rajouter)

    http://plucss.pluxml.org/#form

    @Stéphane : Merci
    ça ne fonctionne pas,c'est pire !, ça doit surement venir de mon thème utilisé ... :(
    Je fais des essais sur un autre thème pour vérifier.
  • zakar!zakar! Member
    Pourrions nous savoir quel thème utilise-tu ?
  • zakar! a écrit:
    Pourrions nous savoir quel thème utilise-tu ?

    Le theme concerné est kataklimt
  • J'ai repris les fichiers theme.css et plucss.css qui sont dans le répertoire admin pour écraser ceux du theme en cours.
    Visiblement, ça arrange partiellement le problème de mise en page ... (c'est de ma faute)

    Reste toute le partie capcha !!! je ne vois pas du tout ou intervenir pour modifier cette mise en page .
    Merci
  • zakar!zakar! Member
    juin 2017 modifié
    Pour les fichiers css, reprends plutôt ceux du fichier thème par défaut.
    Ensuite voici la modification à faire dans le fichier commentaires.php en remplaçant le formulaire :
    [== PHP ==]
    	<form id="form" action="<?php $plxShow->artUrl(); ?>#form" method="post">
    
    		<fieldset>
    			<div class="grid">
    				<div class="col sml-12 med-3 label-centered">
    					<label for="id_name"><?php $plxShow->lang('NAME') ?> :</label>
    				</div>
    				<div class="col sml-12 med-9">
    					<input id="id_name" name="name" type="text" size="20" value="<?php $plxShow->comGet('name',''); ?>" maxlength="30" />
    				</div>
    			</div>
    			<div class="grid">
    				<div class="col sml-12 med-3 label-centered">
    					<label for="id_mail"><?php $plxShow->lang('EMAIL') ?> :</label>
    				</div>
    				<div class="col sml-12 med-9">
    					<input id="id_mail" name="mail" type="text" size="20" value="<?php $plxShow->comGet('mail',''); ?>" />
    				</div>
    			</div>
    			<div class="grid">
    				<div class="col sml-12 med-3 label-centered">
    					<label for="id_site"><?php $plxShow->lang('WEBSITE') ?> :</label>
    				</div>
    				<div class="col sml-12 med-9">
    					<input id="id_site" name="site" type="text" size="20" value="<?php $plxShow->comGet('site',''); ?>" />
    				</div>
    			</div>			
    			<div class="grid">
    				<div class="col sml-12 med-3 label-centered">
    					<div id="id_answer"></div>
    					<label for="id_content" class="lab_com"><?php $plxShow->lang('COMMENT') ?> :</label>
    				</div>
    				<div class="col sml-12 med-9">
    					<textarea id="id_content" name="content" cols="35" rows="6"><?php $plxShow->comGet('content',''); ?></textarea>
    				</div>
    			</div>
    
    			<?php $plxShow->comMessage('<p id="com_message" class="text-red"><strong>#com_message</strong></p>'); ?>
    
    			<?php if($plxShow->plxMotor->aConf['capcha']): ?>
    			<div class="grid">
    				<div class="col sml-12 med-3 label-centered">
    					<label for="id_rep"><?php echo $plxShow->lang('ANTISPAM_WARNING') ?></label>
    				</div>
    				<div class="col sml-12 med-9">
    					<?php $plxShow->capchaQ(); ?> 
    					<input id="id_rep" name="rep" type="text" size="2" maxlength="1" style="width: auto; display: inline;" />
    				</div>
    			</div>
    			<?php endif; ?>
    						
    			<div class="grid">
    				<div class="col sml-12 med-9 med-offset-3">
    					<input type="hidden" id="id_parent" name="parent" value="<?php $plxShow->comGet('parent',''); ?>" />
    					<input class="blue" type="submit" value="<?php $plxShow->lang('SEND') ?>" />
    				</div>
    			</div>
    		</fieldset>
    
    	</form>
    
    Pour voir le résultat, commence à modifier le thème par défaut, pour pouvoir ensuite checker ton thème perso.
  • Bonjour, merci pour vos conseils et astuces, ça m'a permis de régler 90% du problème.
    Cependant, il me reste encore la partie capcha .... toujours un peu du n'importe quoi à l'affichage .
    Je vous ferai signe quand ce sera en ligne pour que vous puissiez y voir plus clair ... :D
Connectez-vous ou Inscrivez-vous pour répondre.