---
url: 'https://dxpr.com/ar/hc/%D8%A7%D9%84%D8%AA%D9%88%D8%AB%D9%8A%D9%82/%D8%AA%D8%B9%D9%84%D9%85-dxpr-builder/%D8%A7%D9%84%D8%AA%D8%AE%D8%B5%D9%8A%D8%B5/%D9%85%D8%AD%D8%B1%D8%B1-%D8%A7%D9%84%D9%86%D8%B5%D9%88%D8%B5'
title: 'إضافة أنماط العلامة وأزرارها إلى محرر النصوص | DXPR'
author:
  name: Jurriaan
  url: 'https://dxpr.com/users/jurriaan'
date: '2023-11-06T10:11:51+00:00'
updated: '2026-10-24T17:19:22+00:00'
copyright: 'Copyright DXPR. All rights reserved.'
type: article
summary: |-
  عندما ينقر المحرّرون داخل نص في DXPR Builder، يظهر شريط أدوات. ويمكنكم ملء
  قائمة الأنماط الخاصة به بأنماط علامتكم، مثل فقرة استهلالية أو عبارة
  مميزة. ويمكنكم أيضًا اختيار الأزرار التي يراها كل دور. فيطبّق المحرّرون عندها
  مظهر العلامة بنقرة واحدة بدل ضبط الأحجام والألوان يدويًا. وتأتي الخطوط من
  قالبكم؛ انظر خطوط مخصصة.
tags:
  - 'Match your brand'
image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
published: true
og:
  site_name: DXPR
  updated_time: '2026-10-24T17:19:22+0000'
  'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.'
schema:
  '@context': 'https://schema.org'
  '@graph':
    -
      mainEntity: {  }
    -
      '@type': TechArticle
      headline: 'إضافة أنماط العلامة وأزرارها إلى محرر النصوص'
      description: |-
        عندما ينقر المحرّرون داخل نص في DXPR Builder، يظهر شريط أدوات. ويمكنكم ملء
        قائمة الأنماط الخاصة به بأنماط علامتكم، مثل فقرة استهلالية أو عبارة
        مميزة. ويمكنكم أيضًا اختيار الأزرار التي يراها كل دور. فيطبّق المحرّرون عندها
        مظهر العلامة بنقرة واحدة بدل ضبط الأحجام والألوان يدويًا. وتأتي الخطوط من
        قالبكم؛ انظر خطوط مخصصة.
      image:
        '@type': ImageObject
        url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
        width: '1200'
        height: '630'
      datePublished: '2023-11-06T10:11:51+0000'
      dateModified: '2026-10-24T17:19:22+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/%D8%A7%D9%84%D8%AA%D9%88%D8%AB%D9%8A%D9%82/%D8%AA%D8%B9%D9%84%D9%85-dxpr-builder/%D8%A7%D9%84%D8%AA%D8%AE%D8%B5%D9%8A%D8%B5/%D9%85%D8%AD%D8%B1%D8%B1-%D8%A7%D9%84%D9%86%D8%B5%D9%88%D8%B5'
      articleSection: 'طابقوا علامتكم'
    -
      '@type': WebPage
      '@id': 'https://dxpr.com/ar/hc/%D8%A7%D9%84%D8%AA%D9%88%D8%AB%D9%8A%D9%82/%D8%AA%D8%B9%D9%84%D9%85-dxpr-builder/%D8%A7%D9%84%D8%AA%D8%AE%D8%B5%D9%8A%D8%B5/%D9%85%D8%AD%D8%B1%D8%B1-%D8%A7%D9%84%D9%86%D8%B5%D9%88%D8%B5'
      description: |-
        عندما ينقر المحرّرون داخل نص في DXPR Builder، يظهر شريط أدوات. ويمكنكم ملء
        قائمة الأنماط الخاصة به بأنماط علامتكم، مثل فقرة استهلالية أو عبارة
        مميزة. ويمكنكم أيضًا اختيار الأزرار التي يراها كل دور. فيطبّق المحرّرون عندها
        مظهر العلامة بنقرة واحدة بدل ضبط الأحجام والألوان يدويًا. وتأتي الخطوط من
        قالبكم؛ انظر خطوط مخصصة.
      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
---
[مركز المساعدة](/ar/hc)/[التوثيق](/ar/hc/%D8%A7%D9%84%D8%AA%D9%88%D8%AB%D9%8A%D9%82) /[تعلّم DXPR Builder](/ar/hc/documentation/learn-dxpr-builder) /[إدارة الموقع](/ar/hc/documentation/learn-dxpr-builder/manage) /[طابقوا علامتكم](/ar/hc/documentation/learn-dxpr-builder/customization) # إضافة أنماط العلامة وأزرارها إلى محرر النصوص.

 تعلّم DXPR Builderإدارة الموقعطابقوا علامتكم

   ## في هذا الدليل

 أدلة ذات صلة

