---
url: 'https://dxpr.com/ar/hc/documentation/learn-dxpr-builder/tutorials/team-directory'
title: 'ابنوا دليل فريق | DXPR'
author:
  name: Jurriaan
  url: 'https://dxpr.com/users/jurriaan'
date: '2026-10-24T08:13:43+00:00'
updated: '2026-10-24T09:09:48+00:00'
copyright: 'Copyright DXPR. All rights reserved.'
type: article
summary: |-
  هنا تبنون صفحة فريق: ترويسة موسّطة وثلاث بطاقات
  قيادة برابط LinkedIn تحت الثالثة وشبكة من أربع بطاقات
  فريق. استخدموها عندما يجب العثور على كل زميل بسهولة.
  ولقسم فريق قصير على صفحة شركتكم، اتبعوا إنشاء صفحة
  من نحن بدلًا من ذلك.
  يبني الفيديو صفحة فريق شركة لوجستيات.
tags:
  - 'Volg een tutorial'
image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
published: true
og:
  site_name: DXPR
  updated_time: '2026-10-24T09:09:48+0000'
  'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.'
schema:
  '@context': 'https://schema.org'
  '@graph':
    -
      mainEntity: {  }
    -
      '@type': TechArticle
      headline: 'ابنوا دليل فريق'
      description: |-
        هنا تبنون صفحة فريق: ترويسة موسّطة وثلاث بطاقات
        قيادة برابط LinkedIn تحت الثالثة وشبكة من أربع بطاقات
        فريق. استخدموها عندما يجب العثور على كل زميل بسهولة.
        ولقسم فريق قصير على صفحة شركتكم، اتبعوا إنشاء صفحة
        من نحن بدلًا من ذلك.
        يبني الفيديو صفحة فريق شركة لوجستيات.
      image:
        '@type': ImageObject
        url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
        width: '1200'
        height: '630'
      datePublished: '2026-10-24T08:13:43+0000'
      dateModified: '2026-10-24T09:09:48+0000'
      author:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
        url: 'https://dxpr.com/'
        logo:
          '@type': ImageObject
          url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg'
          width: '1348'
          height: '501'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
        url: 'https://dxpr.com/'
        logo:
          '@type': ImageObject
          url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg'
          width: '1348'
          height: '501'
      mainEntityOfPage: 'https://dxpr.com/ar/hc/documentation/learn-dxpr-builder/tutorials/team-directory'
      articleSection: 'Volg een tutorial'
    -
      '@type': WebPage
      '@id': 'https://dxpr.com/ar/hc/documentation/learn-dxpr-builder/tutorials/team-directory'
      description: |-
        هنا تبنون صفحة فريق: ترويسة موسّطة وثلاث بطاقات
        قيادة برابط LinkedIn تحت الثالثة وشبكة من أربع بطاقات
        فريق. استخدموها عندما يجب العثور على كل زميل بسهولة.
        ولقسم فريق قصير على صفحة شركتكم، اتبعوا إنشاء صفحة
        من نحن بدلًا من ذلك.
        يبني الفيديو صفحة فريق شركة لوجستيات.
      breadcrumb:
        '@type': BreadcrumbList
        itemListElement:
          -
            '@type': ListItem
            position: 1
            name: الرئيسية
            item: 'https://dxpr.com/ar'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
      inLanguage: ar
---
[Help Center](/ar/hc)/[Documentation](/ar/hc/documentation) /[Learn DXPR Builder](/hc/documentation/learn-dxpr-builder) /[Build pages](/hc/documentation/learn-dxpr-builder/build) /[Volg een tutorial](/hc/documentation/learn-dxpr-builder/tutorials/overview) # ابنوا دليل فريق.

 Learn DXPR BuilderBuild pagesVolg een tutorial

   ## In this guide

 Related guides

- [Card](/hc/documentation/learn-dxpr-builder/elements/card)
- [روابط اجتماعية](/ar/hc/documentation/learn-dxpr-builder/elements/social-links)
- [ابنوا صفحة من نحن](/ar/hc/documentation/learn-dxpr-builder/tutorials/about-page)

