<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>المقالات والصفحات Archives - قوالب ووردبريس عربية</title>
	<atom:link href="https://arabic-themes.com/tag/%d8%a7%d9%84%d9%85%d9%82%d8%a7%d9%84%d8%a7%d8%aa-%d9%88%d8%a7%d9%84%d8%b5%d9%81%d8%ad%d8%a7%d8%aa/feed/" rel="self" type="application/rss+xml" />
	<link>https://arabic-themes.com/tag/المقالات-والصفحات/</link>
	<description>اكتشف الآلاف من السمات والقوالب ومنتجات ووردبريس</description>
	<lastBuildDate>Thu, 17 Aug 2023 12:40:23 +0000</lastBuildDate>
	<language>ar</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	

<image>
	<url>https://arabic-themes.com/wp-content/uploads/2024/12/cropped-themes-logo-220-100x100.png</url>
	<title>المقالات والصفحات Archives - قوالب ووردبريس عربية</title>
	<link>https://arabic-themes.com/tag/المقالات-والصفحات/</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>شرح محرر المكونات Gutenburg لإضافة الصفحات والمقالات</title>
		<link>https://arabic-themes.com/the-gutenburg-component-editor-is-fully-explained/</link>
					<comments>https://arabic-themes.com/the-gutenburg-component-editor-is-fully-explained/#respond</comments>
		
		<dc:creator><![CDATA[إدارة الشركة]]></dc:creator>
		<pubDate>Sat, 10 Jun 2017 17:44:01 +0000</pubDate>
				<category><![CDATA[شروحات ووردبريس]]></category>
		<category><![CDATA[Gutenburg]]></category>
		<category><![CDATA[إضافة إقتباس]]></category>
		<category><![CDATA[إضافة جدول]]></category>
		<category><![CDATA[استخدام محرر Guteberg]]></category>
		<category><![CDATA[المقالات]]></category>
		<category><![CDATA[المقالات والصفحات]]></category>
		<category><![CDATA[شرح محرر]]></category>
		<category><![CDATA[شرح محرر المكونات Gutenburg]]></category>
		<category><![CDATA[محرر Gutenberg]]></category>
		<category><![CDATA[ووردبريس]]></category>
		<guid isPermaLink="false">http://xtratheme.com/business/?p=143</guid>

					<description><![CDATA[<p>بالتأكيد عندما تريد إضافة صفحة أو مقالة جديدة في موقعك الووردبريس، فأنت تت ... <a class="cz_readmore" href="https://arabic-themes.com/the-gutenburg-component-editor-is-fully-explained/"><i class="fas fa-book-reader" aria-hidden="true"></i><span>اقرأ المزيد</span></a></p>
<p>The post <a href="https://arabic-themes.com/the-gutenburg-component-editor-is-fully-explained/">شرح محرر المكونات Gutenburg لإضافة الصفحات والمقالات</a> appeared first on <a href="https://arabic-themes.com">قوالب ووردبريس عربية</a>.</p>
]]></description>
										<content:encoded><![CDATA[
<p class="has-text-align-right wp-block-paragraph">بالتأكيد عندما تريد إضافة صفحة أو مقالة جديدة في موقعك الووردبريس، فأنت تتعامل مع محرر Gutenberg والذي يحتوي على العديد من المكونات والخيارات التي لم تكون في المحرر القديم TinyMCE.</p>



<p class="has-text-align-right wp-block-paragraph">&nbsp;يستخدم ووردبريس لإنشاء العديد من أنواع المواقع، ولذلك ظهر المحرر الجديد للتعامل مع جميع أنواع المواقع وجعلها أكثر تخصيصًا لأصحاب المواقع، حيث يعمل محرر غوتبرج بنظام الحاويات (Blocks) وهي عبارة عن مجموعة من العناصر أو البيانات الموجودة داخل حاوية محددة.</p>



<p class="has-text-align-right wp-block-paragraph">في هذا المقال سنشرح لك كافة الإمكانيات والخيارات التي يوفرها هذا المحرر والتي ستساعدك في إنتاج المحتوى بشكل أفضل، وسنتعرف على بعض الخصائص التي قد لا تكون تعرفها من قبل.</p>



<h2 class="wp-block-heading has-text-align-right">المكونات الرئيسية للمحرر</h2>



<p class="has-text-align-right wp-block-paragraph">قبل شرح المكونات الرئيسية يجب علينا معرفة أن محرر جوتنبرج يستخدم لإنشاء صفحات و مقالات، وإذا كان&nbsp;موقعك للتجارة الالكترونية&nbsp;فإنه يستخدم لإنشاء المنتجات أيضا لانشاء صفحة جديدة.</p>



<p class="has-text-align-right wp-block-paragraph">ستعتمد على المحرر عندما تريد إضافة صفحة جديدة عندما تتوجه في القائمة الجانبية إلى (<strong>صفحات &lt;&lt; أضف جديد)</strong></p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img fetchpriority="high" decoding="async" width="457" height="286" src="https://arabic-themes.com/wp-content/uploads/2023/08/Page-New-edited.jpg" alt="" class="wp-image-4399" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Page-New-edited.jpg 457w, https://arabic-themes.com/wp-content/uploads/2023/08/Page-New-edited-300x188.jpg 300w" sizes="(max-width: 457px) 100vw, 457px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">ونفس الأمر عندما تضيف مقالًا جديدًا (<strong>مقالات &lt;&lt; أضف جديد)،&nbsp;</strong>فستعتمد على نفس المحرر أيضا</p>


<div class="wp-block-image">
<figure class="aligncenter size-full is-resized"><img decoding="async" src="https://arabic-themes.com/wp-content/uploads/2023/08/PostNew-edited-1.jpg" alt="" class="wp-image-4400" width="425" height="239" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/PostNew-edited-1.jpg 427w, https://arabic-themes.com/wp-content/uploads/2023/08/PostNew-edited-1-300x169.jpg 300w" sizes="(max-width: 425px) 100vw, 425px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">الآن نستعرض ما تحتويه القائمة الرئيسية لمحرر جوتنبرج، والتي تحتوي على المكونات التالية:</p>



<ul class="wp-block-list">
<li>نص</li>



<li>وسائط</li>



<li>تصميم</li>



<li>ودجات</li>



<li>تضمينات&nbsp;</li>
</ul>



<p class="has-text-align-right wp-block-paragraph">كل مكون يحتوي على العديد من العناصر وكل عنصر يستخدم معه أدوات خاصة به،<br>لإظهار القائمة الرئيسية لمحرر غوتنبرغ اذهب لصفحة المحرر الذي تكتب فيه ثم انقر على علامة (+ أضف مكون) كما بالشكل التالي</p>


<div class="wp-block-image">
<figure class="aligncenter size-full is-resized"><img decoding="async" src="https://arabic-themes.com/wp-content/uploads/2023/08/To-Show-Editor-Menu-1024x245-2.jpg" alt="" class="wp-image-4409" width="810" height="193" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/To-Show-Editor-Menu-1024x245-2.jpg 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/To-Show-Editor-Menu-1024x245-2-600x144.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/To-Show-Editor-Menu-1024x245-2-300x72.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/To-Show-Editor-Menu-1024x245-2-768x184.jpg 768w" sizes="(max-width: 810px) 100vw, 810px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">بعد الضغط على علامة&nbsp;<strong>+&nbsp;</strong>سيظهر لك قائمة المحرر بالمكونات المهمة</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="1024" height="430" src="https://arabic-themes.com/wp-content/uploads/2023/08/Editor-Main-Menu-1024x430-1.jpg" alt="" class="wp-image-4411" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Editor-Main-Menu-1024x430-1.jpg 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/Editor-Main-Menu-1024x430-1-600x252.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/Editor-Main-Menu-1024x430-1-300x126.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/Editor-Main-Menu-1024x430-1-768x323.jpg 768w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /></figure>



<p class="has-text-align-right wp-block-paragraph">إذا استعرضنا جميع تلك المكونات بشكل سريع، فهي على النحو التالي:</p>



<figure class="wp-block-image size-full is-resized"><img loading="lazy" decoding="async" src="https://arabic-themes.com/wp-content/uploads/2023/08/editor-Component-1024x1008-1.jpg" alt="" class="wp-image-4412" width="840" height="826" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/editor-Component-1024x1008-1.jpg 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/editor-Component-1024x1008-1-600x591.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/editor-Component-1024x1008-1-300x295.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/editor-Component-1024x1008-1-768x756.jpg 768w" sizes="auto, (max-width: 840px) 100vw, 840px" /></figure>



<p class="has-text-align-right wp-block-paragraph">بالشكل السابق يمكنك الإطلاع سريعًا على كافة مكونات المحرر، ولنتحدث الآن على كل مكون على حدة</p>



<h2 class="wp-block-heading has-text-align-right">أولا إضافة نص</h2>



<p class="wp-block-paragraph">يحتوي المكون الأساسي (نص) على مكونات فرعية كالتالي:</p>



<ol class="wp-block-list">
<li>عنوان</li>



<li>فقرة</li>



<li>قائمة</li>



<li>إقتباس</li>



<li>شفرة</li>



<li>تقليدي</li>



<li>مهيأ مسبقا</li>



<li>إقتباس مائل</li>



<li>جدول</li>



<li>بيت شعر أو عبارة</li>
</ol>



<h2 class="wp-block-heading has-text-align-right"><strong>1- إضافة عنوان</strong></h2>



<p class="has-text-align-right wp-block-paragraph">أول عنصر من عناصر المحتوى هو (<strong>العنوان)،&nbsp;</strong>وتستطيع إضافتها كما بالشكل التالي</p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="1024" height="490" src="https://arabic-themes.com/wp-content/uploads/2023/08/H2-title-1024x490-1.jpg" alt="" class="wp-image-4415" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/H2-title-1024x490-1.jpg 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/H2-title-1024x490-1-600x287.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/H2-title-1024x490-1-300x144.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/H2-title-1024x490-1-768x368.jpg 768w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">ثم تحدد نوع العنوان، سواءًا كان عنوانًا رئيسًا أو فرعيًا، (H1,H2,H3 ..H6)، وتجد معه امكانية كتابة الخط بشكل مائل و خط عريض وايضا رابط تشعبي ولكن لا يحبذ ان يتم استخدام خط مائل او عريض في العناوين الفرعية</p>


<div class="wp-block-image">
<figure class="aligncenter size-full is-resized"><img loading="lazy" decoding="async" src="https://arabic-themes.com/wp-content/uploads/2023/08/H2-Write-Introduction-1024x455-1.jpg" alt="" class="wp-image-4416" width="840" height="373" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/H2-Write-Introduction-1024x455-1.jpg 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/H2-Write-Introduction-1024x455-1-600x267.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/H2-Write-Introduction-1024x455-1-300x133.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/H2-Write-Introduction-1024x455-1-768x341.jpg 768w" sizes="auto, (max-width: 840px) 100vw, 840px" /></figure>
</div>


<h2 class="wp-block-heading has-text-align-right"><strong>2- إضافة فقرة</strong></h2>



<p class="has-text-align-right wp-block-paragraph">العنصر التالي هو عنصر فقرة، والذي يحتوي على فقرات النصوص المتتالية، تستطيع إضافة فقرة من خلال الضغط على علامة الإضافة&nbsp;<strong>(+)&nbsp;</strong>ثم تختر&nbsp;<strong>(فقرة)</strong></p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="1024" height="538" src="https://arabic-themes.com/wp-content/uploads/2023/08/pragraph-1024x538-1.jpg" alt="" class="wp-image-4417" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/pragraph-1024x538-1.jpg 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/pragraph-1024x538-1-600x315.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/pragraph-1024x538-1-300x158.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/pragraph-1024x538-1-768x404.jpg 768w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /></figure>



<p class="has-text-align-right wp-block-paragraph">ثم تبدأ في كتابة فقرة المحتوى بشكل مرتب ومسلسل</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="747" height="468" src="https://arabic-themes.com/wp-content/uploads/2023/08/write-Pragraph-edited.jpg" alt="" class="wp-image-4418" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/write-Pragraph-edited.jpg 747w, https://arabic-themes.com/wp-content/uploads/2023/08/write-Pragraph-edited-600x376.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/write-Pragraph-edited-300x188.jpg 300w" sizes="auto, (max-width: 747px) 100vw, 747px" /></figure>



<p class="has-text-align-right wp-block-paragraph">ثم تستطيع بعد ذلك عمل تغيير الخط أو عمل رابط تشعبي أو محاذاة النص يمينا او في المنتصف او يسارا او بعض العمليات الاخرى كما يوضحها الشكل التالي</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="1024" height="625" src="https://arabic-themes.com/wp-content/uploads/2023/08/other-pragraph-Tools-1024x625-1.jpg" alt="" class="wp-image-4419" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/other-pragraph-Tools-1024x625-1.jpg 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/other-pragraph-Tools-1024x625-1-600x366.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/other-pragraph-Tools-1024x625-1-300x183.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/other-pragraph-Tools-1024x625-1-768x469.jpg 768w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /></figure>



<h2 class="wp-block-heading has-text-align-right"><strong>3- إضافة قائمة</strong></h2>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="1024" height="430" src="https://arabic-themes.com/wp-content/uploads/2023/08/list-1024x430-1.jpg" alt="" class="wp-image-4420" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/list-1024x430-1.jpg 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/list-1024x430-1-600x252.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/list-1024x430-1-300x126.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/list-1024x430-1-768x323.jpg 768w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /></figure>



<p class="has-text-align-right wp-block-paragraph">الان يمكنك التحكم في نمط محتويات القائمة مباشرة كالتالي، حيث يمكنك اختيار قائمة نقطية أو قائمة مرقمة ومن خلال السهم في آخر قائمة أدوات يمكن التحكم في اللون ووضع خط أسفل النص أو في وسطه وغيرها من الأدوات</p>



<figure class="wp-block-image size-full is-resized"><img loading="lazy" decoding="async" src="https://arabic-themes.com/wp-content/uploads/2023/08/Edit-List-1024x542-1.jpg" alt="" class="wp-image-4421" width="840" height="444" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Edit-List-1024x542-1.jpg 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/Edit-List-1024x542-1-600x318.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/Edit-List-1024x542-1-300x159.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/Edit-List-1024x542-1-768x407.jpg 768w" sizes="auto, (max-width: 840px) 100vw, 840px" /></figure>



<p class="has-text-align-right wp-block-paragraph">وتستطيع تغيير اللون ونمط الخط ونمط القائمة من شريط الأدوات</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="800" height="500" src="https://arabic-themes.com/wp-content/uploads/2023/08/Edit-List-With-Bold-Color-Numbers-edited.jpg" alt="" class="wp-image-4422" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Edit-List-With-Bold-Color-Numbers-edited.jpg 800w, https://arabic-themes.com/wp-content/uploads/2023/08/Edit-List-With-Bold-Color-Numbers-edited-600x375.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/Edit-List-With-Bold-Color-Numbers-edited-300x188.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/Edit-List-With-Bold-Color-Numbers-edited-768x480.jpg 768w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<h2 class="wp-block-heading has-text-align-right"><strong>4- إضافة إقتباس</strong></h2>



<p class="has-text-align-right wp-block-paragraph">العنصر التالي هو “<strong>الاقتباس”&nbsp;</strong>والذي يستخدم لعمل شكل متميز لوضع مقولة مقتبسة لأحد المشهورين، مع امكانية وضع اسم قائل هذه المقولة</p>



<p class="has-text-align-right wp-block-paragraph">لعمل ذلك اضغط على علامة<strong>&nbsp;+</strong>&nbsp;واختار “<strong>اقتباس”</strong></p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="798" height="532" src="https://arabic-themes.com/wp-content/uploads/2023/08/quotation-Item-edited.jpg" alt="" class="wp-image-4423" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/quotation-Item-edited.jpg 798w, https://arabic-themes.com/wp-content/uploads/2023/08/quotation-Item-edited-600x400.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/quotation-Item-edited-300x200.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/quotation-Item-edited-768x512.jpg 768w" sizes="auto, (max-width: 798px) 100vw, 798px" /></figure>



<p class="has-text-align-right wp-block-paragraph">&nbsp;بعد اختيار عنصر اقتباس ضع المقولة واسم قائلها كالتالي&nbsp;</p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="499" height="281" src="https://arabic-themes.com/wp-content/uploads/2023/08/quotation-edited.jpg" alt="" class="wp-image-4424" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/quotation-edited.jpg 499w, https://arabic-themes.com/wp-content/uploads/2023/08/quotation-edited-300x169.jpg 300w" sizes="auto, (max-width: 499px) 100vw, 499px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">ثم انقر علامة الاقتباس واختار خط مائل</p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="722" height="540" src="https://arabic-themes.com/wp-content/uploads/2023/08/quotation-appear-edited.jpg" alt="" class="wp-image-4436" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/quotation-appear-edited.jpg 722w, https://arabic-themes.com/wp-content/uploads/2023/08/quotation-appear-edited-600x449.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/quotation-appear-edited-300x224.jpg 300w" sizes="auto, (max-width: 722px) 100vw, 722px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">ليصبح الشكل الناتج كالتالي</p>


<div class="wp-block-image">
<figure class="aligncenter size-full is-resized"><img loading="lazy" decoding="async" src="https://arabic-themes.com/wp-content/uploads/2023/08/quotation-look-edited.jpg" alt="" class="wp-image-4439" width="550" height="413" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/quotation-look-edited.jpg 550w, https://arabic-themes.com/wp-content/uploads/2023/08/quotation-look-edited-300x225.jpg 300w" sizes="auto, (max-width: 550px) 100vw, 550px" /></figure>
</div>


<h2 class="wp-block-heading has-text-align-right"><strong>5- إضافة شفرة</strong></h2>



<p class="has-text-align-right wp-block-paragraph">سنستخدم الان عنصر “<strong>شفرة”</strong>والذي يستخدم غالبًا لإضافة الأكواد البرمجية لتصبح بشكل منسق على النحو التالي:</p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="715" height="535" src="https://arabic-themes.com/wp-content/uploads/2023/08/code-Item-edited.jpg" alt="" class="wp-image-4440" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/code-Item-edited.jpg 715w, https://arabic-themes.com/wp-content/uploads/2023/08/code-Item-edited-600x449.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/code-Item-edited-300x224.jpg 300w" sizes="auto, (max-width: 715px) 100vw, 715px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">يظهر لك مربع كتابة الكود والذي سيكون أكثر تنسيقًا مما لو كتبته في فقرة عادية</p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="1024" height="290" src="https://arabic-themes.com/wp-content/uploads/2023/08/Write-Code-1024x290-1.jpg" alt="" class="wp-image-4441" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Write-Code-1024x290-1.jpg 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/Write-Code-1024x290-1-600x170.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/Write-Code-1024x290-1-300x85.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/Write-Code-1024x290-1-768x218.jpg 768w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /></figure>
</div>


<h2 class="wp-block-heading has-text-align-right"><strong>6- إضافة عنصر تقليدي</strong></h2>



<p class="has-text-align-right wp-block-paragraph">لعمل نص تقليدي اختر مكون نص ثم الايقونة تقليدي كالتالي</p>



<figure class="wp-block-image size-full is-resized"><img loading="lazy" decoding="async" src="https://arabic-themes.com/wp-content/uploads/2023/08/traditional-Item-1024x426-1.jpg" alt="" class="wp-image-4442" width="840" height="349" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/traditional-Item-1024x426-1.jpg 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/traditional-Item-1024x426-1-600x250.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/traditional-Item-1024x426-1-300x125.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/traditional-Item-1024x426-1-768x320.jpg 768w" sizes="auto, (max-width: 840px) 100vw, 840px" /></figure>



<p class="has-text-align-right wp-block-paragraph">سيظهر لك المحرر التقليدي القديم ، يمكنك الكتابة واضافة اي نص تريد مع كل الامكانيات كما يظهر بالشكل</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="1024" height="602" src="https://arabic-themes.com/wp-content/uploads/2023/08/Gutenburg-write-editor-comprehensive-explanation-150x150-4.jpg" alt="" class="wp-image-4455" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Gutenburg-write-editor-comprehensive-explanation-150x150-4.jpg 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/Gutenburg-write-editor-comprehensive-explanation-150x150-4-600x353.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/Gutenburg-write-editor-comprehensive-explanation-150x150-4-300x176.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/Gutenburg-write-editor-comprehensive-explanation-150x150-4-768x452.jpg 768w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /></figure>



<p class="has-text-align-right wp-block-paragraph"><strong>7- إضافة محتوى مهيأ مسبقا</strong></p>



<p class="has-text-align-right wp-block-paragraph">لاضافة هذا العنصر اذهب للقائمة الرئيسية وقم باختياره&nbsp;</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="1024" height="433" src="https://arabic-themes.com/wp-content/uploads/2023/08/previous-1024x433-1.jpg" alt="" class="wp-image-4456" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/previous-1024x433-1.jpg 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/previous-1024x433-1-600x254.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/previous-1024x433-1-300x127.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/previous-1024x433-1-768x325.jpg 768w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /></figure>



<p class="has-text-align-right wp-block-paragraph">فائدة هذا العنصر انك يمكن ان تقوم بإدخال نص كنت قد قمت بتهيئته مسبقا في احد الملفات النصية وهو يحافظ على النمط المنقول انظر التالي</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="1024" height="416" src="https://arabic-themes.com/wp-content/uploads/2023/08/previous-Write-1024x416-1.jpg" alt="" class="wp-image-4458" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/previous-Write-1024x416-1.jpg 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/previous-Write-1024x416-1-600x244.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/previous-Write-1024x416-1-300x122.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/previous-Write-1024x416-1-768x312.jpg 768w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /></figure>



<h2 class="wp-block-heading has-text-align-right"><strong>8-  إضافة اقتباس مائل</strong></h2>



<p class="has-text-align-right wp-block-paragraph">لا يختلف عنصر اقتباس مائل عن عنصر إقتباس حيث ان به نفس الأدوات ولاختياره قم بالذهاب للقائمة الرئيسية واختر اقتباس مائل&nbsp;</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="716" height="538" src="https://arabic-themes.com/wp-content/uploads/2023/08/quotation2-edited.jpg" alt="" class="wp-image-4459" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/quotation2-edited.jpg 716w, https://arabic-themes.com/wp-content/uploads/2023/08/quotation2-edited-600x451.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/quotation2-edited-300x225.jpg 300w" sizes="auto, (max-width: 716px) 100vw, 716px" /></figure>



<p class="has-text-align-right wp-block-paragraph">بعد اختيار عنصر اقتباس مائل قم بإدخال النص والتحكم في أسلوب عرضه كالتالي</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="1024" height="683" src="https://arabic-themes.com/wp-content/uploads/2023/08/quotation-choose-edited-1024x683.jpg" alt="" class="wp-image-4460" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/quotation-choose-edited-1024x683.jpg 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/quotation-choose-edited-600x400.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/quotation-choose-edited-300x200.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/quotation-choose-edited-768x512.jpg 768w, https://arabic-themes.com/wp-content/uploads/2023/08/quotation-choose-edited.jpg 1059w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /></figure>



<p class="has-text-align-right wp-block-paragraph">ويظهر لك الناتج كما بالشكل التالي</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="964" height="641" src="https://arabic-themes.com/wp-content/uploads/2023/08/quotation-No-Differ-edited.jpg" alt="" class="wp-image-4461" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/quotation-No-Differ-edited.jpg 964w, https://arabic-themes.com/wp-content/uploads/2023/08/quotation-No-Differ-edited-600x399.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/quotation-No-Differ-edited-300x199.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/quotation-No-Differ-edited-768x511.jpg 768w" sizes="auto, (max-width: 964px) 100vw, 964px" /></figure>



<h2 class="wp-block-heading has-text-align-right"><strong>9- إضافة جدول</strong></h2>



<p class="has-text-align-right wp-block-paragraph">لعمل جدول بيانات داخل المحتوى الخاص بك، فيمكنك استخدام عنصر&nbsp;<strong>“جدول”&nbsp;</strong>من القائمة الرئيسية ثم اختياره من المكون نص</p>



<figure class="wp-block-image size-full is-resized"><img loading="lazy" decoding="async" src="https://arabic-themes.com/wp-content/uploads/2023/08/Table-1024x436-1.jpg" alt="" class="wp-image-4462" width="840" height="357" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Table-1024x436-1.jpg 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/Table-1024x436-1-600x255.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/Table-1024x436-1-300x128.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/Table-1024x436-1-768x327.jpg 768w" sizes="auto, (max-width: 840px) 100vw, 840px" /></figure>



<p class="has-text-align-right wp-block-paragraph">يظهر أدوات عمل الجدول كالتالي قم بإضافة عدد الصفوف والاعمدة</p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="678" height="453" src="https://arabic-themes.com/wp-content/uploads/2023/08/Table-Rows-Columns-edited.jpg" alt="" class="wp-image-4464" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Table-Rows-Columns-edited.jpg 678w, https://arabic-themes.com/wp-content/uploads/2023/08/Table-Rows-Columns-edited-600x401.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/Table-Rows-Columns-edited-300x200.jpg 300w" sizes="auto, (max-width: 678px) 100vw, 678px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">,ولإضافة عمود او صف جديد قبل او بعد الصف أو العمود المحدد اختار الاداة التالية&nbsp;</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="703" height="469" src="https://arabic-themes.com/wp-content/uploads/2023/08/Table-Add-Fields-edited.jpg" alt="" class="wp-image-4465" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Table-Add-Fields-edited.jpg 703w, https://arabic-themes.com/wp-content/uploads/2023/08/Table-Add-Fields-edited-600x400.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/Table-Add-Fields-edited-300x200.jpg 300w" sizes="auto, (max-width: 703px) 100vw, 703px" /></figure>



<p class="wp-block-paragraph"><strong>10- عنصر بيت شعر أو عبارة</strong></p>



<p class="has-text-align-right wp-block-paragraph"><strong>10- عنصر بيت شعر أو عبارة</strong></p>



<p class="has-text-align-right wp-block-paragraph">لعمل تهيئة لـ بيت شعر او عبارة بصورة صحيحة اذهب الى القائمة الرئيسية واختار هذا العنصر</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="828" height="552" src="https://arabic-themes.com/wp-content/uploads/2023/08/poletryAdd-edited.jpg" alt="" class="wp-image-4466" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/poletryAdd-edited.jpg 828w, https://arabic-themes.com/wp-content/uploads/2023/08/poletryAdd-edited-600x400.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/poletryAdd-edited-300x200.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/poletryAdd-edited-768x512.jpg 768w" sizes="auto, (max-width: 828px) 100vw, 828px" /></figure>



<p class="has-text-align-right wp-block-paragraph">ثم ستجد نفس الأدوات العامة ستجدها لتهيئة بيت الشعر أو العبارة</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="748" height="560" src="https://arabic-themes.com/wp-content/uploads/2023/08/poletry-Write-edited.jpg" alt="" class="wp-image-4467" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/poletry-Write-edited.jpg 748w, https://arabic-themes.com/wp-content/uploads/2023/08/poletry-Write-edited-600x449.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/poletry-Write-edited-300x225.jpg 300w" sizes="auto, (max-width: 748px) 100vw, 748px" /></figure>



<h2 class="wp-block-heading has-text-align-right">ثانيا: إضافة وسائط<br></h2>



<p class="wp-block-paragraph">ويحتوي على العناصر التالية</p>



<ol class="wp-block-list">
<li>عنصر صورة</li>



<li>عنصر مقارنة صور</li>



<li>عنصر عرض شرائح</li>



<li>عنصر معرض متجانب</li>



<li>عنصر معرض</li>



<li>عنصر صوت</li>



<li>عنصر غلاف</li>



<li>عنصر ملف</li>



<li>عنصر وسائط من نص</li>



<li>عنصر فيديو</li>
</ol>



<h2 class="wp-block-heading has-text-align-right"><strong>1- إضافة صورة</strong></h2>



<p class="has-text-align-right wp-block-paragraph">الآن سنقوم بإضافة صورة ولعمل ذلك اذهب الى المكون الثاني (وسائط) واختار منه العنصر صورة كالتالي</p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="540" height="863" src="https://arabic-themes.com/wp-content/uploads/2023/08/Add-Image-edited.jpg" alt="" class="wp-image-4468" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Add-Image-edited.jpg 540w, https://arabic-themes.com/wp-content/uploads/2023/08/Add-Image-edited-188x300.jpg 188w" sizes="auto, (max-width: 540px) 100vw, 540px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">ستظهر لك الصورة مع الأدوات حيث يمكنك رفع الصورة التي تريد أو يمكنك ارفاق رابط للصورة من اي موقع اخر او حتى موقعك او حتى اختيار صورة كنت قد رفعتها سابقا</p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="457" height="290" src="https://arabic-themes.com/wp-content/uploads/2023/08/Upload-Image-edited.jpg" alt="" class="wp-image-4469" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Upload-Image-edited.jpg 457w, https://arabic-themes.com/wp-content/uploads/2023/08/Upload-Image-edited-300x190.jpg 300w" sizes="auto, (max-width: 457px) 100vw, 457px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">من خلال الضغط على زر رفع لتقوم برفع الصورة من حاسوبك، ثم تقوم بتحديد الصورة المطلوبة</p>


<div class="wp-block-image">
<figure class="aligncenter size-full is-resized"><img loading="lazy" decoding="async" src="https://arabic-themes.com/wp-content/uploads/2023/08/select-Image-edited.jpg" alt="" class="wp-image-4470" width="800" height="503" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/select-Image-edited.jpg 800w, https://arabic-themes.com/wp-content/uploads/2023/08/select-Image-edited-600x377.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/select-Image-edited-300x189.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/select-Image-edited-768x483.jpg 768w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">بعد رفع الصورة يظهر لك أدوات التحكم في الصورة وأيضا أدوات لكتابة تسمية توضيحية للصورة كالتالي</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="1024" height="683" src="https://arabic-themes.com/wp-content/uploads/2023/08/Edite-Image-edited-1024x683.jpg" alt="" class="wp-image-4471" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Edite-Image-edited-1024x683.jpg 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/Edite-Image-edited-600x400.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/Edite-Image-edited-300x200.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/Edite-Image-edited-768x512.jpg 768w, https://arabic-themes.com/wp-content/uploads/2023/08/Edite-Image-edited.jpg 1027w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /></figure>



<p class="has-text-align-right wp-block-paragraph">الأدوات المستخدمة للصورة تستخدم لعمل قص للصورة واستبدالها اذا اردت ومحاذاتها وايضا عمل رابط تشعبي لها</p>



<h2 class="wp-block-heading has-text-align-right"><strong>2-&nbsp;إضافة</strong>&nbsp;<strong>مقارنة صور&nbsp;</strong></h2>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="455" height="606" src="https://arabic-themes.com/wp-content/uploads/2023/08/compare-Images-edited.jpg" alt="" class="wp-image-4472" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/compare-Images-edited.jpg 455w, https://arabic-themes.com/wp-content/uploads/2023/08/compare-Images-edited-225x300.jpg 225w" sizes="auto, (max-width: 455px) 100vw, 455px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">لتحميل الصورتين قبل التعديل وبعده قم بعمل رفع عن طريق مربع الحوار الذي يظهر لك عند استخدامك العنصر</p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="582" height="348" src="https://arabic-themes.com/wp-content/uploads/2023/08/compareI-mages-Upload-edited.jpg" alt="" class="wp-image-4473" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/compareI-mages-Upload-edited.jpg 582w, https://arabic-themes.com/wp-content/uploads/2023/08/compareI-mages-Upload-edited-300x179.jpg 300w" sizes="auto, (max-width: 582px) 100vw, 582px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">يظهر لك حدا فاصلًا بين الصورتين يمكن تغير ابعاده بالنقر عليه وسحبه&nbsp;</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="800" height="574" src="https://arabic-themes.com/wp-content/uploads/2023/08/compare-ImagesDone-edited.jpg" alt="" class="wp-image-4474" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/compare-ImagesDone-edited.jpg 800w, https://arabic-themes.com/wp-content/uploads/2023/08/compare-ImagesDone-edited-600x431.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/compare-ImagesDone-edited-300x215.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/compare-ImagesDone-edited-768x551.jpg 768w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<h2 class="wp-block-heading has-text-align-right"><strong>3- &nbsp;إضافة</strong>&nbsp;<strong>عرض شرائح&nbsp;</strong></h2>



<p class="has-text-align-right wp-block-paragraph">لعرض شرائح من الصور بشكل جذاب يمكنك استخدام العنصر عرض شرائح عن طريق الذهاب إلى القائمة الرئيسية واختياره</p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="488" height="868" src="https://arabic-themes.com/wp-content/uploads/2023/08/slider-Item-edited.jpg" alt="" class="wp-image-4476" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/slider-Item-edited.jpg 488w, https://arabic-themes.com/wp-content/uploads/2023/08/slider-Item-edited-169x300.jpg 169w" sizes="auto, (max-width: 488px) 100vw, 488px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">سيظهر لك مربع حوار لرفع الصور التي تريد عرضها، ثم ستضغظ على زر رفع وتختر الصور المراد عرضها&nbsp;</p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="581" height="340" src="https://arabic-themes.com/wp-content/uploads/2023/08/slider-Upload-edited.jpg" alt="" class="wp-image-4477" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/slider-Upload-edited.jpg 581w, https://arabic-themes.com/wp-content/uploads/2023/08/slider-Upload-edited-300x176.jpg 300w" sizes="auto, (max-width: 581px) 100vw, 581px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">لإضافة أية عدد من الصور يمكنك نقر علامة&nbsp;<strong>+</strong>&nbsp;الموجودة أسفل الشرائح ورفع صور اخرى</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="800" height="450" src="https://arabic-themes.com/wp-content/uploads/2023/08/slider-Upload2-edited.jpg" alt="" class="wp-image-4478" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/slider-Upload2-edited.jpg 800w, https://arabic-themes.com/wp-content/uploads/2023/08/slider-Upload2-edited-600x338.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/slider-Upload2-edited-300x169.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/slider-Upload2-edited-768x432.jpg 768w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p class="has-text-align-right wp-block-paragraph">الشكل التالي يوضح لك الناتج النهائي وكيف يمكن أن يظهر للزائرين في مقالك او صفحتك&nbsp;</p>



<figure class="wp-block-image size-large is-resized"><img loading="lazy" decoding="async" src="https://arabic-themes.com/wp-content/uploads/2023/08/slider-1024x576.gif" alt="" class="wp-image-4479" width="840" height="472" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/slider-1024x576.gif 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/slider-600x338.gif 600w, https://arabic-themes.com/wp-content/uploads/2023/08/slider-300x169.gif 300w, https://arabic-themes.com/wp-content/uploads/2023/08/slider-768x432.gif 768w" sizes="auto, (max-width: 840px) 100vw, 840px" /></figure>



<h2 class="wp-block-heading has-text-align-right"><strong>4- &nbsp;عنصر معرض متجانب&nbsp;</strong><br></h2>



<p class="has-text-align-right wp-block-paragraph">لإظهار الصور بشكل متجانب قم بالذهاب الى القائمة الرئيسية واختر عنصر&nbsp;<strong>معرض متجانب</strong></p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="534" height="853" src="https://arabic-themes.com/wp-content/uploads/2023/08/gallery-Item-edited.jpg" alt="" class="wp-image-4480" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/gallery-Item-edited.jpg 534w, https://arabic-themes.com/wp-content/uploads/2023/08/gallery-Item-edited-188x300.jpg 188w" sizes="auto, (max-width: 534px) 100vw, 534px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">يظهر لك مربع حوار للمساعدة على رفع الصور قم بالنقر على زر رفع لمجموعة من الصور لإظهارها في المعرض&nbsp;</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="560" height="896" src="https://arabic-themes.com/wp-content/uploads/2023/08/Gallery-Upload-edited.jpg" alt="" class="wp-image-4481" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Gallery-Upload-edited.jpg 560w, https://arabic-themes.com/wp-content/uploads/2023/08/Gallery-Upload-edited-188x300.jpg 188w" sizes="auto, (max-width: 560px) 100vw, 560px" /></figure>



<p class="has-text-align-right wp-block-paragraph">ستظهر لك الصور بشكل متناسق كما بالشكل التالي</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="800" height="450" src="https://arabic-themes.com/wp-content/uploads/2023/08/Gallery-show-1-edited.jpg" alt="" class="wp-image-4483" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Gallery-show-1-edited.jpg 800w, https://arabic-themes.com/wp-content/uploads/2023/08/Gallery-show-1-edited-600x338.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/Gallery-show-1-edited-300x169.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/Gallery-show-1-edited-768x432.jpg 768w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p class="has-text-align-right wp-block-paragraph">لتغير طريقة عرض الشرائح اذهب الى الأدوات الخاصة وانقر تغير نوع او نمط المكون واختار تغير النمط كما تريد ان يظهر كما بالشكل التالي&nbsp;&nbsp;&nbsp;</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="1024" height="576" src="https://arabic-themes.com/wp-content/uploads/2023/08/gallery-1024x576.gif" alt="" class="wp-image-4485" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/gallery-1024x576.gif 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/gallery-600x338.gif 600w, https://arabic-themes.com/wp-content/uploads/2023/08/gallery-300x169.gif 300w, https://arabic-themes.com/wp-content/uploads/2023/08/gallery-768x432.gif 768w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /></figure>



<p class="has-text-align-right wp-block-paragraph">لاختيار مرشح الصور وتغير الوانها بالمرشحات المعطاه قم بالتالي&nbsp;</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="1024" height="576" src="https://arabic-themes.com/wp-content/uploads/2023/08/gallery-Filter-1024x576.gif" alt="" class="wp-image-4486" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/gallery-Filter-1024x576.gif 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/gallery-Filter-600x338.gif 600w, https://arabic-themes.com/wp-content/uploads/2023/08/gallery-Filter-300x169.gif 300w, https://arabic-themes.com/wp-content/uploads/2023/08/gallery-Filter-768x432.gif 768w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /></figure>



<h2 class="wp-block-heading has-text-align-right"><strong>5- إضافة معرض&nbsp;</strong><br></h2>



<p class="has-text-align-right wp-block-paragraph">لإظهار عددًا كبيرًا من الصور بشكل منسق وبترتيب جيد، أضف مكون&nbsp;<strong>(معرض)</strong></p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="522" height="696" src="https://arabic-themes.com/wp-content/uploads/2023/08/Rich-Gallery-Item-edited.jpg" alt="" class="wp-image-4487" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Rich-Gallery-Item-edited.jpg 522w, https://arabic-themes.com/wp-content/uploads/2023/08/Rich-Gallery-Item-edited-225x300.jpg 225w" sizes="auto, (max-width: 522px) 100vw, 522px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">سيظهر لك خيار رفع الصور، ثم قم باختيار عددًا كبيرًا من الصور لمشاهدة ما يمكن ان يقدم لك العنصر</p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="493" height="329" src="https://arabic-themes.com/wp-content/uploads/2023/08/Rich-Gallery-Upload-edited.jpg" alt="" class="wp-image-4488" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Rich-Gallery-Upload-edited.jpg 493w, https://arabic-themes.com/wp-content/uploads/2023/08/Rich-Gallery-Upload-edited-300x200.jpg 300w" sizes="auto, (max-width: 493px) 100vw, 493px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">سيظهر لك المعرض كما بالشكل التالى ولاضافة اي عدد من الصور مرة اخرى ستجد في الأسفل زر رفع</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="1024" height="567" src="https://arabic-themes.com/wp-content/uploads/2023/08/Rich-Gallery-Show-1024x567-1.jpg" alt="" class="wp-image-4489" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Rich-Gallery-Show-1024x567-1.jpg 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/Rich-Gallery-Show-1024x567-1-600x332.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/Rich-Gallery-Show-1024x567-1-300x166.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/Rich-Gallery-Show-1024x567-1-768x425.jpg 768w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /></figure>



<h1 class="wp-block-heading has-text-align-right"><strong>6- إضافة صوت</strong></h1>



<p class="has-text-align-right wp-block-paragraph">اذا اردت إضافة ملفًا صوتيًا ليظهر في مقالك، قم بالذهاب إلى قائمة المكونات واختر&nbsp;<strong>صوت</strong></p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="523" height="696" src="https://arabic-themes.com/wp-content/uploads/2023/08/voice-File-Add-edited.jpg" alt="" class="wp-image-4490" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/voice-File-Add-edited.jpg 523w, https://arabic-themes.com/wp-content/uploads/2023/08/voice-File-Add-edited-225x300.jpg 225w" sizes="auto, (max-width: 523px) 100vw, 523px" /></figure>



<p class="has-text-align-right wp-block-paragraph">سيظهر لك مربع حوار لرفع الملف الصوتي قم باختيار الملف ورفعه كما بالشكلين التاليين&nbsp;</p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="581" height="197" src="https://arabic-themes.com/wp-content/uploads/2023/08/voice-File-Upload-edited.jpg" alt="" class="wp-image-4491" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/voice-File-Upload-edited.jpg 581w, https://arabic-themes.com/wp-content/uploads/2023/08/voice-File-Upload-edited-300x102.jpg 300w" sizes="auto, (max-width: 581px) 100vw, 581px" /></figure>
</div>

<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="799" height="396" src="https://arabic-themes.com/wp-content/uploads/2023/08/voice-File-Show-edited.jpg" alt="" class="wp-image-4492" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/voice-File-Show-edited.jpg 799w, https://arabic-themes.com/wp-content/uploads/2023/08/voice-File-Show-edited-600x297.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/voice-File-Show-edited-300x149.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/voice-File-Show-edited-768x381.jpg 768w" sizes="auto, (max-width: 799px) 100vw, 799px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">سيظهر لك الناتج النهائي كالتالي، حيث يمكنك أيضًا إضافة نصًا أسفل الملف الصوتي بما يقدمه مثلا</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="1024" height="429" src="https://arabic-themes.com/wp-content/uploads/2023/08/voice-File-Show2-1024x429-1.jpg" alt="" class="wp-image-4493" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/voice-File-Show2-1024x429-1.jpg 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/voice-File-Show2-1024x429-1-600x251.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/voice-File-Show2-1024x429-1-300x126.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/voice-File-Show2-1024x429-1-768x322.jpg 768w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /></figure>



<h1 class="wp-block-heading has-text-align-right"><strong>7- إضافة غلاف</strong></h1>



<p class="has-text-align-right wp-block-paragraph">الغلاف هو عبارة عن صورة يمكن الكتابة عليها او داخلها.<br>تستطيع ذلك من خلال الذهاب الى القائمة الرئيسية للمكونات واختيار&nbsp;<strong>غلاف</strong></p>


<div class="wp-block-image">
<figure class="aligncenter size-full is-resized"><img loading="lazy" decoding="async" src="https://arabic-themes.com/wp-content/uploads/2023/08/envelope-edited.jpg" alt="" class="wp-image-4494" width="454" height="605" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/envelope-edited.jpg 454w, https://arabic-themes.com/wp-content/uploads/2023/08/envelope-edited-225x300.jpg 225w" sizes="auto, (max-width: 454px) 100vw, 454px" /></figure>
</div>


<p class="wp-block-paragraph">سيظهر لك الأدوات مع مربع الحوار لرفع الصورة أو اختيار اللون الذي سيظهر به خلفية الكلمات في حالة عدم جعل الخلفية على شكل صورة</p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="457" height="289" src="https://arabic-themes.com/wp-content/uploads/2023/08/envelope-Upload-edited.jpg" alt="" class="wp-image-4495" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/envelope-Upload-edited.jpg 457w, https://arabic-themes.com/wp-content/uploads/2023/08/envelope-Upload-edited-300x190.jpg 300w" sizes="auto, (max-width: 457px) 100vw, 457px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">يظهر لك الناتج النهائي بعد اضافة النص داخل الصورة كما بالشكل التالي</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="799" height="376" src="https://arabic-themes.com/wp-content/uploads/2023/08/envelope-Write-edited.jpg" alt="" class="wp-image-4496" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/envelope-Write-edited.jpg 799w, https://arabic-themes.com/wp-content/uploads/2023/08/envelope-Write-edited-600x282.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/envelope-Write-edited-300x141.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/envelope-Write-edited-768x361.jpg 768w" sizes="auto, (max-width: 799px) 100vw, 799px" /></figure>



<h1 class="wp-block-heading has-text-align-right"><strong>8- إضافة ملف&nbsp;</strong></h1>



<p class="has-text-align-right wp-block-paragraph">اذا اردت رفع ملف على الصفحة ليتم تنزيله بواسطة الزائرين، قم بالذهاب الى القائمة الرئيسية واختر&nbsp;<strong>ملف</strong></p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="463" height="617" src="https://arabic-themes.com/wp-content/uploads/2023/08/File-edited.jpg" alt="" class="wp-image-4497" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/File-edited.jpg 463w, https://arabic-themes.com/wp-content/uploads/2023/08/File-edited-225x300.jpg 225w" sizes="auto, (max-width: 463px) 100vw, 463px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">سيظهر لك الخيار لرفع الملف باي امتداد مثل pdf او docx او غيرها من الامتدادات لكافة انواع الملفات&nbsp;</p>


<div class="wp-block-image">
<figure class="aligncenter size-full is-resized"><img loading="lazy" decoding="async" src="https://arabic-themes.com/wp-content/uploads/2023/08/File-Upload-edited.jpg" alt="" class="wp-image-4498" width="457" height="282" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/File-Upload-edited.jpg 457w, https://arabic-themes.com/wp-content/uploads/2023/08/File-Upload-edited-300x185.jpg 300w" sizes="auto, (max-width: 457px) 100vw, 457px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">بعد أن يتم رفع الملف سيظهر لك كالتالي باسمه وزر تنزيل يمكنك تغير اسمه كما تريد</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="581" height="297" src="https://arabic-themes.com/wp-content/uploads/2023/08/file-Show-edited.jpg" alt="" class="wp-image-4499" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/file-Show-edited.jpg 581w, https://arabic-themes.com/wp-content/uploads/2023/08/file-Show-edited-300x153.jpg 300w" sizes="auto, (max-width: 581px) 100vw, 581px" /></figure>



<h1 class="wp-block-heading has-text-align-right"><strong>9- إضافة وسائط مع نص&nbsp;</strong></h1>



<p class="has-text-align-right wp-block-paragraph">للقيام باضافة وسائط كالصور وإضافة نص بجانبها على اليمين او اليسار، قم باختيار&nbsp;<strong>وسائط مع نص</strong></p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="455" height="608" src="https://arabic-themes.com/wp-content/uploads/2023/08/Media-With-Text-edited.jpg" alt="" class="wp-image-4500" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Media-With-Text-edited.jpg 455w, https://arabic-themes.com/wp-content/uploads/2023/08/Media-With-Text-edited-225x300.jpg 225w" sizes="auto, (max-width: 455px) 100vw, 455px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">سيظهر لك قسمين في مربع الحوار أحدهما لرفع الصورة والآخر لكتابة المحتوى المراد بجانبه، ويمكن أن يكون المحتوى عبارة عن عنوان أو فقرة أو غيرهما</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="582" height="391" src="https://arabic-themes.com/wp-content/uploads/2023/08/Media-With-Text-Upload-edited.jpg" alt="" class="wp-image-4501" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Media-With-Text-Upload-edited.jpg 582w, https://arabic-themes.com/wp-content/uploads/2023/08/Media-With-Text-Upload-edited-300x202.jpg 300w" sizes="auto, (max-width: 582px) 100vw, 582px" /></figure>



<p class="wp-block-paragraph">سيظهر لك قسمين في مربع الحوار أحدهما لرفع الصورة والآخر لكتابة المحتوى المراد بجانبه، ويمكن أن يكون المحتوى عبارة عن عنوان أو فقرة أو غيرهما</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="484" height="303" src="https://arabic-themes.com/wp-content/uploads/2023/08/Video-edited.jpg" alt="" class="wp-image-4502" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Video-edited.jpg 484w, https://arabic-themes.com/wp-content/uploads/2023/08/Video-edited-300x188.jpg 300w" sizes="auto, (max-width: 484px) 100vw, 484px" /></figure>



<h2 class="wp-block-heading has-text-align-right"><strong>10- إضافة فيديو</strong></h2>



<p class="has-text-align-right wp-block-paragraph">لإضافة الفيديو، اذهب إلى القائمة الرئيسية واختر عنصر&nbsp;<strong>فيديو</strong></p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="426" height="215" src="https://arabic-themes.com/wp-content/uploads/2023/08/Video-Upload-edited.jpg" alt="" class="wp-image-4503" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Video-Upload-edited.jpg 426w, https://arabic-themes.com/wp-content/uploads/2023/08/Video-Upload-edited-300x151.jpg 300w" sizes="auto, (max-width: 426px) 100vw, 426px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">ثم قم برفع الفيديو عن طريق مربع الحوار الذي سيظهر لك كما بالشكل التالي</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="1024" height="502" src="https://arabic-themes.com/wp-content/uploads/2023/08/Video-Show-1024x502-1.jpg" alt="" class="wp-image-4504" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Video-Show-1024x502-1.jpg 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/Video-Show-1024x502-1-600x294.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/Video-Show-1024x502-1-300x147.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/Video-Show-1024x502-1-768x377.jpg 768w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /></figure>



<p class="wp-block-paragraph">يمكنك ايضًا احضار رابط من اليوتيوب مثلا او Vimo او أية روابط فيديو اخرى وربطها كالتالي</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="1024" height="536" src="https://arabic-themes.com/wp-content/uploads/2023/08/Video-Add-URL-1024x536-1.jpg" alt="" class="wp-image-4505" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Video-Add-URL-1024x536-1.jpg 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/Video-Add-URL-1024x536-1-600x314.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/Video-Add-URL-1024x536-1-300x157.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/Video-Add-URL-1024x536-1-768x402.jpg 768w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /></figure>



<p class="has-text-align-right wp-block-paragraph">سيظهر لك الفيديو كما بالشكل التالي</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="1024" height="642" src="https://arabic-themes.com/wp-content/uploads/2023/08/Video-YouTube-Link-1024x642-1.jpg" alt="" class="wp-image-4506" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Video-YouTube-Link-1024x642-1.jpg 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/Video-YouTube-Link-1024x642-1-600x376.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/Video-YouTube-Link-1024x642-1-300x188.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/Video-YouTube-Link-1024x642-1-768x482.jpg 768w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /></figure>



<h3 class="wp-block-heading has-text-align-right" id="Design-elements-inGutenberg-editor">ثالثا مكون تصميم وعناصره</h3>



<p class="has-text-align-right wp-block-paragraph">ويحتوي على العناصر التالية</p>



<ol class="wp-block-list">
<li>عنصر ازرار</li>



<li>عنصر أعمدة</li>



<li>عنصر مجموعة</li>



<li>عنصر المزيد</li>



<li>عنصر فاصل صفحة</li>



<li>عنصر فاصل</li>



<li>عنصر فراغ فاصل</li>
</ol>



<p class="has-text-align-right wp-block-paragraph"><strong>1-إضافة الأزرار</strong></p>



<p class="has-text-align-right wp-block-paragraph">لإضافة زر أو أكثر يمكنك الذهاب الى القائمة الرئيسية واختيار&nbsp;<strong>ازرار</strong></p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="656" height="492" src="https://arabic-themes.com/wp-content/uploads/2023/08/buttons-edited.jpg" alt="" class="wp-image-4508" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/buttons-edited.jpg 656w, https://arabic-themes.com/wp-content/uploads/2023/08/buttons-edited-600x450.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/buttons-edited-300x225.jpg 300w" sizes="auto, (max-width: 656px) 100vw, 656px" /></figure>



<p class="has-text-align-right wp-block-paragraph">سيظهر لك الزر اكتب اسمه الداخلي كالتالي ويمكنك عمل رابط تشعبي له ايضا وتغير الخط الى عريض أو مائل</p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="426" height="199" src="https://arabic-themes.com/wp-content/uploads/2023/08/buttons-Add-edited.jpg" alt="" class="wp-image-4511" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/buttons-Add-edited.jpg 426w, https://arabic-themes.com/wp-content/uploads/2023/08/buttons-Add-edited-300x140.jpg 300w" sizes="auto, (max-width: 426px) 100vw, 426px" /></figure>
</div>


<h3 class="wp-block-heading has-text-align-right"><strong>2- إضافة أعمدة</strong></h3>



<p class="has-text-align-right wp-block-paragraph">عنصر&nbsp;<strong>أعمدة&nbsp;</strong>يظهر لك النصوص والصور مقسمة كما تظهر بالصحف العامة، اذهب الى القائمة الرئيسية وختر عنصر&nbsp;<strong>أعمدة</strong></p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="723" height="542" src="https://arabic-themes.com/wp-content/uploads/2023/08/columns-edited.jpg" alt="" class="wp-image-4513" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/columns-edited.jpg 723w, https://arabic-themes.com/wp-content/uploads/2023/08/columns-edited-600x450.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/columns-edited-300x225.jpg 300w" sizes="auto, (max-width: 723px) 100vw, 723px" /></figure>



<p class="has-text-align-right wp-block-paragraph">سيظهر لك العديد من التقسيمات للاعمدة مثل عمودين متساويين في العرض أو أحدهما ضعف الاخر او ثلاث اعمدة</p>


<div class="wp-block-image">
<figure class="aligncenter size-full is-resized"><img loading="lazy" decoding="async" src="https://arabic-themes.com/wp-content/uploads/2023/08/columns-Sepration-edited.jpg" alt="" class="wp-image-4514" width="457" height="328" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/columns-Sepration-edited.jpg 457w, https://arabic-themes.com/wp-content/uploads/2023/08/columns-Sepration-edited-300x215.jpg 300w" sizes="auto, (max-width: 457px) 100vw, 457px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">بعد القيام بالتقسيم يمكنك إضافة فقرات في كل عمود عن طريق النقر على علامة&nbsp;<strong>+&nbsp;</strong>واختيار فقرة</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="800" height="574" src="https://arabic-themes.com/wp-content/uploads/2023/08/columns-Add-Pragraph-edited.jpg" alt="" class="wp-image-4515" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/columns-Add-Pragraph-edited.jpg 800w, https://arabic-themes.com/wp-content/uploads/2023/08/columns-Add-Pragraph-edited-600x431.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/columns-Add-Pragraph-edited-300x215.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/columns-Add-Pragraph-edited-768x551.jpg 768w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p class="has-text-align-right wp-block-paragraph">يمكنك تنسيق النصوص في الاعمدة واضافة خط مائل وخط عريض وعمل روابط تشعبية كما يحدث في أي فقرة عادية</p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="800" height="372" src="https://arabic-themes.com/wp-content/uploads/2023/08/columns-Sepration-Pragraphs-edited.jpg" alt="" class="wp-image-4516" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/columns-Sepration-Pragraphs-edited.jpg 800w, https://arabic-themes.com/wp-content/uploads/2023/08/columns-Sepration-Pragraphs-edited-600x279.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/columns-Sepration-Pragraphs-edited-300x140.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/columns-Sepration-Pragraphs-edited-768x357.jpg 768w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<h2 class="wp-block-heading has-text-align-right"><strong>3- إضافة مجموعة</strong></h2>



<p class="has-text-align-right wp-block-paragraph">لإضافة مكون يجمع مجموعة مكونات أخرى، اذهب الى القائمة الرئيسية واختر&nbsp;<strong>مجموعة</strong></p>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="595" height="794" src="https://arabic-themes.com/wp-content/uploads/2023/08/group-edited.jpg" alt="" class="wp-image-4517" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/group-edited.jpg 595w, https://arabic-themes.com/wp-content/uploads/2023/08/group-edited-225x300.jpg 225w" sizes="auto, (max-width: 595px) 100vw, 595px" /></figure>



<p class="has-text-align-right wp-block-paragraph">يمكنك بعد ذلك النقر على علامة + ووضع أي نوع من أنواع العناصر داخل المجموعة&nbsp;</p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="426" height="267" src="https://arabic-themes.com/wp-content/uploads/2023/08/group-Add-Components-edited.jpg" alt="" class="wp-image-4518" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/group-Add-Components-edited.jpg 426w, https://arabic-themes.com/wp-content/uploads/2023/08/group-Add-Components-edited-300x188.jpg 300w" sizes="auto, (max-width: 426px) 100vw, 426px" /></figure>
</div>


<h1 class="wp-block-heading has-text-align-right"><strong>4- إضافة عنصر المزيد</strong></h1>



<p class="has-text-align-right wp-block-paragraph">عنصر المزيد يستخدم حتى يظهر للمستخدم ليقوم بالنقر عليه لإضافة المزيد من القراءة<br>لتفعيله اذهب إلى القائمة الرئيسية واختر&nbsp;<strong>المزيد</strong></p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="585" height="389" src="https://arabic-themes.com/wp-content/uploads/2023/08/more-edited.jpg" alt="" class="wp-image-4519" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/more-edited.jpg 585w, https://arabic-themes.com/wp-content/uploads/2023/08/more-edited-300x199.jpg 300w" sizes="auto, (max-width: 585px) 100vw, 585px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">سيظهر لك الفاصل كما بالشكل التالي</p>



<p class="wp-block-paragraph"></p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="707" height="398" src="https://arabic-themes.com/wp-content/uploads/2023/08/more-Show-edited.jpg" alt="" class="wp-image-4520" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/more-Show-edited.jpg 707w, https://arabic-themes.com/wp-content/uploads/2023/08/more-Show-edited-600x338.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/more-Show-edited-300x169.jpg 300w" sizes="auto, (max-width: 707px) 100vw, 707px" /></figure>
</div>


<h1 class="wp-block-heading has-text-align-right"><strong>5-إضافة فاصل الصفحة</strong></h1>



<p class="has-text-align-right wp-block-paragraph">عنصر فاصل صفحة ينهي الصفحة الحالية ويضيف ترقيم واحد واثنين في نهاية الصفحة وبعده يتم بداية صفحة جديدة بمحتويات جديدة واذا تم عمل أكثر من فاصل صفحة يتم التقسيم إلى صفحات أكثر</p>



<p class="has-text-align-right wp-block-paragraph">لإضافة هذا العنصر، قم بالذهاب الى القائمة الرئيسية وختر&nbsp;<strong>فاصل الصفحة</strong></p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="462" height="616" src="https://arabic-themes.com/wp-content/uploads/2023/08/Page-Seperation-edited.jpg" alt="" class="wp-image-4522" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Page-Seperation-edited.jpg 462w, https://arabic-themes.com/wp-content/uploads/2023/08/Page-Seperation-edited-225x300.jpg 225w" sizes="auto, (max-width: 462px) 100vw, 462px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">سيظهر التقسيم كحد فاصل كما بالشكل التالي</p>



<figure class="wp-block-image size-full is-resized"><img loading="lazy" decoding="async" src="https://arabic-themes.com/wp-content/uploads/2023/08/Page-Seperation-Add-edited.jpg" alt="" class="wp-image-4523" width="800" height="533" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Page-Seperation-Add-edited.jpg 800w, https://arabic-themes.com/wp-content/uploads/2023/08/Page-Seperation-Add-edited-600x400.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/Page-Seperation-Add-edited-300x200.jpg 300w, https://arabic-themes.com/wp-content/uploads/2023/08/Page-Seperation-Add-edited-768x512.jpg 768w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<h1 class="wp-block-heading has-text-align-right"><strong>6- عنصر فاصل</strong></h1>



<p class="has-text-align-right wp-block-paragraph">يستخدم هذا المكون لعمل فاصل بين الأقسام والأفكار، ولتفعيله اذهب إلى القائمة الرئيسية وقم باختياره من مكون تصميم&nbsp;</p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="368" height="589" src="https://arabic-themes.com/wp-content/uploads/2023/08/seperation-edited.jpg" alt="" class="wp-image-4524" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/seperation-edited.jpg 368w, https://arabic-themes.com/wp-content/uploads/2023/08/seperation-edited-187x300.jpg 187w" sizes="auto, (max-width: 368px) 100vw, 368px" /></figure>
</div>


<h1 class="wp-block-heading has-text-align-right"><strong>7- فراغ</strong></h1>



<p class="has-text-align-right wp-block-paragraph">لعمل فراغ بين أي محتويات بالصفحة باي مسافة تريدها قم باختيار هذا العنصر من القائمة الرئيسية أسفل مكون تصميم</p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="738" height="492" src="https://arabic-themes.com/wp-content/uploads/2023/08/gap-edited.jpg" alt="" class="wp-image-4525" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/gap-edited.jpg 738w, https://arabic-themes.com/wp-content/uploads/2023/08/gap-edited-600x400.jpg 600w, https://arabic-themes.com/wp-content/uploads/2023/08/gap-edited-300x200.jpg 300w" sizes="auto, (max-width: 738px) 100vw, 738px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">يظهر لك الفاصل كما بالشكل التالي ومن النقطة الزرقاء يمكنك زيادة المسافة للفاصل</p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="582" height="302" src="https://arabic-themes.com/wp-content/uploads/2023/08/gap-show-edited.jpg" alt="" class="wp-image-4526" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/gap-show-edited.jpg 582w, https://arabic-themes.com/wp-content/uploads/2023/08/gap-show-edited-300x156.jpg 300w" sizes="auto, (max-width: 582px) 100vw, 582px" /></figure>
</div>


<h1 class="wp-block-heading has-text-align-right" id="Widgets-elements-inGutenberg-editor">رابعا: إضافة ودجات</h1>



<p class="has-text-align-right wp-block-paragraph">يختلف عدد عناصر هذان المكونان حسب ما يوجد لديك من ودجات تم تركيبها على الووردبريس باستخدام القالب الخاص بك غالبًا، وسيتم شرح بعض منها كالتالي</p>



<h2 class="wp-block-heading has-text-align-right"><strong>1-عنصر أخر المقالات&nbsp;</strong></h2>



<p class="has-text-align-right wp-block-paragraph">هذا العنصر يظهر لك قائمة اخر مقالات تم اضافتها او كتابتها مؤخرا<br>لتفعيل العنصر، اذهب إلى القائمة الرئيسية واختر:&nbsp;<strong>آخر المقالات</strong></p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="580" height="774" src="https://arabic-themes.com/wp-content/uploads/2023/08/latest-Articles-edited.jpg" alt="" class="wp-image-4528" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/latest-Articles-edited.jpg 580w, https://arabic-themes.com/wp-content/uploads/2023/08/latest-Articles-edited-225x300.jpg 225w" sizes="auto, (max-width: 580px) 100vw, 580px" /></figure>
</div>


<p class="has-text-align-right wp-block-paragraph">سيظهر لك تلقائيا بآخر المقالات دون تدخل منك كما بالشكل التالي&nbsp;</p>



<h1 class="wp-block-heading has-text-align-right"><strong>2- إضافة أرشيف&nbsp;</strong></h1>



<p class="has-text-align-right wp-block-paragraph">يستخدم عنصر ارشيف لإظهار الأرشيفات بتواريخ المقالات<br>لإضافة أرشيف قم بالذهاب الى القائمة الرئيسية وختر:&nbsp;<strong>أرشيف</strong></p>


<div class="wp-block-image">
<figure class="aligncenter size-full is-resized"><img loading="lazy" decoding="async" src="https://arabic-themes.com/wp-content/uploads/2023/08/Archive-1-edited.jpg" alt="" class="wp-image-4529" width="577" height="768" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/Archive-1-edited.jpg 575w, https://arabic-themes.com/wp-content/uploads/2023/08/Archive-1-edited-225x300.jpg 225w" sizes="auto, (max-width: 577px) 100vw, 577px" /></figure>
</div>


<h1 class="wp-block-heading has-text-align-right">مكون تضمينات وموجز لعناصره</h1>



<p class="has-text-align-right wp-block-paragraph">هناك العديد من العناصر الموجودة في مكون تضمينات مثل عنصر فيسبوك وتويتر ويوتيوب وانستجرام وصور GIF المتحركة وغيرها الكثير من التضمينات من خلالها يمكن وضع منشورات من وسائل التواصل الاجتماعي مثل المنشورات الشكل التالي لبعض ما يمكن تضمينه&nbsp;</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="1024" height="576" src="https://arabic-themes.com/wp-content/uploads/2023/08/include-1024x576.gif" alt="" class="wp-image-4531" srcset="https://arabic-themes.com/wp-content/uploads/2023/08/include-1024x576.gif 1024w, https://arabic-themes.com/wp-content/uploads/2023/08/include-600x338.gif 600w, https://arabic-themes.com/wp-content/uploads/2023/08/include-300x169.gif 300w, https://arabic-themes.com/wp-content/uploads/2023/08/include-768x432.gif 768w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /></figure>



<p class="has-text-align-right wp-block-paragraph">في النهاية نتمنى أن تكون استفدت من هذه المقالة في استخدام محرر Guteberg لإضافة صفحات ومقالات موقعك والتحكم في جميع المكونات بشكل احترافي</p>
<p>The post <a href="https://arabic-themes.com/the-gutenburg-component-editor-is-fully-explained/">شرح محرر المكونات Gutenburg لإضافة الصفحات والمقالات</a> appeared first on <a href="https://arabic-themes.com">قوالب ووردبريس عربية</a>.</p>
]]></content:encoded>
					
					<wfw:commentRss>https://arabic-themes.com/the-gutenburg-component-editor-is-fully-explained/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
	</channel>
</rss>