- [تنسيق محتوى المنشئ باستخدام CSS الخاص بقالبكم](/ar/hc/%D8%A7%D9%84%D8%AA%D9%88%D8%AB%D9%8A%D9%82/%D8%AA%D8%B9%D9%84%D9%85-dxpr-builder/%D8%A7%D9%84%D8%AA%D8%AE%D8%B5%D9%8A%D8%B5/css-%D9%85%D8%AE%D8%B5%D8%B5%D8%A9)
- [فئات الأدوات](/ar/hc/%D8%A7%D9%84%D8%AA%D9%88%D8%AB%D9%8A%D9%82/%D8%AA%D8%B9%D9%84%D9%85-dxpr-builder/%D8%A7%D9%84%D8%AA%D8%AE%D8%B5%D9%8A%D8%B5/%D9%81%D8%A6%D8%A7%D8%AA-%D8%A7%D9%84%D8%A3%D8%AF%D9%88%D8%A7%D8%AA)
- [اختيار ما يراه كل دور في المنشئ](/ar/hc/%D8%A7%D9%84%D8%AA%D9%88%D8%AB%D9%8A%D9%82/%D8%AA%D8%B9%D9%84%D9%85-dxpr-builder/%D8%A7%D9%84%D8%A5%D8%AF%D8%A7%D8%B1%D8%A9/%D8%A5%D8%AF%D8%A7%D8%B1%D8%A9-%D9%85%D9%84%D9%81%D8%A7%D8%AA-%D8%AA%D8%B9%D8%B1%D9%8A%D9%81-%D8%A7%D9%84%D9%85%D8%B3%D8%AA%D8%AE%D8%AF%D9%85)

عندما ينقر المحرّرون داخل نص في DXPR Builder، يظهر شريط أدوات. ويمكنكم ملء قائمة **الأنماط** الخاصة به بأنماط علامتكم، مثل فقرة استهلالية أو عبارة مميزة. ويمكنكم أيضًا اختيار الأزرار التي يراها كل دور. فيطبّق المحرّرون عندها مظهر العلامة بنقرة واحدة بدل ضبط الأحجام والألوان يدويًا. وتأتي الخطوط من قالبكم؛ انظر [خطوط مخصصة](/ar/hc/%D8%A7%D9%84%D8%AA%D9%88%D8%AB%D9%8A%D9%82/%D8%AA%D8%B9%D9%84%D9%85-dxpr-builder/%D8%A7%D9%84%D8%AA%D8%AE%D8%B5%D9%8A%D8%B5/%D8%AE%D8%B7%D9%88%D8%B7-%D9%85%D8%AE%D8%B5%D8%B5%D8%A9).

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

- لتحرير الأنماط، تحتاجون إلى صلاحية **إدارة إعدادات DXPR Builder**.
- لتحرير أزرار شريط الأدوات، تحتاجون إلى صلاحية **إدارة ملف تعريف dxpr builder**.
- يحتاج كل نمط إلى CSS خلفه. تعمل فئات Bootstrap 5 مثل `lead` عندما تحمّل الصفحة Bootstrap 5. وتحتاج فئاتكم الخاصة إلى قاعدة في القالب؛ انظر [CSS مخصص](/ar/hc/%D8%A7%D9%84%D8%AA%D9%88%D8%AB%D9%8A%D9%82/%D8%AA%D8%B9%D9%84%D9%85-dxpr-builder/%D8%A7%D9%84%D8%AA%D8%AE%D8%B5%D9%8A%D8%B5/css-%D9%85%D8%AE%D8%B5%D8%B5%D8%A9).

## الإعداد

1. اذهبوا إلى **DXPR Studio** &gt; **DXPR Builder** &gt; **الإعدادات العامة** (`/admin/dxpr_studio/dxpr_builder/settings`).
2. وسّعوا **محرر النصوص**. يسرد مربع **الأنماط المخصصة** أصلًا الأنماط المشحونة مع DXPR Builder، سطرًا لكل نمط.
3. أضيفوا سطرًا لكل نمط بصيغة `Label=element.class`، واحذفوا الأسطر التي لا تريدونها.
4. انقروا **حفظ الإعدادات**.
5. افتحوا صفحة في المنشئ، أو أعيدوا تحميلها إذا كانت مفتوحة، وانقروا داخل نص.
6. انقروا **الأنماط** على شريط الأدوات واختاروا نمطكم.

