---
url: 'https://dxpr.com/ar/hc/documentation/learn-dxpr-builder/elements/progress-bar'
title: 'شريط التقدم | DXPR'
author:
  name: Jurriaan
  url: 'https://dxpr.com/users/jurriaan'
date: '2023-11-06T09:33:52+00:00'
updated: '2026-10-23T14:31:17+00:00'
copyright: 'Copyright DXPR. All rights reserved.'
type: article
summary: 'أبقِ المشاهدين على علم بالتقدم المحرز في إطلاق المنتج أو الإنجاز الرئيسي أو اعرض بشكل إبداعي مستوى مهاراتك المختلفة بشكل مرئي باستخدام شريط التقدم DXPR Builder.'
tags:
  - 'Data and motion'
image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
published: true
og:
  site_name: DXPR
  updated_time: '2026-10-23T14:31:17+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-06T09:33:52+0000'
      dateModified: '2026-10-23T14:31:17+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/elements/progress-bar'
      articleSection: 'Data and motion'
    -
      '@type': WebPage
      '@id': 'https://dxpr.com/ar/hc/documentation/learn-dxpr-builder/elements/progress-bar'
      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
---
[Help Center](/ar/hc)/[Documentation](/ar/hc/documentation) /[Learn DXPR Builder](/hc/documentation/learn-dxpr-builder) /[Build pages](/hc/documentation/learn-dxpr-builder/build) /[Add content](/hc/documentation/learn-dxpr-builder/elements) /[Data and motion](/hc/documentation/learn-dxpr-builder/elements/data-and-motion) # شريط التقدم.

 Learn DXPR BuilderBuild pagesAdd contentData and motion

   ## In this guide

 Related guides

- [علامة تبويب النمط](/ar/hc/documentation/learn-dxpr-builder/element-settings/style-tab)

 أبقِ المشاهدين على علم بالتقدم المحرز في إطلاق المنتج أو الإنجاز الرئيسي أو اعرض بشكل إبداعي مستوى مهاراتك المختلفة بشكل مرئي باستخدام شريط التقدم DXPR Builder.

 اتبع الخطوات أدناه لبدء استخدام عنصر شريط التقدم في موقع الويب الخاص بك:

1. انقر على أيقونة **+**
2. انتقل إلى علامة **التبويب المحتوى**
3. حدد عنصر **شريط التقدم**
4. املأ رسالة الشريط في حقل **التسمية**
5. اضبط التقدم في حقل **التقدم** . سيؤدي هذا إلى تغيير طول شريط التقدم.
6. اضبط حجم الشريط من **ارتفاع الشريط** جلسة
7. حدد لون الجزء **الأمامي** **والخلفي** من الشريط
8. *اختياريًا،* يمكنك إضافة **خطوط** **ورسوم متحركة** إلى الأشرطة
9. بمجرد تحديد الإعدادات المفضلة لديك، يمكنك النقر فوق **"حفظ التغييرات"** وبذلك تكون قد انتهيت!