web-dev-qa-db-fra.com

Thème user_profile_form (le formulaire d'édition de l'utilisateur)

Je suis à la recherche de moyens simples de thématiser le formulaire de profil utilisateur qui me permettront de configurer une mise en page à deux colonnes pour le formulaire et d'exclure certains éléments.

Comment puis-je y parvenir?

7themingusers
7
areynolds

Outre l'utilisation du module Display Suite, la plupart des méthodes de création de thèmes pour les formulaires nécessitent l'écriture d'un peu de code. Dans la méthode suivante, je définis des variables du formulaire qui peuvent être sorties dans un fichier modèle pour s'adapter à la structure HTML que vous souhaitez. J'ai mis tout mon code dans template.php, mais vous pouvez tout aussi facilement créer un module personnalisé pour ce faire.

  1. Ajouter une implémentation hook_theme ()

    function YOURTHEME_theme($existing, $type, $theme, $path){
  return array(
    'user_profile_form' => array(
      'render element' => 'form',
      'template' => 'user-profile-form',
      'path' => drupal_get_path('theme', 'YOURTHEME') . '/templates', 
      //add '/templates' only if you store template files in an additional folder
    ),

  );
}

    Cela indique au système de thème Drupal qu'il y a un fichier de modèle qui l'attend dans YOURTHEME/templates.

  2. Ensuite, nous définirons certaines variables à passer dans ce modèle dans une fonction hook_preprocess_HOOK. Nous pouvons trouver le tableau structuré du formulaire dans $ variables ['formulaire'] et affecter les éléments du formulaire aux variables que nous aimerions lancer autour de notre fichier tpl.php.

    function YOURTHEME_preprocess_user_profile_form(&$variables) {
  $form_inputs = array(
    'account' => $variables['form']['account'],
    'picture' => $variables['form']['picture'],
    'actions' => $variables['form']['actions'],
  );
  $variables['rendered'] = _YOURTHEME_form_variables_render_all($form_inputs);
}

function _YOURTHEME_form_variables_render_all($elements) {
    //Create array to return, with element name as key and element as value
    $elements_array = array();
    //For each element, render it and add it to the array
    foreach ($elements as $key => $element) {
        $elements_array[$key] = render($element);
    }
    //Return array
    return $elements_array;
}

    Cet exemple mettra les champs d'informations générales sur le compte, le champ de téléchargement de photos de l'utilisateur (si les photos sont activées) et les actions de soumission dans une variable appelée "rendu".

  3. Maintenant que nous avons défini ces variables, nous pouvons les afficher dans un fichier modèle. Créez un fichier de modèle nommé user-profile-form.tpl.php dans 'YOURTHEME/templates'. Ceci est un exemple de démonstration:

    <div id="new-form">
  <?php echo $rendered['picture']; ?>
  <?php echo $rendered['account']; ?>
  <?php echo $rendered['actions']; ?>
  <input type="hidden" name="form_id" value="<?php print $form['#form_id']; ?>" />
  <input type="hidden" name="form_build_id" value="<?php print $form['#build_id']; ?>" />
  <input type="hidden" name="form_token" value="<?php print $form['form_token']['#default_value']; ?>" />
</div>

Remarquez les champs de formulaire masqués à la fin; il s'agit notamment des jetons vitaux Drupal qui aident à sécuriser les formulaires contre les attaques. Votre formulaire ne fonctionnera pas sans eux.

Lorsque vous visitez votre page de modification utilisateur, vous ne devriez maintenant voir que certains champs d'informations générales sur le compte et les champs d'image. Créez différentes variables dans la fonction de prétraitement pour séparer les éléments du formulaire et placez-les où vous le souhaitez dans le fichier user-profile-form.tpl.php, en ajoutant le balisage que vous souhaitez.

7
areynolds

Les suites d'affichage ne peuvent être utilisées que pour l'affichage, pas pour l'édition. C'était super, s'il pouvait gérer les deux.

1
rpataca

Quelques corrections pour le code de areynolds:

Correction de soulignement dans 'élément de rendu 

function YOURTHEME_theme($existing, $type, $theme, $path){
  return array(
    'user_profile_form' => array(
      'render element' => 'form',
      'template' => 'user-profile-form',
      'path' => drupal_get_path('theme', 'YOURTHEME') . '/templates', 
      //add '/templates' only if you store template files in an additional folder
    ),

  );
}

Correction de la fonction de prétraitement à partir du remplacement des données (compte-> image) et de l'ajout d'éléments d'action (bouton de formulaire). 

function YOURTHEME_preprocess_user_profile_form(&$variables) {
  $required_elements[]=$variables['form']['account'];
  $required_elements[]=$variables['form']['picture'];
  $required_elements[]=$variables['form']['actions'];
  $variables['rendered'] = drupal_render($required_elements);
}

Mais toutes ces manipulations ne donnent que l'apparence de la forme. Mais le formulaire ne fonctionnera pas correctement car il nécessite d'autres éléments tels que valider, soumettre des gestionnaires, etc. Je pense donc que la meilleure façon de masquer les éléments non requis dans le tableau $ variables ['form'] en laissant toutes les métadonnées de formulaire nécessaires.

0
ACD

Les panneaux peuvent prendre entièrement en charge le formulaire d'édition de profil et avec une poignée de correctifs (actuellement), vous pouvez extraire les informations de profil 2 en tant que relation de panneaux.

0
ergophobe