تضيف هذه الأسطر أربعة أنماط:

```text
Lead=p.lead
Event date=span.text-primary.fw-semibold
Callout=p.border-start.border-primary.border-4.ps-3
Sassy Title=h1.sassy-title

```

يحمل كل سطر ثلاثة أجزاء:

- تُعدّ **التسمية** قبل `=` الاسم الذي يراه المحرّرون في القائمة.
- يقرّر **العنصر** بعد `=` ما يغطيه النمط. فعنصر كتلة مثل `p` أو `h2` أو `blockquote` ينسّق فقرة أو عنوانًا كاملًا. وعنصر مضمّن مثل `span` أو `mark` أو `code` يغلّف الكلمات المحددة فقط.
- تتبع كل **فئة** نقطة. أضيفوا مزيدًا من الفئات بمزيد من النقاط، كما في `Callout` أعلاه.

تستخدم أسماء العناصر حروفًا وأرقامًا فقط. وتستخدم أسماء الفئات حروفًا وأرقامًا وشرطات وشرطات سفلية. ولاستعادة القائمة المشحونة، أفرغوا المربع واحفظوا.

## أزرار شريط الأدوات لكل دور

1. اذهبوا إلى **DXPR Studio** &gt; **DXPR Builder** &gt; **ملفات تعريف المستخدم** (`/admin/dxpr_studio/dxpr_builder/profile`) وانقروا **تحرير** بجانب الملف الخاص بالدور.
2. وسّعوا **أزرار محرر النصوص (التحرير المباشر)**. حدّدوا الأزرار للنص الذي تحرّرونه على الصفحة.
3. وسّعوا **أزرار محرر النصوص (تحرير النافذة)**. حدّدوا الأزرار لمربعات النصوص في مربع حوار الإعدادات.
4. انقروا **حفظ**.

يغطي التحرير المباشر عناصر النص والتنبيه والاقتباس. أبقوا **Font style** محددًا في المجموعتين لإظهار أنماطكم المخصصة؛ فهو اسم الملف لقائمة **الأنماط**. وإذا ألغيتم تحديد كل زر في مجموعة، تراجع شريط الأدوات ذاك إلى المجموعة المدمجة. يشرح [ملفات تعريف المستخدم](/ar/hc/documentation/learn-dxpr-builder/admin/user-profiles-admin) أي ملف ينطبق على من.

## ما الذي ترونه

**الأنماط** على شريط الأدوات تفتح لوحة بمجموعتين. تحمل **أنماط الكتل** أنماط الفقرات والعناوين الكاملة، وتحمل **أنماط النصوص** الخاصة بالكلمات المحددة. وبعد اختيار نمط، يعرض الزر اسمه، أو **أنماط متعددة** عندما تنطبق عدة أنماط.

يحفظ المحرّر العنصر وفئاته في HTML الخاص بالصفحة، فيرى الزوار المظهر نفسه. ولا ينشط نمط الكتلة إلا في عنصره الخاص: يحتاج `Sassy Title` المؤشر في **عنوان من المستوى 1**.

## الإعدادات

تظهر الأزرار الـ 36 كلها في المجموعتين. ويبدأ ملف جديد محددًا هذه:

| الزر | الاسم الآلي | افتراضي المباشر | افتراضي النافذة |
|---|---|:-:|:-:|
| **AI Assistant**، **AI Tone of Voice** | `aiAgentButton`، `aiAgentToneButton` | نعم | نعم |
| **Bold**، **Italic** | `bold`، `italic` | نعم | نعم |
| **Underline**، **Strike through** | `underline`، `strikethrough` |  | نعم |
| **Superscript**، **Subscript** | `superscript`، `subscript` |  | نعم |
| **Remove format** | `removeFormat` | نعم | نعم |
| **Text color** | `fontColor` | نعم | نعم |
| **Background color** | `fontBackgroundColor` |  |  |
| **Font size** | `fontSize` | نعم | نعم |
| **Font family** | `fontFamily` |  |  |
| **HTML block format** | `heading` | نعم | نعم |
| **Font style** (قائمة **الأنماط**) | `style` | نعم | نعم |
| **Align left**، **Center**، **Align right**، **Justify** | `alignment:left`، `alignment:center`، `alignment:right`، `alignment:justify` | نعم | نعم |
| **Insert/Remove Bullet list** | `bulletedList` | نعم | نعم |
| **Insert/Remove Numbered list** | `numberedList` |  | نعم |
| **Outdent**، **Indent** | `outdent`، `indent` |  | نعم |
| **Block quote** | `blockQuote` |  | نعم |
| **Link**، **Image**، **Table** | `link`، `insertImage`، `insertTable` | نعم | نعم |
| **Horizontal rule**، **Character map** | `horizontalLine`، `specialCharacters` |  | نعم |
| **Source code**، **Show blocks** | `sourceEditing`، `showBlocks` |  | نعم |
| **Select all**، **Replace**، **Accessibility help** | `selectAll`، `findAndReplace`، `accessibilityHelp` |  |  |
| **Undo**، **Redo** | `undo`، `redo` | نعم | نعم |

