Drupal 10 – Login sayfası şablonu oluşturmak için aşağıdaki adımları takip edebilirsiniz. Bu örnekte, sayfa şablonu adını page--user--login.html.twig
olarak kullanacağız.
- Drupal temasının kendi altındaki
templates
klasörüne gidin. Temanızın adına bağlı olarak bu klasörthemes/[tema_adı]/templates
şeklinde olabilir. templates
klasörü içinde yeni bir dosya oluşturun ve adınıpage--user--login.html.twig
olarak kaydedin.- Oluşturduğunuz bu dosyayı bir metin düzenleyici ile açın ve içine aşağıdaki gibi bir örnek içerik ekleyin:
{# /** * @file * Theme override for a user login page. * * Available variables: * - logged_in: Whether the user is logged in. * - login_link: The login link. * - logout_link: The logout link. * - user_picture: The user picture. * - display_name: The user's display name. * - account_links: The account links. * - page: The renderable array representing the page. * - title: The page title. * - styles: The rendered stylesheets. * - scripts: The rendered scripts. * - content: The main content of the page. * - messages: HTML for status and error messages. Should be displayed prominently. * - tabs: Tabs linking to any sub-pages beneath the current page. * - action_links: Actions local to the page, such as 'Add menu' on the menu * administration interface. * * @see template_preprocess() * @see template_preprocess_page() * @see template_process() */ #} {# Customize the HTML structure for the user login page. #} {% set body_classes = [ 'page', 'page-user', logged_in ? 'page-user-logged-in', ] %} <div{{ attributes.addClass(body_classes) }}> {{ page }} </div>
Aşağıdaki bölüm, şablon içinde bir değişken (body_classes
) tanımlar. Bu değişken, sayfanın <body>
elementinin sınıflarını belirler. logged_in
değişkeni, kullanıcının giriş yapmış olup olmadığını belirtir ve buna göre sınıf eklenip eklenmeyeceğini belirler.
{% set body_classes = [ 'page', 'page-user', logged_in ? 'page-user-logged-in', ] %}
Aşağıdaki bölüm, sayfanın temel yapısal HTML’ini içerir. <div>
elementi, sayfanın ana bileşenini temsil eder. attributes.addClass(body_classes)
ifadesi, <div>
elementine dinamik olarak sınıflar ekler. {{ page }}
ifadesi, diğer Drupal bileşenlerini içeren ana sayfa içeriğini temsil eder.
<div{{ attributes.addClass(body_classes) }}> {{ page }} </div>
Bu örnekte, temel bir kullanıcı giriş sayfası yapısı oluşturulmuştur. Bu şablonu kullanarak sayfa üzerindeki diğer bileşenleri ve özellikleri özelleştirebilir ve tasarımınızı tam olarak istediğiniz gibi yapabilirsiniz.