web-dev-qa-db-ja.com

twigにテンプレートファイルを作成する方法drupal 8でユーザーログイン、プロファイル編集、パスワードフォームを忘れた場合のカスタマイズ用?

以前は、以下のコードを使用して、ユーザーログインのカスタムテンプレートを作成し、ユーザープロファイルを編集して、パスワードフォームを忘れます:

 function Yourtheme_theme($existing, $type, $theme, $path){
 return array(
 'user_register' => array(
 'render element' => 'form',
 'template' => 'templates/user-register',
),



'user_pass' => array(
  'render element' => 'form',
  'template' => 'templates/user-pass',
),

'user_profile_form' => array(
  // Forms always take the form argument.
  'arguments' => array('form' => NULL),
  'render element' => 'form',
  'template' => 'templates/user-profile-edit',
),
);
}

function Yourtheme_preprocess_user_register(&$variables) {

$variables['rendered'] = drupal_render_children($variables['form']);
}

function Yourtheme_preprocess_user_login(&$variables) {

$variables['rendered'] = drupal_render_children($variables['form']);
}

同じように作成する方法twigテンプレートファイルdrupalユーザーログインをカスタマイズするための8、ユーザープロファイルの編集およびパスワードフォームを忘れますか?

4
user52318

Hook_theme_suggestions_alterを使用して、好きなテンプレート提案を作成できます。たとえば、フォームIDに基づいています。提案にはアンダースコア( "_")が含まれていますが、テンプレートファイルにはハイフン( "-")が含まれています。

function Yourtheme_theme_suggestions_alter(array &$suggestions, array $variables, $hook) {

  if ($hook == 'form' & !empty($variables['element']['#id'])) {
    $suggestions[] = 'form__' . str_replace('-', '_', $variables['element']['#id']);
  }
}

次に、次のようなテーマでテンプレートを作成します

form--user-register-form.html.twig

そして

form--user-login-form.html.twig

フォームをプリプロセスフックでレンダリングし、フォームのカスタムテーマフックを登録することにより、いくつかの非標準で不要なことを行っています。 hook_themeで新しいフックを作成する必要はありません。提案を使用するだけで、キャッシュをクリアした後、残りの処理が行われます。

テンプレート内で要素をレンダリングできます。

たとえば、form--user-login.html.twigの場合:

<div class="login-form login-form__wrapper">
    <form{{ attributes }}>
        <div class="login-form__top">
            <h3>hello world</h3>
            <div id="error_messages"></div>
            {{ element.messages }}
            {{ element.name }} {# username element #}
            {{ element.pass }} {# password element #}
            <div class="login-form__help_actions">
                <input id="show_password" class="show_password" type="checkbox" />
                <label class="password-toggle" for="show_password">Show password</label>
                <a href="/user/password" class="forgot-password">Forgot Password?</a>
            </div>
            {{ element.form_build_id }} {# required #}
            {{ element.form_id }} {# required #}
            <div class="login-form__submit">
                {{ element.actions.submit }}
            </div>
        </div>
    </form>
</div>
13
oknate