هنا تبنون صفحة فريق: ترويسة موسّطة وثلاث بطاقات قيادة برابط LinkedIn تحت الثالثة وشبكة من أربع بطاقات فريق. استخدموها عندما يجب العثور على كل زميل بسهولة. ولقسم فريق قصير على صفحة شركتكم، اتبعوا [إنشاء صفحة من نحن](/ar/hc/documentation/learn-dxpr-builder/tutorials/about-page) بدلًا من ذلك.

يبني الفيديو صفحة فريق شركة لوجستيات.

  ## قبل أن تبدؤوا

- يملك دوركم صلاحية **التحرير باستخدام DXPR Builder**.
- الصفحة مفتوحة في المنشئ. فلصفحة جديدة، انتقلوا إلى **المحتوى** > **إضافة محتوى** > **صفحة هبوط** (`/node/add/landing_page`) وانقروا **حفظ**.
- تهبط العناصر الجديدة في أعلى قسمها أو عمودها. ولذلك تدخل الروابط الاجتماعية قبل البطاقة فوقها.

## الخطوة 1: إضافة الترويسة

1. انقروا **إضافة العناصر** على الصفحة الفارغة واختاروا **القسم** من تبويب **التخطيط**.
2. مرّروا المؤشر فوق القسم وافتحوا **المزيد** > **الإعدادات**. تحت **فئات HTML** اختاروا **توسيط النص**، ثم انقروا **حفظ**.
3. انقروا **+** على القسم واختاروا **النص** من تبويب **المحتوى**.
4. اكتبوا «فريقنا» كـ **عنوان 2**، وأضيفوا سطرًا واحدًا من المقدمة وانقروا **حفظ**. يطبع القالب عنوان الصفحة كالعنوان 1 للصفحة. ولجعل هذا العنوان هو العنوان 1 بدلًا منه، راجعوا [بناء صفحات صديقة لتحسين محركات البحث](/ar/hc/documentation/learn-dxpr-builder/tutorials/seo#step-1-start-the-content-at-heading-2).

## الخطوة 2: إضافة بطاقات القيادة

1. مرّروا المؤشر فوق القسم وانقروا **إضافة قسم تحت**. افتحوا **المزيد** > **الإعدادات** للقسم الجديد، واختاروا **خلفية** رمادية فاتحة في لوحة **النمط** وانقروا **حفظ**.
2. انقروا **+** على القسم واختاروا **صفًا**. انقروا أيقونة الشبكة (**تخطيط الأعمدة**) الخاصة به، واختاروا الإعداد المسبق **1/3 + 1/3 + 1/3** وانقروا **حفظ**.
3. انقروا **+** في العمود الأول واختاروا **بطاقة**. افتحوا **المزيد** > **الإعدادات** الخاصة بها، واضبطوا **الترويسة** على الدور و**العنوان** على الاسم، ثم انقروا **حفظ**.
4. أضيفوا **بطاقة** إلى العمود الثاني بالطريقة نفسها.
5. انقروا **+** في العمود الثالث واختاروا **الروابط الاجتماعية**. فتأتي بصفي نموذج. اكتبوا `linkedin` فوق «Facebook» في الصف الأول واكتبوا عنوان URL للملف بجانبه. أزيلوا الصف الثاني مع **×** الخاص به، واضبطوا **النمط** على **دائرة** و**الحجم** على **2x**، ثم انقروا **حفظ**.
6. انقروا **+** في العمود نفسه واختاروا **بطاقة**؛ فتهبط فوق الروابط. اضبطوا **الترويسة** و**العنوان** الخاصين بها بالطريقة نفسها وانقروا **حفظ**.
7. انقروا **+** على القسم واختاروا **نصًا**؛ فيهبط فوق الصف. اكتبوا «القيادة» كـ **عنوان 2** وانقروا **حفظ**.

## الخطوة 3: إضافة شبكة الفريق

1. أضيفوا قسمًا ثالثًا مع **إضافة قسم تحت**، ثم **صفًا**. انقروا أيقونة الشبكة (**تخطيط الأعمدة**) الخاصة به، واختاروا الإعداد المسبق **1/4 + 1/4 + 1/4 + 1/4** وانقروا **حفظ**.
2. أضيفوا **بطاقة** إلى كل عمود. افتحوا **المزيد** > **الإعدادات** الخاصة بها، واضبطوا الدور كـ **ترويسة** والاسم كـ **عنوان**، وانقروا **حفظ**.
3. انقروا **+** على القسم واختاروا **نصًا**؛ فيهبط فوق الصف. اكتبوا «الفريق» كـ **عنوان 2** وانقروا **حفظ**.

## الخطوة 4: الحفظ والمعاينة

1. انقروا **حفظ** على شريط أدوات المنشئ.
2. افتحوا قائمة العرض (أيقونة **العين**) واختاروا **معاينة**.

## للمضي أبعد

غير معروض في الفيديو:

- **الصور والسير**: انقروا **+** على بطاقة وأضيفوا سيرة **نص**. ثم انقروا **+** على البطاقة مجددًا وأضيفوا **صورة**؛ فتهبط فوق النص. املؤوا **سمة Alt** باسم الشخص.
- **الصور المستديرة**: على كل صورة، اضبطوا **نصف قطر الحدود** في لوحة **النمط**. فالقيمة بالبكسل، حتى 100.
- **الارتفاع عند التحويم**: في لوحة **نمط التحويم** للبطاقة اضبطوا **الظل المنسدل** على 2.
- **فريق يحدّث نفسه**: أنشئوا نوع محتوى «عضو الفريق» وعرض **شبكة** بمعروض كتلة. أدرجوا العرض من تبويب **طرق عرض Drupal**، فيضيف المحرّرون أشخاصًا دون لمس الصفحة.

## ما سترونه

يجلس «فريقنا» موسّطًا في الأعلى. وعلى الشريط الرمادي، تعرض ثلاث بطاقات قيادة كل دور في الترويسة والاسم تحته، مع أيقونة LinkedIn مستديرة تحت الثالثة. ويلي «الفريق» أربع بطاقات جنبًا إلى جنب.

## إذا لم تظهر الصفحة كما هي معروضة

- **بطاقة لا تعرض مربع إعدادات بعد إضافتها.** تُفتَح البطاقات فارغة، دون مربع حوار. مرّروا المؤشر فوق البطاقة وافتحوا **المزيد** > **الإعدادات** لملء **الترويسة** و**العنوان**.
- **رابط تواصل يعرض «تعذّر العثور على أيقونة علامة مطابقة».** العلامة ليست اسم أيقونة معروفًا. اكتبوها بأحرف صغيرة، مثل `linkedin`.
- **أيقونة LinkedIn تجلس فوق البطاقة.** دخلت البطاقة قبل الروابط، والعناصر الجديدة تهبط في أعلى عمودها. اسحبوا البطاقة فوق الروابط بمقبض السحب على شريط تحكمها.
- **ذهبت تغييراتكم بعد إعادة التحميل.** غادرتم الصفحة قبل نقر **حفظ** على شريط أدوات المنشئ. وإذا عرض الحفظ خطأ، راجعوا [التغييرات لا تُحفَظ](/ar/hc/documentation/learn-dxpr-builder/troubleshooting/saving-fails).

## ما الخطوة التالية؟

- [عنصر البطاقة](/hc/documentation/learn-dxpr-builder/elements/card) لأنواع البطاقات والعناصر الفرعية
- [عنصر الروابط الاجتماعية](/ar/hc/documentation/learn-dxpr-builder/elements/social-links) لأنماط الأيقونات وألوانها
- [صفحة من نحن](/ar/hc/documentation/learn-dxpr-builder/tutorials/about-page) لوضع قسم فريق أقصر على صفحة شركتكم