يحصل المستخدمون الذين لا تطابق أدوارهم أي ملف مفعّل على أشرطة الأدوات المدمجة. فالمباشر هو **Bold** و**Italic** و**Remove format** و**HTML block format** و**Font style** والقائمتان و**Link** و**Image** و**Table** و**Undo** و**Redo**. ويضيف شريط النافذة أزرار التسطير والشطب والأسطر العلوية والسفلية والمحاذاة والمسافات البادئة والألوان والأحجام. ويضيف أيضًا **Block quote** و**Horizontal rule** و**Character map** و**Source code** و**Show blocks**. وعند تفعيل الذكاء الاصطناعي، يحصل كلاهما على زري الذكاء الاصطناعي.

**Font family** تعرض خطوط الويب الآمنة المعيارية في CKEditor، لا خطوط قالبكم.

## إذا لم تروا نمطكم

- **تعرض قائمة الأنماط الأنماط المشحونة فقط.** سطر واحد يكسر الصيغة، أو يجلس سطر فارغ بين نمطين، فيتجاهل DXPR Builder القائمة كلها. صحّحوها ضمن **محرر النصوص** في `/admin/dxpr_studio/dxpr_builder/settings` واحفظوا.
- **نمطكم رمادي.** لا يعمل نمط الكتلة إلا في عنصره الخاص: يحتاج `h1.sassy-title` إلى **عنوان من المستوى 1**. غيّروا الكتلة بقائمة العناوين أولًا، أو عرّفوا النمط لـ `p`.
- **لا يوجد زر أنماط على شريط الأدوات.** يحمل ملف المحرّر **Font style** غير محدد. حدّدوه في مجموعتي الأزرار في `/admin/dxpr_studio/dxpr_builder/profile`.
- **يُطبَّق النمط، لكن النص يبدو متماثلًا.** لا يحمل القالب CSS للفئة، أو Bootstrap 5 غير محمّل. أضيفوا القاعدة إلى القالب، أو اضبطوا **تحميل ملفات Bootstrap جانبيًا** على **Bootstrap 5** ضمن **Bootstrap** على صفحة الإعدادات العامة.
- **يرى المحرّرون النمط، والزوار لا.** **تطبيق مرشّحات صيغة النص على محتوى الواجهة** مفعّل ضمن **مرشّحات النصوص**، وصيغة نص الحقل تزيل سمات `class`. أغلقوا الخيار، أو امنحوا الحقل صيغة تحافظ على الفئات؛ انظر [الزوار يرون شيئًا مختلفًا](/ar/hc/%D8%A7%D9%84%D8%AA%D9%88%D8%AB%D9%8A%D9%82/%D8%AA%D8%B9%D9%84%D9%85-dxpr-builder/%D8%A7%D8%B3%D8%AA%D9%83%D8%B4%D8%A7%D9%81-%D8%A7%D9%84%D8%A3%D8%AE%D8%B7%D8%A7%D8%A1-%D9%88%D8%A5%D8%B5%D9%84%D8%A7%D8%AD%D9%87%D8%A7/%D9%8A%D8%B1%D9%89-%D8%A7%D9%84%D8%B2%D9%88%D8%A7%D8%B1-%D8%B4%D9%8A%D8%A6%D8%A7-%D9%85%D8%AE%D8%AA%D9%84%D9%81%D8%A7).

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

- [CSS مخصص](/ar/hc/%D8%A7%D9%84%D8%AA%D9%88%D8%AB%D9%8A%D9%82/%D8%AA%D8%B9%D9%84%D9%85-dxpr-builder/%D8%A7%D9%84%D8%AA%D8%AE%D8%B5%D9%8A%D8%B5/css-%D9%85%D8%AE%D8%B5%D8%B5%D8%A9): كتابة قواعد القالب خلف فئات أنماطكم.
- [فئات الأدوات](/ar/hc/documentation/learn-dxpr-builder/customization/utility-classes): عرض الفئات للعناصر الكاملة في قائمة **فئات HTML**.
- [ملفات تعريف المستخدم](/ar/hc/documentation/learn-dxpr-builder/admin/user-profiles-admin): كل ما يتحكم فيه الملف أيضًا.