<?xml version="1.0"?>
<rss version="2.0"><channel><title>&#x627;&#x644;&#x628;&#x631;&#x627;&#x645;&#x62C; &#x648;&#x627;&#x644;&#x62A;&#x637;&#x628;&#x64A;&#x642;&#x627;&#x62A;: &#x634;&#x631;&#x648;&#x62D;&#x627;&#x62A; &#x648;&#x648;&#x631;&#x62F;&#x628;&#x631;&#x64A;&#x633; WordPress</title><link>https://academy.hsoub.com/apps/web/wordpress/page/10/?d=8</link><description>&#x627;&#x644;&#x628;&#x631;&#x627;&#x645;&#x62C; &#x648;&#x627;&#x644;&#x62A;&#x637;&#x628;&#x64A;&#x642;&#x627;&#x62A;: &#x634;&#x631;&#x648;&#x62D;&#x627;&#x62A; &#x648;&#x648;&#x631;&#x62F;&#x628;&#x631;&#x64A;&#x633; WordPress</description><language>ar</language><item><title>&#x645;&#x648;&#x627;&#x632;&#x646;&#x629; &#x628;&#x64A;&#x646; &#x623;&#x634;&#x647;&#x631; &#x625;&#x636;&#x627;&#x641;&#x627;&#x62A; &#x627;&#x644;&#x645;&#x62D;&#x627;&#x62F;&#x62B;&#x629; &#x627;&#x644;&#x641;&#x648;&#x631;&#x64A;&#x629; &#x645;&#x639; &#x627;&#x644;&#x639;&#x645;&#x644;&#x627;&#x621; &#x644;&#x645;&#x648;&#x627;&#x642;&#x639; &#x627;&#x644;&#x648;&#x648;&#x631;&#x62F;&#x628;&#x631;&#x64A;&#x633;</title><link>https://academy.hsoub.com/apps/web/wordpress/%D9%85%D9%88%D8%A7%D8%B2%D9%86%D8%A9-%D8%A8%D9%8A%D9%86-%D8%A3%D8%B4%D9%87%D8%B1-%D8%A5%D8%B6%D8%A7%D9%81%D8%A7%D8%AA-%D8%A7%D9%84%D9%85%D8%AD%D8%A7%D8%AF%D8%AB%D8%A9-%D8%A7%D9%84%D9%81%D9%88%D8%B1%D9%8A%D8%A9-%D9%85%D8%B9-%D8%A7%D9%84%D8%B9%D9%85%D9%84%D8%A7%D8%A1-%D9%84%D9%85%D9%88%D8%A7%D9%82%D8%B9-%D8%A7%D9%84%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-r339/</link><description><![CDATA[
<p><img src="https://academy.hsoub.com/uploads/monthly_2018_04/5ad8717b08968_---.png.361c645ef5dd734ad3885e32b529f92b.png" /></p>

<p>
	لا تزال التقنية تغيّر مجال خدمة العملاء بصور شتى ومؤثرة على السوق، فقديمًا كان المستهلك يضطر إلى الذهاب إلى المتجر من أجل مشكلة يواجهها أو من أجل استفسار بسيط، فلما جاء الهاتف صار يتحدّث إلى الشركات والمتاجر التي يتعامل معها من خلاله، إلا أنه سرعان ما سئم من المشاكل التي ظهرت جراء ظهور الهاتف.<br>
	ثم أتى الإنترنت بعد ذلك، ومكّنت الأدواتِ التي صحبَتْهُ أو لحِقَتْ به الشركاتِ من التعامل مع عدة مشاكل في نفس الوقت فصارت أزمنة الردود أقصر، لكن لا زال لتلك الأدوات من بريد أو شبكات اجتماعية جوانبها المظلمة السلبية في التعامل مع العملاء من أجل تقديم الدعم لهم.<br>
	وأرى أن المحاولة الأخيرة إلى الآن للإجابة عن أسئلة العميل ومشاكله بأسلوب منضبط هي المحادثة الفورية التي تجمع فضائل كلًا من الانترنت والهاتف.<br>
	ظهرت المحادثات الفورية أول مرة في أواخر الثمانينات من القرن الماضي حين أنشأت Quantum Link برنامج On-Line Messages لحاسوب كومودور 64، ممهدة الطريق لبرامج المحادثات الفورية فيما بعد، ثم تحولت Q-Link إلى ما عرفت بعد ذلك بشركة AOL، شركة الاتصالات الشهيرة.<br>
	وربما يُنظر إلى المحادثات الفورية على أنها مجرد طريقة يصل بها المستهلك إلى البائع، لكني أرى أنها لم تأخذ حقها في التطبيق في السوق بسبب وجود وسائط أخرى توفر خدمة دعم للعملاء، رغم أنها تزيد من رضى العملاء ومن ثم تزيد من المبيعات.
</p>

<h2>
	أهمية المحادثات الفورية
</h2>

<p>
	إن من ينظر للمحادثات الفورية على أنها مجرد تقنية أو وسيلة أخرى يمكن استخدامها للتعامل مع العملاء يتجاهل الفوائد الكثيرة التي تأتي من ورائها، فإن المستخدم مثلًا يراها حلًا أفضل له لأنه لن يضطر إلى الخروج من الموقع من أجل استفسار بسيط طرأ في ذهنه عن المنتج، بل يمكنه الحصول على المساعدة بضغطة زر.<br>
	وقد قال 51% من المستخدمين أنهم أُعجبوا بالمحادثات الفورية لأنهم يستطيعون تنفيذ أكثر من عملية في نفس الوقت (تسوق – استفسار - ..) أثناء إجراء هذه المحادثة، أما ممثلي الدعم الفني فإن بإمكانهم إجراء أكثر من محادثة نصية في نفس الوقت أيضًا، مما يقلل من نفقات الشركة إذ أنها لن تضطر إلى توظيف المزيد من العاملين، على عكس الشركات التي تستخدم المكالمات الصوتية للدعم الفني.<br>
	كما أن المحادثات الفورية تحسّن تجربة المستخدم لأنها توفّر توقيتات استجابة منضبطة، فقد وجدت دراسة أن 93% من الشركات لا تتبع قاعدة الخمس دقائق في الرد على العملاء، بل 7% فقط هم من يستجيبون للعملاء في أقل من خمس دقائق.<br>
	فهذا جدير بالإشارة إليه، إذ أن خمس دقائق تأخير في الرد على الزائر للموقع تتسبب في خسارة الفوز به كعميل بنسبة 400%، وجدير بالذكر أيضًا أن العامل المشترك بين الشركات التي تقع تحت نسبة 7% السابقة هو أنها جميعًا تستخدم المحادثات الفورية. فليس بخافٍ أن خدمة العملاء الممتازة تزيد من المبيعات، فإن 38% من العملاء يقولون أنهم قد اشتروا منتجًا ما نتيجة محادثة فورية مع ممثل للشركة، كما وجدت دراسة للتسويق الإلكتروني أن 63% من العملاء يعودون إلى الموقع الذي أجروْا فيه محادثة فورية.<br>
	والأهم من كل ذلك أن 92% من العملاء الذين يتسوقون عبر الإنترنت يفضّلون هذه الطريقة في خدمة العملاء، فما أريد قوله هو أن استخدام أدوات للتحدث مباشرة مع العملاء ليس صعبًا، بل هو مربح أيضًا إن نظرت إلى الإحصاءات التي تذكر رضى العملاء عن هذه الطريقة في التعامل معهم.
</p>

<h2>
	إضافات محادثة فورية لووردبريس
</h2>

<h3>
	1. Live Chat
</h3>

<p>
	<a class="ipsAttachLink ipsAttachLink_image" data-fileid="27478" href="https://academy.hsoub.com/uploads/monthly_2018_04/live-chat-on-wordpress-3.png.ffc353d7964a927c0b5926bbc7b372ad.png" rel=""><img alt="live-chat-on-wordpress-3.png" class="ipsImage ipsImage_thumbnailed" data-fileid="27478" data-unique="yfpzgn7gu" src="https://academy.hsoub.com/uploads/monthly_2018_04/live-chat-on-wordpress-3.thumb.png.7ce18fe936acb8e38af104a4994801a3.png"></a>
</p>

<p>
	تُعد <a href="https://wordpress.org/plugins/wp-live-chat-software-for-wordpress/" rel="external nofollow">هذه الإضافة</a> أفضل الأدوات الموجودة في السوق لتقديم خدمات الدعم الفني للعملاء للمواقع العاملة بووردبريس، وتسمح لأصحاب الموقع أن يتواصلوا مع العملاء من أجهزتهم المكتبية أو اللوحية أو حتى الهواتف، إضافة إلى أنهم لا يحتاجون أن يسجلوا الدخول إلى لوحة تحكم ووردبريس كي يستخدموا الإضافة.<br>
	وبها خاصية تسمح لممثلي خدمة العملاء أن يرسلوا دعوات محادثة إلى العملاء بُناءً على معايير محددة مثل عدد الصفحات التي زاروها أو الوقت الذي قضوْه على الموقع، إضافة إلى مزايا أخرى مثل المراقبة في الوقت الحقيقي -real time monitoring-، ومشاركة الملفات، ونظام بطاقات يوفر دعمًا على مدار الساعة للعملاء، وهذه الأخيرة تمكّن العملاء من مراسلتك حتى لو لم تكن متاحًا مباشرة على الموقع.<br>
	وتتكامل live chat مع تطبيقات الطرف الثالث مثل Zendesk أو إحصاءات جوجل أو تطبيقات إدارة العلاقات مع المستخدمين مثل  Hubspot  وSalesforce، إضافة إلى مواقع الشبكات الاجتماعية مثل فيس بوك وتويتر.<br>
	وتبدأ أسعار هذه الإضافة من 16$ شهريًا لكل ممثل دعم فني في الشركة، إن دفعت الباقة بشكل سنوي على دفعة واحدة.
</p>

<h3>
	2. Zendesk Chat
</h3>

<p>
	<a class="ipsAttachLink ipsAttachLink_image" data-fileid="27479" href="https://academy.hsoub.com/uploads/monthly_2018_04/live-chat-on-wordpress.png.63680eab1dd668a86aa7b445ae4c85d4.png" rel=""><img alt="live-chat-on-wordpress.png" class="ipsImage ipsImage_thumbnailed" data-fileid="27479" data-unique="5hrrik3cj" src="https://academy.hsoub.com/uploads/monthly_2018_04/live-chat-on-wordpress.thumb.png.44233d22b7a0206a9ab6c5a9cabc71ce.png"></a>
</p>

<p>
	تأتي إضافة <a href="https://wordpress.org/plugins/zopim-live-chat/" rel="external nofollow">Zendesk chat</a> من منصة خدمة العملاء الشهيرة Zendesk، وتتميز بواجهة جميلة التصميم يمكن تغيير القوالب المرئية فيها، إضافة إلى سهولة تثبيتها.<br>
	كما توفر هذه الإضافة بادئات آلية للمحادثات مع العملاء يمكن تخصيصها (كأن تُفتح محادثةٌ مع العميل حين يبقى فترة معينة على الموقع أو يفتح عددًا معينًا من الصفحات)، وبها ويدجت-widget- مهيأة لتعمل على الهواتف، ولوحة تحليل متطورة.<br>
	وهناك خطة أسعار مجانية لهذه الإضافة لكنها تسمح بممثل خدمة عملاء واحد فقط، وبمحادثة واحدة مفتوحة، بمعنى أنك ستتعامل مع العملاء واحدًا تلو الآخر. وقد تناسبك هذه الخطة إن كنت المالك الوحيد لموقعك وتقوم بنفسك على تجارتك بدون مساعدة أو توظيف لأحد، أما للاستخدام التجاري فإن خطط الأسعار تبدأ من 14$ شهريًا لكل ممثل دعم فني.
</p>

<h3>
	3. Olark
</h3>

<p>
	<a class="ipsAttachLink ipsAttachLink_image" data-fileid="27480" href="https://academy.hsoub.com/uploads/monthly_2018_04/live-chat-on-wordpress-4.png.60700ff9c79ef3eed93784e5a4dc5c46.png" rel=""><img alt="live-chat-on-wordpress-4.png" class="ipsImage ipsImage_thumbnailed" data-fileid="27480" data-unique="abtbpdnzs" src="https://academy.hsoub.com/uploads/monthly_2018_04/live-chat-on-wordpress-4.thumb.png.fdf8b82c21414982c244c14457c87ade.png"></a>
</p>

<p>
	يمكنك استخدام <a href="https://www.olark.com/" rel="external nofollow">هذه الإضافة</a> بعد إضافة شفرة قصيرة إلى القالب الفرعي"child theme”  الذي تستخدمه، أو عبر <a href="https://wordpress.org/plugins/olark-for-wp/" rel="external nofollow">رابطها في موقع ووردبريس</a>. وإليك بعض من مزايا هذه الإضافة:
</p>

<ul>
<li>
		تقارير عن المحادثات
	</li>
	<li>
		تكامل مع برامج Help Desk و CRM مثل Salesforce وZendesk وGroove.
	</li>
	<li>
		تصنيف ممثلي الدعم إلى مجموعات حسب الوظيفة التي يقومون بها.
	</li>
	<li>
		البحث في تاريخ المحادثات، حيث تحصل كل محادثة على تصنيف مفصّل لنشاط المستخدم على الموقع، ويمكن له أن يقيّم المحادثة بعد انتهائها.
	</li>
	<li>
		رؤية ما بداخل سلة تسوق المستخدم.
	</li>
</ul>
<p>
	وتبدأ أسعار Olark من 17$ شهريًا لكل ممثل دعم.
</p>

<h3>
	4. WP Live Chat Support
</h3>

<p>
	<a class="ipsAttachLink ipsAttachLink_image" data-fileid="27481" href="https://academy.hsoub.com/uploads/monthly_2018_04/live-chat-on-wordpress-2.png.6497e588c7ab57b9f4e525da1904a44f.png" rel=""><img alt="live-chat-on-wordpress-2.png" class="ipsImage ipsImage_thumbnailed" data-fileid="27481" data-unique="3o2tpyrwu" src="https://academy.hsoub.com/uploads/monthly_2018_04/live-chat-on-wordpress-2.thumb.png.b6c4a135430c0c68dc26b44040ad7f41.png"></a>
</p>

<p>
	تهدف إضافة <a href="https://wordpress.org/plugins/wp-live-chat-support/" rel="external nofollow">WP Live Chat Support</a> إلى خدمة الشركات التي تبحث عن حلول غير مكلفة للمحادثات الفورية مع العملاء، وتأتي بست قوالب لصندوق المحادثات، وإمكانية نقل صندوق المحادثة في أي مكان في صفحتك، وفتح محادثات مع العملاء دون حد أقصى لعددها، وتخزين محلي للرسائل، وتكامل مع تحليلات جوجل، إضافة إلى أنها لا تحتوي على إعلانات أو روابط، ويمكنك حجب الزوار من عناوين IP بعينها.<br>
	والإضافة نفسها مجانية، لكن <a href="https://wp-livechat.com/purchase-pro/?utm_source=readme&amp;utm_medium=wordpress&amp;utm_campaign=buy" rel="external nofollow">الباقة المدفوعة</a> التي تشتريها لمرة واحدة مقابل 40$ تعطيك مزايا مثل عدد غير محدود من ممثلي الدعم الفني، والردود المحددة مسبقًا، ومعدلات رضى العملاء، والقدرة على إضافة صورة ممثل الدعم الفني لنافذة المحادثة.
</p>

<h3>
	5. Tidio Live Chat
</h3>

<p>
	<a class="ipsAttachLink ipsAttachLink_image" data-fileid="27482" href="https://academy.hsoub.com/uploads/monthly_2018_04/live-chat-on-wordpress-5.png.3d7d88d61f2ab7e191b8fce12ebfee15.png" rel=""><img alt="live-chat-on-wordpress-5.png" class="ipsImage ipsImage_thumbnailed" data-fileid="27482" data-unique="c819a14k5" src="https://academy.hsoub.com/uploads/monthly_2018_04/live-chat-on-wordpress-5.thumb.png.cf38eeeae78899f0be4b0cd12223f583.png"></a>
</p>

<p>
	تعد إضافة <a href="https://wordpress.org/plugins/tidio-live-chat/" rel="external nofollow">Tidio</a> من أسهل الإضافات في تثبيتها، حيث لا تتطلب إلا تفعيلها فقط، وتأتي في ثلاث تصميمات، وتستطيع تعديل اللون إلى ما يناسب هوية شركتك.<br>
	وتوفر Tidio تطبيقات مخصصة لأجهزة سطح المكتب والهواتف، حيث يمكنك إدارة محادثاتك مباشرة منها، إضافة إلى ودجة تدعم المحادثات المباشرة بأكثر من 140 لغة.<br>
	ويمكن للمستخدمين أن يصلوا إليك إن لم تكن متاحًا من خلال إرسال أسئلتهم عبر البريد الإلكتروني، ويمكنك الرد عليهم من خلال البريد أيضًا، بل إن Tidio تتكامل مع Zendesk وGetResponse وSalesforce وMailChimp.<br>
	ويمكنك استخدام باقة مجانية في tidio تدعم ممثل دعم فني واحد ومحادثة واحدة مفتوحة، أما الباقات المدفوعة فتبدأ من 15$ شهريًا لكل ثلاثة موظفين للدعم الفني، ، مع إمكانية إضافة موظفين أكثر بتكلفة 10$ شهريًا للموظف. أو يمكنك اختيار باقة تكلفك 15$ شهريًا لكل 5000 زيارة فريدة للموقع.
</p>

<h2>
	خاتمة
</h2>

<p>
	لعلي أكون قد وُفِّقت في بيان هذه الإضافات وتوضيح مزاياها، وأرجو أن تكون قد رأيتَ وجهة نظري في أهمية المحادثات الفورية لكثير من المواقع هذه الأيام -خاصة مواقع التجارة الإلكترونية- حيث تطرأ تساؤلات في أذهان المستخدمين قبل أن يقرروا شراء منتج ما.<br>
	ولتعلم أن إضافات المحادثة الفورية تقرّب المسافات بين موظفي الشركة وبين المستهلكين ليجيبوا عن أسئلتهم بسرعة، فيزداد ولاؤهم للشركة ومن ثم تزيد مبيعاتهم. وما عليك أن تشغل بالك بشيء بعد تثبيت هذه الإضافات إلا أن تتأكد أن لديك موظفين كفاية للرد على أسئلة العملاء.<br>
	ترجمة -بتصرف- لمقال <a href="https://premium.wpmudev.org/blog/live-chat-for-wordpress/" rel="external nofollow">How to Setup Live Chat on WordPress</a> لصاحبته Maddy Osman.
</p>
]]></description><guid isPermaLink="false">339</guid><pubDate>Fri, 20 Apr 2018 11:05:00 +0000</pubDate></item><item><title>&#x643;&#x64A;&#x641;&#x64A;&#x629; &#x625;&#x639;&#x62F;&#x627;&#x62F; &#x645;&#x646;&#x62A;&#x62F;&#x649; &#x62F;&#x639;&#x645; &#x641;&#x646;&#x64A; &#x628;&#x627;&#x633;&#x62A;&#x62E;&#x62F;&#x627;&#x645; &#x625;&#x636;&#x627;&#x641;&#x629; Support System</title><link>https://academy.hsoub.com/apps/web/wordpress/%D9%83%D9%8A%D9%81%D9%8A%D8%A9-%D8%A5%D8%B9%D8%AF%D8%A7%D8%AF-%D9%85%D9%86%D8%AA%D8%AF%D9%89-%D8%AF%D8%B9%D9%85-%D9%81%D9%86%D9%8A-%D8%A8%D8%A7%D8%B3%D8%AA%D8%AE%D8%AF%D8%A7%D9%85-%D8%A5%D8%B6%D8%A7%D9%81%D8%A9-support-system-r338/</link><description><![CDATA[
<p><img src="https://academy.hsoub.com/uploads/monthly_2018_03/04.png.fd5c4449992d2f1e7c512215310959d4.png" /></p>

<p>
	لعلك تدرك أن عملاءك الذين بنيت لهم مواقعهم باستخدام ووردبريس يرغبون أن يتواصلوا معك من أجل طرح أسئلتهم أو عرض مشاكلهم، وقد توفِّرُ لهم قناة تواصل من خلال لوحة إدارة الموقع، لكني أرى أن منتدى خاص للدعم الفني تجعله في الواجهة الأمامية (front end) لموقعك سيكون أفضل.<br>
	وقد رأينا منافع مثل هذا المنتدى بأنفسنا إذ لدينا واحد في WMPU DEV، وهو منتدى نشط جدًا بالمناسبة، وإليك المنافع التي أقصدها:
</p>

<ol>
<li>
		يعرض هذا المنتدى للأعضاء الحاليين والمحتملين الإمكانيات التي توفرها منتديات الدعم الخاصة بنا.
	</li>
	<li>
		يجيب عن أسئلة الأعضاء المشتركين فيه دون أن يضطروا لفتح تذاكر دعم فني جديدة.
	</li>
	<li>
		يزيد من كفاءة فريق الدعم إذ يوجّهون الأعضاء إلى منشورات سابقة إن كان السؤال مكررًا بدلًا من إجابة السؤال من جديد في كل مرة.
	</li>
	<li>
		يمكن أن تنظر إليه على أنه مرجع لمجتمع ووردبريس ككل، إذ أن أي مستخدم لووردبريس يمكنه استخدامه والاستفادة منه.
	</li>
</ol>
<p style="text-align: center;">
	<img alt="wpmudev-support-page.png" class="ipsImage ipsImage_thumbnailed" data-fileid="27225" data-unique="0f6ix4z5w" src="https://academy.hsoub.com/uploads/monthly_2018_03/wpmudev-support-page.png.7710da6e21e5bbb376af16afe61f468f.png"></p>

<p>
	وإن كنت تدير شبكة بها مواقع عديدة لأكثر من مستخدم واحد أو تقدّم خدمة الدعم الفني لعملائك عبر لوحات الإدارة الخاصة بمواقعهم فلعلك تستخدم إضافة <a href="https://premium.wpmudev.org/project/support-system/" rel="external nofollow">Support System</a>، وقد بدأت أنا شخصيًا باستخدامها حين أنشأت شبكة متعددة المواقع (Multisite Network) تتيح للمستخدمين أن ينشئوا مواقعهم الخاصة، ولا تزال تقدّم هذه الشبكة خدمة الدعم لمستخدميها عبر توفير طريقة يتصلون بي من خلالها من أجل الدعم الفني.<br>
	لكن هذه الإضافة تمتد إلى ما وراء لوحات التحكم للمواقع، فيمكن أن تنشئ مساحات للدعم الفني في واجهة موقعك وتنشر البطاقات التي أجيب عليها في صفحة الدعم الخاصة بك، وذلك يسمح للمستخدمين أن يروا كل البطاقات التي أُجيب عليها، كما تقوم هي نفسها -مساحة الدعم الفني- مقام الدليل على خبرتك في ووردبريس وعلى الخدمة الممتازة التي تقدمها لعملائك، إضافة إلى كونها مرجعًا لمجتمع مستخدمي ووردبريس.<br>
	وسأعرض لك في هذا المقال كيف تستخدم إضافة Support System لإنشاء منتدى للدعم الفني، إضافة إلى إنشاء نافذة للمستخدمين كي يطرحوا أسئلتهم، ثم نشر الإجابات على تلك الأسئلة في موقعك. وسيكون كل ذلك في الواجهة الأمامية لموقعك، رغم أن المستخدمين لديك سيرون بطاقات الدعم من خلال نوافذ لوحات التحكم الخاصة بهم.
</p>

<h2>
	<a id="___Support_System_13" rel=""></a>تثبيت وإعداد إضافة Support System
</h2>

<p>
	سنضيف بعض التصنيفات للبطاقات ونضبط إعدادات الإضافة بمجرد تفعيلها -قم بتثبيتها إن لم تكن قد فعلت-. ونبدأ مباشرة في التصنيفات: اذهب إلى Support ثم Ticket Categories، وأنشئ تصنيفات كما لو كنت ستنشئ تصنيفات لمنشور عادي، ولأني أنشئ منتدى وهمي في ووردبريس من أجل الشرح فقط، فإن أسماء تصنيفاتي ستكون لها علاقة بهذا:
</p>

<p style="text-align: center;">
	<img alt="ticket-categories.png" class="ipsImage ipsImage_thumbnailed" data-fileid="27224" data-unique="al76p5be4" src="https://academy.hsoub.com/uploads/monthly_2018_03/ticket-categories.png.5b209ad2169bf447b23ac28610027a3b.png"></p>

<p>
	والآن سنهيئ إعدادات الإضافة، اذهب إلى Support ثم Settings كي ترى صفحة الإعدادات العامة للإضافة، وسترى أنها تعطيك خيارات تتعلق بقائمة الدعم والرسائل البريدية وصلاحيات رؤية البطاقات.
</p>

<ul>
<li>
		غيّر اسم القائمة، وحقل email from وعنوان البريد إن كان ضروريًا في حالتك.
	</li>
	<li>
		ثم ننتقل إلى صلاحيات الرؤية، قم بتحديد كل الخيارات من أجل أن يصل جميع المستخدمين إلى البطاقات.
	</li>
</ul>
<p style="text-align: center;">
	<img alt="settings-general.png" class="ipsImage ipsImage_thumbnailed" data-fileid="27220" data-unique="cwzwkz6em" src="https://academy.hsoub.com/uploads/monthly_2018_03/settings-general.png.ac41b0d7cca7acd1c7e745b7ef04cc0a.png"></p>

<p>
	بمجرد أن تضغط على حفظ التغييرات نكون قد انتهينا من إعداد الإضافة وتهيئتها.
</p>

<h2>
	<a id="___25" rel=""></a>إنشاء صفحات للمنتدى
</h2>

<ul>
<li>
		نحتاج أن ننشئ صفحة في الموقع للمنتدى من أجل أن يكون عامًا ويراه الناس ويفتحوا بطاقات دعم جديدة، فأنشئ صفحة ثابتة (static page) جديدة بالطريقة العادية، وسمّها Support، ثم لا تضف أي شيء إليها.
	</li>
	<li>
		كرر هذه الخطوة مع صفحتين أخرتين، وهما الصفحة التي سيرسل المستخدمون فيها بطاقات جديدة، والأخرى من أجل الأسئلة الشائعة، حيث ستكتب الأسئلة الشائعة لتجيب عن أكثر الأسئلة التي تدور بين المستخدمين. إليك مثالًا عن الصفحات التي أنشأتها:
	</li>
</ul>
<p style="text-align: center;">
	<img alt="pages.png" class="ipsImage ipsImage_thumbnailed" data-fileid="27217" data-unique="l7ubtm83v" src="https://academy.hsoub.com/uploads/monthly_2018_03/pages.png.d0903a1f5d61b31690648f295f986fd4.png"></p>

<h2>
	<a id="____30" rel=""></a>تفعيل واجهة الدعم الأمامية
</h2>

<p>
	من أجل تفعيل الجزء الأمامي من الإضافة، اذهب إلى Support ثم Settings ثم Front End، وحدد المربع الخاص بخيار Activate Front End. وستظهر الآن عدة خيارات، فأتمّها كما يلي:
</p>

<ul>
<li>
		Use Support System styles: اترك هذا الخيار محددًا ما لم ترد إضافة إعداداتك الخاصة. شخصيًا، لن أغيّر هذا إلا إن كان تخصيص السمة يتعارض مع تخصيص الإضافة.
	</li>
	<li>
		Support Page: اختر صفحة الدعم التي أنشأتها قبل قليل.
	</li>
	<li>
		Submit new ticket Page: اختر الصفحة التي أنشأتها قبل قليل لإرسال البطاقات.
	</li>
	<li>
		FAQs Page: اختر الصفحة التي أنشأتها للأسئلة الشائعة.-
	</li>
</ul>
<p>
	اضغط الآن على زر Save changes.
</p>

<h2>
	<a id="___38" rel=""></a>إثراء صفحات الدعم
</h2>

<p>
	بعد أن اخترتَ صفحاتك وفعّلتَ الواجهة الأمامية، يجب أن تضيف كودًا مختصرًا لكل صفحة من صفحات الدعم، عُد إلى صفحات الدعم وأضف الأكواد التالية:
</p>

<ul>
<li>
		صفحة الدعم (Support Page): [support-system-tickets-index]
	</li>
	<li>
		صفحة إرسال البطاقات الجديدة (Submit new ticket Page): [support-system-submit-tickets-form]
	</li>
	<li>
		صفحة الأسئلة الشائعة (FAQs Page): [support-system-faqs]
	</li>
</ul>
<p style="text-align: center;">
	<img alt="settings.png" class="ipsImage ipsImage_thumbnailed" data-fileid="27219" data-unique="tvwz6w8co" src="https://academy.hsoub.com/uploads/monthly_2018_03/settings.png.914f57a6845794df4579e13fa166ed6c.png"></p>

<p>
	احفظ كل صفحة من تلك الصفحات، ثم أضفهم إلى قائمة التنقل في موقعك. لاحظ أنك لا تحتاج إلى تفعيل صفحة الأسئلة الشائعة في موقعك إن كنت تريد منتدى للدعم فقط ولا تريد أن تنشر الأسئلة الشائعة، لكن إن كنت تجد أن لديك أسئلة تتكرر كثيرًا فربما تكون هذه الصفحة مفيدة حينها.<br>
	والآن حين يريد مستخدم أن يطرح سؤالًا فإنه سيذهب إلى صفحة الدعم ويختار Submit new ticket ليذهب إلى صفحة إرسال البطاقة.
</p>

<p style="text-align: center;">
	<img alt="submit-ticket.png" class="ipsImage ipsImage_thumbnailed" data-fileid="27221" data-unique="9wiqekoca" src="https://academy.hsoub.com/uploads/monthly_2018_03/submit-ticket.png.420dd3512ee28f8cd16f2221654c501b.png"></p>

<h2>
	<a id="_____50" rel=""></a>نشر بطاقات المشاكل التي حُلَّت
</h2>

<p>
	يستطيع المستخدمون الآن أن يرسلوا بطاقاتهم بما أن المنتدى قد صار جاهزًا -ربما تود إضافة بعض تلك البطاقات بنفسك-، وستُنشَر تلك البطاقات بشكل آلي في موقعك بمجرد أن يتم حل المشاكل التي تُذكر فيها. إليك بعض البطاقات العشوائية التي أضفتها إلى موقعي من أجل توضيح المثال:
</p>

<p style="text-align: center;">
	<img alt="new-tickets.png" class="ipsImage ipsImage_thumbnailed" data-fileid="27216" data-unique="ggi7hcfsv" src="https://academy.hsoub.com/uploads/monthly_2018_03/new-tickets.png.e3a0f558ac7ab1c1b57c0be664441c67.png"></p>

<p>
	والخطوة التالية الآن هي الإجابة على هذه البطاقات التي أُرسلت إليك، وحاول أن تفصّل الإجابة وتبيّنها إذ أنها ستُنشر على موقعك، إليك صفحة الدعم الخاصة بي:
</p>

<p style="text-align: center;">
	<img alt="support-page-tickets.png" class="ipsImage ipsImage_thumbnailed" data-fileid="27222" data-unique="31wtvxil3" src="https://academy.hsoub.com/uploads/monthly_2018_03/support-page-tickets.png.7929918649a349e182a9253df2564987.png"></p>

<p>
	يستطيع المستخدمون في هذه المرحلة أن يرسلوا بطاقات جديدة أو يبحثوا في الموجودة مسبقًا، أو يقرؤوا البطاقات الموجودة مباشرة، وسأرى إجابة كل بطاقة قد أجيب عليها بمجرد النقر عليها:
</p>

<p style="text-align: center;">
	<img alt="support-ticket-frontend.png" class="ipsImage ipsImage_thumbnailed" data-fileid="27223" data-unique="dekrg5mi7" src="https://academy.hsoub.com/uploads/monthly_2018_03/support-ticket-frontend.png.7a0010b5c82b8a834978921da15243ee.png"></p>

<p>
	وأستطيع إضافة رد جديد إن مررت للأسفل، أو حتى شكر الشخص الذي أجاب وإخباره أن الحل قد نجح معي.
</p>

<p style="text-align: center;">
	<img alt="reply-frontend.png" class="ipsImage ipsImage_thumbnailed" data-fileid="27218" data-unique="hmwbpid56" src="https://academy.hsoub.com/uploads/monthly_2018_03/reply-frontend.png.c7d23d67378bd3d11ef8e31c4ca5d51f.png"></p>

<p>
	وهنا تبدأ ثمرة هذا المنتدى بالظهور إذ يرى الناس حجم التجاوب والفائدة التي قد يحصلون عليها من المشاركة فيه.
</p>

<h2>
	<a id="___68" rel=""></a>إضافة صفحات للتصنيفات
</h2>

<p>
	سترى أنك إن ذهبت إلى صفحة الدعم في موقعك واخترت أي تصنيف فستظهر كل البطاقات التي تحت هذا التصنيف، ويمكنك استغلال هذا باستخدام ذلك الرابط الذي تم توليده لإنشاء صفحات في موقعك كما يلي:<br>
	اذهب إلى كل تصنيف عبر النقر على الرابط في صفحة الدعم الخاصة بك، ثم انسخ الرابط الموجود في اللسان الذي ستأخذك إليه تلك النقرة، وأضف هذه الروابط كروابط مخصصة (custom URLs) في قائمة موقعك.
</p>

<p style="text-align: center;">
	<img alt="menu-screen.png" class="ipsImage ipsImage_thumbnailed" data-fileid="27215" data-unique="qmwuc50zd" src="https://academy.hsoub.com/uploads/monthly_2018_03/menu-screen.png.75da80a00dee0dc4178d58c4d866fcce.png"></p>

<p>
	يستطيع المستخدمون الآن أن ينتقلوا إلى تصنيف محدد في منتدى الدعم بالنقر على الروابط المخصصة في قائمة الموقع، إضافة إلى النقر على التصنيف في صفحة الدعم الأساسية.
</p>

<p style="text-align: center;">
	<img alt="categories-menu.png" class="ipsImage ipsImage_thumbnailed" data-fileid="27214" data-unique="c2120nbmf" src="https://academy.hsoub.com/uploads/monthly_2018_03/categories-menu.png.be8f36a1a4f6a3dbb4ea8d547a94c67a.png"></p>

<h2>
	<a id="_77" rel=""></a>خاتمة
</h2>

<p>
	إن إضافة منتدى للدعم الفني من شأنه أن يخدم عملاءك ويزكّي سمعتك، كما يقدم مرجعًا مفيدًا لعملائك وأي متابع أو مستخدم، وهذا صحيح في حالة منتدى الدعم عندنا في WMPU DEV، إذ يمثّل المنتدى مكانًا نساعد فيه مشتركينا على الاستفادة من ووردبريس بشكل عام، ومن منتجاتنا بشكل خاص.<br>
	أضف إلى هذا أنك ستعرض مدى خبرتك بمجالك، فإن كنت تقدم إجابات مفيدة لأسئلة الناس فسيثقوا أنك خبير في ووردبريس، وهكذا تساعدك إضافة Support System على إنشاء منتدى دعم فني يخدمك ويخدم عملاءك على حد سواء.<br>
	والآن أخبرني، هل تقدّم خدمات دعم فني لعملائك؟ وإن كان فكيف تفعلها، وهل جربت الإضافة الخاصة بنا والتي استعرضناها في هذا المقال؟
</p>

<p>
	ترجمة -بتصرف- لمقال <a href="https://premium.wpmudev.org/blog/setting-up-support-forum-wordpress/" rel="external nofollow">How to Set Up a Support Forum with the Support System Plugin</a> لصاحبته Rachel McCollin
</p>
]]></description><guid isPermaLink="false">338</guid><pubDate>Sat, 03 Mar 2018 12:58:25 +0000</pubDate></item><item><title>&#x627;&#x644;&#x62F;&#x644;&#x64A;&#x644; &#x627;&#x644;&#x634;&#x627;&#x645;&#x644; &#x644;&#x62A;&#x623;&#x645;&#x64A;&#x646; &#x643;&#x644;&#x645;&#x629; &#x633;&#x631; &#x627;&#x644;&#x648;&#x631;&#x62F;&#x628;&#x631;&#x64A;&#x633;</title><link>https://academy.hsoub.com/apps/web/wordpress/%D8%A7%D9%84%D8%AF%D9%84%D9%8A%D9%84-%D8%A7%D9%84%D8%B4%D8%A7%D9%85%D9%84-%D9%84%D8%AA%D8%A3%D9%85%D9%8A%D9%86-%D9%83%D9%84%D9%85%D8%A9-%D8%B3%D8%B1-%D8%A7%D9%84%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-r331/</link><description><![CDATA[
<p><img src="https://academy.hsoub.com/uploads/monthly_2018_01/5a69ce57a7b11_30(1).png.604305d5ea1baad39174a099e75a1cef.png" /></p>

<p>
	أعرف أنني أتحدث كثيرًا عن أن مسؤولية أمن مواقع الوردبريس تقع على عاتق أصحابها. لكن من المعلوم أن هناك حالات حيث لا يملك أصحاب المواقع سيطرة كاملة على نقاط الضعف التي يتسبب بها المستخدمون خاصة الذين لا يلتزمون بوضع كلمات مرور ذكيةٍ وآمنة.<br>
	لكي نكون منصفين، لنُفَكِر في حجم وعدد الاسماء، الأرقام، تواريخ أعياد الميلاد، العناوين، والمعلومات التي علينا تتبعها بصورة يومية. ثم لنعد التفكير في عدد التطبيقات التي نستعملها يوميًا. فآخر ما نتمناه هو حِفظُ كلمةِ مرورٍ فريدةٍ ومعقدةٍ لكل واحدة منها.<br>
	ولكن حينما نصل إلى كلمات السر فلا يمكن التقصير في اختيارها ووضع أمن موقع الويب (أو المعلومات الخاصة بالمستخدم) على المحك لمجرد أننا لا نريد إنشاء كلمةَ مرورٍ أفضلَ من تلك التي أنشأناها على Gmail قبل سنواتٍ خلت. أيضًا، فكلمة السر الخاصة بموقع الوردبريس تلعب دورًا مهمًا في تعزيز أمن موقع ووردبريس الخاص بك.
</p>

<h2 id="تاريخ-كلمات-المرور-و-وردبريس">
	تاريخ كلمات المرور و وردبريس
</h2>

<p>
	وضع الوردبريس منذ ظهوره مسؤولية ضمان قوة كلمات مرور مستخدمي مواقع الإنترنت على عاتق مطوري المواقع أنفسِهم. ومحاولةً للالتزام ببرتوكول <a href="https://www.owasp.org/index.php/Category:OWASP_Top_Ten_Project" rel="external nofollow">OWASP 10</a>، سَنَت ووردبريس عددا من التدابير الأمنية لحماية المستخدمين من الممارسات الخاطئة لكلمات المرور، نذكر منها:
</p>

<h3 id="نسخة-3.7">
	1-نسخة 3.7
</h3>

<p>
	في تحديث <a href="https://codex.wordpress.org/Version_3.7" rel="external nofollow">3.7</a>، أضاف الورد بريس مؤشر قوة كلمة المرور أثناء إعداد الحساب وإعادة تعيين كلمة السر. وقد كان الغرض من ذلك هو إعطاء المستخدمين حافزًا لإنشاء كلمات مرورٍ أقوى.
</p>

<h3 id="نسخة-4.0">
	2-نسخة 4.0
</h3>

<p>
	في عام 2014 مع الإصدار 4.0، بدأ وردبريس بإدخال خاصية غلق كل الحسابات المفتوحة لحظة تسجيل خروج المستخدم من نظام إدارة المحتوى.
</p>

<h3 id="نسخة-4.3">
	3- نسخة 4.3
</h3>

<p>
	في عام 2015 أضاف وردبريس خاصية جديدة لكلمة المرور لمساعدة المستخدمين على إنشاء كلماتِ سِرٍ معقدة.
</p>

<p style="text-align: center;">
	<img alt="001.jpg" class="ipsImage ipsImage_thumbnailed" data-fileid="26734" data-unique="1w9lwxs2n" src="https://academy.hsoub.com/uploads/monthly_2018_01/001.jpg.d78189865aa8b932e42a6aead0a0ccfd.jpg"></p>

<p>
	وأضيفت ميزة أخرى (auto-populate) من شأنها أن تشجع المستخدمين على إنشاء كلماتِ مرورٍ قوية باقتراح من وردبريس.
</p>

<p style="text-align: center;">
	<img alt="002.jpg" class="ipsImage ipsImage_thumbnailed" data-fileid="26735" data-unique="l0zl3wgge" src="https://academy.hsoub.com/uploads/monthly_2018_01/002.jpg.7ad5f83945b31caf0457a948002eb654.jpg"></p>

<h3 id="الآن">
	4-الآن
</h3>

<p>
	قامت ووردبريس بإضافة الميزات التالية لتحصين كلمة المرور:
</p>

<ul>
<li>
		كل معلومات وملفات تسجيل دخول المستخدمين يتم تسييرها من جانب الخادم (server-side)
	</li>
	<li>
		تقديم حماية إضافية لكلمات السر من خلال تقنيات التمليح والتمدد (Salting and stretching techniques)
	</li>
	<li>
		نظام الإِذن من ووردبريس الذي يُقَيِد من لديه حق الوصول إلى معلومات المستخدم الخاصة مثل عنوان البريد الإلكتروني لمن قام بترك تعليقات أو إضافة للمحتوى لكن تم وَسمُهُ بعلامة “خاص”.
	</li>
</ul>
<p>
	السؤال الذي يتبادر إلى الاذهان هو لم يقوم الووردبريس بكل هذه المجهودات في سبيل تعزيز نظام كلمات المرور لديه. الاجابة بسيطة، فكلمةُ مرورٍ ضعيفة تفتح الباب على مصراعيه لكثيرٍ من المخاطر على مواقع الإنترنت، قد لا يتمكن فريق أمن وردبريس من جعل كل التحديثات تحدث بصورة آلية على نواة النظام أو يُفرَضُ على جميع المستخدمين استعمال مكونات الحماية والنسخ الاحتياطي الإضافية لكن باستطاعتهم أن يقوموا بكل ما في وِسعِهم لإجبارِ المستخدمين على اتخاذ قرارات أكثر ذكاءً أثناء الاشتراك و تسجيل الدخول.
</p>

<h2 id="الطريقة-الصحيحة-لاستخدام-كلمات-المرور-مع-ووردبريس">
	الطريقة الصحيحة لاستخدام كلمات المرور مع ووردبريس
</h2>

<p>
	في عام 2016 قامت منظمة وردفنس (Wordfence) برصد لمواقع الانترنت لمدة 16 ساعة فكانت النتيجة كما يلي:<br>
	"خلال هذه الفترة الزمنية رصدنا 6,611,909 هجمة، مستهدفةً 72,532 موقِعًا، رصدنا هجماتٍ كانت من قبل 8941 عنوان IP فريد، و كان متوسط عدد الهجمات 626 هجمة لكل موقعٍ ضحية"<br>
	دون استعمال تدابير أمنية إضافية وِفق قواعد سليمة، فكل ما يحتاجه القراصنة هو كلمة مرور واحدة ضعيفة لِيَجعَلَ من موقعك عرضةً لمثل هذه الهجمات المتوحشة. هذا ما يؤدي الى تعريض موقعك، مستخدميك أو أي زائرِ لموقعك الالكتروني لهذا الخطر.<br>
	لتجنب ذلك، فيما يلي 8 نقاط يُمكِن تطبيقُها لإنشاء كلماتِ مرورٍ أقوى على الوردبريس
</p>

<h3 id="الأخذ-بنصائح-الووردبريس">
	1. الأخذ بنصائح الووردبريس
</h3>

<p style="text-align: center;">
	<img class="ipsImage ipsImage_thumbnailed" data-fileid="26736" data-unique="mxn97t7bz" src="https://academy.hsoub.com/uploads/monthly_2018_01/003.jpg.d6ff33e54b569663925810aa41934370.jpg" alt="003.jpg"></p>

<p>
	تعودنا على هذا النوع من الاقتراحات البسيطة، لكن المهم هو الفكرة، يجب إنشاء كلمة مرورٍ مُعقدة.
</p>

<h3 id="إختيار-كلمات-مرورٍ-طويلة">
	2-إختيار كلمات مرورٍ طويلة
</h3>

<p>
	يوصي الوردبريس باستعمال كلمات مرورٍ متكونة من أكثر من ستة أحرف. ومع ذلك، فكلمات المرور التي تحتوي من 10 إلى 50 حرفا يكون اختيارًا أمثل.
</p>

<h3 id="الجمع-بين-الأحرف-والأرقام">
	3- الجمع بين الأحرف والأرقام
</h3>

<p>
	يُعتَبَرُ استعمال سلسلةٍ طويلةٍ من الأرقام غير كافٍ، بل يتوجب استعمال مزيجٍ من الأحرف الكبيرة والصغيرة، الأرقام والرموز عند إنشاء كلمات المرور.
</p>

<h3 id="تجنب-استعمال-كلمات-المرور-القديمة">
	4-تجنب استعمال كلمات المرور القديمة
</h3>

<p>
	يجد بعض المستخدمين أنه من الممكن إعادة استعمال كلمات مرور قديمة سبق وأن تم إعادة تعيينها غير أنَه يتوجب تَجَنُب هذه السلوكيات.
</p>

<h3 id="التحديث">
	5-التحديث
</h3>

<p>
	إتباع كل القواعد المذكورة سابِقًا في إنشاء قواعد المرور يساعد على إنشاء كلماتِ مرورٍ قويةٍ يَصعُب كَسرُهَا مع ذلك فالسماح ببقاء نفس كلمة المرور لمدة طويلة يجعلها عُرضةً للتدهور، لذلك فمن الأفضل طلب من جميع المستخدمين تغيير كلمة المرورِ بشكل دوري(كل بضعة أشهر على سبيل المثال).
</p>

<h3 id="استعمال-خاصية-عاملين-من-التَعَرُف-two-factor-authentication">
	6-استعمال خاصية عاملين من التَعَرُف (Two-Factor Authentication)
</h3>

<p style="text-align: center;">
	<img alt="004.jpg" class="ipsImage ipsImage_thumbnailed" data-fileid="26737" data-unique="zdmnzo8rq" src="https://academy.hsoub.com/uploads/monthly_2018_01/004.jpg.497e10458f2925f636ce696d43f0db86.jpg"></p>

<p>
	حتى باستعمال أقوى كلمات المرور وإتباع أفضل ممارسات الحفاظ على أمن كلمات مرور فهذا لا يجعل منها منيعةً تمامًا من الاختراق، و لتوفير حمايةً أكبر لمواقع الانترنت يُستَحسَن إضافة تقنية التَعَرُف بواسطة عاملين (Two-Factor Authentication)حيث يُتَطَلَب من المستخدمين تنشيطَ جهازٍ أو تطبيق ثانٍ (مثل Google Authenticator) إضافةً لإسم المستخدم و كلمة المرور الخاصة بهم لتأكيد هويتهم قبل السماح لهم بالولوج إلى النظام.
</p>

<p style="text-align: center;">
	<img alt="005.jpg" class="ipsImage ipsImage_thumbnailed" data-fileid="26738" data-unique="zgt5mjvww" src="https://academy.hsoub.com/uploads/monthly_2018_01/005.jpg.4215cc1dffc2cc1c4a196795991f1515.jpg"></p>

<h3 id="إستعمال-إضافات-الأمن-المساعدةsecurity-plugin">
	7-إستعمال إضافات الأمن المساعدة(Security Plugin)
</h3>

<p style="text-align: center;">
	<img alt="006.jpg" class="ipsImage ipsImage_thumbnailed" data-fileid="26739" data-unique="4s1snxbnh" src="https://academy.hsoub.com/uploads/monthly_2018_01/006.jpg.4b92c807f06901e8b7681e9c6292afb4.jpg"></p>

<p>
	تسمح الإضافات الأمنية المساعدة بمراقبة الموقع والكشف عن الثغرات الأمنية به، يمكن أيضا استعمال هذه الإضافات للحدِ من محاولات تسجيل الدخول الفاشلة. بعض هذه الإضافات الأمنية تسمح بتدقيق كلمات مرور المستخدمين لتفرض عليهم استعمال كلمات مرورٍ أكثر قوةً.
</p>

<h3 id="إستعمال-أدوات-إدارة-كلمات-المرور">
	8-إستعمال أدوات إدارة كلمات المرور
</h3>

<p>
	يقترح دليل إنشاء كلمات المرور للوردبريس ما يلي "إن أفضل طريقة لإنشاء كلمة مرورٍ قوية هي باستعمال أداةُ إدارة كلمات المرور لتوليد مجموعةٍ عشوائيةٍ من الأحرفِ، الأرقامِ والرموز"<br>
	قطع الووردبريس أشواطًا طويلة في سبيل تأمين تسجيل الدخول وتشجيع أفضل الممارسات لتوليد كلمات المرور، فاستعمال أدوات إدارة كلمات المرور ليس لعدم قدرة المستخدمين على إنشاء كلمات مرور طويلة ومعقدة بل يعود السبب إلى مشكلة صعوبة تذكر كلمات السر المعقدة هذه، لذلك فاستعمال أداة مساعدة يكون مفيدًا. يُمكِن تلخيص فوائد هذه الادوات في النقاط التالية:
</p>

<ul>
<li>
		يمكن البحث عن كلمات المستخدم و كلمات المرور كلها في مكان واحد للولوج إلى المواقع و التطبيقات.
	</li>
	<li>
		يمكن تخزين و تأمين المعلومات الشخصية والحساسة الأخرى أيضًا، مثل معلومات بطاقة الائتمان.
	</li>
	<li>
		المساعدة في إنشاء كلمات مرور جديدة وقوية.
	</li>
	<li>
		عند تفعيل هذا النوع من الأدوات، تَشرَع في ملء تفاصيل تسجيل الدخول الخاصة بالمستخدم للمواقع المحفوظة. مما يتيح إدارة حسابات مستخدمين عِدَة لنفس الموقع.
	</li>
</ul>
<p>
	بينما لا يمكن فرض هذه الأدوات على كل المستخدمين، يتبقى لنا استعمالها بأنفسنا واقتراحها على معارفنا.
</p>

<h2 id="خلاصة">
	خلاصة
</h2>

<p>
	يُعتَبَر تأمين مواقع الوردبريس من كل الخروق الأمنية أمرًا صعبًا، فيوجد العديد من الطرق الملتوية التي يسلكها القراصنة ، لذلك لا يتوجب علينا ترك أمرًا بسيطًا وبديهيًا ككلمة المرور تَمُر دون تقويتها.<br>
	الكل على دراية أن كلمة مرور قوية تؤدي إلى تجربة أكثر أمنًا على الإنترنت، لكنها ليست الخيار المُفَضَل للمستخدمين لما تَحمِلُه من إزعاج أثناء إنشاء كلمة مرور قوية ومعقدة وفريدة لكل موقع على يزورونه على الإنترنت. بتقديم الأدوات اللازمة للمستخدمين لتأمين كلمات السر الخاصة بهم سنعمل على تأمين نظام الدخول لمواقعنا على الوردبريس.
</p>

<p>
	ترجمة –وبتصرّف- للمقال <a href="https://premium.wpmudev.org/blog/a-complete-guide-to-wordpress-password-security/" rel="external nofollow">A Complete Guide to WordPress Password Security</a> لصاحبه Brenda Barron
</p>

<p>
	حقوق الصورة البارزة محفوظة لـ <a href="https://www.freepik.com/free-vector/security-background-with-connected-circuits_1140339.htm" rel="external nofollow">Freepik</a> و <a href="https://www.flaticon.com/free-icon/wordpress-logo-button_15986" rel="external nofollow">Flaticon</a>
</p>
]]></description><guid isPermaLink="false">331</guid><pubDate>Thu, 25 Jan 2018 12:33:36 +0000</pubDate></item><item><title>&#x643;&#x64A;&#x641; &#x62A;&#x636;&#x64A;&#x641; &#x623;&#x64A;&#x642;&#x648;&#x646;&#x629; &#x627;&#x644;&#x647;&#x648;&#x64A;&#x651;&#x629; Favicon &#x625;&#x644;&#x649; &#x645;&#x648;&#x642;&#x639; &#x62A;&#x62F;&#x64A;&#x631;&#x647; &#x628;&#x627;&#x633;&#x62A;&#x62E;&#x62F;&#x627;&#x645; &#x648;&#x648;&#x631;&#x628;&#x631;&#x64A;&#x633;</title><link>https://academy.hsoub.com/apps/web/wordpress/%D9%83%D9%8A%D9%81-%D8%AA%D8%B6%D9%8A%D9%81-%D8%A3%D9%8A%D9%82%D9%88%D9%86%D8%A9-%D8%A7%D9%84%D9%87%D9%88%D9%8A%D9%91%D8%A9-favicon-%D8%A5%D9%84%D9%89-%D9%85%D9%88%D9%82%D8%B9-%D8%AA%D8%AF%D9%8A%D8%B1%D9%87-%D8%A8%D8%A7%D8%B3%D8%AA%D8%AE%D8%AF%D8%A7%D9%85-%D9%88%D9%88%D8%B1%D8%A8%D8%B1%D9%8A%D8%B3-r310/</link><description><![CDATA[
<p><img src="https://academy.hsoub.com/uploads/monthly_2017_11/5a1fdf789199f_30(1).png.654f1916c385375221cb7f83e9b2c635.png" /></p>

<p>
	سنتعلم في هذا الدرس كيفية ترسيخ هويّة بصرية قوية لموقعك عبر تصميم أيقونة الهوية “fav icon” واستخدامها في ووردبريس، ليراها الزائر إلى موقعك بمجرد وصوله، وإبراز الموقع وسط زحام ألسنة المواقع التي لديه في المتصفح عن يمين موقعك وشماله، وسنتعرّف أيضًا كيف ننقل نفس الهوية البصرية عبر الأجهزة المختلفة التي قد يزورك منها المستخدمون.<br>
	 
</p>

<h2 id="تعريف-بأيقونة-الهوية-favorite-icon">
	تعريفٌ بأيقونة الهوية Favorite Icon
</h2>

<p>
	هي تلك الصور الصغيرة التي تراها في ألسنة المتصفح بجانب عنوان الموقع، وتراها أيضًا في تاريخ التصفح والمواقع المفضّلة، سواء في المتصفح العادي أو على الأجهزة المحمولة، وتكون عادة بمقاس 16*16 أو 32*32 بكسل
</p>

<p style="text-align: center;">
	<a class="ipsAttachLink ipsAttachLink_image" data-fileid="25682" href="https://academy.hsoub.com/uploads/monthly_2017_11/fav-example.png.97c98b5799b36c4bb36d49fa6296f345.png" rel=""><img alt="fav-example.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25682" data-unique="8567g3yrd" src="https://academy.hsoub.com/uploads/monthly_2017_11/fav-example.thumb.png.66f877e5aa245080cd496aed4be59699.png"></a>
</p>

<p>
	وتلعب تلك الرموز الصغيرة دورًا هامًا في إبراز هوية موقعك فهي تميزه وسط الألسنة الكثيرة التي قد تكون لدى المستخدم في نفس الوقت، ووجود ذلك الرمز في لسان موقعك يعني أن المستخدم لن يجد صعوبة تذكر في العودة إليه بمجرد التفكير في ذلك، وهذا في مصلحة موقعك والمحتوى الموجود به.
</p>

<h2 id="الصيغ-المستخدمة-في-أيقونات-الهوية">
	الصيغ المستخدمة في أيقونات الهويّة
</h2>

<p>
	شقّت أيقونات الهويّة طريقها بصورة رسمية لأول مرة في متصفح ميكروسوفت “إنترنت إكسبلورر” إصدار 5، في عام 1999، أي حين كان الإنترنت في أيام طفولته، وقد اعتمدتها <a href="http://www.w3.org/" rel="external nofollow">W3C (اتحاد الويب العالمي)</a> في غضون بضعة أشهر، واستخدمها مطورو الويب من حينها.<br>
	وتدعم أغلب متصفحات الويب الآن صيغ الصور الحديثة التي يمكن إخراج أيقونة الهوية بها، مثل png – gif – svg، إضافة إلى صيغة ico القديمة، وسنمر سريعًا على أشهرهم سريعًا فيما يلي:
</p>

<h3 id="صيغة-ico">
	صيغة ICO
</h3>

<p>
	تظل هذه الصيغة أكثر صيغة مدعومة لأيقونات الهوية عبر المتصفحات والأجهزة المختلفة، ويفضَل أن تُخرج نسخة من أيقونة الهوية لموقعك بهذه الصيغة، حتى لو كنت تستخدم صيغة حديثة مثل PNG.<br>
	لماذا؟ ببساطة لأن الصيغ الأحدث مثل PNG وGIF غير مدعومة من بعض <a href="https://en.wikipedia.org/wiki/Favicon#Browser_implementation" rel="external nofollow">المتصفحات القديمة</a>، ولأن المكان الذي تبحث فيه المتصفحات عن أيقونة الهوية للموقع<a href="https://en.wikipedia.org/wiki/Favicon#How_to_use" rel="external nofollow"> يختلف بشكل كبير من متصفح لآخر</a>، وهناك احتمال لحدوث خطأ 404 إن لم يجد المتصفح أيقونة الهوية في المكان الافتراضي الذي يبحث فيه.<br>
	كما أن صيغة ICO تسمح بحفظ أكثر من صورة في نفس الملف، كأنها حاوية لمجموعة صور، وهذا يفيدنا في حفظ عدة نسخ من أيقونة الهوية بأكثر من كثافة نقطية في ملف واحد -مثلًا 16*16 و32*32 و48*48 كما <a href="https://msdn.microsoft.com/en-us/library/gg491740(v=vs.85).aspx" rel="external nofollow">تنصح مايكروسوفت</a>-، كي يقرر المتصفح أي صورة أفضل للعرض حال فتح الموقع من جهاز بعينه.<br>
	ذلك أن نسخة 16*16 مثلًا لن تكفي وحدها، فهي لا تناسب العرض في شريط المهام أو على سطح المكتب للمستخدم مثلًا وإن كانت مناسبة تمامًا للعرض في لسان المتصفح، فحينها يكون وجود أكثر من نسخة في مصلحة هوية الموقع البصرية.
</p>

<h3 id="صيغة-png">
	صيغة PNG
</h3>

<p>
	أحد المزايا الرئيسية لاستخدام صور PNG أن تصميمها وإخراجها سهل، وأن البرامج التي تقوم بذلك متوفرة للمختص وغير المختص، مثل PhotoShop وGIMP، كما أنها تدعم خيارات شفافية متطورة، ويدعمها اتحاد الويب العالمي كذلك W3C.<br>
	ورغم أن صيغة ICO تدعم شفافية قناة ألفا 8-بت “8bit alpha channel transparency”، إلا أن إيجاد برامج لتصميم الصورة وإظهار تأثير الشفافية من الصعوبة بمكان.
</p>

<h3 id="الاختيار-بين-الصيغتين">
	الاختيار بين الصيغتين
</h3>

<p>
	الإجابة المختصرة لسؤال “أي الصيغتين أستخدم؟” هي أن تستخدم كليهما، فيمكنك ضبط إعدادات أيقونة الهوية باستخدام وسم ، عبر تحديد المكان الذي يحتوي على أيقونة الهوية بصيغة PNG، مع الإبقاء على نسخة أخرى .ICO متاحة كخيار احتياطي في مجلد الجذر للموقع.<br>
	وبهذا فإنك تضمن تغطية أكبر قدر ممكن من إصدارات المتصفحات التي قد يدخل منها المستخدمون إلى موقعك مع تقليل احتمال ظهور خطأ 404.
</p>

<h3 id="ماذا-عن-الأجهزة-المحمولة">
	ماذا عن الأجهزة المحمولة؟
</h3>

<p>
	لا شك أن أغلب حركة الويب تأتي من أجهزة محمولة سواء كانت هواتف أو حواسيب لوحية، لذا يجب ألا تهمل ذلك أثناء تصميم أيقونة الهوية.<br>
	لكن تلك الأجهزة متشعبة ومتنوعة أكثر من المتصفحات نفسه،ا حين نفكر في مقاسات الصورة المناسبة وأحجام الشاشات وأنظمة تشغيل تلك الأجهزة أيضًا، فليس هناك حل واحد يناسبهم جميعًا.<br>
	وحينها يجب أن يكون لديك نسخ بصيغة PNG، ونسخ لأيقونات Apple Touch، وأخرى لرسوميات Windows 8 Tile Graphics، وهكذا .. كي تغطي كافة النسخ المحتملة لأيقونة الهوية لموقعك أو هويتك البصرية بشكل عام.<br>
	ولكن بداعي التبسيط في هذا المقال، فإننا سنكتفي بإنشاء أيقونة هوية بصيغة ico فقط، أما إن أردت التوسع بعدها فاطلع إن شئت على <a href="https://css-tricks.com/favicon-quiz/" rel="external nofollow">هذه الخيارات للأجهزة المحمولة</a>، و<a href="https://github.com/audreyr/favicon-cheat-sheet" rel="external nofollow">هذا الدليل الجامع لخيارات أيقونات الهوية</a>.
</p>

<h2 id="كيفية-إنشاء-أيقونة-هوية-fav-icon">
	كيفية إنشاء أيقونة هوية “Fav Icon”
</h2>

<p>
	إننا ننصح باستخدام برامج تصميم احترافية لإنشاء هويتك البصرية بشكل عام ولأيقونة الهوية في حالتنا هذه، وسنستخدم برنامج PhotoShop CS6 من شركة أدوبي لهذا الدليل، لكن لديك خيارات مجانية مثل GIMP أيضًا، وستجد الخيارات متشابهة نوعًا ما.
</p>

<p style="text-align: center;">
	<img alt="favicon-settings-photoshop1.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25683" data-unique="t0tr8t51i" src="https://academy.hsoub.com/uploads/monthly_2017_11/favicon-settings-photoshop1.png.05753602e017e7a884d53f159d699d53.png"></p>

<ol>
<li>
		حمّل إضافة ICO Format الخاصة ببرنامج فوتوشوب، والتي سنحفظ صورتنا بامتداد ico من خلالها.
	</li>
	<li>
		داخل فوتوشوب، اضغط File، ثم New، ثم أنشئ صورة بأبعاد 512*512 بكسل، بكثافة نقطية قدرها 72 بكسل/بوصة.
	</li>
	<li>
		صمم أيقونتك داخل مساحة الصورة الفارغة التي أنشأناها قبل قليل.
	</li>
	<li>
		حين يكون تصميمك جاهزًا، اضغط Image، ثم Image Size.
	</li>
	<li>
		تأكد من تنشيط خيار Constrain Proportions واضبط أبعاد الصورة على 16*16 بكسل.
	</li>
	<li>
		استخدم فلتر Unsharp Mask لتقليل التشويش في الأيقونة.
	</li>
	<li>
		اضغط File ثم حفظ باسم، واحفظ تصميمك بامتداد ICO
	</li>
</ol>
<p>
	وإليك مثالًا لأيقونة موقعي الخاص:
</p>

<p style="text-align: center;">
	<img alt="leaving-work-behind-favicon.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25685" data-unique="521of11hx" src="https://academy.hsoub.com/uploads/monthly_2017_11/leaving-work-behind-favicon.png.152094d8d8aa476313dd47bba79f7cda.png"></p>

<p>
	<br>
	وهناك أدوات على الإنترنت يمكن أن تستخدمها إن لم تكن ترغب في تصميم أيقونتك بنفسك، وكل ما عليك فعله هو رفع الصورة التي ترغب فيها إلى أحد هذه المواقع -معظم تلك الأدوات يمكنها إخراج ملفات ICO تحتوي على أحجام مختلفة للصورة- :
</p>

<ul>
<li>
		 <a href="http://tools.dynamicdrive.com/favicon/" rel="external nofollow">Dynamic Drive – Favicon Generator</a>
	</li>
	<li>
		 <a href="http://www.favicon.cc/" rel="external nofollow">Favicon.cc</a>
	</li>
	<li>
		 <a href="https://websitesetup.org/favicon-generator/" rel="external nofollow">Favicon Generator</a>
	</li>
</ul>
<p>
	انتبه إلى أن المظهر الافتراضي لصورتك في لسان المتصفح ستكون بكثافة 16*16 بكسل، فلا تجعل تصميمك به تفاصيل كثيرة تجعل من الصعب رؤية تفاصيل منها، فألق نظرة على الأيقونات التي تستخدمها أغلب المواقع المشهورة -أو يمكنك النظر إلى أيقونة أكاديمية حسوب في أعلى لسان المتصفح لديك-، وستلاحظ أنها بسيطة ومباشرة.<br>
	والآن بما أن لديك أيقونة هوية لموقعك، دعنا نضيفها داخل ووردبريس:
</p>

<h2 id="كيفية-إضافة-أيقونة-الهوية-إلى-ووردبريس">
	كيفية إضافة أيقونة الهوية إلى ووردبريس
</h2>

<p>
	إن كنت تعرف ووردبريس فستقول لابد أن يكون أحدهم قد كتب إضافة هنا أو هناك تقوم بهذا عني، وصحيح أنه يمكنك استخدام إضافات لتنفيذ هذا بدلًا عنك لكن يجب أن تكون لديك هذه المعرفة على أي حال بشيء صغير كهذا، بدلًا من تحميل موقعك بإضافة أخرى لمجرد تنفيذ شيء صغير كهذا.<br>
	وفي هذا الدليل المختصر، سنرى كيف نضيف ايقونة الهوية إلى ووردبريس 4.3 -هذا الإصدار وقت كتابة المقال الأصلي، لكن يمكن تطبيقه على نسخة ووردبريس لديك، نسخة 4.8 وقت ترجمة المقال-:
</p>

<ol>
<li>
		سجّل دخولك إلى لوحة إدارة ووردبريس.
	</li>
	<li>
		اضغط على Appearence (مظهر)، ثم Customize (تخصيص).
	</li>
	<li>
		 اضغط على Site Identity أو (هوية الموقع) إن كنت تستخدم النسخة العربية من ووردبريس.
	</li>
	<li>
		اضغط على Select file (اختر ملفًا) في الجزء الذي تجد مكتوبًا فيه Site Icon (أيقونة الموقع)، واختر أيقونة الهوية التي صممتها.
	</li>
	<li>
		ستظهر أيقونة الهوية الآن تحت ترويسة Site Icon في Site Identity، اضغط Save and Publish (حفظ ونشر).
	</li>
</ol>
<p style="text-align: center;">
	<a class="ipsAttachLink ipsAttachLink_image" data-fileid="25684" href="https://academy.hsoub.com/uploads/monthly_2017_11/fav_icon-e1441970276370.png.03806e31d02baf66d2843d170a8a3ea1.png" rel=""><img alt="fav_icon-e1441970276370.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25684" data-unique="nlkhsv54m" src="https://academy.hsoub.com/uploads/monthly_2017_11/fav_icon-e1441970276370.thumb.png.08cc4deae5d2d9194f734d0fa1026b76.png"></a>
</p>

<p>
	وهكذا نكون قد غيرنا أيقونة الهوية.<br>
	لاحظ أن ووردبريس تسمح لك بتعديل عملك قبل نشره باختيار جزء الصورة التي ترغب فيها كي تكون أيقونة الهوية، في حالة أن تكون الصورة التي رفعتها مستطيلة مثلًا وليست مربعة.
</p>

<h3 id="كيف-تضيف-أيقونة-الهوية-في-ووردبريس-42-والإصدارات-الأقدم">
	كيف تضيف أيقونة الهوية في ووردبريس 4.2 (والإصدارات الأقدم)
</h3>

<p>
	لأولئك الذين لم يرقّوا إصدرات ووردبريس لديهم لأي سبب كان، يمكن اتباع الخطوات التالية لإضافة أيقونة الهوية:
</p>

<ol>
<li>
		ارفع الصورة التي أنشأتها إلى المجلد الجذر لموقعك باستخدام برنامج لبروتوكول نقل الملفات FTP.
	</li>
	<li>
		الصق الشفرة التالية في ملف header.php داخل السمة التي تستخدمها للموقع: <a href="https://gist.github.com/midoriberlin/111a3ce34672106eb620" rel="external nofollow">https://gist.github.com/midoriberlin/111a3ce34672106eb620</a>، انتبه إلى أنك ستغير الرابط وامتداد الملف إن كنت تستخدم صيغة أخرى غير PNG.
	</li>
	<li>
		ارفع صورة أيقونة الهوية إلى مجلد السمة الرئيسي.
	</li>
</ol>
<p>
	تأكد أن ترفع صورة الأيقونة إلى المجلد الجذر للموقع والمجلد الرئيسي للسمة، فلا تهمل هذه الخطوة الثالثة كي تضمن ظهور أيقونة الهوية حتى لمن يتصفح محتوى الموقع من قارئات الأخبار “feed readers”.
</p>

<h2 id="الخلاصة">
	الخلاصة
</h2>

<p>
	آمل أنك بنهاية المقال قد رأيت أن تلك الأيقونة الصغيرة مهمة لهوية موقعك ومستخدميه، وأنها سهلة في إضافتها لووردبريس أيضًا -على الأقل في الإصدارات الحديثة منها-، أما الآن فدعني أعيد لك ملخص المقال في عجالة:
</p>

<ul>
<li>
		أضف كلا الصيغتين ICO وPNG لتغطية أكبر قدر ممكن من المتصفحات الموجودة الآن.
	</li>
	<li>
		اطلع على الدليل الجامع لأيقونات الهوية كي تستهدف أكبر شريحة ممكنة من الأجهزة المحمولة (أو حالات الاستخدام عمومًا).
	</li>
	<li>
		استغل أدوات مثل Favicon.cc كي تخرج أكثر من حجم لأيقونتك في ملف واحد بكفاءة ويسر.
	</li>
	<li>
		استخدم خاصية Site Icon في ووردبريس 4.3+ كي تريح رأسك من عناء تثبيتها بالطريقة التقليدية في الإصدارات القديمة، لكن الإصدار القديم متوفر إن شئت.
	</li>
</ul>
<p>
	دعنا نعرف في التعليقات إن واجهت مشكلة في عرضها في موقعك!
</p>

<p>
	ترجمة -وبتصرّف- لمقال <a href="https://premium.wpmudev.org/blog/favicons-wordpress/" rel="external nofollow">How to Add a Favicon to Your WordPress Site</a> لصاحبه Tom Ewer
</p>
]]></description><guid isPermaLink="false">310</guid><pubDate>Thu, 30 Nov 2017 10:38:00 +0000</pubDate></item><item><title>&#x627;&#x644;&#x627;&#x633;&#x62A;&#x62E;&#x62F;&#x627;&#x645; &#x627;&#x644;&#x623;&#x645;&#x62B;&#x644; &#x644;&#x644;&#x641;&#x626;&#x627;&#x62A; &#x648;&#x627;&#x644;&#x648;&#x633;&#x648;&#x645; &#x648;&#x627;&#x644;&#x62A;&#x635;&#x646;&#x64A;&#x641;&#x627;&#x62A; &#x641;&#x64A; &#x648;&#x648;&#x631;&#x62F;&#x628;&#x631;&#x64A;&#x633;</title><link>https://academy.hsoub.com/apps/web/wordpress/%D8%A7%D9%84%D8%A7%D8%B3%D8%AA%D8%AE%D8%AF%D8%A7%D9%85-%D8%A7%D9%84%D8%A3%D9%85%D8%AB%D9%84-%D9%84%D9%84%D9%81%D8%A6%D8%A7%D8%AA-%D9%88%D8%A7%D9%84%D9%88%D8%B3%D9%88%D9%85-%D9%88%D8%A7%D9%84%D8%AA%D8%B5%D9%86%D9%8A%D9%81%D8%A7%D8%AA-%D9%81%D9%8A-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-r309/</link><description><![CDATA[
<p><img src="https://academy.hsoub.com/uploads/monthly_2017_11/5a1bade434aad_27-2(1).png.aab65d87fcdf2c86888e63231ecccfea.png" /></p>

<p>
	قد تصاب بحيرة في بداية استخدامك لووردبريس حين تبدأ في التعمق فيها كنظام إدارة للمحتوى لديك لتواجه مصطلحات مثل التصنيفات-Taxonomy والتصنيفات الخاصة-Custom Taxonomies بعد أن كنت تتعامل بسلاسة مع الفئات-Categories والوسوم-Tags.<br>
	وسنتناول في هذا المقال الفرق بين كل منهم، وكيفية استخدامهم في موقعك، مع بعض الأمثلة على كيفية استخدامهم، ونظرة أيضًا على كيفية استخدام إضافاتنا لهم لإضافة إمكانيات جديدة لموقعك.
</p>

<h2 id="التعريفات">
	التعريفات
</h2>

<p>
	دعنا نبدأ ببعض التمهيد أولًا كي ندرك أبعاد ما نتحدث عنه، فنبدأ بالتصنيفات-taxonomies إذ أنها أوسع المصطلحات التي سنتعامل معها وأشملها.
</p>

<h3 id="التصنيف-taxonomy">
	التصنيف Taxonomy
</h3>

<p>
	أتى هذا المصطلح أصلًا من علم الأحياء، حيث يستخدم في تصنيفات الأنواع الحية وممالك الكائنات، ويعرّفه قاموس أوكسفورد على أنه “نظام يستخدم في التقسيم أو التصنيف”.<br>
	أما لدينا في ووردبريس فهو يشير إلى “<strong>تقنية جمع لبعض المنشورات أو الروابط أو أنواع مخصصة من المنشورات</strong>”، وهيا ننظر الآن في بعض الأمثلة التي ستزيل اللبس نهائيًا عن فهم التصنيف في ووردبريس.<br>
	فقد عرفنا إلى الآن أنه نظام تجميع تستخدمه أنت لتحديد نوع أي منشور في ووردبريس، فالفئة-category تُعدّ تصنيفًا، وكذلك الوسم-tag ما هو إلا تصنيف أيضًا، وتستطيع إنشاء تصنيفاتك الخاصة التي تضع المنشورات العادية والمخصصة تحتها، حيث يكثر استخدام التصنيفات لتمييز منشورات عادية عن نوع مخصص من المنشورات-Custom Post Type، من أجل تلافي أي خلط بين المنشورات العادية والمخصصة منها.<br>
	فمثلًا ستجد أن إضافة “Support System Plugin” تضيف نوعي منشورات خاصة حين تثبتّها في موقعك، وهما “Support Ticket” و”FAQ”. كما ستنشئ تصنيفين مخصصين هما “Ticket Category” و”FAQ Category”. وذلك التقسيم يفصل بين البطاقات “Tickets” التي لديك والأسئلة الشائعة “FAQ”، وبين منشورات عادية كمقالات مدونة الموقع.
</p>

<h3 id="ما-هو-الفصل-term">
	ما هو الفصل Term؟
</h3>

<p>
	هو عنصر داخل التصنيف، تستخدمه لتمييز منشوراتك عن بعضها، ويمكن أن يجمع عدة عناصر فرعية أخرى فيه. فإن كنت تستخدم إضافة “Support” التي ذكرناها قبل قليل وأنشأت فئات-categories لكل فريق من فِرَق الدعم لديك، فكل واحد من تلك الفِرَق يشكّل فصلًا في تصنيف “Ticket Category” الذي أنشأَته الإضافة حين ثبّتّها.<br>
	ويمكنك أن تنشئ فصولًا مختلفة لتصنيف “FAQ Category” كذلك إلا أنك قد ترى عناصر مكررة، لكن بالنسبة لووردبريس فهذه فصول مختلفة وستُخَزَّن منفصلة في قاعدة البيانات، حتى لو أعطيتها نفس الأسماء.
</p>

<p style="text-align: center;">
	<img alt="support-plugin.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25655" data-unique="abevam0uw" src="https://academy.hsoub.com/uploads/monthly_2017_11/support-plugin.png.5c85326ec98ef6ef956122c34c061a80.png"><br><span style="color:#999999;">إضافة Support System تضيف نوعين مخصصين من المنشورات، وتصنيفين</span>
</p>

<h3 id="ما-هي-الفئة-category">
	ما هي الفئة Category؟
</h3>

<p>
	يخلط الناس عادة بين الفئات-Categories والتصنيفات-Taxonomies، إليك وظيفة كل منهما وموقعه:<br>
	• الفئة عبارة عن تصنيف.<br>
	• فئة س التي تضيفها داخل تصنيف ص، هي فصل-Term داخل هذا التصنيف وأحد عناصره.<br>
	فإذا أنشأت فئات لمنشوراتك مثل “الأخيرة” و”المميزة”، فستكون تلك فصولًا في تصنيف واحد، تمامًا كما أن المبيعات والدعم مثلًا عبارة عن فصول في تصنيف “Ticket Categories” داخل إضافة “Support System”.
</p>

<h3 id="ما-هو-الوسم-tag-إذا">
	ما هو الوسم-Tag إذًا؟
</h3>

<p>
	الوسم يشبه الفئة كثيرًا، فهو فصل في تصنيف “post_tag”، فإن كان لديك “ووردبريس” و”شروح” كوسوم لمنشوراتك، فهما فصلان في تصنيف “post_tag”. ولا تسألني لماذا سُمّيت الوسوم في ووردبريس “post_tags” ولم تُسمّ الفئات “post_categories”، فهذا أحد ألغاز ووردبريس العجيبة.<br><strong>لكن ما الفرق بين الوسم والفئة، ولمَ نحتاج إلى الاثنين؟ ألا يغني أحدهما عن الآخر؟</strong><br>
	تختلف الفئات عن الوسوم في أن بنيتها هرمية، فيمكن أن تنشئ فئة فرعية من فئة موجودة أصلًا، لكن لا يمكن فعل هذا في الوسوم، لهذا ستجد نفسك تستخدم الفئات لهيكلة موقعك أكثر من الوسوم، بما أن لكل منهما بنية منفصلة.<br>
	أما التصنيفات ففيها مرونة أكبر، إذ يمكن تشكيلها لتكون هرمية مثل الفئات، ويمكن استخدامها مثل الوسوم بحيث لا يتفرع تصنيف من آخر، لذا يمكن اعتبارها تتصرف مثل الفئات، غير أن الفرق بينهما أن التصنيف يمكن أن يحتوي فئة بينما العكس غير صحيح.
</p>

<h2 id="إنشاء-التصنيفات-والفصول">
	إنشاء التصنيفات والفصول
</h2>

<p>
	ننتقل الآن إلى كيفية إنشاء فصل أو تصنيف بما أننا فصّلنا في معانيها قبل قليل، ستجد ابتداءًا أن ووردبريس لديها تصنيفات قليلة موجودة افتراضيًا، وهي:
</p>

<ul>
<li>
		<strong>Category</strong>
	</li>
	<li>
		<strong>Tag</strong>
	</li>
	<li>
		<strong>Link category</strong>: لا يُستخدم هذا مع المنشورات العادية، لكن مع منشورات الروابط. وهو أحد الآثار الموجودة في ووردبريس أيام ميزة كان اسمها blogroll. خلاصة الأمر أنك تستطيع تجاهل هذا التصنيف.
	</li>
	<li>
		<strong>Post format</strong>: يستخدم هذا التصنيف مع المنشورات العادية، ولتحديد نوع المنشور كذلك -فيديو، نص، إلخ-. أتخيل أن يكون هذا مفيدًا للمدونين رغم أني لم أستخدمه بنفسي أو أرى حالات استخدام كثيرة له.
	</li>
</ul>
<p>
	ومما سبق يتبيّن أن ووردبريس تأتي بأربع تصنيفات أساسية مباشرة، يمكننا الاستفادة مباشرة من اثنين منهما. وستجد تصنيف “Category” به فصل واحد وهو “uncategorized”، أما تصنيف “post_tag” لا يحتوي أي فصول حتى تضيف أنت بنفسك فيه.<br>
	لكن هذا لا يشكّل نهاية الطريق للتصنيفات والفصول في موقعك، فإن ووردبريس تسمح لك بإنشاء تصنيفاتك الخاصة وتضع تحتها أي نوع من المنشورات تراه مناسبًا.<br>
	ولديك طريقتين لإنشاء تصنيف خاص بك، وهي إما عبر دالة <a href="https://codex.wordpress.org/Function_Reference/register_taxonomy" rel="external nofollow">()register_taxonomy</a> بكتابة <a href="https://premium.wpmudev.org/blog/creating-content-taxonomies-and-fields/" rel="external nofollow">شفرة برمجية</a> ، أو باستخدام إضافة <a href="https://premium.wpmudev.org/project/custompress/" rel="external nofollow">CustomPress</a> لإنشاء تصنيفات جديدة دون كتابة أي شفرة.
</p>

<p style="text-align: center;">
	<img alt="custompress.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25654" data-unique="41qbj5f38" src="https://academy.hsoub.com/uploads/monthly_2017_11/custompress.png.835f649e888a6b8955444b24507031d4.png"></p>

<p>
	وأي من تلك الطريقتين ستنشئ تصنيفًا جديدًا، كما يمكنك إنشاء فصول برمجيًا باستخدام دالة <a href="https://codex.wordpress.org/Function_Reference/wp_insert_term" rel="external nofollow">()wp_insert_term</a> . قد يفيدك هذا إن كنت تكتب إضافة بتصنيف تريد تجهيزه بفصول مسبقًا، لذا إن كنت تكتب إضافة لتذاكر الدعم كإضافتنا التي تحدثنا عنها في أول المقال واستخدمناها كمثال، فربما تود إضافة تصنيف مثل”priority” مثلًا، وتضع فيه فصولًا بأسماء مثل “high” و”medium” و”low”.<br>
	غير أن أسهل طريقة يمكن إنشاء فصل بها هي من خلال صفحة داخل لوحة تحكم ووردبريس في إضافة “Support System”، تختص بإنشاء فئة تذاكر جديدة، وستجد أن إضافة فصل جديد هنا يشبه إضافة فئة جديدة في صفحة الفئات “categories”<br>
	إليك صورة منها:
</p>

<p style="text-align: center;">
	<img alt="ticket-categories.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25653" data-unique="2q1uvbz36" src="https://academy.hsoub.com/uploads/monthly_2017_11/ticket-categories.png.5d866b12ee65678dfc4344dc78b282af.png"></p>

<h2 id="استخدام-مختلف-للتصنيفات-والفئات-والفصول">
	استخدام مختلف للتصنيفات والفئات والفصول
</h2>

<p>
	توضع الفئات منفصلة عن التصنيفات المخصصة وفصولها، لا بأس بهذا إن كنت تستخدم إضافة من طرف ثالث يجب أن تعمل على أنواع عديدة من المواقع إن كان المطور لا يعرف كيف ستستخدم التصنيفات أو المنشورات العادية في موقعك، فعندهاا لن يجعل التصنيفات التي أنشأتها الإضافة تتفاعل مع تلك العادية التي ستستخدمها. لكن إن كنت تكتب إضافتك بنفسك، فلا بأس أن تستخدم خيالك قليلًا، كما سنرى الآن:
</p>

<h3 id="استخدام-التصنيفات-الخاصة-لإضافة-طابع-مميز-للمنشورات-العادية">
	استخدام التصنيفات الخاصة لإضافة طابع مميز للمنشورات العادية
</h3>

<p>
	قد يأتي عليك وقت لا تكفي فيه فئات موقعك لتصنيف المنشورات إن كان الموقع مبنيًا بشكل أساسي على المنشورات/المقالات وحدها، وستجد أنك تستخدم عدة طبقات من الفئات الفرعية إلى حد أن الفئات الرئيسية يجب أن تكون تصنيفات بحد ذاتها. وإحدى الطرق التي تحدد بها أن هذه هي حالتك أن تسأل نفسك إن كان هناك أي تفاعل بين الفئات الفرعية، وما إن كنت تربط الفئات الرئيسية إلى منشوراتك أم لا.<br>
	فإن كان كل محتوى مدونتك عن الكتب مثلًا، ولديك فئتين رئيسيتين هما المؤلِّف ومجال الكتاب، مع فئات فرعية لعدة مؤلفين وأنواع كثيرة للكتب، فيجب أن تنشئ تصنيفين رئيسيين هما المؤلف، ومجال الكتاب، لماذا؟
</p>

<ul>
<li>
		 لأن كل مقال عن كتاب سيكون تحت فئة واحدة فقط في تصنيف المؤلف.
	</li>
	<li>
		 لن تربط تصنيفي المؤلف ومجال الكتاب لأي مقال بعد الآن.
	</li>
</ul>
<p>
	كما أن إنشاء تصنيفات جديدة يتيح لك كتابة شفرة برمجية لاستعلامات مخصصة تبحث عن الكتب في مجال ما لمؤلف معين، قد تستطيع فعل هذا باستخدام الفئات، لكن لن تكون بنفس الكفاءة.
</p>

<h3 id="استخدام-التصنيفات-الخاصة-مع-المنشورات-وأنواع-المنشورات-الخاصة">
	استخدام التصنيفات الخاصة مع المنشورات وأنواع المنشورات الخاصة
</h3>

<p>
	لا يوجد سبب يمنعك من تسجيل تصنيف مخصص وتضع تحته نوع معينًا من المنشورات خصصته ليكون الخيار الافتراضي لما تنشره، فلنقل مثلًا أنك تعمل على مدونة الكتب السالفة الذكر، وأنشأت نوع منشورات سميته “review” تستخدمه لكتابة مراجعات عن الكتب التي قرأتها، فإن هذا يختلف قطعًا عن المقالات العادية في مدونتك والتي ستتحدث عن موضوعات أكثر شمولية حول الكتب.<br>
	فيمكن أن تنشئ تصنيفًا مخصصًا-Custom Taxonomy من مجال الكتاب لمراجعة الكتب، كي يعرف القراء أنك تحت هذا التصنيف تكتب مراجعات لكتب في هذا المجال أو ذاك. وإن أردت استخدام التصنيفات لمنشورات مدونتك أيضًا فيمكنك كتابة منشورات عن كل مجال تهتم به ثم تستخدم خطاف <a href="https://codex.wordpress.org/Plugin_API/Action_Reference/pre_get_posts" rel="external nofollow">pre_get_posts</a> لترتيب المنشورات والمراجعات في هذا المجال أو ذاك في صفحة أرشيفات الفصل الخاص به.<br>
	أو تنشئ قالبًا مخصصًا لهذا التصنيف (اسمه taxonomy-genre.php) كي يبدأ حلقتين-loops، واحد للمراجعات وآخر للمنشورات.
</p>

<h3 id="إضافة-التصنيفات-للصفحات">
	إضافة التصنيفات للصفحات
</h3>

<p>
	يمكنك أيضًا أن تضيف التصنيفات لأنواع منشورات ليس لديها تصنيف افتراضي ملحقة به، كالصفحات مثلًا. ولفعل هذا نستخدم دالة <a href="https://codex.wordpress.org/Function_Reference/register_taxonomy_for_object_type" rel="external nofollow">()register_taxonomy_for_object_type</a> ، إذ يسمح لك ذلك بإضافة أي تصنيفات موجودة مسبقًا إلى أي نوع منشور موجود أيضًا من قبل.<br>
	فكي تضيف تصنيفات إلى الصفحات مثلًا ستضيف هذا إلى دوال السمة التي تستخدمها أو إلى إضافة -plugin:
</p>

<pre class="ipsCode prettyprint lang-php prettyprinted" id="ips_uid_6875_7" style="">
<span class="pun">&lt;?</span><span class="pln">php register_taxonomy_for_object_type</span><span class="pun">(</span><span class="pln"> </span><span class="str">'category'</span><span class="pun">,</span><span class="pln"> </span><span class="str">'page'</span><span class="pln"> </span><span class="pun">);</span><span class="pln"> </span><span class="pun">?&gt;</span></pre>

<p>
	وإن أردت فعل هذا مع تصنيف أنشأته بنفسك، فأضف هذا السطر إلى شفرة إنشاء التصنيف باستخدام دالة <a href="https://codex.wordpress.org/Function_Reference/register_taxonomy" rel="external nofollow">()register_taxonomy</a> ، والعامل الثاني في هذه الدالة هو نوع المنشور الذي سيدخل تحت هذا التصنيف، وإن كنت تريد استخدام أكثر من نوع منشور فيجب أن تضعهم في مصفوفة.<br>
	إذًا، إذا أنشأت نوع منشورات اسمه “review” وأردت إنشاء تصنيفًا اسمه “genre” سيدخل تحته أي”review” أو”page” أو”post”، فإن شفرة إنشاء التصنيف تكون هكذا:
</p>

<pre class="ipsCode prettyprint lang-php prettyprinted" id="ips_uid_6875_9" style="">
<span class="pun">&lt;?</span><span class="pln">php register_taxonomy</span><span class="pun">(</span><span class="pln"> </span><span class="str">'genre'</span><span class="pun">,</span><span class="pln"> array</span><span class="pun">(</span><span class="pln"> </span><span class="str">'review'</span><span class="pun">,</span><span class="pln"> </span><span class="str">'post'</span><span class="pun">,</span><span class="pln"> </span><span class="str">'page'</span><span class="pln"> </span><span class="pun">),</span><span class="pln"> $args </span><span class="pun">);</span><span class="pln"> </span><span class="pun">?&gt;</span></pre>

<p>
	وكمل تلاحظ فإن أول عامل متغير هنا هو معرّف التصنيف “genre”، ثم الثاني هو مصفوفة أنواع المنشورات، والثالث هو معاملات للتصنيف الذي أنشأته.
</p>

<p>
	وفائدة استخدام التصنيفات هنا هي إمكانية إنشاء تصميمات لعناصر بعينها في هذا المجال -review،posts،page لتصنيف genre في حالتنا-، كما يمكن تحديد مكان أي صفحة في أي فئة ثم إجراء استعلام-query في قالب صفحتك يخرج لك منشورات ومراجعات من تلك الفئة بعد محتوى الصفحة التي حددتها، أو عرض محتويات الصفحة بمراجعاتها، أو المنشورات في صفحة أرشيفات التصنيف.
</p>

<h2 id="خاتمة">
	خاتمة
</h2>

<p>
	إن القدرة على إنشاء تصنيفاتك الخاصة في ووردبريس هو أحد الأمور التي جعلتها نظام إدارة محتوى بدلًا من منصة تدوين، عبر استغلال كل طرق التصنيف الممكنة للمحتوى التي يمكنك إنشاء مواقع تعرض المحتوى الذي تريده بدقة.<br>
	المهم ألا تترك نفسك تغرق في الاختلافات بين التصنيف والفئة، فالتصنيف-taxonomy هو الأشمل، وداخله فصول-terms، كل منها يمكن أن يكون فئة-category بذاتها.
</p>

<p>
	<br>
	ترجمة -بتصرف- لمقال <a href="https://premium.wpmudev.org/blog/wordpress-categories-tags-taxonomies/" rel="external nofollow">Using Categories, Tags and Taxonomies Properly in WordPress</a> لصاحبته ريتشل ماكّولن.
</p>
]]></description><guid isPermaLink="false">309</guid><pubDate>Mon, 27 Nov 2017 06:17:00 +0000</pubDate></item><item><title>&#x623;&#x62F;&#x648;&#x627;&#x62A; &#x62A;&#x647;&#x64A;&#x626;&#x629; &#x644;&#x644;&#x645;&#x62D;&#x62A;&#x648;&#x649; SEO &#x644;&#x627; &#x63A;&#x646;&#x649; &#x639;&#x646;&#x647;&#x627; &#x2013; &#x627;&#x644;&#x623;&#x62F;&#x648;&#x627;&#x62A; &#x627;&#x644;&#x645;&#x62C;&#x627;&#x646;&#x64A;&#x629; &#x648;&#x623;&#x62F;&#x648;&#x627;&#x62A; &#x627;&#x644;&#x628;&#x62D;&#x62B;</title><link>https://academy.hsoub.com/apps/web/wordpress/%D8%A3%D8%AF%D9%88%D8%A7%D8%AA-%D8%AA%D9%87%D9%8A%D8%A6%D8%A9-%D9%84%D9%84%D9%85%D8%AD%D8%AA%D9%88%D9%89-seo-%D9%84%D8%A7-%D8%BA%D9%86%D9%89-%D8%B9%D9%86%D9%87%D8%A7-%E2%80%93-%D8%A7%D9%84%D8%A3%D8%AF%D9%88%D8%A7%D8%AA-%D8%A7%D9%84%D9%85%D8%AC%D8%A7%D9%86%D9%8A%D8%A9-%D9%88%D8%A3%D8%AF%D9%88%D8%A7%D8%AA-%D8%A7%D9%84%D8%A8%D8%AD%D8%AB-r307/</link><description><![CDATA[
<p><img src="https://academy.hsoub.com/uploads/monthly_2020_10/5f7f0b4309843_---SEO--------.png.cbee750bf24121fee912857b3d9bee21.png" /></p>

<p>
	تابعنا في<a href="https://academy.hsoub.com/apps/web/wordpress/%D8%A3%D8%AF%D9%88%D8%A7%D8%AA-%D8%AA%D9%87%D9%8A%D8%A6%D8%A9-%D9%84%D9%84%D9%85%D8%AD%D8%AA%D9%88%D9%89-seo-%D9%84%D8%A7-%D8%BA%D9%86%D9%89-%D8%B9%D9%86%D9%87%D8%A7-%E2%80%93-%D9%84%D9%84%D9%85%D9%8A%D8%B2%D8%A7%D9%86%D9%8A%D8%A7%D8%AA-%D8%A7%D9%84%D9%83%D8%A8%D9%8A%D8%B1%D8%A9-%D9%88%D8%A7%D9%84%D9%85%D8%AA%D9%88%D8%B3%D8%B7%D8%A9-r305/" rel=""> الجزء السابق</a> من الدرس الأدوات الخاصة بالميزانيات الكبيرة والمتوسطة وسنتابع اليوم سرد أهم الأدوات المجانية وأدوات البحث..
</p>

<h2 id="أدوات-تهيئة-المحتوى-المجانية">
	أدوات تهيئة المحتوى المجانية
</h2>

<p>
	قبل أن تشتري أيًا من الأدوات التي ذكرناها في المقال، يجب أن تعرف أولًا بعض أشهر أدوات تهيئة المحتوى المجانية، فكيف ستعامل مع المزايا الكثيرة والمتشعبة للأدوات المدفوعة إن لم تستطع استخدام الأدوات المجانية بإمكانياتها البسيطة؟<br>
	وتكفي الأدوات التي سنذكرها الآن لتنفيذ مهام تهيئة المحتوى الخاصة بموقع تجاري صغير، وستعمل كدعامة حين تستخدم الأدوات المدفوعة فيما بعد.
</p>

<h3 id="1-answer-the-public">
	1. <a href="https://answerthepublic.com/" rel="external nofollow">Answer The Public</a>
</h3>

<p style="text-align: center;">
	<img alt="answer-the-public.jpg" class="ipsImage ipsImage_thumbnailed" data-fileid="25588" data-unique="6crrt6piu" src="https://academy.hsoub.com/uploads/monthly_2017_11/answer-the-public.jpg.23d65d229c21de7a9704b11c37a3c363.jpg"></p>

<p>
	هي أداة بحث بصرية للكلمات المفتاحية، وتجمع بين جامع الاقتراحات التلقائية من جوجل “Google AutoSuggest Scraping” مع جامع أسئلة “question scraper”، وتمنحك وصولًا سهلًا للأسئلة التي يسألها عملاؤك على جوجل، الأمر الذي يفيدك في تطوير موضوعات المحتوى لديك وإيجاد كلمات مفتاحية دلالية.
</p>

<h3 id="2-bloomberry-question-analyzer">
	2. <a href="http://buzzsumo.com/solutions/question-analyzer/" rel="external nofollow">Bloomberry / Question Analyzer</a>
</h3>

<p style="text-align: center;">
	<img alt="question-analyzer.jpg" class="ipsImage ipsImage_thumbnailed" data-fileid="25584" data-unique="di616j4sd" src="https://academy.hsoub.com/uploads/monthly_2017_11/question-analyzer.jpg.7453426fbe24f5e1174c25cb1ddd1200.jpg"></p>

<p>
	هي أداة مجانية تابعة لـ BuzzSumo، وتعرف أيضًا باسم Question Analyzer، وتيسّر هذه الأداة البحث عن الأسئلة عبر المنتديات المشهورة مثل ريدديت وقورا وأمازون، وكسابقتها فهي تساعدك على أن تجد كلمات مفتاحية مرتبطة بمحتواك وتبحث في أسئلة العملاء في الإنترنت.
</p>

<h3 id="3-ubersuggest">
	3. <a href="https://ubersuggest.io/" rel="external nofollow">UberSuggest</a>
</h3>

<p style="text-align: center;">
	<img alt="uber-suggest.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25587" data-unique="pl2612r1q" src="https://academy.hsoub.com/uploads/monthly_2017_11/uber-suggest.png.7bd7dc233c4725cdd726ce042bd14411.png"></p>

<p>
	استخدم هذه الأداة للبحث عن كلمات مفتاحية غير موجودة في مخطِّط جوجل للكلمات المفتاحية، فهي أداة بحث تُستَخدم كأداة لاقتراح الموضوعات التي يجب أن تكتب فيها، وعدد مرات البحث فيها غير محدود، كما أنها تنفِّذ مهمتها بشكل ممتاز، وهذا شيء جيد بالنسبة لأداة مجانية.
</p>

<h3 id="4-carrot2-search-engine">
	4. <a href="http://search.carrot2.org/stable/search" rel="external nofollow">Carrot2 Search Engine</a>
</h3>

<p style="text-align: center;">
	<img alt="Carrot2.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25579" data-unique="uzknyveqf" src="https://academy.hsoub.com/uploads/monthly_2017_11/Carrot2.png.1aeccb97ee990fe3e05471e9f1258266.png"></p>

<p>
	هي أداة مفتوحة المصدر لتجميع نتائج البحث، وتساعدك على تنظيم نتائج البحث في تصنيفات موضوعية لتعطيك لمحة سريعة وتقدم لك استعراضًا أكثر كفاءة، وهي أيضًا كسابقتيها مناسبة كأداة للبحث واختيار الموضوعات.
</p>

<h3 id="5-lsi-graph">
	5. <a href="https://lsigraph.com/" rel="external nofollow">LSI Graph</a>
</h3>

<p style="text-align: center;">
	<img alt="LSI.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25582" data-unique="e0v181poi" src="https://academy.hsoub.com/uploads/monthly_2017_11/LSI.png.fbc3e592b2645ee62e994f73f19967d5.png"></p>

<p>
	هو مولّد للكلمات المفتاحية الكامنة المفهرسة والمرتبطة بالكلمة المستهدفة لخدمة مهام تهيئة المحتوى، والكلمات المفتاحية التي يولّدها ترتبط بكلمة مفتاحية أساسية.<br>
	وباختصار فهذه الأداة تساعدك على إيجاد كلمات مفتاحية تتعلق بالكلمة الأساسية لديك.
</p>

<h2 id="أدوات-جوجل-المجانية">
	أدوات جوجل المجانية
</h2>

<h3 id="1-مخطط-جوجل-للكلمات-المفتاحية-google-keyword-planner">
	1. <a href="https://adwords.google.com/intl/en_ph/home/tools/keyword-planner/" rel="external nofollow">مخطِّط جوجل للكلمات المفتاحية Google Keyword Planner</a>
</h3>

<p style="text-align: center;">
	<img alt="GoogleKeyword.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25580" data-unique="5ue2uqcab" src="https://academy.hsoub.com/uploads/monthly_2017_11/GoogleKeyword.png.b31a376215f2e4c180fa67ad6d3129af.png"></p>

<p>
	لعله أشهر الأدوات التي تستخدم في البحث عن الكلمات المفتاحية في الإنترنت، وهو مباشر وبسيط: ابحث عن الكلمة المفتاحية وستحصل على بيانات مفيدة كثيرة.<br>
	وتُقسَّم البيانات فيه إلى أعمدة مثل مستوى المنافسة، والعرض المتوقع Estimated Bid، والتي تخبرك كم يتوقع أن تحوّل زوارك إلى عملاء باستخدام الكلمة المفتاحية التي بحثت عنها.
</p>

<h3 id="2-منصة-بحث-جوجل-google-search-consol">
	2. <a href="https://www.google.com/webmasters/tools/home?hl=en" rel="external nofollow">منصة بحث جوجل Google Search Consol</a>
</h3>

<p style="text-align: center;">
	<img alt="SearchConsole.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25586" data-unique="30jjzxxoy" src="https://academy.hsoub.com/uploads/monthly_2017_11/SearchConsole.png.a7e527465a0dd0499c17f0ac482c87fb.png"></p>

<p>
	منصة بحث جوجل هي خدمة مجانية تقدمها جوجل لتساعد موقعك على أن يُعثر عليه في الإنترنت، ويساعدك في مراقبة ومتابعة حالة موقعك وحضوره في الإنترنت، ويحدد ما إن كان لديك بيانات وصفية “meta data” مكررة أم لا، ويتفقد المشاكل الأمنية المحتملة بصفة دورية، ويقدم قائمة من الصفحات التي فهرستها إضافة إلى مزايا أخرى كثيرة.
</p>

<h3 id="3-معلومات-سرعة-الصفحات-من-جوجل-google-pagespeed-insights">
	3. <a href="https://developers.google.com/speed/pagespeed/insights/" rel="external nofollow">معلومات سرعة الصفحات من جوجل Google PageSpeed Insights</a>
</h3>

<p style="text-align: center;">
	<img alt="launching-a-website-google-pagespeedinsight.jpg" class="ipsImage ipsImage_thumbnailed" data-fileid="25581" data-unique="gjqf3pp7j" src="https://academy.hsoub.com/uploads/monthly_2017_11/launching-a-website-google-pagespeedinsight.jpg.dd349bc99429c73cdfa7ceb60a3a164a.jpg"></p>

<p>
	أحد أهم عوامل الترتيب التقني في تهيئة المحتوى هي سرعة تحميل الموقع، وهذه الأداة تمسح موقعك لتحدد سرعة تحميله بناءً على الوقت الذي يستغرقه جوجل في تفسيره، وتخبرك على إثر ذلك إن كان موقعك بطيئًا أو مناسبًا أو يحتاج مزيدًا من العمل عليه لتطويره، كما ستظهر لك بعض المشاكل التي قد تكون لديك وحلولها أيضًا.
</p>

<h2 id="أدوات-البحث-في-منصات-معينة">
	أدوات البحث في منصات معيّنة
</h2>

<h3 id="1-أداة-البحث-عن-الكلمات-المفتاحية-في-reddit-keyworddit">
	1. <a href="http://www.keyworddit.com/" rel="external nofollow">أداة البحث عن الكلمات المفتاحية في Reddit (keyworddit)</a>
</h3>

<p style="text-align: center;">
	<img alt="Reddit.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25585" data-unique="8wm4bl7rz" src="https://academy.hsoub.com/uploads/monthly_2017_11/Reddit.png.37a9f7ff0c9c33218313af7aabd18835.png"></p>

<p>
	تتيح لك هذه الأداة استخراج كلمات مفتاحية من مجتمع فرعي في ريدديت “Subreddit”، عبر كتابة اسم المجتمع الفرعي ثم اختيار واحد من القائمة التي سيولدها البرنامج تلقائيًا، ثم استخرج الكلمات المفتاحية من المجتمع الفرعي.
</p>

<h3 id="2-pinterest-keyword-tool">
	2. <a href="http://www.pinterestkeywordtool.com/" rel="external nofollow">Pinterest Keyword tool</a>
</h3>

<p style="text-align: center;">
	<img alt="Pinterest.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25583" data-unique="eteuoh5me" src="https://academy.hsoub.com/uploads/monthly_2017_11/Pinterest.png.c06d1a746085580e92a9cc05c16fceaf.png"></p>

<p>
	تساعدك هذه الأداة في تهيئة عناوين لوحات Pinterest Boards، وإن كنت تستهدف فئة المراهقين والشباب فاعلم أن Pinterest من المنصات المهمة لك، إذ <a href="https://www.omnicoreagency.com/pinterest-statistics/" rel="external nofollow">تذكر تقارير</a> أنهم يستخدمونها بنفس قدر استخدام إنستجرام.<br>
	وشأنها كمخطِّط جوجل للكلمات المفتاحية، فإن أداة pinterest المجانية للبحث عن الكلمات المفتاحية تتيح لك البحث عن “عبارات” مفتاحية -جُمل تتكون من ثلاث كلمات على الأقل وتستهدف شرائح محددة من السوق عوضًا عن استهداف كل السوق أو كل شريحة ممكنة-.<br>
	كما تتيح لك تفقُّد تاريخ بحثك عن الكلمات المفتاحية، وتحميل الكلمات إن شئت.
</p>

<h2 id="خاتمة">
	خاتمة
</h2>

<p>
	لا تمثّل هذه القائمة إلا غيضًا من فيض تلك الأدوات المتاحة على الإنترنت، وقد يكون من بينها ما هو أصلح لك اعتمادًا على المهام التي تريد تنفيذها.<br>
	وتحديد أي أداة أنسب لك يجب أن يمر عبر محاولات من التجربة والخطأ، لذا استغلّ فترات التجربة المجانية التي تقدمها بعض البرامج.<br>
	ترجمة -بتصرف- لمقال <a href="https://premium.wpmudev.org/blog/wordpress-seo-tools/" rel="external nofollow">WordPress SEO Tools for Every Budget</a> لصاحبته Maddy Osman
</p>
]]></description><guid isPermaLink="false">307</guid><pubDate>Mon, 20 Nov 2017 12:51:00 +0000</pubDate></item><item><title>&#x623;&#x62F;&#x648;&#x627;&#x62A; &#x62A;&#x647;&#x64A;&#x626;&#x629; &#x644;&#x644;&#x645;&#x62D;&#x62A;&#x648;&#x649; SEO &#x644;&#x627; &#x63A;&#x646;&#x649; &#x639;&#x646;&#x647;&#x627; &#x2013; &#x644;&#x644;&#x645;&#x64A;&#x632;&#x627;&#x646;&#x64A;&#x627;&#x62A; &#x627;&#x644;&#x643;&#x628;&#x64A;&#x631;&#x629; &#x648;&#x627;&#x644;&#x645;&#x62A;&#x648;&#x633;&#x637;&#x629;</title><link>https://academy.hsoub.com/apps/web/wordpress/%D8%A3%D8%AF%D9%88%D8%A7%D8%AA-%D8%AA%D9%87%D9%8A%D8%A6%D8%A9-%D9%84%D9%84%D9%85%D8%AD%D8%AA%D9%88%D9%89-seo-%D9%84%D8%A7-%D8%BA%D9%86%D9%89-%D8%B9%D9%86%D9%87%D8%A7-%E2%80%93-%D9%84%D9%84%D9%85%D9%8A%D8%B2%D8%A7%D9%86%D9%8A%D8%A7%D8%AA-%D8%A7%D9%84%D9%83%D8%A8%D9%8A%D8%B1%D8%A9-%D9%88%D8%A7%D9%84%D9%85%D8%AA%D9%88%D8%B3%D8%B7%D8%A9-r305/</link><description><![CDATA[
<p><img src="https://academy.hsoub.com/uploads/monthly_2017_11/5a0825e5338dd_13(1).png.caf975d1593ccaee18593f04a138d14a.png" /></p>

<p>
	لم تكن تهيئة المحتوى لمحركات البحث SEO تمثّل أولوية لمطوري الويب المتخصصين في ووردبريس منذ خمس سنوات مثلًا، لكنها بدأت تكتسب سمعة من حينها إلى الآن في <a href="https://academy.hsoub.com/marketing/performance-marketing/%D9%83%D9%8A%D9%81-%D8%A3%D8%AF%D9%91%D9%89-%D8%AA%D8%AD%D8%B3%D9%8A%D9%86-%D8%A7%D9%84%D8%B5%D9%81%D8%AD%D8%A9-%D8%A7%D9%84%D8%B1%D8%A6%D9%8A%D8%B3%D9%8A%D8%A9-%D9%84%D9%86%D8%B3%D8%AE%D8%A9-%D8%A7%D9%84%D9%85%D8%AD%D9%85%D9%88%D9%84-%D9%85%D9%86-%D9%85%D9%88%D9%82%D8%B9-%D8%A3%D8%AD%D8%B0%D9%8A%D8%A9-%D8%B2%D9%81%D8%A7%D9%81-%D8%A5%D9%84%D9%89-%D8%B2%D9%8A%D8%A7%D8%AF%D8%A9-%D8%A7%D9%84%D8%AA%D8%AD%D9%88%D9%8A%D9%84%D8%A7%D8%AA-conversions-r287/" rel="">جذب الزيارات الطبيعية “Organic Traffic”</a> إلى الموقع ومحتواه.<br>
	فبدون تقنية SEO لا يكون أمامك إلا فرض تخمينات لما يبحث عنه الناس، وكم منهم يريد إجابات، وأين تضعهم غاياتهم من ذلك البحث في قمع المبيعات لديك.<br>
	ولا شك أن هناك مئات من أدوات SEO التي يمكنك استخدامها، ويتوقف قرارك في استخدام هذه الأداة أو تلك دونًا عن غيرها على كونها ضرورية لا تستطيع تحقيق نتائج جيدة بدونها أم أنها إضافة لا بأس بها إلى العمل لكنه لن يتأثر لو لم تكن موجودة، خاصة إن مثّلت تهيئة المحتوى جزءًا صغيرًا من عملك أو إن كنت تعمل مستقلًا بدون دعم من مؤسسة/شركة ما، إذ ستكون دقيقًا في اختيار أداة تهيئة المحتوى المناسبة إلى طقم أدواتك بسبب ميزانيتك المتاحة وأسعار خدماتك التي تتأثر بارتفاع تكلفة ما تستخدمه من برامج.<br>
	وسننظر في هذا المقال في بعض أدوات تهيئة المحتوى التي تغطي شرائح عريضة من مستويات الإنفاق التي قد تكون متاحة لديك، فستجد أداة تناسبك من بينهم سواء كنت تملك مالًا فائضًا في ميزانيتك أو كنت تخطو خطواتك الأولى وتحتاج أن تقيّم نجاح كل أداة تضعها في جعبتك.
</p>

<h2 id="أدوات-تهيئة-المحتوى-للميزانيات-الكبيرةغير-المحدودة-الأفضل">
	أدوات تهيئة المحتوى للميزانيات الكبيرة/غير المحدودة: الأفضل
</h2>

<p>
	ستجد أدوات مجانية منتشرة في أرجاء الإنترنت -كما سيأتي بعد قليل-، لكنها لن تعطيك نفس الأداء الذي ستحصل عليه من الأدوات التي سنذكرها الآن، فلا شك أنك تحصل على أداء أفضل مقابل المال الذي ستدفعه.
</p>

<h3 id="1-moz">
	1. Moz
</h3>

<p>
	هي <a href="https://moz.com/" rel="external nofollow">شركة استشارية</a> تساعد الشركات على رفع ترتيبها في نتائج البحث، وقد أطلقت منتج Moz Pro في 2007، ولديها خدمات مجانية أيضًا لا بأس بأدائها، إلى جانب تلك المدفوعة.
</p>

<h3 id="moz-pro">
	Moz Pro
</h3>

<p style="text-align: center;">
	<img alt="moz-pro.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25494" data-unique="3xizbs4jh" src="https://academy.hsoub.com/uploads/monthly_2017_11/moz-pro.png.f3a217cb77addceb6e7f074751afcfa1.png"></p>

<p>
	<a href="https://moz.com/products/pro" rel="external nofollow">Moz Pro</a> هي أفضل باقة لديهم تقدّم لك مزايا مثل البحث بالكلمات المفتاحية Keyword Research، وبناء الروابط Link Building، والتحليل الشامل لكل ما يتعلق برؤية موقعك في نتائج البحث Site Audits، إضافة إلى بيانات عن تهيئة الصفحات Page Optimization Insights.<br>
	تبدأ أسعار MozPro من 100<script type="math/tex" id="MathJax-Element-87"> في الشهر لخطة الأسعار الأساسية Standard، وستجد لديهم فترة تجربة لمدة شهر لخطة الأسعار المتوسطة Medium التي تبدأ من 150</script>$شهر.
</p>

<h3 id="moz-local">
	Moz Local
</h3>

<p style="text-align: center;">
	<img alt="moz-local-dashboard.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25493" data-unique="t9y3j04u7" src="https://academy.hsoub.com/uploads/monthly_2017_11/moz-local-dashboard.png.d62081d9f1f2167fb6b819e1825ff4c2.png"></p>

<p>
	توفر <a href="https://moz.com/local/overview" rel="external nofollow">MozLocal</a> استخدامًا محددًا للشركات التي تريد تطوير التهيئة المحلية لمحركات البحث Local SEO -إرسال موقع شركتك الجغرافي إلى محركات البحث-، فهي تساعد العملاء الجدد ومحركات البحث المحلية على إيجاد شركتك جغرافيًا، ويمكنك اختبار تلك الأداة بالحصول على ناتج التسجيل المجاني لك، وإن أعجبتك فيمكنك الترقية مقابل نحو 10$/شهريًا.
</p>

<h3 id="الأدوات-المجانية-من-moz">
	الأدوات المجانية من Moz
</h3>

<p style="text-align: center;">
	<img alt="moz-keyword-explorer.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25492" data-unique="utm0q6ry6" src="https://academy.hsoub.com/uploads/monthly_2017_11/moz-keyword-explorer.png.8ae068d029cc1d7c6e9079a27cb31ca9.png"></p>

<p>
	لا تنتهي جودة منتجات Moz عند المنتجات المدفوعة فقط، فلديهم بعض المنتجات المجانية التي لاقت رواجًا، مثل:
</p>

<ul>
<li>
		Moz Keyword Explorer: أداة تجد لك أفضل الكلمات المفتاحية المناسبة لموقعك.
	</li>
	<li>
		Moz Open Site Explorer: أداة تساعدك على فرص إظهار المحتوى وبناء الروابط.
	</li>
	<li>
		MozBar : إضافة للمتصفح تساعدك على فحص وتحليل البحث المهم ومقاييس الصفحات ومقاييس الشبكات الاجتماعية للمواقع التي تزورها.
	</li>
</ul>
<h3 id="2-semrush">
	2. SEMRush
</h3>

<p style="text-align: center;">
	<img alt="semrush.jpg" class="ipsImage ipsImage_thumbnailed" data-fileid="25496" data-unique="5esqwsc34" src="https://academy.hsoub.com/uploads/monthly_2017_11/semrush.jpg.1bf58c650c211283f9a4b914b80e3c5b.jpg"></p>

<p>
	هي إحدى أفضل الأدوات الموجودة في السوق لتهيئة المحتوى إضافة إلى Moz Pro التي أسلفنا ذكرها، فبحث الكلمات المفتاحية الخاص بها -والذي يعتبر أحد أبرز مزاياها- يُظهر أفضل الكلمات المفتاحية التي يستخدمها منافسوك.<br>
	وكسابقتها Moz Pro فإن <a href="https://www.semrush.com/" rel="external nofollow">SEMRush</a> توفر حزمة متكاملة من المزايا كما نرى فيما يلي:
</p>

<ul>
<li>
		صعوبة الكلمات المفتاحية Keyword Difficulty: مقدار الجهد الذي تتطلبه كي تصل إلى درجات جوجل الأولى في البحث لكلمة مفتاحية بعينها.
	</li>
	<li>
		الروابط الخلفية BackLinks.
	</li>
	<li>
		التحليل الكامل للموقع Site Audit.
	</li>
	<li>
		متابعة التغير في صفحة نتائج البحث SERP Position Tracking: وهي الصفحة التي يوفرها محرك البحث كاستجابة لطلب بحث من مستخدم ما، حيث SERP هي Search Engine Results Page أو صفحة النتائج من محرك البحث.
	</li>
	<li>
		مقارنات بين النطاقات Domain vs Domain Comparison.
	</li>
	<li>
		اقتراحات تهيئةٍ للمحتوى لموقعك.
	</li>
</ul>
<p>
	وتبدأ أسعار خدماتها من 100$ شهريًا لباقة Pro.
</p>

<h3 id="3-ahref">
	3. Ahref
</h3>

<p style="text-align: center;">
	<img alt="ahrefs.jpg" class="ipsImage ipsImage_thumbnailed" data-fileid="25489" data-unique="flqvn2lj5" src="https://academy.hsoub.com/uploads/monthly_2017_11/ahrefs.jpg.dc01c285f490a0de032e5700b470bc9a.jpg"></p>

<p>
	يروّج العديد من خبراء تهيئة المحتوى لأداة <a href="https://ahrefs.com/" rel="external nofollow">Ahref</a> على أنها أداتهم المفضّلة، فلديها أحد أفضل أدوات تحليل الروابط الخلفية في السوق مقارنة بسابقتيها اللتين شرحناهما قبل قليل، وهي تتباهى بأن لديها أكبر قاعدة روابط -أكثر من 12 تريليون رابط-، وتحدث تلك القائمة مرة يوميًا على الأقل.<br>
	وتبدأ أسعارها من 100$ للباقة الخفيفة lite، ولديها فترات تجربة مجانية.
</p>

<h3 id="4-buzzsumo">
	4. BuzzSumo
</h3>

<p style="text-align: center;">
	<img alt="buzzsumo.jpg" class="ipsImage ipsImage_thumbnailed" data-fileid="25490" data-unique="iryj90ijt" src="https://academy.hsoub.com/uploads/monthly_2017_11/buzzsumo.jpg.51f19eb3b4c29531d4cf3d5dcdc6bac1.jpg"></p>

<p>
	لا يمكن القول أن <a href="http://buzzsumo.com/" rel="external nofollow">BuzzSumo</a> أداة تهيئة محتوى مثل Moz أو SEMRush أو Ahref، لكننا لا ننكر أيضًا الرابط العميق بين المحتوى نفسه وتهيئته لمحركات البحث، وتقع هي في هذه المنطقة كأداة بحث قوية للمحتوى.<br>
	فهي تسمح لك بمعرفة مستوى أداء محتواك مقارنة بالسوق ككل، إضافة إلى تحديد المؤثرين الرئيسيين في السوق، ويفيدك هذا في تحليل أداء محتواك في الموضوعات المختلفة، وأداؤه مقارنة بمنافسيك أيضًا.<br>
	يبدأ سعر باقة Pro من 80$، مع فرصة تجربة مجانية.
</p>

<h2 id="أدوات-تهيئة-المحتوى-للميزانية-المتوسطة">
	أدوات تهيئة المحتوى للميزانية المتوسطة
</h2>

<p>
	من الصعب تبرير التكاليف التي ستأتي مع أغلى أدوات تهيئة محتوى في السوق إن كنت تعمل مستقلًا، لهذا فإن الأفضل لك أن تختار إحدى الأدوات ذات التكلفة المتوسطة، وما يلي هو نتيجة بحثنا في تلك الأدوات:
</p>

<h3 id="1-serpstat">
	1. <a href="https://serpstat.com/" rel="external nofollow">SerpStat</a>
</h3>

<p style="text-align: center;">
	<img alt="serpstat.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25498" data-unique="c2ski2l0v" src="https://academy.hsoub.com/uploads/monthly_2017_11/serpstat.png.94cff765ad7aa5fea9c9ecd8731952be.png"></p>

<p>
	تبدأ أسعار تلك الأداة من 20<script type="math/tex" id="MathJax-Element-86">/شهريًا للحساب الشخصي، و500</script> للشركات، ولديها فترة تجربة مجانية أيضًا، أما مزاياها فما يلي:
</p>

<ul>
<li>
		متابعة تغير نتائج البحث SERP Position Tracking.
	</li>
	<li>
		تحليل الروابط الخلفية.
	</li>
	<li>
		بحث عن الكلمات المفتاحية.
	</li>
	<li>
		التحليل الشامل للموقع Site Audit.
	</li>
	<li>
		تحليل المنافسين.
	</li>
</ul>
<h3 id="2-se-ranking">
	2. <a href="https://seranking.com/" rel="external nofollow">SE Ranking</a>
</h3>

<p style="text-align: center;">
	<img alt="se-ranking.jpg" class="ipsImage ipsImage_thumbnailed" data-fileid="25497" data-unique="3x7u4wlbp" src="https://academy.hsoub.com/uploads/monthly_2017_11/se-ranking.jpg.ce2a70d7356d2cd9ad75464f4819d657.jpg"></p>

<p>
	هي أحد الأدوات التي تعتمد على التخزين السحابي، وتوفر مزايا عديدة مثل متابعة نتائج البحث وتحليل المنافسين وتفقُّد الروابط الخلفية ومراقبتها، والتحليل العميق للموقع، ولديها إعدادات مناسبة لمن يتعاملون مع عدة عملاء كالشركات مثلًا. وتبدأ أسعارها من 7$/شهريًا للحساب الشخصي مع فترة تجربة مجانية.
</p>

<h3 id="3-majestic-seo">
	3. <a href="https://majestic.com/" rel="external nofollow">Majestic SEO</a>
</h3>

<p style="text-align: center;">
	<img alt="majestic-seo.jpg" class="ipsImage ipsImage_thumbnailed" data-fileid="25491" data-unique="0lx2w16am" src="https://academy.hsoub.com/uploads/monthly_2017_11/majestic-seo.jpg.a29ec75bf955b7562d10898d70697348.jpg"></p>

<p>
	يمكن وضع تلك الأداة في مقارنة مع أداة Ahref السالفة الذكر، إذ تختص بالتهيئة المتعلقة بالروابط، ولديها قاعدة روابط كبيرة تدّعي أنها الأكبر في العالم.<br>
	ولديها مزايا مثل TrustFlow وcitationFlow لقياس جودة المواقع التي ترغب في أن تحصل على رابط منها، فتعرف إن كانت تلك المواقع سبام أم لا.<br>
	تبدأ أسعارها من 80$/شهريًا لباقة Lite.
</p>

<h3 id="4-smartcrawl-seo-plugin">
	4. <a href="https://premium.wpmudev.org/project/smartcrawl-wordpress-seo/" rel="external nofollow">SmartCrawl SEO Plugin</a>
</h3>

<p style="text-align: center;">
	<img alt="smartcrawl.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25499" data-unique="dvheesylt" src="https://academy.hsoub.com/uploads/monthly_2017_11/smartcrawl.png.90e075404ad3d4223e27bce2cd991595.png"></p>

<p>
	هي إضافة ووردبريس أنشأتها WPMU DEV -شركة تنتج حلولًا لووردبريس-، وتهدف إلى زيادة الـ PageRank وجلب مزيد من الزيارات إلى موقعك، وتحتاج هذه الإضافة إلى إعداد بسيط في البداية كي تعطيك نتائج تهيئة سريعة وممتازة من أجل أن تراك محركات بحث مثل Google وbing.<br>
	كل ما عليك هو تحميلها وتثبيتها ثم تفعيلها، وستولّد خريطة لموقعك تلقائيًا، ويمكنك ضبط إعداداتها من لوحة التحكم “wordpress dashboard” &gt; ثم إعدادات “Settings” &gt; ثم SmartCrawl.
</p>

<h3 id="5-the-seo-framework">
	5. <a href="https://premium.wpmudev.org/blog/review-seo-framework-wordpress/" rel="external nofollow">The SEO Framework</a>
</h3>

<p>
	هي إضافة حديثة نسبيًا لتهيئة المحتوى كتبها سايبر واجر -أحد أعضاء WPMU DEV- وبدأت تحصل على انتشار سريع، وبدأ الأمر حين كان يعمل على مشروع لعميل يستخدم سمة ليس فيها إعدادات متطورة لتهيئة المحتوى، فقرر أن يكتب إضافة تقوم بهذا.<br>
	وقد نشرها لأعضاء WPMU DEV في مايو2015 وجعلها متاحة لهم، إذ شعر أنه تعلم الكثير من مجتمع WPMU DEV ومن المناسب أن يرد لهم الجميل بشيء ما، ثم أطلق الإضافة إلى <a href="https://wordpress.org/plugins/autodescription/" rel="external nofollow">مستودع ووردبريس للإضافات</a> حين حصل على نقد إيجابي من غيره من الأعضاء.<br>
	ويفضّلها الناس عادة على بعض إضافات تهيئة المحتوى التقليدية، إذ أنها خالية من الإعلانات والسَُخام -bloatware-، لذا فهي مثالية لمهام تهيئة المحتوى وتفقُّد موقعك.
</p>

<h3 id="6-screaming-frog-seo-spider">
	6. <a href="https://www.screamingfrog.co.uk/seo-spider/" rel="external nofollow">Screaming Frog SEO Spider</a>
</h3>

<p style="text-align: center;">
	<img alt="screaming-frog.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25495" data-unique="hlw5yff9x" src="https://academy.hsoub.com/uploads/monthly_2017_11/screaming-frog.png.6cde14b8f0cddf480d346dac34153dcc.png"></p>

<p>
	هو برنامج لسطح المكتب -ويندوز أو ماك أو لينكس- تثبّته على حاسوبك محليًّا، وينتشر في الإنترنت عن طريق زاحفات “crawlers” بحثًا عن روابط المواقع والصور والنصوص والتطبيقات لتقييم أي عنصر على الإنترنت من منظور SEO.<br>
	وهذه الأداة مناسبة لتحليل موقعك والحصول على تحليل لأي مشكلة تقنية، ولديهم باقة مدفوعة بـ150$ في العام، إضافة إلى باقة مجانية.<br>
	وسنتابع في الدرس القادم بقية الأدوات…
</p>

<p>
	ترجمة -بتصرف- لمقال <a href="https://premium.wpmudev.org/blog/wordpress-seo-tools/" rel="external nofollow">WordPress SEO Tools for Every Budget</a> لصاحبته Maddy Osman
</p>
]]></description><guid isPermaLink="false">305</guid><pubDate>Mon, 13 Nov 2017 07:03:00 +0000</pubDate></item><item><title>&#x643;&#x64A;&#x641; &#x62A;&#x647;&#x64A;&#x626; &#x644;&#x648;&#x62D;&#x629; &#x62A;&#x62D;&#x643;&#x645; &#x645;&#x648;&#x642;&#x639; &#x648;&#x648;&#x631;&#x62F;&#x628;&#x631;&#x64A;&#x633; &#x644;&#x639;&#x645;&#x64A;&#x644;&#x643; &#x627;&#x644;&#x630;&#x64A; &#x644;&#x627; &#x64A;&#x645;&#x644;&#x643; &#x627;&#x644;&#x62E;&#x628;&#x631;&#x629; &#x623;&#x648; &#x627;&#x644;&#x648;&#x642;&#x62A; &#x644;&#x62A;&#x647;&#x64A;&#x626;&#x62A;&#x647;&#x627; &#x628;&#x646;&#x641;&#x633;&#x647;</title><link>https://academy.hsoub.com/apps/web/wordpress/%D9%83%D9%8A%D9%81-%D8%AA%D9%87%D9%8A%D8%A6-%D9%84%D9%88%D8%AD%D8%A9-%D8%AA%D8%AD%D9%83%D9%85-%D9%85%D9%88%D9%82%D8%B9-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-%D9%84%D8%B9%D9%85%D9%8A%D9%84%D9%83-%D8%A7%D9%84%D8%B0%D9%8A-%D9%84%D8%A7-%D9%8A%D9%85%D9%84%D9%83-%D8%A7%D9%84%D8%AE%D8%A8%D8%B1%D8%A9-%D8%A3%D9%88-%D8%A7%D9%84%D9%88%D9%82%D8%AA-%D9%84%D8%AA%D9%87%D9%8A%D8%A6%D8%AA%D9%87%D8%A7-%D8%A8%D9%86%D9%81%D8%B3%D9%87-r303/</link><description><![CDATA[
<p><img src="https://academy.hsoub.com/uploads/monthly_2020_09/thumbnail.png.ec9aeaacd888fc08df601ad0c24bb007.png" /></p>

<p>
	إن كنت تنشئ موقعًا لعملاء أو لمستخدمين بعيدين عن التقنية فإن تخصيص وتهيئة لوحة التحكم في ووردبريس يساعدهم على إدارة الموقع والعمل على المحتوى بشكل أيسر وأسرع، فأغلب العملاء الذين يطلبون مني بناء مواقع تستخدم ووردبريس يكونون بعيدين عن التقنية ولا يملكون وقتًا لتعلم كيفية إدارة الموقع أو ووردبريس.
</p>

<p>
	لذا يقع علي أنا أن أخصص لوحة التحكم "dashboard” وصفحات الإدارة الأخرى داخل لوحة التحكم لتيسير الأمر عليهم، كما أني أضع بعض أشكال الدعاية المختلفة لي ولعملي داخل التحكم كنوع من الدعاية لنفسي.
</p>

<p>
	ويختلف التخصيص الذي أقوم به حسب حاجة كل عميل، لكن عادة يكون فيه واحد أو أكثر من العناصر التالية:
</p>

<ul>
<li>
		وضع شعاري في صفحة تسجيل الدخول.
	</li>
	<li>
		وضع دعاية لي في أقسام لوحة التحكم، من شيء بسيط مثل تغيير نصوص الترويسة "header" والتذييل "footer”، إلى وضع هويّتي في الألوان والشكل العام للأقسام.
	</li>
	<li>
		إزالة ودجات لوحة المتحكمات التي لا يحتاجها العميل، وإضافة ودجات أخرى مع تعريف وشرح لما يجب أن يعرفوه عن الموقع.
	</li>
	<li>
		إزالة عناصر من قوائم الإدارة التي لا يحتاج العميل إلى الدخول إليها، وإضافة عناصر أخرى عند الحاجة.
	</li>
	<li>
		إضافة صناديق وصفية "metaboxes” لتعديل الأقسام كي يستطيع العميل إضافة بيانات عبر الحقول المخصصة.
	</li>
</ul>
<p>
	وتزوّدك ووردبريس بالعديد من الدوال التي تساعدك إن أردت كتابة تلك المهام بنفسك برمجيًا -وهو ما أفعله عادة، فأضع كل التخصيصات التي أرغب بها في إضافة "plugin" إدارية مخصصة-، لكن إن لم ترغب في كتابتها بنفسك أو داهمك موعد التسليم وأردت حلولًا أسرع، فإذًا طريقك الأسرع والأسهل هو إضافات ووردبريس الجاهزة.
</p>

<p>
	وسأضع بين يديك في هذا المقال أفضل 10 إضافات في نظري لتخصيص أقسام لوحة التحكم في ووردبريس، إضافات تتنوع من تلك التي تسمح لك بتعديلات كثيرة في لوحة التحكم إلى تلك الصغيرة التي تنفذ مهمة واحدة فقط وبسيطة، لتقرر أنت بعدها استخدام ما يناسبك وفق الحالة التي لديك، وسنبدأ بأكبر واحدة فيهم:
</p>

<h2>
	Ultimate Branding
</h2>

<p style="text-align: center;">
	<img alt="ultimate-branding-600x171.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25432" data-unique="vk46f9c30" src="https://academy.hsoub.com/uploads/monthly_2017_11/ultimate-branding-600x171.png.2d3236fb95f848911dd90c29a38ac16b.png"></p>

<p>
	تعطيك <a href="https://premium.wpmudev.org/project/ultimate-branding/" rel="external nofollow">هذه الإضافة</a> خيارًا لتعديل الواجهات الأمامية للمواقع في شبكتك إن كنت تدير أكثر من موقع، إضافة إلى تخصيص أقسام لوحة التحكم طبعًا، وإضفاء الطابع المميز لهويّتك فيها، وتغيير لوحة المتحكمات، وإزالة عناصر القوائم التي لا تريدها، وإعادة ترتيب العناصر الباقية، وإنشاء شريط إدارة مخصص "admin bar”، وتضيف نصوصًا مساعِدة، وغير ذلك الكثير.
</p>

<p>
	ويمكنك تفعيل/إلغاء تفعيل أي من تلك المزايا من لوحة المتحكّمات كي تستخدم ما تحتاجه فقط لموقعك كما ترى في الصورة التالية:
</p>

<p style="text-align: center;">
	<img alt="ultimate-branding-dashboard.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25433" data-unique="0hn4swxju" src="https://academy.hsoub.com/uploads/monthly_2017_11/ultimate-branding-dashboard.png.30777ef425e1de40a4030447b67f93df.png"></p>

<h2>
	White Labels CMS
</h2>

<p style="text-align: center;">
	<img alt="white-label-cms-600x171.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25434" data-unique="t99h1ns4x" src="https://academy.hsoub.com/uploads/monthly_2017_11/white-label-cms-600x171.png.29aed3881a83c281cf10bcdc89ed71d3.png"></p>

<p>
	هذه هي أشهر <a href="https://en-gb.wordpress.org/plugins/white-label-cms/" rel="external nofollow">إضافة مجانية</a> لتخصيص لوحة التحكم، فتضيف من خلالها شعارك الخاص، وتضيف/تزيل ودجات لوحة المتحكمات، أو تخفي الصناديق الوصفية في صفحات التعديل "editing screens”، وتزيل العناصر التي لا تريدها من قوائم لوحة التحكم، وتضيف شفرة CSS خاصة بك أيضًا إن شئت.
</p>

<p>
	وقد لا تكون محمّلة بالمزايا مثل Ultimate Branding، وقد تصيبك واجهة استخدامها ذات الصفحة الواحدة بقليل من الحيرة، لكن الجيد فيها أنها مجانية وتوفّر أغلب الوظائف الموجودة في كل الإضافات المجانية.
</p>

<h2>
	Admin Menu Editor
</h2>

<p style="text-align: center;">
	<img alt="admin-menu-editor-600x171.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25435" data-unique="8zdi63brp" src="https://academy.hsoub.com/uploads/monthly_2017_11/admin-menu-editor-600x171.png.c1651320135ea58a33cf04f872423ac7.png"></p>

<p>
	إن كان كل ما تحتاجه هو إضافة أو إزالة عناصر في قوائم إدارة ووردبريس فهذه <a href="https://en-gb.wordpress.org/plugins/admin-menu-editor/" rel="external nofollow">الإضافة</a> مناسبة للغاية، بل تستطيع من خلالها تغيير أسماء عناصر القوائم في حالة كنت تبني موقعًا لعميل سيكتب أخبارًا مثلًا، فحينها يكون من المناسب تغيير نص Posts إلى News إن كنت تستخدم النسخة الإنجليزية، وكذلك الأمر بالنسبة لصفحة إدارة القوائم في قوائم التنقل. ويمكنك أيضًا إعادة ترتيب عناصر القائمة وإخفاؤها من المستخدمين الذين لا يملكون خبرة كافية بالتعامل معها.
</p>

<p>
	وإن جربت الترقية إلى النسخة المدفوعة منها فستحصل على خيارات بنقل عناصر القوائم الفرعية إلى قوائم أخرى، في حالة حذف خيارات كثيرة من قائمتين أو أكثر مثلًا، فيكون جمع العناصر الجديدة في قائمة مستقلة خيارًا مناسبًا.
</p>

<h2>
	Post Type Archive Link
</h2>

<p style="text-align: center;">
	<img alt="post-type-archives-600x171.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25431" data-unique="44yjwi9nl" src="https://academy.hsoub.com/uploads/monthly_2017_11/post-type-archives-600x171.png.57d059863d104133329869d5c32ce89f.png"></p>

<p>
	أحد الأمور التي تحيرني في ووردبريس هو صعوبة إضافة رابط لأرشيف نوع معين من المنشورات إلى قوائم التنقل، والطريقة الوحيدة لفعل ذلك هي معرفة رابط أرشيف المنشور نفسه ثم إضافته كرابط مخصص، وهذا قد يكون عسيرًا إن لم تكن معتادًا على طريقة توليد ووردبريس للروابط.
</p>

<p>
	وهنا يأتي دور إضافة <a href="https://en-gb.wordpress.org/plugins/post-type-archive-links/" rel="external nofollow">Post Type Archive Link</a> إذ تضيف صندوقًا لأنواع منشوراتك المخصصة إلى صفحة قوائم الإدارة كي تضيف رابطًا لكل أرشيف خاص بنوع منشور معين إلى القوائم لديك، وهذا مفيد جدًا في حالة كنت تستخدم ووردبريس كنظام إدارة محتوى ولديك عدة أنواع مختلفة من المنشورات.
</p>

<h2>
	Media Library Assistant
</h2>

<p style="text-align: center;">
	<img alt="media-library-assistant-600x171.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25430" data-unique="akyo5gn92" src="https://academy.hsoub.com/uploads/monthly_2017_11/media-library-assistant-600x171.png.1dc6680e8501dd84eedd2054d1e95be1.png"></p>

<p>
	إن كان لديك ملفات وسائط كثيرة وأردت إدارتها بكفاءة أكبر بدلًا من الخيارات المتوفرة افتراضيًا، فّإن<a href="https://wordpress.org/plugins/media-library-assistant/" rel="external nofollow"> هذه الإضافة</a> تسمح لك بإضافة تصنيفات ووسوم إلى ملفات الوسائط، كما تعرض معلومات عن كل ملف في القائمة الرئيسية للوسائط، كأن تبيّن أي منشور نشرت فيه صورة معينة كصورة رئيسية مع رابط إلى المنشور نفسه.
</p>

<p>
	وتتجلى أهمية هذه الإضافة حين تحتاج أن تغير أو تزيل صورة تعرف اسمها، لكنك لا تدري أين رفعتها بالضبط.
</p>

<h2>
	Login Logo
</h2>

<p style="text-align: center;">
	<img alt="login-logo-600x171.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25438" data-unique="nkzrx5da3" src="https://academy.hsoub.com/uploads/monthly_2017_11/login-logo-600x171.png.d5f90cd71c06b42c59b971555b77d3d6.png"></p>

<p>
	هذه هي إحدى <a href="https://wordpress.org/plugins/login-logo/" rel="external nofollow">الإضافات البسيطة</a> التي تحدثت عنها، وهي تتيح لك تغيير شعار صفحة التسجيل الأساسية في ووردبريس، عبر تسمية ملف الشعار الجديد login-logo.png، ووضعه في مجلد wp-content. ولا شرح يذكر لها إلا تفعيلها ورفع الملف، وسيستبدل شعارك الشعار القديم لووردبريس.
</p>

<p>
	وسترى حين تدخل إلى مجلد الإضافة نفسها تحذيرًا أنها لم تحدّث لأكثر من عامين، فلا تقلق لأن الإضافة أبسط من أن تحتاج إلى تحديث، وهي من مطوّر يمكن الوثوق فيه، إذ هو مارك جاكيث، أحد المساهمين في تطوير ووردبريس نفسها.
</p>

<h2>
	Dashboard Widget Order
</h2>

<p style="text-align: center;">
	<img alt="dashboard-widget-order-600x171.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25437" data-unique="rb627d2jf" src="https://academy.hsoub.com/uploads/monthly_2017_11/dashboard-widget-order-600x171.png.d67fc26e1700bd0029fbb44205313c48.png"></p>

<p>
	تقدم ودجات لوحة المتحكمات معلومات مفيدة للمستخدم عن موقعه فتتيح له إنشاء محتوى جديد بسهولة، كما تساعده على شق طريقه داخل ووردبريس.
</p>

<p>
	لكني أجد أحيانًا أني لا أستطيع تحديد الترتيب الافتراضي لهذه الودجات -أتحدث كمالك موقع أو مطوّر-، صحيح أنك تستطيع إضافة وإزالة تلك الودجات، لكنك لا تستطيع تغيير ترتيبهم دون كتابة أسطر معقدة من الشفرة البرمجية.
</p>

<p>
	وتحلّ <a href="https://premium.wpmudev.org/project/dashboard-widget-order/" rel="external nofollow">هذه الإضافة </a>تلك المشكلة لكنها لا تعمل إلا في حالة إدارة المواقع المتعددة، حيث تتيح لك إعادة ترتيب الودجات بسرعة في لوحة المتحكمات، بحيث تعرف مباشرة كيف ستظهر لوحة المتحكمات لكل موقع أو لكل مستخدم يضاف إلى شبكة مواقعك التي تديرها.
</p>

<p>
	Dashboard Feeds
</p>

<p style="text-align: center;">
	<img alt="dashboard-feeds-600x171.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25436" data-unique="nvo9att77" src="https://academy.hsoub.com/uploads/monthly_2017_11/dashboard-feeds-600x171.png.0d21b693f44b0cc4ecabdde629a3ff13.png"></p>

<p>
	إن أردت حذف ودجة أخبار ووردبريس "Wordpress News" لأن العميل لا يهتم بووردبريس نفسها ولا بتطوير مواقع تدار بها، <a href="https://premium.wpmudev.org/project/dashboard-feeds/" rel="external nofollow">فهذه الإضافة</a> تفعل ذلك، بل وتعطيك خيار استبدالها بخدمة خلاصات أخبار أخرى RSS، وإضافة خلاصات الأخبار تلك في ودجات منفصلة إن شئت في لوحة المتحكمات، ويمكنك حينها أن تضع خلاصة أخبار من موقعك أنت كنوع من الدعاية لعملك، لتشجع العميل على العودة إليك مرة أخرى.
</p>

<h2>
	الخلاصة
</h2>

<p>
	لا تهمل أمرًا صغيرًا مثل تهيئة لوحة التحكم الخاصة بعميلك حتى وإن احتاج بعض الجهد، إذ سيصب في مصلحة عملك وسمعتك بالنهاية، أن العميل ينجز مهامه أسرع وبسلاسة أكبر حين تبني أنت موقعه، إضافة إلى هويّتك التي ستتركها واضحة في موقعه ليذكرك بها أو يراها بعض العملاء المحتملين فيوصيهم بالتعامل معك مما رأى من جودة عملك واهتمامك براحته والتفاصيل الصغيرة بالنسبة لك، لكنها تؤرقه هو.
</p>

<p>
	وهذه الإضافات مسعفات لك إن أردت بناء تجربة الاستخدام هذه في لوحة التحكم بسرعة دون كتابة شفرة برمجية خاصة، ولن تؤثر في الصورة المهنية التي تريدها لنفسك.
</p>

<p>
	دعنا نسمع منك في التعليقات إن جربت تخصيص لوحة تحكم من قبل أو واجهتك مشكلة في تخصيصها، أو كانت لك تفضيلات معينة في الإضافات تستخدمها مع عملائك!
</p>

<p>
	 
</p>

<p>
	ترجمة -بتصرف- لمقال <a href="https://premium.wpmudev.org/blog/customizing-wordpress-dashboard/" rel="external nofollow">Customizing the WordPress Admin Experience for Novice Clients</a> لصاحبته ريتشيل ماكّولن.
</p>
]]></description><guid isPermaLink="false">303</guid><pubDate>Mon, 06 Nov 2017 07:03:00 +0000</pubDate></item><item><title>&#x643;&#x64A;&#x641; &#x62A;&#x636;&#x639; &#x62E;&#x637;&#x651;&#x64E;&#x629; &#x635;&#x64A;&#x627;&#x646;&#x629; &#x634;&#x647;&#x631;&#x64A;&#x651;&#x64E;&#x629; &#x644;&#x645;&#x648;&#x627;&#x642;&#x639;&#x643; &#x639;&#x644;&#x649; &#x648;&#x648;&#x631;&#x62F;&#x628;&#x631;&#x64A;&#x633;</title><link>https://academy.hsoub.com/apps/web/wordpress/%D9%83%D9%8A%D9%81-%D8%AA%D8%B6%D8%B9-%D8%AE%D8%B7%D9%91%D9%8E%D8%A9-%D8%B5%D9%8A%D8%A7%D9%86%D8%A9-%D8%B4%D9%87%D8%B1%D9%8A%D9%91%D9%8E%D8%A9-%D9%84%D9%85%D9%88%D8%A7%D9%82%D8%B9%D9%83-%D8%B9%D9%84%D9%89-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-r301/</link><description><![CDATA[
<p><img src="https://academy.hsoub.com/uploads/monthly_2020_10/5f7f0c0aa0d5c_-------.png.001a4291b5e6fbb29613f465e838278c.png" /></p>

<p>
	تحتاج لوضع خطَّة صيانة شهريَّة لمواقعك على ووردبريس إلى تنظيم المهام التي تنجزها يوميًّا وأسبوعيًّا وشهريًّا وحتى سنويًّا وتقسيمها إلى بضعة فئات رئيسيَّة وهي: النسخ الاحتياطي والتحديثات الأساسيَّة لووردبريس وصيانة الإضافات (Plugin) وصيانة القوالب وسلامة الموقع بالكامل وسلامة المحتوى.
</p>

<p style="text-align: center;">
	<a class="ipsAttachLink ipsAttachLink_image" data-fileid="25156" href="https://academy.hsoub.com/uploads/monthly_2017_10/Brenda.jpg.64d0a6e9ffa43fbfafb8c8f7a69b75ce.jpg" rel=""><img alt="Brenda.jpg" class="ipsImage ipsImage_thumbnailed" data-fileid="25156" data-unique="6bimguly2" src="https://academy.hsoub.com/uploads/monthly_2017_10/Brenda.thumb.jpg.4455a6ca153cab52baa37c23d81c38c9.jpg"></a>
</p>

<p>
	يجب الإشارة إلى أنَّ هذا الدرس هو نموذج أساسي لإنشاء خطَّة صيانة شهرية خاصَّة بك؛ يمكنك تعديلها بحسب خبرتك بالمهام التي تنجزها بانتظام لوحدك أو مع فريقك، باعتبارك مطورًا لووردبريس.
</p>

<h2 id="النسخ-الاحتياطي-في-ووردبريس">
	النسخ الاحتياطي في ووردبريس
</h2>

<p>
	يجب إجراء النسخ الاحتياطي على ووردبريس في فترات منتظمة ويفضل أن تكون يوميَّة؛ النسخ الاحتياطي كل أسبوع لا بأس به ولكن النسخ الاحتياطي كل شهر هو أطول فترة وغير مفضل. يسمح لك الموقع «<a href="https://managewp.com/" rel="external nofollow">ManageWP</a>» بتزويد العملاء بخدمة <a href="https://managewp.com/features/backup" rel="external nofollow">النسخ الاحتياطي التراكمي</a> اليومي دون الحاجة إلى النسخ الاحتياطي للموقع الذي تديره يدويًّا.<br>
	الخيارات المقترحة لإجراء النسخ الاحتياطي هي:<br>
	• يوميًّا<br>
	• أسبوعيًّا<br>
	• شهريًّا
</p>

<p style="text-align: center;">
	<a class="ipsAttachLink ipsAttachLink_image" data-fileid="25155" href="https://academy.hsoub.com/uploads/monthly_2017_10/backup_screenshot.jpg.20be3184ac1aeb18adf34cbc6e3e881a.jpg" rel=""><img alt="backup_screenshot.jpg" class="ipsImage ipsImage_thumbnailed" data-fileid="25155" data-unique="9re27ic3q" src="https://academy.hsoub.com/uploads/monthly_2017_10/backup_screenshot.thumb.jpg.d1b04b834276efbcfaa45b48daae3305.jpg"></a>
</p>

<h2 id="التحديثات-الأساسية-لووردبريس">
	التحديثات الأساسيَّة لووردبريس
</h2>

<p>
	من الصعب جدولة عملية <a href="https://wordpress.org/news/category/releases/" rel="external nofollow">التحديثات</a> (خصوصًا التحديثات الأساسيَّة لووردبريس) ضمن مخطط زمني ثابت إذ لا تصدر التحديثات في فترات منتظمة. على أي حال، نجد خلال العامين الماضيين أنَّ التحديثات أصبحت تتكرر بشكل كبير لذا أنصحك باختيار يوم ما في كل شهر تتفقد فيه التحديثات وتثبِّتها على جميع المواقع التي تديرها.<br>
	يمكن أن نستثني من هذه القاعدة حالة تثبيت التحديثات الأساسيَّة لووردبريس عند صدورها مباشرةً بناءً على طلبك أو طلب شركتك.<br>
	الخيارات المقترحة للتحقق من التحديثات وتثبيتها هي:<br>
	• فور صدورها مباشرةً<br>
	• شهريًّا
</p>

<h2 id="صيانة-الإضافات">
	صيانة الإضافات
</h2>

<p>
	تتكون صيانة الإضافات في ووردبريس من عنصرين هما:<br>
	• تحديث الإضافات<br>
	• فحص الإضافات
</p>

<h3 id="تحديث-الإضافات">
	تحديث الإضافات
</h3>

<p>
	تقترح ووردبريس التأكد من وجود تحديثات للإضافات كل 3 إلى 6 أشهر؛ إن كنت مطورًا لووردبريس فستدرك مدى ضعف هذه النصيحة لمواقع وردبريس التي من المفترض أن تعمل يوميًا بصورة صحيحة، وستسعفك حينئذٍ خبرتك في تحديد موعد لهذه التحديثات في مخططك الزمني. قد لا تتوافر التحديثات الأساسيَّة لووردبريس دومًا لذا يمكن التحقق من تحديثات الإضافات أيضًا في اليوم نفسه أي الجمع بينها في يوم واحد.<br>
	الخيارات المقترحة للتحقق من تحديثات الإضافات وتثبيتها هي:<br>
	• شهريًّا
</p>

<h3 id="فحص-الإضافات">
	فحص الإضافات
</h3>

<p>
	تختلف مهمة الصيانة هذه قليلًا عن المهمة السابقة التي تقتصر على التحقق من وجود تحديثات ثمَّ تثبيتها، كما أنَّها غير قابلة للجدولة أي لا تضاف إلى مخططك الزمني لتنفِّذها كلَّ شهر.<br>
	أول أمر تتطلبه هذه المهمة هو التأكُّد من عدم وجود إضافات مثبَّتة ومفعَّلة في المواقع التي تديرها ولكنَّها غير مستخدمة، فقد يستمتع بعض العملاء بتجريب مزايا جديدة عبر تثبيت إضافات جديدة دون إذنك وينسَون بعدئذٍ إلغاء تفعيلها وحذفها.<br>
	يجب أن تعرف الإضافات التي يتوافر لها تحديثات من تلك التي لا يوجد لها تحديثات، فمن المحتمل أن يُرفع الدعم عن الأخيرة وتصبح بذلك غير آمنة؛ إن صادفت وجود إضافة غير مدعومة فساعد عميلك على اختيار البديل المناسب.<br>
	يجب عليك أيضًا أن تراقب جودة الإضافات وأداءها وتبحث دومًا عن وجود بديل أفضل من تلك التي تستخدمها إن شعرت أن أدائها آخذ في التدنِّي. لنأخذ مثلًا الإضافة Disqus الرسميَّة التي بدأت تكسب سمعة سيئة إذ أصبحت مشوبة بالأخطاء ومعطلة تمامًا؛ أخذ أحد المطورين على عاتقه تطويرها ليصدرها باسم <a href="https://wordpress.org/plugins/disqus-conditional-load/" rel="external nofollow">Disqus Conditional Load</a> وهي مشابهة للإضافة السابقة لكنَّها خالية نسبيًّا من الأخطاء وتُستخدم بكثرة حاليًّا.<br>
	الجزء الأخير من هذه المهمة يتضمن استعراض مجلد الإضافات للتأكد من حذف كامل الإضافات التي أَلغيت أنت أو عميلك تثبيتها.<br>
	الخيارات المقترحة لهذه المهمَّة هي:<br>
	• 3 أشهر<br>
	• 6 أشهر<br>
	• سنة
</p>

<h2 id="صيانة-القوالب">
	صيانة القوالب
</h2>

<p>
	تُقسم هذه المهمة إلى جزأين وهما:
</p>

<h3 id="تحديث-القوالب">
	تحديث القوالب
</h3>

<p>
	يجب أن يكون جدول مواعيد المهام المتعلقة بتحديث القوالب مطابق لمواعيد للمهام التي تنجزها لتحديث الإضافات؛ بعبارة أخرى، حدِّد موعدًا واحدًا لمهمَّة تحديث القوالب ومهمَّة تحديث الإضافات لتنجزهما سويةً في الوقت ذاته، على فرض أنَّك تستخدم قوالب غير رسمية.<br>
	الخيارات المقترحة لتحديث القوالب:<br>
	• شهريًّا
</p>

<h3 id="فحص-القالب">
	فحص القالب
</h3>

<p>
	ستفيدك هنا خبرتك كثيرًا لتحديد المهام المتعلِّقة بفحص القوالب التي يجب أن تُنفِّذها وكم تحتاج من الوقت لتكرارها. بصورة مشابه لفحص الإضافات، تتضمن هذه المهمة التأكد من عدم وجود قوالب غير مستخدمة مثبَّتة في الموقع وأنَّ قالبًا واحدًا على الأقل موجودٌ باعتباره القالب الرئيسي والافتراضي في الموقع.<br>
	إن كنت تستخدم قالبًا خاصًّا بك فأضف إلى هذه المهمة فحص ملفات وأنماط قالبك للتأكد من أنَّ كلَّ شي مرتبٌ ومنظمٌ والكود الذي كتبته ما يزال صالحًا. إن كنت تستخدم قالبًا خارجيًا فتأكد أنَّ المطور ما يزال يعمل على الكود ويقدم الدعم للقالب.<br>
	الخيارات المقترحة لفحص القالب:<br>
	• 3 أشهر<br>
	• 6 أشهر<br>
	• سنة<br>
	إن كنت مرتاحًا بالعمل وفق مخططك الزمني الذي وضعته لقالبك أو نمطك المخصص بك على المواقع التي تديرها فاستمر بذلك.
</p>

<h2 id="سلامة-كامل-الموقع">
	سلامة كامل الموقع
</h2>

<p>
	يحوي الموقع «ManageWP» على مزيَّة التحديثات الأمنيَّة (<a href="https://managewp.com/features/vulnerability-updates" rel="external nofollow">Vulnerability Updates</a>) التي تنبِّهك بوجود إضافات وقوالب وملفات ووردبريس أساسيَّة ومهمَّة، كما تسمح لك بعرض أداء الموقع.
</p>

<p style="text-align: center;">
	<a class="ipsAttachLink ipsAttachLink_image" data-fileid="25157" href="https://academy.hsoub.com/uploads/monthly_2017_10/vulnerabilities.jpg.a38c92a0598ffb98fd7c9f657c27b2d8.jpg" rel=""><img alt="vulnerabilities.jpg" class="ipsImage ipsImage_thumbnailed" data-fileid="25157" data-unique="bo8gx0jhr" src="https://academy.hsoub.com/uploads/monthly_2017_10/vulnerabilities.thumb.jpg.f6522efb4e14867d4bace1c06fbb9b0b.jpg"></a>
</p>

<p>
	الخيارات المقترحة لتصفح التحديثات الأمنيَّة:<br>
	• يوميًّا<br>
	يوفِّر الموقع «ManageWP» أيضًا مزيَّة الفحص الأمني (<a href="https://managewp.com/features/security-check" rel="external nofollow">Security Check</a>) التي تفحص كامل موقعك بحثًا عن برمجيات خبيثة في أي وقت تريد، كما تستطيع تفعيل وضع مراقبة الأمن 24/7 الذي يوفِّره الإصدار المدفوع.<br>
	الخيارات المقترحة لمراقبة أمن الموقع:<br>
	• مرة يوميًّا<br>
	• عدة مرات يوميًّا<br>
	• 24/7<br>
	الأمر الأخير الذي أودُّ ذكره ضمن هذا الموضوع هو الأداء الكلي للموقع أي فترة تحميل صفحاته وحجمها ورفع أدائه وغيرها. يحوي الموقع «ManageWP» مزيَّة أخرى وهي فحص الأداء (<a href="https://managewp.com/features/performance-scan" rel="external nofollow">Performance Scan</a>) التي تعطيك لمحة عن أداء موقعك وما هي المشكلات التي يعاني منها وماذا يحدث فيه.<br>
	الخيارات المقترحة لفحص أداء الموقع:<br>
	• شهريًّا
</p>

<h2 id="سلامة-المحتوى">
	سلامة المحتوى
</h2>

<p>
	قد تتطلب هذه المهمة منك العمل مع عميلك أغلب الوقت خلافًا للمهام السابقة؛ تتضمن هذه المهام التحقق من الأخطاء 404 أو <a href="https://academy.hsoub.com/apps/web/wordpress/%D9%83%D9%8A%D9%81%D9%8A%D8%A9-%D8%A5%D8%B5%D9%84%D8%A7%D8%AD-%D8%A3%D9%88-%D8%AD%D8%B0%D9%81-%D8%A7%D9%84%D8%B1%D9%88%D8%A7%D8%A8%D8%B7-%D8%A7%D9%84%D9%85%D8%B9%D8%B7%D9%84%D8%A9-%D8%B9%D9%84%D9%89-%D9%85%D9%88%D9%82%D8%B9-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-%D8%A7%D9%84%D8%AE%D8%A7%D8%B5-%D8%A8%D9%83-r22/" rel="">الروابط المعطلة</a> وتحسينها.<br>
	الخيارات المقترحة لأداء هذه المهمة:<br>
	• شهريًّا<br>
	يجب عليك أيضًا العمل مع عميلك للبحث عن أي مقاطع فيديو أو صوت لم يعد يستخدمها أو للبحث عن مدونات منشورة يستطيع دمجها مع بعضها أو منشورات ذات محتوى قديم، وهذا ما يدعى “تدقيق المحتوى”.<br>
	عليك أيضًا أن تراقب تصنيفات SEO لعملائك إذ إنَّ نجاحهم هو في النهاية نجاحك؛ للمزيد اقرأ <a href="https://managewp.com/why-is-seo-essential-for-your-business" rel="external nofollow">هذه المقالة</a>.<br>
	الخيارات المتاحة لدقيق المحتوى:<br>
	• 6 أشهر<br>
	• سنة
</p>

<h2 id="دورك-الآن">
	دورك الآن
</h2>

<p>
	غطَّت هذه المقالة مهام الصيانة عمومًا التي قد تختلف عن المهام التي تنجزها أنت أو فريقك؛ ما هي المهام الأخرى التي تضيفها لجدولك الزمني؟ وما هي المهام التي تتركها؟ شاركنا رأيك بالتعليقات.
</p>

<p>
	ترجمة -وبتصرف- للمقال <a href="https://managewp.com/how-to-create-a-monthly-maintenance-plan-for-your-wordpress-sites" rel="external nofollow">How to Create a Monthly Maintenance Plan for Your WordPress Sites</a> لصاحبه Brenda Barron.
</p>

<p>
	حقوق الصورة البارزة محفوظة لـ <a href="http://www.freepik.com/free-vector/under-construction-background-design_1000242.htm" rel="external nofollow">Freepik</a>
</p>
]]></description><guid isPermaLink="false">301</guid><pubDate>Sat, 14 Oct 2017 11:06:00 +0000</pubDate></item><item><title>&#x643;&#x64A;&#x641;&#x64A;&#x629; &#x627;&#x633;&#x62A;&#x62E;&#x62F;&#x627;&#x645; &#x634;&#x628;&#x643;&#x627;&#x62A; &#x62A;&#x648;&#x632;&#x64A;&#x639; &#x627;&#x644;&#x645;&#x62D;&#x62A;&#x648;&#x649; CDN &#x644;&#x62A;&#x62D;&#x633;&#x64A;&#x646; &#x623;&#x62F;&#x627;&#x621; &#x645;&#x648;&#x627;&#x642;&#x639; &#x648;&#x648;&#x631;&#x62F;&#x628;&#x631;&#x64A;&#x633;</title><link>https://academy.hsoub.com/apps/web/wordpress/%D9%83%D9%8A%D9%81%D9%8A%D8%A9-%D8%A7%D8%B3%D8%AA%D8%AE%D8%AF%D8%A7%D9%85-%D8%B4%D8%A8%D9%83%D8%A7%D8%AA-%D8%AA%D9%88%D8%B2%D9%8A%D8%B9-%D8%A7%D9%84%D9%85%D8%AD%D8%AA%D9%88%D9%89-cdn-%D9%84%D8%AA%D8%AD%D8%B3%D9%8A%D9%86-%D8%A3%D8%AF%D8%A7%D8%A1-%D9%85%D9%88%D8%A7%D9%82%D8%B9-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-r299/</link><description><![CDATA[
<p><img src="https://academy.hsoub.com/uploads/monthly_2017_09/59c65558029b2_main(52).png.5148d6a3a20cbc8ff3db319199b75e40.png" /></p>

<p>
	من المهم جدًا أن يكون الموقع سريعًا، إذ <a href="https://blog.kissmetrics.com/loading-time/" rel="external nofollow">يتوقع ما نسبته 47% من الزوار</a> أن يُحمَّل الموقع في أقل من ثانيتين، وسيترك ما نسبته 40% من الزوار موقعك إن استغرق أكثر من ثلاث ثواني ليُحمَّل. <a href="http://usabilitynews.org/how-long-is-too-long-to-wait-for-a-website-to-load/" rel="external nofollow">إحدى الدراسات</a> (صحيحٌ أنَّ الدراسة قديمة، لكن الفكرة النظرية وراءها ما تزال صالحة إلى زماننا هذا) تقول أنَّ المستخدمين سيتساهلون إذا حدث تأخير بسيط، لكن درجة عدم رضاهم إذا كان التأخير متوسطًا هي نفسها إذا كان التأخير كبيرًا. فربما لا تظن أنَّ موقعك «بطيء»، لكن حتى لو كان زمن التأخير متوسطًا فقد يحسّ الزوار أنه بطيء جدًا؛ والحل الوحيد لتفادي خسارة زوار موقعك بسبب بطء الموقع هو جعله سريعًا :-) .<br>
	إحدى أكبر العقبات التي ستواجهك عندما تحاول جعل موقعك سريعًا هي الصور والملفات الثابتة الأخرى مثل JS و CSS، فالصور تكون عادةً كبيرةً وتأخذ وقتًا طويلًا للتحميل (خصوصًا على الاستضافات المشتركة الرخيصة)، ولتحسين ذلك يمكنك استخدام شبكات توزيع المحتوى (CDN).
</p>

<h2 id="ما-هي-شبكات-توزيع-المحتوى">
	ما هي شبكات توزيع المحتوى؟
</h2>

<p>
	شبكات توزيع المحتوى (بالإنكليزية Content Distribution Networks) هي مجموعة من الخواديم المنتشرة حول العالم والمختصة بتخديم المحتوى الثابت بسرعة.
</p>

<p style="text-align: center;">
	<img alt="1-alex-denning-cdn-image.png" class="ipsImage ipsImage_thumbnailed" data-fileid="25060" data-unique="kyehrtk51" src="https://academy.hsoub.com/uploads/monthly_2017_09/1-alex-denning-cdn-image.png.45b8f46ee9f62b28e89d60ef43738461.png"></p>

<p>
	طريقة عمل تلك الشبكات تتلخص بوجود خادوم رئيسي (origin) يخزِّن ملفاتك الثابتة (مثل الصور وملفات JavaScript و CSS) وخواديم توزيع التي توصِّل المحتوى إلى المستخدمين، والخادوم الرئيسي هو الخادوم الذي يحتوي على النسخة الرئيسية من الملفات (وفي حالتنا: هو الخادوم الذي يُشغِّل ووردبريس).<br>
	وعندما يتم طلب الصورة عبر شبكة توزيع المحتوى فسيُحدَّد ما هو الخادوم الأقرب لمكان المستخدم جغرافيًا وسيتحقق الخادوم إن كان يملك الصورة المطلوبة، فإن لم يكن يملكها فسينزلها من الخادوم الرئيسي، وإذا كانت موجودةً عنده فسيرسلها للمستخدم.<br>
	فائدة طريقة التوزيع السابقة تتلخص في نقطتين أساسيتين:<br>
	1. تلك الخواديم مخصصة ومحسّنة لتخديم المحتوى الثابت (مثل الصور) لذا يمكنها تحميل المحتوى بشكل أسرع.<br>
	2. يتواجد أحد تلك الخواديم بالقرب من مكان المستخدم، وهذا يعني أنَّ الملف لن يحتاج إلى الانتقال لمسافات طويلة (فيزيائيًا) حتى يصل إلى المستخدم، وبالتالي سيكون زمن التأخير قليلًا.<br>
	قد يبدو من الوهلة الأولى أنَّ الأمر معقدٌ جدًا، وهو كذلك، لكن لحسن الحظ لا توجد ضرورة أن تتعامل مع الأمور التقنية الخاصة بشبكات توزيع المحتوى، إذ تستطيع قطف الثمار مباشرةً، فهنالك خدماتٌ كثيرة تتولى الأمور التقنية وتُسهِّل عملية الاستفادة من تحسين الأداء عبر استعمال شبكات توزيع المحتوى في موقعك.<br>
	لكن دعنا نلقي نظرةً على أفضل حلّ لاستعمال شبكات التوزيع في ووردبريس.
</p>

<h2 id="استخدام-photon">
	استخدام Photon
</h2>

<p>
	خدمة Photon هي خدمة جيدة لتوزيع المحتوى، وهي مجانية أيضًا، وهنالك أسباب تجعل خدمة Photon (التابعة لإضافة Jetpack) جيدة، ولهذا فصلناها عن بقية إضافات CDN:<br>
	1. هذه الخدمة هي جزءٌ من إضافة <a href="https://wordpress.org/plugins/jetpack/" rel="external nofollow">Jetpack</a>، فإضافة Jetpack فيها الكثير من الميزات المفيدة ومن المرجح أنّك تستعملها في موقعك؛ كل ما عليك فعله هو تثبيت Jetpack (من إضافات – أضف جديد، ثم ابحث عن Jetpack) وفعِّل Photon وستكون خدمة CDN جاهزةً عندك، ولا حاجة إلى إجراء أيّة خطوات إضافية، وضبط هذه الخدمة بسيطٌ جدًا؛ إذ تحتاج الكثير من إضافات CDN الأخرى إلى تعديلات تقنية على ضبط خادومك، لكن هذه الإضافة لا تتطلب ذلك.<br>
	2. ستُحسِّن خدمة Photon من حجم صورك تلقائيًا، فأغلبية خدمات CDN ستُخدِّم الصور التي ترسلها لها كما هي، لكن خدمة Photon ستجعل الحجم التخزيني لتلك الصور أصغر، ولفعل ذلك ستستخدم Jetpack صيغة صور باسم webp <a href="https://developers.google.com/speed/webp/" rel="external nofollow">التي طورتها Google</a>، وتملك صيغة webp أفضل خوارزمية ضغط متوافرة حاليًا، وهي مدعومة من متصفحَي Chrome و Opera، وخدمة Photon تعرف ذلك وتُخدِّم الصور بصيغة webp لزوار موقع Chrome و Opera فقط (<a href="https://www.netmarketshare.com/browser-market-share.aspx?qprid=0&amp;qpcustomd=0" rel="external nofollow">التي يستعملها حوالي نصف الزوار</a>).<br>
	3. إحدى المزايا المتقدمة لخدمة Photon هي القدرة على تطبيق فلاتر إلى الصور وقصها وإعادة تحجميها، وعملية القص وإعادة التحجيم ستقوم بها خدمة Photon دون تدخل من المستخدم (باستعمال دوال <code>add_image_size()‎</code> الموجودة في ووردبريس)، ويمكن للمستخدمين المتقدمين أن يضيفوا فلاتر إلى الصورة لتغيير طريقة عرضها.<br>
	عملية ضبط Photon شبيهة بطريقة ضبط وحدات (modules) Jetpack الأخرى. فبعد تفعيل إضافة Jetpack فاذهب إلى صفحة الضبط الخاصة بها وابحث عن Photon ثم اضغط على «Activate». ألم أقل لك أنَّ الأمر بسيط جدًا.<br>
	لمزيدٍ من المعلومات حول Photon أحيلك إلى <a href="https://jetpack.com/support/photon/" rel="external nofollow">هذه الصفحة</a>، وإلى <a href="https://developer.wordpress.com/docs/photon/api/" rel="external nofollow">توثيق <abbr title="Application Programming Interface | واجهة برمجية">API</abbr></a>.
</p>

<h2 id="خيارات-أخرى-لشبكات-توزيع-المحتوى">
	خيارات أخرى لشبكات توزيع المحتوى
</h2>

<p>
	لماذا تريد استخدام شبكة توزيع أخرى إذا كانت خدمة Photon ممتازةً؟ هنالك ثلاثة أسباب محتملة:
</p>

<ol>
<li>
		الخصوصية. خدمة Photon مملوكة من شركة Automattic (وهي الشركة التي تملك موقع wordpress.com) وبعض المستخدمين يشكون في أمرهم. لا تنسَ أنَّ Automattic هي شركة تجارية وتوفر خدمة مجانية ولا تتوقع أنها صدقة نابعة من طيبة قلوبهم.
	</li>
	<li>
		لن تنتهي صلاحية التخزين المؤقت. وهذا يعني أنَّك لا تستطيع حذف صورة، فلو أردتَ استبدال صورة بأخرى فعليك رفع الصورة الجديدة باسمٍ مختلف.
	</li>
	<li>
		خدمة Photon لا تدعم إلا الصور. فلو أردتَ تخديم ملفات JavaScript و CSS من شبكة توزيع محتوى، فعليك استخدام خدمة أخرى.
	</li>
</ol>
<p>
	لكن لسوء الحظ، لا توجد خدمة توزيع محتوى سهلة الإعداد كما في خدمة Photon.<br>
	لكن الأسباب السابقة لا تعني بالضرورة أن تتجنب استخدام هذه الخدمة، إذ إنَّ تحميل الصورة من خدمة Photon يملك أثرًا كبيرًا على سرعة موقعك، والفائدة الآتية من تحميل الملفات الثابتة الأخرى من شبكة توزيع محتوى ستكون قليلة نسبيًا، ما لم يكن موقعك مشهورًا فعندئذٍ سيستفيد من استعمال خدمة CDN أخرى.<br>
	إذا أصررتَ على إعداد شبكة CDN فسأذكر في بقية هذا الدرس أفضل الخيارات التجارية المتاحة أمامك لتختار منها ما يناسبك.
</p>

<h2 id="أفضل-الخيارات-خدمة-cloudflare">
	أفضل الخيارات: خدمة Cloudflare
</h2>

<p>
	خدمة <a href="https://www.cloudflare.com/" rel="external nofollow">Cloudflare</a> هي خيار ممتاز، ويمكنها توفير ميزات أكثر من مجرد شبكة توزيع محتوى، بما في ذلك تحسين حماية موقعك وخلاف ذلك، لذا أنصحك بإلقاء نظرة عليها. ذكرتُ Cloudflare أولًا لأنها توفر خطةً مجانيةً رائعةً كافيةً لأغلبية المستخدمين (وإذا أردتَ المزيد من الميزات، فالخطط الاحترافية تبدأ من 20 دولارًا لكل موقع شهريًا).<br>
	فإذا كنتَ مهتمًا كثيرًا بالحصول على أفضل أداء وأردتَ دمج خدمات إضافة Jetpack مع خدمة توزيع محتوى خارجية، فأنصحك باستعمال Cloudflare.<br>
	الجانب السلبي الوحيد لهذه الخدمة هو أنَّ إعدادها ليس بسيطًا كما في إضافة Jetpack؛ إذ ستحتاج إلى تسجيل حساب في الخدمة واتباع التعليمات لتحديث سجلات DNS، وقد تستغرق هذه العملية بين عدِّة ساعات إلى يوم كامل، وبعد فعلك لذلك عليك تسجيل الحساب المجاني وضبطه بنفسك. يمكنك قراءة <a href="http://www.wpbeginner.com/wp-tutorials/how-to-setup-cloudflare-free-cdn-in-wordpress/" rel="external nofollow">هذا الدرس</a> لشرح طريقة فعل ذلك.
</p>

<h2 id="الخيارات-التجارية-الأخرى">
	الخيارات التجارية الأخرى
</h2>

<p>
	توفِّر <a href="https://www.incapsula.com/" rel="external nofollow">Incapsula</a> خدمة شبيهة بخدمة Cloudflare، وتعطيك خدمات تحسين الأداء والأمان، والخطة المجانية التي توفرها رائعة وهي سهلة الإعداد نسبيًا (ويوفرون لك <a href="https://wordpress.org/plugins/incapsula/" rel="external nofollow">إضافة ووردبريس</a> لتسهيل دمج الخدمة مع موقعك، لكن قد مضت فترةٌ طويلةٌ منذ آخر تحديث لهذه الإضافة). لكن من مساوئ خدمة Incapsula أنَّ الخطط المدفوعة أغلى من نظيراتها في Cloudflare، لذا إذا أردتَ الحصول على ميزات متقدمة فعليك دفع مبلغ كبير نسبيًا، إذ تبدأ الخطط المدفوعة من 59 دولارًا لكل موقع شهريًا.<br>
	أما خدمة <a href="https://www.keycdn.com/" rel="external nofollow">KeyCDN</a> فهي حلٌّ رخيصٌ نسبيًا لمواقع ووردبريس، وتوفر هذه الخدمة <a href="https://wordpress.org/plugins/cdn-enabler/" rel="external nofollow">إضافة ووردبريس</a> مُصانة ومُحدَّثة وتستحق التجربة. يجدر بالذكر أنَّ هذه الخدمة لا توفِّر خطة مجانية لكن هنالك فترة تجريبية مجانية، والخطط المدفوعة تبدأ من 0.04 دولار لكل غيغابايت، أي لن تدفع أكثر من دولار واحد شهريًا إلا إذا كان موقعك مشهورًا جدًا.<br>
	ربما أشهر الخدمات هي خدمة <a href="https://www.maxcdn.com/" rel="external nofollow">MaxCDN</a> والتي تستخدم من أشهر مواقع التدوين وتُذكَر كثيرًا عند الحديث مع مطوري ووردبريس الآخرين. يمكنك إضافة دعم لخدمة MaxCDN عبر إضافات مثل W3 Total Cache (<a href="https://www.maxcdn.com/one/tutorial/setup-wordpress-with-w3-total-cache/" rel="external nofollow">انظر التوثيق</a>)، وتبدأ الأسعار من 9 دولارًا شهريًا.<br><a href="https://www.fastly.com/" rel="external nofollow">Fastly</a> هي خدمة CDN تُستعمَل من أكبر المواقع التي تتخصص بالأخبار مثل موقع صحيفة الغارديان البريطانية، وينصحون باستخدام إضافة <a href="https://wordpress.org/plugins/purgely/installation/" rel="external nofollow">purgely</a> لدمج الخدمة في موقعك. وصحيحٌ أنَّ Fastly ليست أرخص خدمة CDN لكن هنالك إمكانية تجربة الخدمة بإعطائك 50 دولارًا في حسابك، وأنصحك بتجربة هذه الخدمة إذا كنت جادًا بخصوص تحسين سرعة موقعك.
</p>

<h2 id="خيارات-أخرى">
	خيارات أخرى
</h2>

<p>
	إذا أردتَ المزيد من الخيارات والإعدادات فقد تضع ببالك استخدام <a href="https://aws.amazon.com/cloudfront/" rel="external nofollow">Amazon Cloudfront</a> أو <a href="https://cloud.google.com/cdn/" rel="external nofollow">Google’s Cloud CDN</a> إذا توفر تلك الخدمات تحكمًا دقيقًا وتسعير أكثر مرونة، لكنها تتطلب أن تكون لديك دراية تقنية أكبر.<br>
	ربما تفكر في الدفع لأحدهم لكي يضبط تلك الخدمات لك لكي تلائم احتياجاتك.
</p>

<h2 id="الخلاصة">
	الخلاصة
</h2>

<p>
	إنَّ أفضل خيار هو استخدام <a href="https://en-gb.wordpress.org/plugins/jetpack/" rel="external nofollow">خدمة Photon</a> لتخديم الصور مع استخدام <a href="http://cloudflare.com/" rel="external nofollow">Cloudflare</a> لبقية الملفات، وعملية إعداد تلك الخدمات سهلة ولا تأخذ وقتًا طويلًا وستحسِّن سرعة موقعك كثيرًا، مما يرضي زوار موقعك ومحركات البحث.<br>
	أما إذا كان موقعك أكبر فقد تفكر في استخدام الخدمات المدفوعة التي توفر لك قدرًا كبيرًا من التحكم، وهذه الخدمات التي ناقشناها في هذا الدرس توفِّر مجالًا واسعًا من الخدمات لمختلف أنواع المواقع ولمختلف الميزانيات.<br>
	الفكرة الرئيسية من استخدام شبكات توزيع المحتوى هي تخديم محتوى الموقع بشكل أسرع إلى المستخدمين، وهذه الخدمات تضبطها لمرة واحدة ثم تنساها، لذا أنصحك بأخذ وقتك لتفكِّر بالخيار الأفضل لجعل موقعك سريعًا.<br>
	لا تنسَ أنَّ استخدام شبكات توزيع المحتوى هو جزءٌ بسيطٌ من الأحجية التي تجعل موقعك سريعًا، فاستخدام إضافة للتخزين الموقت واختيار قالب سريع والاستضافة في شركة جيدة هي عوامل ستساعد في تسريع موقعك. لذا أنصحك بالاطلاع على الدورة التدريبية <a href="http://masterwp.co/" rel="external nofollow">Become a WordPress Master</a> التي تعلِّمك المهارات اللازمة لفعل ذلك في ووردبريس.
</p>

<p>
	ترجمة –وبتصرّف– للمقال <a href="https://wpshout.com/using-cdns-unlock-big-wordpress-speed-boost/" rel="external nofollow">Using CDNs to Unlock a Big WordPress Speed Boost</a> لصاحبه Alex Denning.
</p>

<p>
	حقوق الصورة البارزة محفوظة لـ <a href="http://www.freepik.com/free-vector/world-map-with-global-technology-or-social-connection-network-with-nodes-and-links-vector-illustration_1158187.htm" rel="external nofollow">Freepik</a>
</p>
]]></description><guid isPermaLink="false">299</guid><pubDate>Mon, 25 Sep 2017 14:04:04 +0000</pubDate></item><item><title>&#x643;&#x64A;&#x641;&#x64A;&#x629; &#x627;&#x644;&#x627;&#x633;&#x62A;&#x641;&#x627;&#x62F;&#x629; &#x645;&#x646; &#x627;&#x644;&#x643;&#x62A;&#x628; &#x627;&#x644;&#x645;&#x62C;&#x627;&#x646;&#x64A;&#x629; &#x644;&#x644;&#x62D;&#x635;&#x648;&#x644; &#x639;&#x644;&#x649; &#x645;&#x634;&#x62A;&#x631;&#x643;&#x64A;&#x646; &#x628;&#x645;&#x648;&#x642;&#x639;&#x643; &#x627;&#x644;&#x645;&#x639;&#x62A;&#x645;&#x62F; &#x639;&#x644;&#x649; &#x648;&#x648;&#x631;&#x62F;&#x628;&#x631;&#x64A;&#x633;</title><link>https://academy.hsoub.com/apps/web/wordpress/%D9%83%D9%8A%D9%81%D9%8A%D8%A9-%D8%A7%D9%84%D8%A7%D8%B3%D8%AA%D9%81%D8%A7%D8%AF%D8%A9-%D9%85%D9%86-%D8%A7%D9%84%D9%83%D8%AA%D8%A8-%D8%A7%D9%84%D9%85%D8%AC%D8%A7%D9%86%D9%8A%D8%A9-%D9%84%D9%84%D8%AD%D8%B5%D9%88%D9%84-%D8%B9%D9%84%D9%89-%D9%85%D8%B4%D8%AA%D8%B1%D9%83%D9%8A%D9%86-%D8%A8%D9%85%D9%88%D9%82%D8%B9%D9%83-%D8%A7%D9%84%D9%85%D8%B9%D8%AA%D9%85%D8%AF-%D8%B9%D9%84%D9%89-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-r284/</link><description><![CDATA[
<p><img src="https://academy.hsoub.com/uploads/monthly_2017_07/main.png.ebb43580f0483f89d3ab2fafbe425903.png" /></p>

<p id="كيفية-الاستفادة-من-الكتب-المجانية-للحصول-على-مشتركين-بموقعك-المعتمد-على-ووردبريس">
	إذا كنتَ تحب الكتب، فيمكنك أن تحصل على كميةٍ كبيرةٍ منها بالاشتراك في النشرات الإخبارية، وهذا لأنَّ توفير تنزيل مجاني للكتب هو محفِّز للتسجيل في القوائم البريدية وهو استراتيجية ناجحة لزيادة معدّل الاشتراك في قائمتك البريدية.<br>
	من المرجَّح أنَّك تستخدم هذه الاستراتيجية أو فكّرتَ باستخدامها وتريد معرفة كيفية فعل ذلك. وعلى أيّة حال، إذا لم تستعمل هذه التقنية من قبل ولا تعلم كيف توفِّر ذلك الكتاب للمشتركين الجدد وأردتَ استكشاف طرائق فعل ذلك، فهذه المقالة مناسبةٌ لك.<br>
	الذي تحتاج له هو البحث عن طريقة بسيطة لإعطاء الكتاب الذي وعدتَ به دون إمكانية تنزيله من الزوار قبل أن يشتركوا، مع تفادي فهرسة صفحة تحميل الكتاب من محركات البحث. دعني أبشِّرَك أننا نملك بعض الخيارات بهذا الصدد.<br>
	سننظر في هذا المقال إلى خمس طرائق التي يمكنك فيها إتاحة تنزيل ملف مجانًا. وهذه الطرائق سهلة التطبيق ومناسبة لزوار موقعك وستخفي نيتك ببناء قائمة بريدية من زوار الموقع ومن محركات البحث.
</p>

<h2 id="الخيار-الأول-استخدام-التخزين-السحابي">
	الخيار الأول: استخدام التخزين السحابي
</h2>

<p style="text-align: center;">
	<img alt="1-email-confirmation.png" class="ipsImage ipsImage_thumbnailed" data-fileid="24243" data-unique="yhunfkypn" src="https://academy.hsoub.com/uploads/monthly_2017_07/1-email-confirmation.png.e6ff06de5a93395acf8749ad19abb2a3.png"></p>

<p>
	<br>
	هذه هي أبسط طريقة وهي الخيار الصائب لأغلبية أنواع مواقع الويب. عليك أن ترفع ملفك إلى خدمة التخزين السحابي المفضَّلة عندك مثل Google Drive أو Dropbox أو Box أو غيرها، ثم ولِّد رابط URL لمشاركة الملف مع الآخرين وضمِّن رابط التنزيل السابق في رسالة البريد الإلكتروني الترحيبية بمشتركي القائمة البريدية الجدد.<br>
	هذا الحل مناسب للكثيرين، لكن ربما تكون هنالك أسباب تجعلك تنفر من التخزين السحابي، فمثلًا: ربما لا تحب فكرة استخدام التخزين السحابي، وقد يكون من الصعب إنشاء أذونات صحيحة للملفات وقد تُشكِّل عائقًا أمام مستخدميك إذا لم تفعلها بطريقة بصحيحة. أضف إلى ذلك أنَّ تخزين الملف على خدمة سحابية يعني أنَّك تضيّع على نفسك فرصة ثمينة لإبقاء المستخدمين في موقعك.<br>
	وبغض النظر عن الأسباب، إذا ارتأيتَ أنَّ التخزين السحابي ليس مناسبًا لك، فما تزال لدينا أربعة خيارات أخرى يمكنك التفكير بها.
</p>

<h2 id="الخيار-الثاني-استخدام-مزود-خدمة-القائمة-البريدية">
	الخيار الثاني: استخدام مزود خدمة القائمة البريدية
</h2>

<p style="text-align: center;">
	<img alt="2-link-to-file.png" class="ipsImage ipsImage_thumbnailed" data-fileid="24244" data-unique="625q64pt0" src="https://academy.hsoub.com/uploads/monthly_2017_07/2-link-to-file.png.0fcb378d74391cc4f6962bdbee8ceaac.png"></p>

<p>
	<br>
	خيار آخر بسيط هو توفير الملف لتنزيله عبر استخدام مزود خدمة القائمة البريدية، لكن لا تسمح جميع مزودات خدمة القوائم البريدية لك بفعل ذلك، لكن إن كان مزود الخدمة الخاص بك يسمح بذلك، مثل MailChimp أو ConvertKit، فارفع ملفك (احرص ألّا يتجاوز الحد الأقصى لحجم الملف المرفوع) ثم ضمِّنه كرابط في البريد المُرسَل لتأكيد التسجيل في موقعك.<br>
	إذا لم يكن يوفِّر مزود خدمة القائمة البريدية الخاص بك هذه الميزة، فمن المرجح أنَّهم يوفرون قدرةً على الاندماج مع مزود خدمة من طرف ثالث الذي يسمح لك باستضافة وتضمين الملفات بسهولة، لكن قد تكون هنالك بعض التكاليف الإضافية إذا أردتَ استخدام خدمة من طرف ثالث.<br>
	وصحيحٌ أنَّ هذا الخيار سهل التطبيق ومناسب للمشتركين، لكنه لن يدفع المشتركين إلى العودة إلى موقعك؛ وإذا كان هذا مهمًا بالنسبة إليك –وأتوقع أنَّه كذلك– فاستمر بالقراءة، فبقية الخيارات ستضع الفكرة السابقة بالحسبان.
</p>

<h2 id="الخيار-الثالث-استخدام-صفحة-غير-قابلة-للفهرسة">
	الخيار الثالث: استخدام صفحة غير قابلة للفهرسة
</h2>

<p style="text-align: center;">
	<img alt="3-ebook-webpage.png" class="ipsImage ipsImage_thumbnailed" data-fileid="24245" data-unique="vpjzl5tq7" src="https://academy.hsoub.com/uploads/monthly_2017_07/3-ebook-webpage.png.c5fe084f8a6051e4a5beb07a70073a6d.png"></p>

<p>
	<br>
	أحد الأسباب الرئيسية لاستخدام فريق التسويق للقوائم البريدية هو محاولة حثّ المستخدمين على العودة إلى الموقع الإلكتروني. لذا لِمَ لا تفعل ذلك من الكتاب المجاني الذي توفِّره؟<br>
	- أنشِئ صفحةً لعرض معلومات عن الملف ورابط تنزيله.<br>
	- ارفع الملف إلى موقعك وضع رابط التنزيل في الصفحة التي أنشأتها سابقًا.<br>
	- شارك رابط الصفحة في رسالة الترحيب بعد الاشتراك بالقائمة البريدية.<br>
	هذا يسمح للمشتركين الجدد بتنزيل الملف بسهولة مع تحقيق هدفك بإعادتهم إلى الموقع، وبالتالي ستستفيد من رؤيتهم للإعلانات، ولتوفِّر لهم أفضل ما في موقعك لإبقائهم لأطول فترة ممكنة.<br>
	هنالك بعض الأمور العملية التي يجب أن تأخذها بالحسبان إذا شئت استخدام هذه الطريقة. يجب أن تحرص على تصعيب العثور على الصفحة التي تستضيف رابط الكتاب أو سيتمكن زوار موقعك من تحميل الكتاب دون التسجيل في قائمتك البريدية. ولفعل ذلك أنصحك باتباع الخطوات الآتية:<br>
	- لا تضع رابطًا لهذه الصفحة من أي مكان في موقعك عدا رسالة الترحيب بمشتركي القائمة البريدية.<br>
	- استخدم إضافة مثل <a href="https://premium.wpmudev.org/project/smartcrawl-wordpress-seo/" rel="external nofollow">Smartcrawl</a> لإضافة خاصية <code>noindex</code> إلى الصفحة ولحذفها من خريطة الموقع لكي تتجاهلها محركات البحث إن وجدَتها.<br>
	- راقب إحصائيات زيارة الصفحة، فلو كانت الصفحة تحصل على زوار أكثر من عدد المشتركين الجدد بالقائمة البريدية، فمن المحتمل أنَّ رابط الصفحة قد نُشِرَ في مكانٍ آخر. لذا غيّر رابط URL للصفحة واستخدم <a href="https://academy.hsoub.com/apps/web/wordpress/%D9%83%D9%8A%D9%81%D9%8A%D8%A9-%D8%A5%D9%86%D8%B4%D8%A7%D8%A1-%D8%AA%D8%AD%D9%88%D9%8A%D9%84-%D8%B7%D9%84%D8%A8%D8%A7%D8%AA-%D9%85%D9%86-%D8%A7%D9%84%D9%86%D9%85%D8%B7-301-%D8%A8%D8%A7%D8%B3%D8%AA%D8%AE%D8%AF%D8%A7%D9%85-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-r121/" rel="">إضافة لإعادة التوجيه</a> لإعادة توجيه الرابط القديم إلى صفحتك الرئيسية أو إلى صفحة الهبوط المناسبة.
</p>

<p style="text-align: center;">
	<br><img alt="4-smartcrawl-meta-robots.png" class="ipsImage ipsImage_thumbnailed" data-fileid="24246" data-pin-nopin="true" data-unique="k2lu4wyoy" src="https://academy.hsoub.com/uploads/monthly_2017_07/4-smartcrawl-meta-robots.png.5e18f11ccfe2068b3ce52aca567f26b7.png"></p>

<p>
	<br>
	من سلبيات هذه الطريقة هي أنَّ رابط الصفحة يمكن أن يُشارك على مواقع التواصل الاجتماعي، فلو كنتَ تراقب تحليل بيانات زيارات موقعك، فستَحُسّ على ذلك بسرعة وستقدر على تغيير رابط URL، لكنني أرى أنَّ الأمر مربك في بعض الأحيان.<br>
	هذا الحل مناسب لأغلبيتنا، لكن ماذا لو كان الملف الذي تريد تنزيله قيمًا ومهم جدًا ولا تريد تركه دون حماية؟ ربما تريد شيئًا أكثر حمايةً في هذه الحالة.
</p>

<h2 id="الخيار-الرابع-استخدام-صفحة-محمية-بكلمة-مرور">
	الخيار الرابع: استخدام صفحة محمية بكلمة مرور
</h2>

<p style="text-align: center;">
	<img alt="5-ebook-webpage-password.png" class="ipsImage ipsImage_thumbnailed" data-fileid="24247" data-unique="umlxvkec2" src="https://academy.hsoub.com/uploads/monthly_2017_07/5-ebook-webpage-password.png.5a571f39e3e529cb7df2cce7131d936a.png"></p>

<p>
	<br>
	إذا أردتَ جعل الملف الذي تريد من مشتركي موقعك تحميله أكثر أمانًا. فأحد الحلول السهولة هو حماية الصفحة بكلمة مرور وتوفير رابط الصفحة وكلمة المرور في رسالة الترحيب بالقائمة البريدية. وبهذه الطريقة سيكون الملف أكثر أمانًا، وستستفيد من عودة المشتركين إلى موقعك لتحميل الملف.<br>
	ولكي يستطيع الزائر مشاركة هذه الصفحة مع البقية، فسيحتاج إلى وضع رابط الصفحة وكلمة مرور، وهذا سيجعل عملية التنزيل أكثر أمانًا، لكن في المقابل ستصبح العملية أصعب على المشتركين الجدد للوصول إلى الملف الموعود (إذ أضفتَ خطوةً جديدةً). يمكن إعادة تأمين الملف بسهولة بعد نشر أحد الزوار للرابط وكلمة المرور: حيث عليك تغيير كلمة المرور فقط، ولا حاجة إلى تغيير رابط URL.
</p>

<h2 id="الخيار-الخامس-استخدام-كود-التفعيل-في-marketpress">
	الخيار الخامس: استخدام كود التفعيل في MarketPress
</h2>

<p style="text-align: center;">
	<img alt="6-discount-applied.png" class="ipsImage ipsImage_thumbnailed" data-fileid="24248" data-unique="ox6ertaip" src="https://academy.hsoub.com/uploads/monthly_2017_07/6-discount-applied.png.5d84f3d78fff0e7116d712008ad87fc2.png"></p>

<p>
	<br>
	إذا كنتَ تستخدم MarketPress فيمكنك استخدام الملف الذي تريد من مستخدميك تنزيله للترويج لقائمتك البريدية، إذ عليك توفير كود تخفيض (أو كوبون) كمُحفِّز للاشتراك في قائمتك البريدية. ثم أعطهم كود التخفيض برسالة الترحيب بمشتركي القائمة البريدية وضع رابطًا إلى الملف على موقعك.<br>
	هذا الخيار مرنٌ ومناسب لأنه يسمح لك بتوفير كود يؤدي إلى تخفيض بنسبة مئوية ثابتة لأي منتج من منتجاتك. وبفعلك لذلك، فأنت تزيد من مشتركي القائمة البريدية وفي نفس الوقت تزيد من مبيعاتك.<br>
	إذا لم تستخدم أكواد التخفيض من قبل مع MarketPress، فاعلم أنَّ إعدادها سهل، ويمكنك فعل ذلك بثلاثة خطوات:
</p>

<ol>
<li>
		سجل دخولك إلى لوحة تحكم ووردبريس.
	</li>
	<li>
		اذهب إلى صفحة Store Settings &gt; Add Ons واحرص على أنَّ إضافة أكواد التخفيض (coupons) مفعّلة.
	</li>
	<li>
		اذهب إلى Store &gt; Coupons وأنشِئ كود تخفيض جديد.
	</li>
</ol>
<p>
	هذا كل ما في الأمر! عليك الآن توفير كود التخفيض الذي أنشأتَه للمشتركين الجدد بالقائمة البريدية، ووضع رابط إلى متجرك.
</p>

<h2 id="الخلاصة">
	الخلاصة
</h2>

<p>
	تحفيز زوار موقعك على الاشتراك بالقائمة البريدية عبر توفير ملف للتحميل مجانًا هي استراتيجية مجرِّبة وفعّالة، وكما رأيت، ليس من الصعب تصميم طريقة لتوصيل المحتوى مع الحفاظ على حماية الملف المعني دون تعقيد العملية على زوار الموقع. والمفتاح الرئيسي لنجاح هذه العملية هو تحديد أهدافك منها قبل اعتماد إحدى طرائق توفير الملف.<br>
	إذا كان هدفك هو تبسيط الأمر ما استطعت، فأنصحك باستعمال التخزين السحابي أو خدمات مزود القائم البريدية لتوفير الملف. أما إذا رَغِبتَ بعودة المشتركين إلى موقعك، فاستخدم صفحة غير مفهرسة من محركات البحث أو صفحة محمية بكلمة مرور لتوفير رابط لتنزيل الملف.<br>
	في النهاية، إذا كنتَ تستعمل MarketPress، فإنشاء أكواد تخفيض سيسمح لك باستخدام الدعم المُضمَّن في MarketPress لإنشاء «منتجات» قابلة للتحميل، مما يزيد من احتمال عودة المشتركين إلى موقعك.<br>
	ترجمة –وبتصرّف– للمقال <a href="https://premium.wpmudev.org/blog/give-away-ebooks-get-subscribers/" rel="external nofollow">How to Give Away a Free Ebook (and Get More Subscribers) with WordPress</a> لصاحبه Jon Penland
</p>

<p>
	حقوق الصورة البارزة محفوظة لـ <a href="http://www.freepik.com/free-vector/businessman-in-a-boat_1076109.htm" rel="external nofollow">Freepik</a>
</p>
]]></description><guid isPermaLink="false">284</guid><pubDate>Sun, 23 Jul 2017 20:38:23 +0000</pubDate></item><item><title>&#x643;&#x64A;&#x641; &#x62A;&#x633;&#x62A;&#x639;&#x645;&#x644; SSL &#x648; HTTPS &#x645;&#x639; &#x648;&#x648;&#x631;&#x62F;&#x628;&#x631;&#x64A;&#x633;</title><link>https://academy.hsoub.com/apps/web/wordpress/%D9%83%D9%8A%D9%81-%D8%AA%D8%B3%D8%AA%D8%B9%D9%85%D9%84-ssl-%D9%88-https-%D9%85%D8%B9-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-r278/</link><description><![CDATA[
<p><img src="https://academy.hsoub.com/uploads/monthly_2017_07/main2.png.c48677bf7d3a1a6013173a5f3f675328.png" /></p>

<p id="كيف-تستعمل-ssl-و-https-مع-ووردبريس">
	نحن نرسل معلوماتنا الشخصية في كل يوم عبر الإنترنت، ففي الساعة الماضية دفعتُ المستحقات على بطاقتي الائتمانية، واشتريتُ كتابًا، وحفظتُ نسخةً من عناوين منازل أصدقائي، وأرسلتُ بعض رسائل البريد الإلكتروني، واشتريتُ بعض الحاجيات.<br>
	أصبحتْ مشاركة معلوماتنا شائعة جدًا في هذه الفترة، حتى أننا لم نعد نفكر قبل مشاركتها.<br>
	هذا هو الغرض من <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr>، فشهادات <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> تحمي التفاصيل التي نشاركها على الإنترنت، مانعةً وقوعها في الأيدي الخاطئة.<br>
	استخدام <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> –وبالتالي HTTPS– لحماية موقع ووردبريس الخاص بك وزواره لن يكون أمرًا صعبًا ومعقدًا، وسنناقش في هذا الدرس ما هو <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> وكيف نستخدمه.
</p>

<h2 id="ما-هو-ssl">
	ما هو <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr>؟
</h2>

<p>
	«طبقة المقابس الآمنة» (Secure Socket Layer اختصارًا <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr>) بدأت كطريقة لزيادة الحماية بين المواقع الإلكترونية وزوارها في 1994 من شركة Netscape Communications حيث وجدوا أنَّ الحاجة لمثل هذه التقنية في تزايد.<br>
	تم تحسين <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> لاحقًا وأُصدِرَ لأول مرة بنسخة 3.0 في عام 1996، لكنه كان يحتوي على ثغرات. ومن ثم استحوذت «Internet Engineering Task Force» (اختصارًا IETF) عليه رسميًا في 1999 وطوِّرَ كثيرًا منذ ذاك الحين.
</p>

<p style="text-align: center;">
	<img alt="1-IETF_Logo-320px-312x166.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23978" data-unique="uwa5g6ed2" src="https://academy.hsoub.com/uploads/monthly_2017_07/1-IETF_Logo-320px-312x166.png.8697f6862fed4e24611a7dfd5ae92303.png"></p>

<p>
	وفي الوقت الراهن، أعيدت تسمية <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> إلى <abbr title="Transport Layer Security | بروتوكول أمن طبقة النقل">TLS</abbr> ‏(Transport Layer Security أي حماية طبقة النقل)، لكن ما يزال يشار إليه باسم <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> أو <abbr title="Transport Layer Security | بروتوكول أمن طبقة النقل">TLS</abbr>/<abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr>. وما يزال الغرض منه هو ذاته إلى يومنا هذا، وأصبحت هذه التقنية معياريةً لحماية مواقع الويب.
</p>

<h2 id="متى-يجب-أن-تستعمل-ssl">
	متى يجب أن تستعمل <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr>؟
</h2>

<p>
	<a href="http://googleonlinesecurity.blogspot.com/2014/08/https-as-ranking-signal_6.html" rel="external nofollow">أعلنت شركة Google منذ مدة أنَّها ستزيد من تقييم المواقع</a> التي تستعمل <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> في نتائج بحثها، لكن ربما تجد زيادةً مقدارها 1% في هذه الفترة، لإعطاء الجميع فرصةً للانتقال إلى استخدام <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr>.<br>
	وبغض النظر عمّا سبق: إذا كان يطلب موقعك من المستخدمين تسجيل دخولهم أو إعطاء معلوماتهم الشخصية مثل أسمائهم وعناوين بريدهم الإلكتروني وتفاصيل بطاقتهم الائتمانية وهلم جرًا… فيجب أن توفِّر حمايةً عبر <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr>. فبدونها قد تُعرِّض معلومات المستخدمين للخطر.
</p>

<h2 id="كيف-يعمل-ssl">
	كيف يعمل <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr>؟
</h2>

<p>
	يعمل <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> عبر تشفير المعلومات المُمرَّرة بين الخادوم الذي يُستضاف عليه الموقع إلى المتصفح بدلًا من ترك المعلومات بصيغتها النصية، مما يعني أنَّ النص سيُعاد صياغته بطريقةٍ تجعله يبدو وكأنه سلسلة من الحروف غير المفهومة والأرقام، بدلًا من بقائه بصيغته المفهومة.<br>
	لإنشاء اتصال <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> آمن على موقع ويب، فيجب أن يحصل صاحب الموقع على شهادة <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> (أي <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> certificate) من إحدى الشركات المتخصصة والتي تُسمى «سلطة الشهادات» (Certificate Authority). وبعد دفع المبلغ، فيجب إرسال معلومات الموقع الإلكتروني إلى سلطة الشهادات مثل الاسم والعنوان ورقم الهاتف. توضح هذه الصورة بعض المعلومات اللازمة لتسجيل شهادة <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> أساسية، هنالك معلوماتٌ أخرى تتطلبها الشهادات الأكثر أمانًا:
</p>

<p style="text-align: center;">
	<img alt="2-ssl-registration-enter-details-700x200.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23979" data-unique="nmk3qfclh" src="https://academy.hsoub.com/uploads/monthly_2017_07/2-ssl-registration-enter-details-700x200.png.b22575c8537eabbe8fb77c7e9e9d0105.png"></p>

<p>
	وبالمقابل، سيحصل مالك الموقع على مفتاح عمومي (public key) ومفتاح خاص (private key). لا يجب مشاركة المفتاح الخاص مع أي شخص (مَثَلُهُ كمَثل كلمة المرور) لكن المفتاح العمومي ليس مهمًا أن يبقى مخفيًا.<br>
	تلك المفاتيح هي أحرف وأرقام متناسقة مع بعضها رياضيًا، وهي تشبه المفتاح والقفل. وتُنشَأ عبر خوارزمية باسم Secure Hash Algorithm.<br>
	يُرسَل المفتاح العمومي مع البيانات التي أدخلتها مسبقًا في ملفٍ باسم «Certificate Signing Request» (أي طلب توقيع الشهادة).
</p>

<p style="text-align: center;">
	<img alt="3-public-key-in-whm-700x104.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23980" data-unique="1745kh5oe" src="https://academy.hsoub.com/uploads/monthly_2017_07/3-public-key-in-whm-700x104.png.15b3dd25277f140d031642a09bf3ce7d.png"></p>

<p>
	ستتحقق سلطة الشهادات من المعلومات التي أدخلتَها وتتأكد أنها دقيقة (وأنَّك لستَ مُخترِقًا) وإذا جرى كل شيءٍ على ما يرام، فستوقَّع الشهادة عبر خوارزمية SHA.<br>
	بعد ذلك ستصدر شهادة <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr>، وهذه هي المرحلة التي يمكن للموقع فيها استخدام اتصالات مشفرة عبر <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr>.<br>
	وعندما يزور المستخدم موقعًا محميًا، فسيتأكد الخادوم أنَّ شهادة <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> تتطابق مع المفتاح الخاص، ومن ثم سينُشَأ «نفق مشفَّر» بين الخادوم (أو الموقع) والمتصفح (أو المستخدم).
</p>

<h2 id="كيف-تبدو-المواقع-المحمية-بشهادات-ssl">
	كيف تبدو المواقع المحمية بشهادات <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr>؟
</h2>

<p>
	السابقة <code>https</code> ستظهر قبل رابط URL بدلًا من البروتوكول الافتراضي <code>http</code>. يمكنك أن تلاحظ قفلًا لونه أخضر معروضٌ في حقل العنوان في متصفحك.
</p>

<p style="text-align: center;">
	<img alt="4-https-and-green-padlock-in-chrome-700x104.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23981" data-unique="ciaaow4jd" src="https://academy.hsoub.com/uploads/monthly_2017_07/4-https-and-green-padlock-in-chrome-700x104.png.9cb3dcd67c2ac34be3ad23584f8f2b2b.png"></p>

<p>
	إذا اختار القائمون على الموقع شراء شهادة موسعة (تسمى «Extended Validation Certificate») فسيصبح شريط العنوان أخضر اللون بأكمله، أو سيحتوي على اسم الشركة باللون الأخضر قبل عنوان URL. أما في متصفح Safari فلن يصبح شريط العنوان أخضر اللون، ولن يكون لاسم الشركة خلفيةٌ خضراء، وإنما سيُستعمَل اللون الأخضر لكتابة اسم الشركة:
</p>

<p style="text-align: center;">
	<img alt="5-ev-ssl-certificate-in-safari-700x104.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23982" data-unique="u5khjr51h" src="https://academy.hsoub.com/uploads/monthly_2017_07/5-ev-ssl-certificate-in-safari-700x104.png.55acb2419a243d7a761ca8a1fd891aff.png"></p>

<p>
	عادةً، توفِّر الشهادات الموسعة حمايةً أكثر، وتُصدَر بعد أن تجتاز الشركة تحققات أكثر من سلطة الشهادات. وسيُطلَب من القائمين عليها توفير دليل على العنوان الفيزيائي وغير ذلك من الأمور القانونية، إضافةً إلى المعلومات الأساسية التي ذكرناها آنفًا.
</p>

<h2 id="متى-تتوقف-شهادة-ssl-عن-العمل">
	متى تتوقف شهادة <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> عن العمل
</h2>

<p>
	إذا انتهت صلاحية شهادة <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> أو كانت موقعةً ذاتيًا (self-signed) أو كانت غير صالحة، فسيتحول لون كلمة https إلى الأحمر وأحيانًا يوضع خط فوقها، وأغلبية المتصفحات تحذِّرك إذا كان الموقع يستخدم شهادة <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> متوقفة، وتطلب تأكيدك قبل الدخول إلى الموقع غير الموثوق:
</p>

<p style="text-align: center;">
	<img alt="6-untrusted-ssl-certificate-on-site-700x200.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23983" data-unique="25c0kti4u" src="https://academy.hsoub.com/uploads/monthly_2017_07/6-untrusted-ssl-certificate-on-site-700x200.png.4705916e5936c70e6d34490c028c8d84.png"></p>

<p>
	عندما تنتهي صلاحية الشهادة، فيجب على مالك الموقع أن يُجدِّد شهادة <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> ببساطة، وذلك عبر سلطة الشهادات؛ لكن من الأفضل عدم الانتظار حتى انتهاء الشهادة لتجديدها، لكي يكون موقعك محميًا دومًا.<br>
	أو سينبِّهك المتصفح إذا كنتَ تستخدم شهادة موقعة ذاتيًا وذلك إذا أصدرتَ شهادة <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> خاصة بك ولم تذهب إلى سلطة شهادات لتحقق من صحة المعلومات التي أدخلتها.<br>
	أغلبية المتصفحات تثق بشهادات <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> المُصدَرَة من سلطة شهادات موثوقة، وستعرض تحذيرًا لجميع المواقع التي تستخدم شهادات موقعة ذاتيًا. إذا اشتريتَ شهادة <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> من شركة ليس ذات مستوى مرموق، فقد يُعتَبَر أنَّ موقعك يستخدم شهادة موقعة ذاتيًا.
</p>

<p style="text-align: center;">
	<img alt="7-ssl-certificate-expired-700x314.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23984" data-unique="falf1yn02" src="https://academy.hsoub.com/uploads/monthly_2017_07/7-ssl-certificate-expired-700x314.png.3cc7a366e524451b5e96b29b138f844b.png"></p>

<p>
	قد تصبح شهادة <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> غير صالحة لعدد من الأسباب، أحدها هو استخدام خوارزمية SHA قديمة.<br>
	عملية التجزئة (hashing) هي عملية تحويل كمية كبيرة من المعلومات النصية إلى كمية أصغر يُشار إليها بالمفتاح (key) ويتم تحويلها عبر تطبيق مجموعة من القواعد الرياضية. وهنالك حاجةٌ إلى عملية تجزئة أقوى مع تقدم التقنية.<br>
	لم تعد خوارزمية SHA0 مستخدمةً، وخفَّ استخدام خوارزمية SHA1 كثيرًا في الآونة الأخيرة، وأصبح متصفح Chrome يُظهِر تحذيرات بدءًا من عام 2016 للمواقع التي تستخدم خوارزمية SHA1. المعيار الحالي للتشفير هو خوارزمية SHA2 وأتوقع أن تحل محلها خوارزمية SHA3.<br>
	قد يبدو لك أنَّ شهادة <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> غير صالحة إذا لم يتمكن المتصفح من التحقق منها من سلطة الشهادات. وهذا يحدث إذا كان اسم النطاق المستعمل في الشهادة يختلف عن اسم نطاق الموقع الذي يستخدمها.<br>
	أفضل طريقة لحل هذه المشاكل هي تحديث شهادة <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> بالتنسيق مع سلطة الشهادات وباتباع تعليماتهم.
</p>

<p style="text-align: center;">
	<img alt="8-insecure-ssl-certificate-on-site--700x104.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23985" data-unique="mntseb5ok" src="https://academy.hsoub.com/uploads/monthly_2017_07/8-insecure-ssl-certificate-on-site--700x104.png.ae42a1b32a9d44571220142687db86f4.png"></p>

<p>
	إذا ظهر قفلٌ أمامه مثلثٌ أصفرٌ صغير، فمن المرجَّح أنَّ السبب هو أنَّ موقعك يحتوي على روابط لصفحات غير آمنة، تأكَّد أنَّ جميع صورك وعناصر القائمة وجميع الروابط في موقعك تستعمل بروتوكول https.<br>
	من السهل معرفة السبب وراء عدم صلاحية الشهادة عبر استخدام أداة مجانية باسم <a href="https://www.whynopadlock.com/" rel="external nofollow">Why No Padlock</a> حيث تُعلِمُك مباشرةً بالمشكلة بما في ذلك استعمال الصور والسكربتات لبروتوكول http بدلًا من https.
</p>

<h2 id="استخدام-شهادة-ssl-مع-ووردبريس">
	استخدام شهادة <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> مع ووردبريس
</h2>

<p>
	بعد أن تملك شهادة <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> فيمكنك الآن استخدامها مع موقعك الذي يعتمد على ووردبريس.<br>
	لا تنسَ أن تأخذ نسخةً احتياطيةً من كامل الموقع قبل إجراء أيّة تغييرات لمنع فقدان بياناتك في حال حدث شيءٌ غيرُ متوقعٍ. يمكنك الإكمال بعد أخذ النسخة الاحتياطية.<br>
	لضبط شهادة <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> على موقع ووردبريس مستقل أو على شبكة متعددة المواقع، فافتح ملف <code>wp-config.php</code> وأضف السطر الآتي من الشيفرة. حيث سيُجبِر صفحات تسجيل الدخول ولوحة التحكم على استعمال تشفير <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr>:
</p>

<pre class="ipsCode prettyprint lang-php prettyprinted" id="ips_uid_1774_7" style="">
<span class="pln">define</span><span class="pun">(</span><span class="str">'FORCE_SSL_ADMIN'</span><span class="pun">,</span><span class="pln"> </span><span class="kwd">true</span><span class="pun">);</span></pre>

<p>
	احرص على أن تضع السطر السابق قبل التعليق الآتي:
</p>

<pre class="ipsCode prettyprint lang-php prettyprinted" id="ips_uid_1774_7" style="">
<code class="hljs cs"><span class="hljs-comment"><span class="com">/* That's all, stop editing! Happy blogging. */</span></span></code></pre>

<p>
	سنضبط الآن إعادة توجيه (301) لكي يعاد توجيه كل زوار موقعك إلى النسخة الآمنة من الموقع التي تستعمل https بدلًا من http.<br>
	عدِّل ملف <code>‎.htaccess</code> أو أنشِئ واحدًا إن لم يكن موجودًا من قبل. إذا كان موجودًا فعليك وضع الشيفرة الآتية في أول الملف قبل أي شيءٍ آخر.<br>
	لا تنسَ وضع اسم نطاقك بدلًا من <code>mysite.com</code> واحرص على إدخال المنفذ الصحيح إذا لم يستعمل موقعك المنفذ 80.
</p>

<pre class="ipsCode prettyprint lang-php prettyprinted" id="ips_uid_1774_7" style="">
<code class="hljs apache"><span class="hljs-tag"><span class="tag">&lt;IfModule</span><span class="pln"> </span><span class="atn">mod_rewrite</span><span class="pln">.</span><span class="atn">c</span><span class="tag">&gt;</span></span><span class="pln">
</span><span class="hljs-keyword"><span class="hljs-common"><span class="pln">RewriteEngine</span></span></span><span class="pln"> </span><span class="hljs-literal"><span class="pln">On</span></span><span class="pln">
</span><span class="hljs-keyword"><span class="hljs-common"><span class="pln">RewriteCond</span></span></span><span class="pln"> </span><span class="hljs-cbracket"><span class="pln">%{SERVER_PORT}</span></span><span class="pln"> 80 
</span><span class="hljs-keyword"><span class="hljs-common"><span class="pln">RewriteRule</span></span></span><span class="pln"> ^(.*)$ https://www.mysite.com/</span><span class="hljs-number"><span class="pln">$1</span></span><span class="hljs-sqbracket"><span class="pln"> [R,L]</span></span><span class="pln">
</span><span class="hljs-tag"><span class="tag">&lt;/IfModule&gt;</span></span></code></pre>

<p>
	افتح موقعك الآن لتجرِّبه. فإذا ظهرت الكلمة <code>https</code> في عنوان URL مع القفل الأخضر فهذا يعني أنَّ موقعك أصبح يستعمل شهادة <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr>.
</p>

<h2 id="الخلاصة">
	الخلاصة
</h2>

<p>
	الحصول على شهادة <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> لموقعك هي خطوةٌ مهمةٌ في طريق حمايته وحماية زواره، لكنها ليست الخطوة الوحيدة التي عليها فعلها، يمكنك الاطلاع على <a href="https://academy.hsoub.com/apps/web/wordpress/%D8%A7%D9%84%D8%AD%D9%85%D8%A7%D9%8A%D8%A9-%D9%88%D8%A5%D8%B6%D8%A7%D9%81%D8%A7%D8%AA-%D8%A7%D9%84%D9%86%D8%B3%D8%AE-%D8%A7%D9%84%D8%A7%D8%AD%D8%AA%D9%8A%D8%A7%D8%B7%D9%8A-%D9%81%D9%8A-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-r7/" rel="">هذا الدرس</a>.<br>
	إذا أردتَ معلوماتٍ أكثر عن استخدام <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> مع ووردبريس لاحتياجاتك الخاصة، فانظر إلى صفحة <a href="http://codex.wordpress.org/Administration_Over_SSL" rel="external nofollow">Administration Over <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr></a> في توثيق ووردبريس.<br>
	هل أنت مهتم بالحصول على شهادة <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> مجانية؟ <a href="https://www.eff.org/deeplinks/2014/11/certificate-authority-encrypt-entire-web" rel="external nofollow">أعلنت EFF ‏(Electronic Frontier Foundation) في عام 2014</a> أنها تعمل على مشروع مفتوح المصدر لإنشاء شهادات <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> مجانًا، وأُطلِق هذا المشروع لاحقًا باسم <a href="https://letsencrypt.org" rel="external nofollow">Let’s Encrypt</a>.<br>
	هنالك إضافاتُ تساعدك في ضبط شهادة <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> في موقعك، لكن انتبه فقد لا تكون تلك الإضافات مُحدَّثةً وقد لا تتوافق مع آخر نسخة من ووردبريس.<br>
	قد تحسب أنَّه لا بأس باستعمال إضافات قديمة إذا كان يستعملها الكثيرون وقد اختبرتَها في موقعٍ تجريبي دون مشاكل، لكن حماية موقعك ليست شيئًا يُستهان به.
</p>

<p>
	<br>
	ترجمة –وبتصرّف– للمقال <a href="https://premium.wpmudev.org/blog/ssl-https-wordpress/" rel="external nofollow">How to Use <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> and HTTPS with WordPress</a>لصاحبته Jenni McKinnon
</p>
]]></description><guid isPermaLink="false">278</guid><pubDate>Mon, 10 Jul 2017 15:01:11 +0000</pubDate></item><item><title>&#x643;&#x64A;&#x641;&#x64A;&#x629; &#x627;&#x633;&#x62A;&#x639;&#x627;&#x62F;&#x629; &#x645;&#x648;&#x642;&#x639; &#x648;&#x648;&#x631;&#x62F;&#x628;&#x631;&#x64A;&#x633; &#x62A;&#x639;&#x631;&#x636; &#x644;&#x644;&#x627;&#x62E;&#x62A;&#x631;&#x627;&#x642;</title><link>https://academy.hsoub.com/apps/web/wordpress/%D9%83%D9%8A%D9%81%D9%8A%D8%A9-%D8%A7%D8%B3%D8%AA%D8%B9%D8%A7%D8%AF%D8%A9-%D9%85%D9%88%D9%82%D8%B9-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-%D8%AA%D8%B9%D8%B1%D8%B6-%D9%84%D9%84%D8%A7%D8%AE%D8%AA%D8%B1%D8%A7%D9%82-r275/</link><description><![CDATA[
<p><img src="https://academy.hsoub.com/uploads/monthly_2017_07/main2.png.c155b874d1daf3e9278629365a5ad710.png" /></p>

<p id="كيفية-استعادة-موقع-ووردبريس-تعرض-للاختراق">
	تعرّض موقعك للاختراق هو أحد أكثر التجارب إحباطًا والتي ستواجهك أثناء عملك كمدير أحد المواقع؛ ولسوء الحظ، لن تغني عنك تعزيزاتك الأمنية شيئًا، إذ <a href="http://www.forbes.com/forbes/welcome/#50764a803a8c" rel="external nofollow">يُختَرَق يوميًا حوالي 30000 موقع إلكتروني</a>، ومن المرجح أن يقع موقعك فرسيةً عاجلًا أم آجلًا، لذا من المهم أن تعلم ما الذي يتوجب عليك فعله عند حدوث ذلك.<br>
	لكن لحسن الحظ، من الممكن أن تتعرَّف على الآلية التي أُختِرَق موقعك بواسطتها وذلك عبر القيام ببعض أعمال «التنقيب» في سجلات الموقع؛ وبعد أن تُحدِّد كيف وصل المخترق إلى موقعك تمامًا، فيمكنك ترقيع الثغرة الأمنية لتنجب استغلالها مجددًا مستقبلًا.<br>
	يتوافر في WPMU DEV <a href="https://premium.wpmudev.org/support/" rel="external nofollow">فريق دعم فني خبير يستطيع مساعدتك في تشخيص مشاكل موقعك</a> أو يمكنك استخدام إضافة مثل <a href="https://premium.wpmudev.org/project/wp-defender/" rel="external nofollow">Defender</a> لترقيع الثغرات الأمنية قبل وقوع الهجوم (سنستفيض بالشرح عن هذا الموضوع لاحقًا).<br>
	لكن إن كنتَ عازمًا على حلِّ المشكلة بنفسك، فسأذكر في هذا الدرس أكثر الطرائق التي يمكن اختراق موقعك عبرها شيوعًا وكيف تتحقق من السجلات بحثًا عن أدلة.
</p>

<h2 id="كيف-تخترق-المواقع-الجيدة">
	كيف تُختَرَق المواقع «الجيدة»
</h2>

<p>
	يتسلل المخترقون إلى موقعك بإحدى الطريقتين الآتيتين: إما يدويًا وإما عبر استعمال برنامج يُنشئونه لهذا الغرض يسمى «bot» أو «hackbot»؛ ولمّا كانت أغلبية الهجمات تستهلك وقت المخترقين فلذا تستعمل برمجيات hackbot لمهاجمة مئات أو حتى آلاف المواقع ساعيًّا بشكلٍ ممنهج.<br>
	هذه هي الطرائق الرئيسية التي يستطيع المخترقون الوصول عبرها إلى موقعك:<br>
	هجمات تخمين اسم المستخدم وكلمة المرور: وهذا النمط من الهجمات يُطلَق عليه اسم «Brute force attacks». فلو كنتَ تستخدم اسم المستخدم الافتراضي (مثل «admin» أو «administrator») مع كلمة مرور ضعيفة، فأنت «تهدي» المخترقين نصف المعلومات التي يحتاجون لها للدخول إلى موقعك.<br>
	ثغرات في البرمجيات: عندما يجد المخترقون ثغرةً أمنيةً في برمجية ووردبريس أو في إحدى إضافاتها أو قوالبها أو السكربتات المستعملة فيها، فسيحاولون استغلالها للوصول إلى موقعك، بمحاولة «حقن» السكربتات الخاصة بهم على سبيل المثال.<br>
	الأبواب الخلفية: يوضع ملفٌ خبيثٌ بين ملفات موقعك، والذي يحتوي على سكربت الذي يسمح للمخترق بالوصول المتكرر إلى موقعك دون أن يخلِّف وراءه أثرًا.<br>
	البرمجيات الخبيثة والفيروسات: إذا كان حاسوبك يعاني من الفيروسات والبرمجيات الخبيثة، فيمكن أن يستعملها المخترقون للوصول إلى موقعك.<br>
	خادوم غير مؤمن: يجب أن يكون الخادوم الذي تستضيف عليه موقعك آمنًا؛ فلو لم يكن كذلك، فيستطيع المخترقون استغلال الثغرات الأمنية فيه لاختراق موقعك.<br>
	أذونات غير صحيحة للملفات: عليك <a href="https://premium.wpmudev.org/blog/understanding-file-permissions/" rel="external nofollow">ضبط الأذونات (permissions) على جميع ملفاتك</a> وهذا يعني أنَّك تستطيع أن تُحدِّد مَن يستطيع قراءة السكربتات والكتابة إليها وتنفيذها. فإذا سمحتَ بكل ذلك فيمكن للمخترق أن يُعدِّل ملفاتك بسهولة، ويضيف سكربت خبيث مثل الأبواب الخلفية، وبالتالي سيُختَرَق موقعك.<br>
	استخدام موقع احتيالي: يمكن للمخترقين إنشاء مواقع تتنكر بصفة الشركة الأصلية أو المدونة المعنية، ويُنشِئون نماذج تسجيل مصممة خصيصًا لجمع المعلومات لاستخدامها لاحقًا، وفي حال كان الموقع مبينًا على ووردبريس فيُحتَمل أن يسرقوا بيانات الدخول.<br>
	ثغرات XML-RPC: يُستخدَم بروتوكول XML-RPC لميزة pingbacks و trackbacks في ووردبريس، حيث يسمح لووردبريس بإنشاء عدد من الاستدعاءات عبر طلبية HTTP والذي يعني أنَّ موقعك يمكن أن يُرسِل pingback لموقعٍ آخر بالكامل ويستلم الرد. والمشكلة هي أنَّ المخترقين يستخدمون هذه الميزة لتنفيذ هجمات brute force عن بعد.<br>
	هجمات XSS‏ (Cross-site Scripting): ثغرة XSS هي أنَّ الشيفرة مكتوبة بطريقة تجعل من الممكن للمخترق أن يكتب وينفذ شيفرة JavaScript خبيثة والتي تحاول الوصول إلى بيانات المتصفح الخاص بالمستخدم؛ ويتم ذك عادةً عبر وضع رابط لإرسال المستخدمين إلى أحد المواقع لسرقة أيّة بيانات يدخلونها أثناء تصفحهم للموقع الهدف. حيث يستطيعون مثلًا سرقة بيانات دخول مدير الموقع للوصول إلى لوحة التحكم.<br>
	تزوير الطلب عبر المواقع (Cross-site request forgery اختصارًا CSRF): يحدث هذا النوع من الهجمات عندما يزوِّر المخترق طلبيةً من المستخدم عبر استخدام الشيفرات. وهذا يعني أنَّ المخترق قد يُعدِّل على الطلبية العادية لأغراضه الخبيثة. ولعدم امتلاك المخترقين على وصولٍ كمسؤول (admin) فإنهم يخدعون المستخدم لجعله ينفذ شيئًا لإعطاء ترخيص بتنفيذ الطلبية الخبيثة. وهذا النوع من الهجوم يمكن أن يستخدم لخداع المستخدم لفعل العديد من الأشياء مثل إرسال تفاصيل الدخول للمخترق مما يعطيه وصولًا إلى الموقع.<br>
	المشكلة أنَّ القائمة السابقة ليست شاملةً وهنالك الكثير من الطرائق المتاحة أمام المخترقين، ومن المستحيل التخمين ما هي الآلية التي ستُتبَع لاختراق موقعك، وماذا عليك أن تفعل لحل المشكلة.<br>
	إذا بدأت بالتخمين، فمن المرجح أنَّك لن تكتشف الخلل، وستضيع وقتك في حلقة مفرغة؛ فما يزال المخترق متمكنًا من الوصول إلى موقعك، في حين أنَّك حَلَلتَ إحدى المشكلات ظانًا أنَّك أغلقتَ الثغرة التي دخل منها؛ إلى أن يتعرض موقعك للاختراق مجددًا، وهكذا…<br>
	الطريقة الوحيدة التي يمكنك أن تتأكد فيها من أمان موقعك بعد اختراقه هي أن تَعلَم تمام العلم ما هو الجزء الذي تعرض إلى الهجوم من موقعك، وبعد معرفتك لذلك فيمكنك أن تصلح المشكلة وتنهي الحلقة المفرغة.
</p>

<h2 id="التعامل-مع-السجلات">
	التعامل مع السجلات
</h2>

<p>
	يمكن أن توفِّر لك سجلات موقعك دلائل مهمة تبيّن كيف اُخترِقَ موقعك؛ ولا ضير من تفقد سجل أخطاء موقعك.<br>
	مكان هذه السجلات يختلف من موقعٍ لآخر وذلك اعتمادًا على الاستضافة، لذا أنصحك بالتواصل مع مزود الاستضافة إذا لم تعرف أين تجد السجلات.<br>
	في لوحة cPanel، يمكنك أن تجد هذه السجلات في قسم Metrics بعد تسجيل الدخول. ويكون سجل الأخطاء قصيرًا عادةً، لذا يمكنك الضغط على زر Errors لتنظر إلى سجل الأخطاء أو يمكنك الضغط على زر Raw Access للوصول إلى سجل الوصول (access log) أولًا. يجب أن يعطيك سجل الوصول فكرةً عن كيفية اُخترِق موقعك.<br>
	يمكن أن يعطيك سجل الأخطاء فكرةً سريعةً عمّا حدث، لكن لعدم عرض محاولات الوصول الناجحة إلى موقعك، فلن تستفيد منه كثيرًا. لكن مع ذلك أرى أنَّ من المناسب البدء به فلربما يعطيك فكرة عمّا عليك البحث في سجلات الوصول.<br>
	للحصول على نسخة من سجل الوصول، فاضغط على رز Raw Access، ثم اختر أحد المواقع الموجودة في القائمة لتنزيل نسخة من السجلات.
</p>

<p style="text-align: center;">
	<img alt="1-download-access-log.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23871" data-unique="bye8a2kso" src="https://academy.hsoub.com/uploads/monthly_2017_07/1-download-access-log.png.830c533f04b2d161189876490dc45b7d.png"></p>

<p>
	بعد التنزيل، يمكنك استخراج المحتويات وعرضها في برنامجك المفضَّل مثل المحرر <a href="http://brackets.io/" rel="external nofollow">Brackets</a> المفتوح المصدر.<br>
	أبقِ في بالك أنَّ cPanel تحتفظ بسجلات آخر 24 ساعة فقط، لكن يمكنك تشغيل ميزة الأرشفة لحفظ بيانات الوصول لشهرٍ أو أكثر. أما لسجلات الأخطاء، فيُسجَّل عادةً آخر 300 خطأ فيها.<br>
	لتفعيل الأرشفة، عليك تفعيل الحقل الموجود في القسم العلوي من الصفحة المُعَنوَن «Archive logs in your home directory at the end of each stats run every 24 hours»، يمكنك أيضًا تفعيل الحقل الذي يدنوه لحذف السجلات القديمة من الأشهر الماضية، وهذا يساعد في تقليل المساحة التخزينية والموارد التي يحتاج لها موقعك للاستمرار في أرشفة السجلات.
</p>

<p style="text-align: center;">
	<img alt="2-archive-access-logs.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23872" data-unique="ry6csdavu" src="https://academy.hsoub.com/uploads/monthly_2017_07/2-archive-access-logs.png.85bad60b38807f47ac27e6483425a1e7.png"></p>

<p>
	لا تنسَ الضغط على زر Save لحفظ تغييراتك؛ يجدر بالذكر أنَّ هذين الخيارين مفعلان افتراضيًا، لكن قد يعطلها مزود الاستضافة لبعض خطط الاستضافة.<br>
	من المهم ملاحظة أنَّك لا تملك وقتًا طويلًا لتفحص السجلات القديمة، فعند اختراق موقعك، فيجب عليك فورًا الحصول على السجلات وتحليلها لأن لديك فرصة زمنية قصيرة قبل حذف سجلاتك حذفًا دائمًا. لذا احفظ منها ما استطعت لمنع فقدان البيانات المهمة.
</p>

<h3 id="فهم-بنية-السجلات">
	فهم بنية السجلات
</h3>

<p>
	ستبدو سجلات الأخطاء والوصول متشابهة وكأنها كتل كبيرة من النص غير المفهوم، لكن بعد أن تتعلم طريقة عرض المعلومات في السجلات، فلن يصعب عليك فهمها كما قد تتوقع.
</p>

<p style="text-align: center;">
	<a class="ipsAttachLink ipsAttachLink_image" data-fileid="23873" href="https://academy.hsoub.com/uploads/monthly_2017_07/3-error-access-logs.png.45e80651cec9da2b32628d3e91e68712.png" rel=""><img alt="3-error-access-logs.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23873" data-unique="7ah236jvz" src="https://academy.hsoub.com/uploads/monthly_2017_07/3-error-access-logs.thumb.png.9526d510caecec4e67768bbf2f916260.png"></a>
</p>

<p>
	عندما ننظر إلى سجل الأخطاء، فمن المهم أن نعلم بنيته:
</p>

<ul>
<li>
		الوقت والتاريخ
	</li>
	<li>
		نوع الخطأ
	</li>
	<li>
		عنوان IP للمستخدم
	</li>
	<li>
		وصف الخطأ
	</li>
	<li>
		مسار الصفحة التي تمت محاولة عرضها
	</li>
	<li>
		رابط URL للموقع الذي أتى المستخدم منه إلى الصفحة المعنية
	</li>
</ul>
<p>
	تنطبق المعلومات السابقة على عدد كبير من أنواع السجلات، لكن لاحظ أنَّ سجلك قد يكون مختلفًا لذا أنصحك بالرجوع إلى التوثيق الذي تقدمه لك شركة الاستضافة (أو الذي يوفره خادومك). والمِثل ينطبق على سجلات الوصول.<br>
	هذه هي بنية أغلبية سجلات الوصول:
</p>

<ul>
<li>
		عنوان IP للمستخدم
	</li>
	<li>
		الوقت والتاريخ
	</li>
	<li>
		طريقة الوصول إلى الصفحة عبر برتوكول HTTP (مثلًا: GET أو POST …إلخ.) والإصدار
	</li>
	<li>
		رمز حالة HTTP (مثلًا: 200 أو 404).
	</li>
	<li>
		عدد البايتات المُستقبَلة
	</li>
	<li>
		البرمجيات المستخدمة (المتصفح أو نظام تشغيل الجهاز)
	</li>
	<li>
		من الذي وصل إلى موقعك (ستُعرَض عبارة User Agent للمتصفح عادةً)
	</li>
</ul>
<h3 id="البيانات-التي-يجدر-بنا-البحث-عنها">
	البيانات التي يجدر بنا البحث عنها
</h3>

<p>
	عندما تحدِّق بالبيانات الموجودة في السجل فستبدو وكأنها كلام ليس ذا معنى ما لم تكن تعلم ما الذي عليك التركيز عليه. أنصحك بالبدء بإلقاء نظرة سريعة على سجل الأخطاء فقد يعطيك تلميحةً عمّا عليك البحث عنه في سجل الوصول.<br>
	إذا لاحظتَ أنَّ أحدهم حاول الوصول إلى ملفاتٍ لن يحاول المستخدم العادي زيارتها –لكن المخترقين سيفعلون ذلك– فلاحظ عنوان IP. إذ إنَّ المخترقين يحاولون الوصول إلى ملفات وصفحات مثل ملف <code>‎.htaccess</code> و <code>install.php</code> و <code>wp-config.php</code> والأجزاء الأخرى المشابهة من موقعك.<br>
	هذا مثال عن سطرٍ موجودٍ في سجل الأخطاء الذي ولَّدتهُ برمجية cPanel:
</p>

<pre class="ipsCode prettyprint lang-php prettyprinted" id="ips_uid_3539_7" style="">
<span class="pun">[</span><span class="typ">Fri</span><span class="pln"> </span><span class="typ">May</span><span class="pln"> </span><span class="lit">06</span><span class="pln"> </span><span class="lit">23</span><span class="pun">:</span><span class="lit">14</span><span class="pun">:</span><span class="lit">24.856758</span><span class="pln"> </span><span class="lit">2016</span><span class="pun">]</span><span class="pln"> </span><span class="pun">[</span><span class="pln">core</span><span class="pun">:</span><span class="pln">error</span><span class="pun">]</span><span class="pln"> </span><span class="pun">[</span><span class="pln"><abbr title="Process IDentifier | معرّف العملية أو البرنامج">pid</abbr> </span><span class="lit">27290</span><span class="pun">]</span><span class="pln"> </span><span class="pun">(</span><span class="lit">13</span><span class="pun">)</span><span class="typ">Permission</span><span class="pln"> denied</span><span class="pun">:</span><span class="pln"> </span><span class="pun">[</span><span class="pln">client </span><span class="lit">12.345</span><span class="pun">.</span><span class="lit">68.90</span><span class="pun">:</span><span class="lit">33106</span><span class="pun">]</span><span class="pln"> AH00132</span><span class="pun">:</span><span class="pln"> file permissions deny server access</span><span class="pun">:</span><span class="pln"> </span><span class="str">/path/</span><span class="pln">to</span><span class="pun">/</span><span class="pln">your</span><span class="pun">-</span><span class="pln">site</span><span class="pun">/.</span><span class="pln">htaccess</span></pre>

<p>
	في رسالة الخطأ السابقة: منع الخادوم وصول المستخدم إلى أحد الملفات لعدم امتلاكه صلاحيات لعرض الملف (الذي هو <code>‎.htaccess</code>)، إذا لم تتعرَّف على عنوان IP ولم يكن تابعًا لك، فيجب أن تأخذ حذرك وتسجِّل ملاحظة عن هذا السطر.<br>
	إذا لم تكن تعرف عنوان IP الخاص بك، فسيخبرك Google ما هو بالبحث باستخدام العبارة «what is my IP address».<br>
	عندما ترى أخطاءً مشابهةً، فيمكنك الانتقال الآن إلى سجل الوصول، وحاول أن تبحث عن أسطر مشابهة، لكن عند تمكُّن المستخدم من الوصول إلى الصفحة بنجاح، ويكون ذلك عندما تُعاد القيمة 200 كرمز لحالة HTTP في سجل الوصول. وهذا يشير إلى نجاح تنفيذ طلب المستخدم.<br>
	ابحث أيضًا عن مستخدمين يحاولون الوصول إلى صفحات يفترض أنَّ الزائر سيزورها مرةً أو مرتين فقط وخصوصًا أنَّ الفاصل بين الزيارات معدود بالثواني. لكن أبقِ في ذهنك أنَّ هنالك الكثير من المكونات التي يجب تحميلها لعرض صفحة واحدة، ومن الطبيعي أن تلاحظ أنَّ أحد عناوين IP يحاول الوصول إلى نفس الصفحة مراتٍ عدّة كما في المثال الآتي:
</p>

<pre class="ipsCode prettyprint lang-php prettyprinted" id="ips_uid_3539_7" style="">
<code class="hljs perl"><span class="hljs-number"><span class="lit">12.345</span></span><span class="pun">.</span><span class="hljs-number"><span class="lit">678.910</span></span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">[</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">/</span><span class="typ">May</span><span class="pun">/</span><span class="hljs-number"><span class="lit">2016</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">03</span></span><span class="pln"> </span><span class="pun">-</span><span class="hljs-number"><span class="lit">0700</span></span><span class="pun">]</span><span class="pln"> </span><span class="hljs-string"><span class="str">"GET /wp-admin/network/ HTTP/1.1"</span></span><span class="pln"> </span><span class="hljs-number"><span class="lit">302</span></span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="hljs-string"><span class="str">"-"</span></span><span class="pln"> </span><span class="hljs-string"><span class="str">"Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.94 Safari/537.36"</span></span><span class="pln">
</span><span class="hljs-number"><span class="lit">12.345</span></span><span class="pun">.</span><span class="hljs-number"><span class="lit">678.910</span></span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">[</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">/</span><span class="typ">May</span><span class="pun">/</span><span class="hljs-number"><span class="lit">2016</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">04</span></span><span class="pln"> </span><span class="pun">-</span><span class="hljs-number"><span class="lit">0700</span></span><span class="pun">]</span><span class="pln"> </span><span class="hljs-string"><span class="str">"GET /wp-login.php?redirect_to=http</span><span class="hljs-variable"><span class="str">%3A</span></span><span class="hljs-variable"><span class="str">%2F</span></span><span class="hljs-variable"><span class="str">%2Fyour</span></span><span class="str">-site.com</span><span class="hljs-variable"><span class="str">%2Fwp</span></span><span class="str">-admin</span><span class="hljs-variable"><span class="str">%2Fnetwork</span></span><span class="hljs-variable"><span class="str">%2F</span></span><span class="str">&amp;reauth=1 HTTP/1.1"</span></span><span class="pln"> </span><span class="hljs-number"><span class="lit">200</span></span><span class="pln"> </span><span class="hljs-number"><span class="lit">2564</span></span><span class="pln"> </span><span class="hljs-string"><span class="str">"-"</span></span><span class="pln"> </span><span class="hljs-string"><span class="str">"Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.94 Safari/537.36"</span></span><span class="pln">
</span><span class="hljs-number"><span class="lit">12.345</span></span><span class="pun">.</span><span class="hljs-number"><span class="lit">678.910</span></span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">[</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">/</span><span class="typ">May</span><span class="pun">/</span><span class="hljs-number"><span class="lit">2016</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">06</span></span><span class="pln"> </span><span class="pun">-</span><span class="hljs-number"><span class="lit">0700</span></span><span class="pun">]</span><span class="pln"> </span><span class="hljs-string"><span class="str">"GET /wp-admin/load-styles.php?c=1&amp;dir=ltr&amp;load</span><span class="hljs-variable"><span class="str">%5B</span></span><span class="hljs-variable"><span class="str">%5D</span></span><span class="str">=dashicons,buttons,forms,l10n,login&amp;ver=29ef489256bcba8815b5864843de10bb HTTP/1.1"</span></span><span class="pln"> </span><span class="hljs-number"><span class="lit">200</span></span><span class="pln"> </span><span class="hljs-number"><span class="lit">38435</span></span><span class="pln"> </span><span class="hljs-string"><span class="str">"http://your-site.com/wp-login.php?redirect_to=http</span><span class="hljs-variable"><span class="str">%3A</span></span><span class="hljs-variable"><span class="str">%2F</span></span><span class="hljs-variable"><span class="str">%2Fwpwringer</span></span><span class="str">.com</span><span class="hljs-variable"><span class="str">%2Fwp</span></span><span class="str">-admin</span><span class="hljs-variable"><span class="str">%2Fnetwork</span></span><span class="hljs-variable"><span class="str">%2F</span></span><span class="str">&amp;reauth=1"</span></span><span class="pln"> </span><span class="hljs-string"><span class="str">"Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.94 Safari/537.36"</span></span><span class="pln">
</span><span class="hljs-number"><span class="lit">12.345</span></span><span class="pun">.</span><span class="hljs-number"><span class="lit">678.910</span></span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">[</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">/</span><span class="typ">May</span><span class="pun">/</span><span class="hljs-number"><span class="lit">2016</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">07</span></span><span class="pln"> </span><span class="pun">-</span><span class="hljs-number"><span class="lit">0700</span></span><span class="pun">]</span><span class="pln"> </span><span class="hljs-string"><span class="str">"GET /wp-admin/images/wordpress-logo.svg?ver=20131107 HTTP/1.1"</span></span><span class="pln"> </span><span class="hljs-number"><span class="lit">200</span></span><span class="pln"> </span><span class="hljs-number"><span class="lit">1521</span></span><span class="pln"> </span><span class="hljs-string"><span class="str">"http://your-site.com/wp-admin/load-styles.php?c=1&amp;dir=ltr&amp;load</span><span class="hljs-variable"><span class="str">%5B</span></span><span class="hljs-variable"><span class="str">%5D</span></span><span class="str">=dashicons,buttons,forms,l10n,login&amp;ver=29ef489256bcba8815b5864843de10bb"</span></span><span class="pln"> </span><span class="hljs-string"><span class="str">"Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.94 Safari/537.36"</span></span><span class="pln">
</span><span class="hljs-number"><span class="lit">12.345</span></span><span class="pun">.</span><span class="hljs-number"><span class="lit">678.910</span></span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">[</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">/</span><span class="typ">May</span><span class="pun">/</span><span class="hljs-number"><span class="lit">2016</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="lit">09</span><span class="pln"> </span><span class="pun">-</span><span class="hljs-number"><span class="lit">0700</span></span><span class="pun">]</span><span class="pln"> </span><span class="hljs-string"><span class="str">"GET /favicon.ico HTTP/1.1"</span></span><span class="pln"> </span><span class="hljs-number"><span class="lit">200</span></span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="hljs-string"><span class="str">"http://your-site.com/wp-login.php?redirect_to=http</span><span class="hljs-variable"><span class="str">%3A</span></span><span class="hljs-variable"><span class="str">%2F</span></span><span class="hljs-variable"><span class="str">%2Fwpwringer</span></span><span class="str">.com</span><span class="hljs-variable"><span class="str">%2Fwp</span></span><span class="str">-admin</span><span class="hljs-variable"><span class="str">%2Fnetwork</span></span><span class="hljs-variable"><span class="str">%2F</span></span><span class="str">&amp;reauth=1"</span></span><span class="pln"> </span><span class="hljs-string"><span class="str">"Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.94 Safari/537.36"</span></span><span class="pln">
</span><span class="hljs-number"><span class="lit">12.345</span></span><span class="pun">.</span><span class="hljs-number"><span class="lit">678.910</span></span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">[</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">/</span><span class="typ">May</span><span class="pun">/</span><span class="hljs-number"><span class="lit">2016</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">16</span></span><span class="pln"> </span><span class="pun">-</span><span class="hljs-number"><span class="lit">0700</span></span><span class="pun">]</span><span class="pln"> </span><span class="hljs-string"><span class="str">"GET /wp-includes/js/thickbox/loadingAnimation.gif HTTP/1.1"</span></span><span class="pln"> </span><span class="hljs-number"><span class="lit">200</span></span><span class="pln"> </span><span class="hljs-number"><span class="lit">15238</span></span><span class="pln"> </span><span class="hljs-string"><span class="str">"http://your-site.com/wp-admin/network/"</span></span><span class="pln"> </span><span class="hljs-string"><span class="str">"Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.94 Safari/537.36"</span></span><span class="pln">
</span><span class="hljs-number"><span class="lit">12.345</span></span><span class="pun">.</span><span class="hljs-number"><span class="lit">678.910</span></span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">[</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">/</span><span class="typ">May</span><span class="pun">/</span><span class="hljs-number"><span class="lit">2016</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">16</span></span><span class="pln"> </span><span class="pun">-</span><span class="hljs-number"><span class="lit">0700</span></span><span class="pun">]</span><span class="pln"> </span><span class="hljs-string"><span class="str">"GET /wp-admin/admin-ajax.php?action=dashboard-widgets&amp;widget=dashboard_primary&amp;pagenow=dashboard-network HTTP/1.1"</span></span><span class="pln"> </span><span class="hljs-number"><span class="lit">200</span></span><span class="pln"> </span><span class="hljs-number"><span class="lit">1744</span></span><span class="pln"> </span><span class="hljs-string"><span class="str">"http://your-site.com/wp-admin/network/"</span></span><span class="pln"> </span><span class="hljs-string"><span class="str">"Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.94 Safari/537.36"</span></span><span class="pln">
</span><span class="hljs-number"><span class="lit">12.345</span></span><span class="pun">.</span><span class="hljs-number"><span class="lit">678.910</span></span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">[</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">/</span><span class="typ">May</span><span class="pun">/</span><span class="hljs-number"><span class="lit">2016</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">14</span></span><span class="pln"> </span><span class="pun">-</span><span class="hljs-number"><span class="lit">0700</span></span><span class="pun">]</span><span class="pln"> </span><span class="hljs-string"><span class="str">"GET /wp-admin/load-styles.php?c=1&amp;dir=ltr&amp;load</span><span class="hljs-variable"><span class="str">%5B</span></span><span class="hljs-variable"><span class="str">%5D</span></span><span class="str">=dashicons,admin-bar,wp-pointer,common,forms,admin-menu,dashboard,list-tables,edit,revisions,media,themes,about,nav-menus,widgets&amp;load</span><span class="hljs-variable"><span class="str">%5B</span></span><span class="hljs-variable"><span class="str">%5D</span></span><span class="str">=,site-icon,l10n,buttons,wp-auth-check&amp;ver=29ef489256bcba8815b5864843de10bb HTTP/1.1"</span></span><span class="pln"> </span><span class="hljs-number"><span class="lit">200</span></span><span class="pln"> </span><span class="hljs-number"><span class="lit">90768</span></span><span class="pln"> </span><span class="hljs-string"><span class="str">"http://your-site.com/wp-admin/network/"</span></span><span class="pln"> </span><span class="hljs-string"><span class="str">"Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.94 Safari/537.36"</span></span><span class="pln">
</span><span class="hljs-number"><span class="lit">12.345</span></span><span class="pun">.</span><span class="hljs-number"><span class="lit">678.910</span></span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">[</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">/</span><span class="typ">May</span><span class="pun">/</span><span class="hljs-number"><span class="lit">2016</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pln"> </span><span class="pun">-</span><span class="hljs-number"><span class="lit">0700</span></span><span class="pun">]</span><span class="pln"> </span><span class="hljs-string"><span class="str">"GET /wp-admin/load-scripts.php?c=1&amp;load</span><span class="hljs-variable"><span class="str">%5B</span></span><span class="hljs-variable"><span class="str">%5D</span></span><span class="str">=hoverIntent,common,admin-bar,jquery-ui-widget,jquery-ui-position,wp-pointer,wp-ajax-response,jquery-color,wp-lists,quicktags,jqu&amp;load</span><span class="hljs-variable"><span class="str">%5B</span></span><span class="hljs-variable"><span class="str">%5D</span></span><span class="str">=ery-query,admin-comments,jquery-ui-core,jquery-ui-mouse,jquery-ui-sortable,postbox,dashboard,thickbox,plugin-install,svg-painter&amp;load</span><span class="hljs-variable"><span class="str">%5B</span></span><span class="hljs-variable"><span class="str">%5D</span></span><span class="str">=,heartbeat,wp-auth-check&amp;ver=29ef489256bcba8815b5864843de10bb HTTP/1.1"</span></span><span class="pln"> </span><span class="hljs-number"><span class="lit">200</span></span><span class="pln"> </span><span class="hljs-number"><span class="lit">51768</span></span><span class="pln"> </span><span class="hljs-string"><span class="str">"http://your-site.com/wp-admin/network/"</span></span><span class="pln"> </span><span class="hljs-string"><span class="str">"Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.94 Safari/537.36"</span></span><span class="pln">
</span><span class="hljs-number"><span class="lit">12.345</span></span><span class="pun">.</span><span class="hljs-number"><span class="lit">678.910</span></span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">[</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">/</span><span class="typ">May</span><span class="pun">/</span><span class="hljs-number"><span class="lit">2016</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">30</span></span><span class="pln"> </span><span class="pun">-</span><span class="hljs-number"><span class="lit">0700</span></span><span class="pun">]</span><span class="pln"> </span><span class="hljs-string"><span class="str">"GET /wp-admin/network/plugin-editor.php HTTP/1.1"</span></span><span class="pln"> </span><span class="hljs-number"><span class="lit">200</span></span><span class="pln"> </span><span class="hljs-number"><span class="lit">38208</span></span><span class="pln"> </span><span class="hljs-string"><span class="str">"http://your-site.com/wp-admin/network/"</span></span><span class="pln"> </span><span class="hljs-string"><span class="str">"Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.94 Safari/537.36"</span></span><span class="pln">
</span><span class="hljs-number"><span class="lit">12.345</span></span><span class="pun">.</span><span class="hljs-number"><span class="lit">678.910</span></span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">[</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">/</span><span class="typ">May</span><span class="pun">/</span><span class="hljs-number"><span class="lit">2016</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">32</span></span><span class="pln"> </span><span class="pun">-</span><span class="hljs-number"><span class="lit">0700</span></span><span class="pun">]</span><span class="pln"> </span><span class="hljs-string"><span class="str">"GET /wp-admin/load-scripts.php?c=1&amp;load</span><span class="hljs-variable"><span class="str">%5B</span></span><span class="hljs-variable"><span class="str">%5D</span></span><span class="str">=hoverIntent,common,admin-bar,jquery-ui-widget,jquery-ui-position,wp-pointer,svg-painter,heartbeat,wp-auth-check&amp;ver=29ef489256bcba8815b5864843de10bb HTTP/1.1"</span></span><span class="pln"> </span><span class="hljs-number"><span class="lit">200</span></span><span class="pln"> </span><span class="hljs-number"><span class="lit">17875</span></span><span class="pln"> </span><span class="hljs-string"><span class="str">"http://your-site.com/wp-admin/network/plugin-editor.php"</span></span><span class="pln"> </span><span class="hljs-string"><span class="str">"Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.94 Safari/537.36"</span></span><span class="pln">
</span><span class="hljs-number"><span class="lit">12.345</span></span><span class="pun">.</span><span class="hljs-number"><span class="lit">678.910</span></span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="pun">[</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">/</span><span class="typ">May</span><span class="pun">/</span><span class="hljs-number"><span class="lit">2016</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">15</span></span><span class="pun">:</span><span class="hljs-number"><span class="lit">33</span></span><span class="pln"> </span><span class="pun">-</span><span class="hljs-number"><span class="lit">0700</span></span><span class="pun">]</span><span class="pln"> </span><span class="hljs-string"><span class="str">"GET /favicon.ico HTTP/1.1"</span></span><span class="pln"> </span><span class="hljs-number"><span class="lit">200</span></span><span class="pln"> </span><span class="pun">-</span><span class="pln"> </span><span class="hljs-string"><span class="str">"http://your-site.com/wp-admin/network/plugin-editor.php"</span></span><span class="pln"> </span><span class="hljs-string"><span class="str">"Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.94 Safari/537.36"</span></span></code></pre>

<p>
	أبقِ في بالك أنَّ هذه النوع من الزيارات يحدث يوميًا، وكل سطر في سجل الوصول يشير عادةً إلى جزءٍ من أجزاء الصفحة التي يجري تحميلها، مثل ملفات JavaScript والصور. والفرق بين المخترق الذي يحاول الوصول إلى نفس الصفحة التي يحاول الزائر الاعتيادي الوصول إليها هو أنَّ المخترق قد يحاول استخدام برمجية للوصول إلى نفس الصفحة مرارًا وتكرارًا، لذا ستجد تكرارًا لنفس الأسطر في السجل.<br>
	السجل الموجود أعلاه يُظهِر زائرًا حاول إدخال عنوان الموقع في متصفحه ويتبعه <code>‎/wp-admin/network</code> كما هو ظاهر في أول سطر. ونجحت هذه الطلبية، وثم أعيد توجيه المستخدم تلقائيًا إلى صفحة تسجيل الدخول.<br>
	بعد عدِّة أسطر (التي تمثِّل تحميل مختلف أنواع الوسائط)، سنرى أنَّ المستخدم قد نجح بتسجيل دخوله وأعيد توجيهه إلى لوحة التحكم في السطرين السادس والسابع. ومن ثم انتقل مباشرةً إلى محرر الإضافات (Plugin Editor) في السطر العاشر.<br>
	وصحيحٌ أنَّ هذه نسخة مختصرة مما ستشاهده في سجلك، لكنها تعطيك فكرة عن سلسلة الأحداث التي تشتبه بها. فلن يحاول الكثير من المستخدمين الوصول إلى محرر الملفات في لوحة التحكم بعد تسجيل دخولهم مباشرةً، لكن سيفعل المخترقون ذلك. وفي هذه الحالة، يبدو أنَّ المخترق قد حصل على اسم المستخدم وكلمة المرور بطريقةٍ ما.<br>
	إذا رأيتَ في سجلات الأخطاء أو الوصول أنَّ هنالك محاولاتٌ كثيرةٌ للوصول إلى صفحة التسجيل أو صفحة «نسيت كلمة المرور»، فلقد اكتشفتَ مَن اخترق موقعك وكيف استطاع الدخول إلى موقعك عبر هجوم التخمين (brute force attack).<br>
	قد تستدل على وجود عدد كبير من المحاولات الفاشلة التي تراها قبل نجاح إحداها عبر النظر إلى رمز حالة HTTP؛ فسيشر إلى أخطاءٍ من طرف العميل إذ كان يبدأ بالرقم 400، وهذه بعض دلالات هذه الأرقام:
</p>

<ul>
<li>
		400 Bad Request: هذا يعني أنَّ المستخدم ارتكب خطأً في صياغة الطلبية.
	</li>
	<li>
		401 Unauthorized: يحدث هذا الخطأ عندما يُطلَب من المستخدم الاستيثاق للوصول إلى الصفحة، لكن المعلومات التي أدخلها غير صحيحة.
	</li>
	<li>
		403 Forbidden: هذا الخطأ شبيهٌ بالخطأ 401، فهذا الرقم يشير إلى أنَّ المستخدم غير مرخَّص له برؤية الصفحة التي حاول الوصول إليها، وهذا يعني أنَّ الطلبية صحيحةٌ تقنيًا، لكن الخادوم قرر ألّا يعطي المستخدم وصولًا إلى الصفحة (وهذا هو الاختلاف بينهما).
	</li>
	<li>
		429 Too Many Requests: إذا ثبَّتتَ إضافةً تحصي عدد مرات وصول أحد المستخدمين إلى الصفحة وتضع حدًا أقصى لها، فسيرى المستخدم هذا الخطأ عندما يجري طلبيات أكثر من الحد الأقصى خلال فترة زمنية محددة. وهذا لن يشكِّل مشكلةً للمستخدمين العاديين لكن ربما يشير إلى استخدام أحد المخترقين لبرمجية اختراق.
	</li>
</ul>
<p>
	صحيحٌ أنَّ القائمة السابقة لا تحتوي جميع رموز الأخطاء التي قد تصادفها، لكن يجب أن تعطيك فكرةً عمّا عليك البحث عنه في سجلات الوصول.<br>
	أصعب جزء من عملية البحث في سجلاتك هي أنَّك ستصادف الكثير من الصفحات التي يطلبها الزوار العاديون حتى لو كان موقعك صغيرًا. فلو سجَّل مدير الموقع دخوله إلى لوحة التحكم فسينتج ذلك حوالي 10 أسطر في سجل الوصول قبل أن يضغطوا على أيّ شيءٍ بعد تسجيل دخولهم، لذا يمكنك أن تتخيل الحجم الكبير للسجل الذي عليك تفحصه حتى لو كان زوار موقع قلّة.
</p>

<h3 id="ترشيح-واستبعاد-الزوار-العاديين">
	ترشيح واستبعاد الزوار العاديين
</h3>

<p>
	إذا رشَّحتَ الطلبيات العادية فيمكنك أن تضيّق مجال بحثك كثيرًا، <a href="https://blog.sucuri.net/2015/08/ask-sucuri-how-did-my-wordpress-website-get-hacked-a-tutorial.html" rel="external nofollow">شارك موقع Sucuri Security بعض النصائح حول كيفية تفسير</a> سجلاتك باستخدام الأداة <code>grep</code> بعد الاتصال عبر <abbr title="Secure Shell | القشرة (أو الصَدَفة) الآمنة">SSH</abbr>. افتح عميل <abbr title="Secure Shell | القشرة (أو الصَدَفة) الآمنة">SSH</abbr> المفضَّل لديك مثل Terminal لأجهزة Mac OS X أو <a href="http://www.chiark.greenend.org.uk/~sgtatham/putty/download.html" rel="external nofollow">PuTTY</a> للأجهزة العاملة بنظام ويندوز وأدخل أحد الأوامر المذكورة أدناه والتي تناسب احتياجاتك.<br>
	يمكنك أن تقلل كمية السجلات التي عليك تفحصها إلى أكثر من النصف عبر استبعاد جميع الأسطر التي تتضمن طلبيات لصفحات وملفات معينة مثل ملفات CSS و JavaScript والصور، والزيارات إلى الصفحة الرئيسية وصفحة <code>‎/contact</code> و <code>‎/singup</code>.
</p>

<pre class="ipsCode prettyprint lang-php prettyprinted" id="ips_uid_3539_7" style="">
<code class="hljs 1c"><span class="pln">$ cat access</span><span class="pun">-</span><span class="pln">log </span><span class="hljs-string"><span class="pun">|</span><span class="pln">grep </span><span class="pun">-</span><span class="typ">Ev</span><span class="pln"> </span><span class="str">"</span></span><span class="str">\.(js</span><span class="hljs-string"><span class="str">|css|png|jpg|jpeg) HTTP/1"</span></span><span class="pln"> </span><span class="hljs-string"><span class="pun">|</span><span class="pln">grep </span><span class="pun">-</span><span class="typ">Ev</span><span class="pln"> </span><span class="str">"</span></span><span class="str"> GET (/</span><span class="hljs-string"><span class="str">|/contact|/signup) HTTP/1"</span></span><span class="hljs-string"><span class="pun">|</span><span class="pln"> more</span></span></code></pre>

<p>
	أشرنا إلى الصفحة الرئيسية في المثال السابق بأوّل علامة <code>/</code> في العبارة <code>GET (/|/contact|/signup)</code>، يمكنك أيضًا تغيير <code>contact</code> و <code>singup</code> إلى صفحات أخرى إذا ارتأيتَ أنها تتعلق بموقعك ولن يهتم بها أحد المخترقين.<br>
	إذا وجدتَ أنَّ الأمر السابق لم يُرشِّح أغلبية سجلك، وما يزال عليك تفحص آلاف الطلبيات، فيمكنك تجربة الأمر الآتي للبحث عن الطلبيات التي تحاول الوصول إلى صفحة تسجيل الدخول وإلى لوحة التحكم:
</p>

<pre class="ipsCode prettyprint lang-php prettyprinted" id="ips_uid_3539_7" style="">
<code class="hljs 1c"><span class="pln">$ cat access</span><span class="pun">-</span><span class="pln">log </span><span class="hljs-string"><span class="pun">|</span><span class="pln">grep </span><span class="pun">-</span><span class="pln">E </span><span class="str">"</span></span><span class="str">wp-admin</span><span class="hljs-string"><span class="str">|wp-login|POST /"</span></span><span class="pln"> </span><span class="hljs-string"><span class="pun">|</span><span class="pln"> more</span></span></code></pre>

<p>
	ولمّا كان هذه الصفحات هدفًا للهجمات، فيمن المفيد تفحص هذا النوع من الطلبيات، خصوصًا لو أشار سجل الأخطاء إلى وجود عدد كبير من المحاولات الفاشلة للوصول إلى إحدى الصفحتين السابقتين.<br>
	إذا كنتَ تعرف عناوين IP لجميع مدراء الموقع، فيمكنك أن تستبعد الطلبيات التي يجرونها عبر الأمر الآتي:
</p>

<pre class="ipsCode prettyprint lang-php prettyprinted" id="ips_uid_3539_7" style="">
<code class="hljs 1c"><span class="pln">$ cat access</span><span class="pun">-</span><span class="pln">log </span><span class="hljs-string"><span class="pun">|</span><span class="pln">grep </span><span class="pun">-</span><span class="pln">E </span><span class="str">"</span></span><span class="str">wp-admin</span><span class="hljs-string"><span class="str">|wp-login|POST /"</span></span><span class="pln"> </span><span class="hljs-string"><span class="pun">|</span><span class="pln">grep </span><span class="pun">-</span><span class="pln">v </span><span class="str">"</span></span><span class="str">^</span><span class="hljs-number"><span class="str">1.2</span></span><span class="str">.</span><span class="hljs-number"><span class="str">3.4</span></span><span class="hljs-string"><span class="str">|1.2.3.5"</span></span><span class="pln"> </span><span class="hljs-string"><span class="pun">|</span><span class="pln"> more</span></span></code></pre>

<p>
	لاحظ أنَّ عليك أن تضع عناوين IP الحقيقية للمدراء بدلًا من <code>1.2.3.4</code> و <code>1.2.3.5</code> في الأمر السابق.<br>
	يجب أن تساعدك الأوامر السابقة بتضييق مجال بحثك في السجلات لتجعل الطلبيات التي يجريها المخترقون واضحةً لك، لكن لا تظن أنَّ هذه الطريقة بالدقة التي كنتَ تتوقعها، فلا تُغفِل أنَّ لديك وقت قليل جدًا لتفحص السجلات في أغلبية الحالات، وقد لا تخرج بأيّة نتائج من هذه العملية، حتى لو استعنتَ بالأداة <code>grep</code>، فمعرفة كيف استطاع المخترق الوصول إلى موقعك كالبحث عن أبرة في كومة قش.<br>
	هذا هو السبب وراء أتمتة هذه العملية، فهي أكثر دقةً وكفاءة مقارنةً بالبحث اليدوي في السجلات.
</p>

<h2 id="أتمتة-عملية-استكشاف-الأخطاء">
	أتمتة عملية استكشاف الأخطاء
</h2>

<p>
	هنالك الكثير من الإضافات التي يمكن أن تراقب موقعك وتُخطِرُكَ إن حاول أحد المخترقين اختراق موقعك، حتى لو كنتَ نائمًا :-) . هذه الإضافات مثل <a href="https://www.wordfence.com/" rel="external nofollow">Wordfence</a> و <a href="https://sucuri.net/" rel="external nofollow">Sucuri Security</a> تملك خيارات رائعة لتأمين موقعك، وتوفر قائمةً مذهلةً من الخيارات لحجب المخترقين، الأمر الذي قد يصعب على بعض المستخدمين فعله.<br>
	يمكنك –بشكلٍ بديل– استخدام <a href="https://premium.wpmudev.org/project/wp-defender/" rel="external nofollow">Defender</a> الذي يحجب المخترقين، ويسمح لك بتقوية أمن موقعك ببضع نقرات، ويحاول إصلاح الأجزاء التي قد تكون عرضةً للاختراق، ولا تُغفِل سهولةَ استخدامه وتبسيطه للمعلومات الأمنية.<br>
	إضافة Defender موجودة أيضًا إذا كنتَ مشتركًا في WPMU DEV لكن يمكنك <a href="https://premium.wpmudev.org/" rel="external nofollow">تجربته مجانًا</a>؛ سأذكر في الأقسام الآتية كيف تعرف إذا تعرضَت للاختراق، وكيف «تنظِّف» موقعك بعد تعرضه لهجوم وكيف تؤمنه منعًا لحدوث مثل هكذا هجمات مستقبلًا، وبهذا ستمنع المخترقين مستقبلًا من مهاجمة موقعك. يمكنك فعل كل ذلك بإصلاح المشاكل الأمنية وتقوية حماية موقعك عبر ضبط إضافة Defender.
</p>

<h3 id="البدء-باستخدام-إضافة-defender">
	البدء باستخدام إضافة Defender
</h3>

<p>
	قبل أن تنظِّف موقعك وتحميه، عليك <a href="https://premium.wpmudev.org/project/wp-defender/" rel="external nofollow">تنزيل إضافة Defender</a> ثم تثبيتها وتفعيلها على موقعك. إضافة Defender متوافقة مع موقع ووردبريس مستقل، أو مع شبكة متعددة المواقع، أو مع شبكة BuddyPress؛ حيث تُفعَّل إضافة Defender على عموم الشبكة لذا ستتمكن من إدارة حماية جميع موقعك من لوحة تحكم إدارة الشبكة.<br>
	ولمّا كنت تنوي إجراء تغييرات كبيرة في موقعك، فمن المهم أخذ نسخة احتياطية كاملة لموقعك قبل إجراء أيّة تعديلات، راجع درس <a href="https://academy.hsoub.com/apps/web/wordpress/%D8%A7%D9%84%D8%AD%D9%85%D8%A7%D9%8A%D8%A9-%D9%88%D8%A5%D8%B6%D8%A7%D9%81%D8%A7%D8%AA-%D8%A7%D9%84%D9%86%D8%B3%D8%AE-%D8%A7%D9%84%D8%A7%D8%AD%D8%AA%D9%8A%D8%A7%D8%B7%D9%8A-%D9%81%D9%8A-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-r7/" rel="">الحماية وإضافات النسخ الاحتياطي في ووردبريس</a>
</p>

<h3 id="تفحص-موقعك">
	تَفحُّص موقعك
</h3>

<p>
	بعد أن تنتهي من تنزيل الإضافة وتفعيلها، فيمكنك تفحص موقعك بحثًا عن ثغرات مباشرةً. إذا كنتَ تريد التحقق من الإعدادات فاذهب إلى Defender &gt; Settings؛ وإلا، فاذهب مباشرةً إلى Defender &gt; Scan ثم اضغط على زر Scan My Website.
</p>

<p style="text-align: center;">
	<img alt="4-defender-progress-scan.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23874" data-unique="l4de33kly" src="https://academy.hsoub.com/uploads/monthly_2017_07/4-defender-progress-scan.png.93b1dbd99334f5379b5b6d8fead04b35.png"></p>

<p>
	قد يأخذ التفحص بضع دقائق في المواقع أو الشبكات الكبيرة، لكن يمكنك أن تنتقل إلى صفحةٍ أخرى في موقعك أو حتى تستطيع أن تغلق متصفحك. وبعد انتهاء عملية التفحص يمكنك العودة ورؤية النتائج.<br>
	إذا عُثِرَ على ثغرات أو ملفات خبيثة، فستُعرَض قائمةٌ بها، فيمكنك أن تضغط على أيقونة «المفك» بجانب العنصر الموجود في القائمة لعرض المزيد من التفاصيل عن المشكلة ويمكنك حينئذٍ أن تحذف الملف أو تتجاهل هذه الثغرة إذا لم تكن مشكلةً أمنيةً، ويمكنك أيضًا مقارنة الملف مع نسخة حديثة من ووردبريس أو يمكنك استعادة الملف المكتشف من نسخة حديثة من ووردبريس.<br>
	يمكنك أن تضغط على زر التجاهل لتجاهل الملف مباشرةً، يمكنك استعادة هذه النتيجة في أي وقت لحلها لاحقًا. هنالك أيضًا أيقونة لحذف الملف مباشرةً.
</p>

<p style="text-align: center;">
	<a class="ipsAttachLink ipsAttachLink_image" data-fileid="23875" href="https://academy.hsoub.com/uploads/monthly_2017_07/5-defender-results.png.5e47c67c36404c7fedbe82daa91f52de.png" rel=""><img alt="5-defender-results.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23875" data-unique="8za314930" src="https://academy.hsoub.com/uploads/monthly_2017_07/5-defender-results.thumb.png.9efcb39c9b3aea77a781c889ad3bd9a0.png"></a>
</p>

<p>
	ستُضمَّن في الإصدارات القادمة ميزة التسجيل الحي تلقائيًا وعلى مدار الساعة، لكن لمّا كانت إضافة Defender تكتشف التغيرات التي أُجريَت على ملفاتك، فيمكنك –نظريًا– أن تعرف كيف وصل المخترق إلى موقعك دون الحاجة إلى النظر في السجلات، فلطالما أبقيتَ على إضافة Defender مثبتةً فلا يصيبنّك القلق حول أمن موقعك، لأن المخترقين سيوقَفون قبل أن تَسنَح لهم فرصة الدخول غير المصرَّح به إلى موقعك.<br>
	يمكنك أيضًا أن تتأكد أن المخترقين لن يتلفوا على أمن موقعك وذلك بتقوية الحماية، ويمكنك فعل ذلك ببضع نقرات وذلك في صفحة Defender &gt; Hardener.<br>
	الثغرات التي لم تُحَل بعد ستعلَّم باللون الأصفر، ويمكنك الضغط على زر + لعرض تفاصيل حول الثغرة. ويمكنك –بنقرة واحدة– أن تحل المشكلة أو أن تتجاهلها؛ ويمكنك العودة إلى المشاكل التي تجاهلتها لاحقًا.
</p>

<p style="text-align: center;">
	<a class="ipsAttachLink ipsAttachLink_image" data-fileid="23876" href="https://academy.hsoub.com/uploads/monthly_2017_07/6-defender-action-needed.png.2c42e81033fb34cb6341e3d510e8e62a.png" rel=""><img alt="6-defender-action-needed.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23876" data-unique="02dzywrby" src="https://academy.hsoub.com/uploads/monthly_2017_07/6-defender-action-needed.thumb.png.71d183c6d794fbb504beaa00af29b720.png"></a>
</p>

<p>
	يمكنك –إضافةً إلى تعطيل محرر الملفات وتحديث المفاتيح الأمنية– أن تُغيّر بادئة جداول قاعدة البيانات، وأن تُغيّر اسم المستخدم للحساب الافتراضي <code>admin</code>، وأن تخفي التبليغ عن الأخطاء في الواجهة الأمامية، وأن تمنع تنفيذ شيفرات PHP غير المصرَّح بها، والكثير غير ذلك.<br>
	يمكنك أيضًا أتمتة إجراء التفحص بالذهاب إلى صفحة Defender &gt; Automated Scans كي تنام قرير العين عالمًا أنَّ موقعك مؤمن حتى لو كنتَ مشغولًا عنه. يمكنك أن تضبط اليوم والوقت الذي سيُجرى فيه الفحص، ويمكنك أن تحدِّد إذا كنتَ تريد فعل ذلك يوميًا أو أسبوعيًا أو شهريًا.
</p>

<h2 id="الخلاصة">
	الخلاصة
</h2>

<p>
	بعد أن تعرف كيف اُخترِق موقعك عبر تفحص سجلات الوصول يدويًا أو عبر إضافة Defender تلقائيًا، فيمكنك أن ترقِّع الثغرة الأمنية التي استعملها المخترق للوصول إلى موقعك، بدلًا من أن تحس أنَّك لا تعرف ما الذي حدث وتحاول تخمين ذلك.<br>
	لكن بعد أن تنظِّف موقعك وتؤمنه، فلا تحسبنَّ أنَّ المعركة قد انتهت، فمن المهم أن تثبِّت إحدى الإضافات الأمنية مثل Defender لحماية موقعك على مدار الساعة. تثبيت إضافة Defender يعني أنَّ محاولات الاختراق المستقبلية ستُصدَّ قبل أن تصبح مشكلةً تعطِّل موقعك وتأخذ من وقتك. يمكن لإضافة Defender أن تساعدك في تحديث موقع ووردبريس مع قوالبك وإضافاتك لتحصل على آخر التحديثات الأمنية.<br>
	ترجمة –وبتصرّف– للمقال <a href="https://premium.wpmudev.org/blog/troubleshoot-hacked-wordpress-site/" rel="external nofollow">Help, I’ve Been Hacked! How to Troubleshoot and Fix a WordPress Site</a>لصاحبته Jenni McKinnon
</p>

<p>
	حقوق الصورة البارزة محفوظة لـ <a href="https://www.vecteezy.com/vector-art/138072-hacking-identity-theft-system-vector" rel="external nofollow">Vecteezy</a>
</p>
]]></description><guid isPermaLink="false">275</guid><pubDate>Mon, 03 Jul 2017 05:39:01 +0000</pubDate></item><item><title>&#x643;&#x64A;&#x641;&#x64A;&#x629; &#x625;&#x62C;&#x631;&#x627;&#x621; &#x639;&#x645;&#x644;&#x64A;&#x629; &#x625;&#x639;&#x627;&#x62F;&#x629; &#x62A;&#x648;&#x62C;&#x64A;&#x647; &#x641;&#x64A; &#x648;&#x648;&#x631;&#x62F;&#x628;&#x631;&#x64A;&#x633; &#x2013; &#x627;&#x644;&#x623;&#x62F;&#x648;&#x627;&#x62A; &#x648;&#x627;&#x644;&#x62A;&#x642;&#x646;&#x64A;&#x627;&#x62A;</title><link>https://academy.hsoub.com/apps/web/wordpress/%D9%83%D9%8A%D9%81%D9%8A%D8%A9-%D8%A5%D8%AC%D8%B1%D8%A7%D8%A1-%D8%B9%D9%85%D9%84%D9%8A%D8%A9-%D8%A5%D8%B9%D8%A7%D8%AF%D8%A9-%D8%AA%D9%88%D8%AC%D9%8A%D9%87-%D9%81%D9%8A-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-%E2%80%93-%D8%A7%D9%84%D8%A3%D8%AF%D9%88%D8%A7%D8%AA-%D9%88%D8%A7%D9%84%D8%AA%D9%82%D9%86%D9%8A%D8%A7%D8%AA-r274/</link><description><![CDATA[
<p><img src="https://academy.hsoub.com/uploads/monthly_2017_06/main2.png.06b2eb55de0312cba40cbc098286682c.png" /></p>

<p id="كيفية-إجراء-عملية-إعادة-توجيه-في-ووردبريس-الأدوات-والتقنيات">
	تحدثنا في <a href="https://academy.hsoub.com/apps/web/wordpress/%D9%83%D9%8A%D9%81%D9%8A%D8%A9-%D8%A5%D8%AC%D8%B1%D8%A7%D8%A1-%D8%B9%D9%85%D9%84%D9%8A%D8%A9-%D8%A5%D8%B9%D8%A7%D8%AF%D8%A9-%D8%AA%D9%88%D8%AC%D9%8A%D9%87-%D9%81%D9%8A-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-%E2%80%93-%D8%AA%D9%85%D9%87%D9%8A%D8%AF-r272/" rel="">الجزء السابق</a> عن أهمية إعادة توجيه العناوين القديمة للصفحات إلى عناوينها الجديدة، وسنكمل شرح كيفية فعل ذلك في ووردبريس في هذا الدرس.
</p>

<h2>
	أولًا: نقل موقع ووردبريس قديم إلى مضيفٍ جديد
</h2>

<p>
	هذه الحالة غير معقدة أبدًا، فلو كنتَ تنقل موقع ووردبريس إلى مضيفٍ جديد دون تغيير بنية الروابط الدائمة لصفحات الموقع، فلا توجد اختلافات في الروابط الدائمة مما لا يستدعي استخدام إعادة توجيه عبر الرمز 301.<br>
	وهذا بسبب امتلاك الموقع لنفس الصفحات التي كانت فيه بنفس روابطها الدائمة، وذلك من وجه نظر Google، فلو كان يتوقع وجود إحدى الصفحات في الرابط example.com/great-optimized-page فسيجد نفس الصفحة بنفس المحتوى بعد نقل الموقع إلى المضيف الجديد، وكل ما اختلف هو أنَّ الخادوم الذي كان مسؤولًا عن إيصال الصفحة إلى العميل قد تغيّر.<br>
	لن تحتاج إلى إجراء الكثير من العمليات للحفاظ على تقييم SEO عندما تنقل موقع ووردبريس من مضيفٍ لآخر مع الإبقاء على بنية الروابط الدائمة نفسها في أغلبية الحالات، لكن ما يزال عليك أن تنتبه إلى أمرين مهمين ألا وهما: سرعة الموقع والانتقال إلى خادومٍ يستعمل تشفير <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr>.
</p>

<h3 id="التأكد-من-أداء-وسرعة-الموقع">
	التأكد من أداء وسرعة الموقع
</h3>

<p>
	أوّل عنصر يمكن أن يؤثر في تقييم SEO عند نقل موقع ووردبريس من مضيفٍ إلى آخر هو سرعة الموقع، إذ يُكافِئ Google المواقع السريعة، لذا احرص على نقل عملائك إلى بيئةٍ أسرع وليس إلى بيئةٍ أبطأ، وابذل جهدك لكي تتفادى حدوث أيّة مشاكل في الأداء والتي قد تحدث عند الانتقال إلى مضيفٍ آخر. أداة <a href="https://developers.google.com/speed/pagespeed/insights/" rel="external nofollow">PageSpeed Insights</a> من Google هي أداةٌ رائعةً لاستكشاف المشاكل المتعلقة بالأداء وتحسين سرعة الموقع.<br>
	أنصحك أيضًا بالتواصل مع فريق الدعم الفني لشركة الاستضافة وتتأكد من ضَبطِ كلَّ شيءٍ ضبطًا صحيحًا، فاطلب منهم مثلًا التحقق أنَّ التخزين المؤقت لصفحات الموقع يعمل عملًا سليمًا. فلو انتقلتَ مثلًا إلى شركة الاستضافة SiteGround، فعليك أن تُفعِّل ميزات التخزين المؤقت يدويًا، وربما ترغب بتعطيل بعض إضافات التخزين المؤقت مثل W3 Total Cache، لكي لا تتكرر النسخ المؤقتة في الخادوم. قد تستصعب فعل ما سبق ذكره، لذا حاول التواصل مع فريق الدعم التقني لشركة الاستضافة ليساعدك في الأمر.<br>
	الجوانب التقنية الأخرى الخاصة بضبط الخادوم، مثل استخدام آخر إصدار من PHP وتفعيل شيءٍ يسمى php-fpm (والذي لا أتظاهر بفهم الغاية منه)، يمكن أن تؤثر في أداء موقعك تأثيرًا كبيرًا، لذا إذا أشارت أداة PageSpeed Insights إلى أداءٍ ضعيفٍ أو متوسط (خصوصًا إذا كان وقت استجابة الخادوم كبيرًا) فلا تخجل من الحديث عن هذه المشكلة مع فريق الدعم التقني لمحاولة حلّها.
</p>

<h3 id="الانتقال-إلى-ssl">
	الانتقال إلى <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr>
</h3>

<p>
	ثاني أمر عليك أخذه بالحسبان عند نقل موقع ووردبريس بين خادومين هو أمرٌ تقنيٌ بحت، ويتمحور حول شهادات <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr>، فلو كنتَ تنتقل من موقع لا يستعمل شهادات <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> (أي أنَّ روابط URL تشبه <a href="http://example.com" rel="external nofollow">http://example.com</a>) إلى بيئة تستعمل فيها شهادات <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> (الروابط تشبه <a href="https://example.com" rel="external nofollow">https://example.com</a>)، فيجب أن تتنبَّه إلى ذلك؛ لأنَّ محرِّك البحث والزوار سيبحثون عن الصفحات في <a href="http://example.com" rel="external nofollow">http://example.com</a> وإذا لم تمنعهم من ذلك، فسينتهي بهم المطاف بالدخول إلى النسخة القديمة غير الآمنة من الموقع، وهذا يعني:<br>
	1. سيُدخِل المستخدمون بياناتهم الشخصية مثل معلومات بطاقاتهم الائتمانية في النسخة غير الآمنة من الموقع، وهذا أمرٌ خطيرٌ جدًا من الناحية الأمنية.<br>
	2. ستكون معلومات تحليل موقعك غريبةً جدًا، لأنك سترى إحصائيات عن زيارات النسخة الآمنة أو غير الأمنة كلًا على حدة.<br>
	3. سيرى محرِّك Google نسختين من الصفحات، إحداها موجودةٌ في <a href="http://example.com" rel="external nofollow">http://example.com</a> والأخرى مماثلةٌ تمامًا لها موجودةٌ في <a href="https://example.com" rel="external nofollow">https://example.com</a>، مما يجعله يظن أنَّك تملك موقعين منفصلين فيهما نفس المحتوى، مما يعرِّضك للعقوبة بسبب <a href="https://yoast.com/duplicate-content/#www" rel="external nofollow">تكرارك للمحتوى نفسه</a>.<br>
	دون الدخول بتفاصيل تقنية بحتة عن هذه المشكلة، دعني أخبرك ماذا عليك أن تفعل: ثبِّت إضافة <a href="https://wordpress.org/plugins/wp-force-ssl/" rel="external nofollow">WP Force <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr></a> وهي إضافةٌ بسيطةٌ ورائعةٌ والتي تُعيد توجيه جميع الزيارات التي تقصد الصفحات التي تبدأ بالسابقة ‎http://‎ إلى نسخة https://‎ منها. عليك <a href="https://wordpress.org/plugins/wp-force-ssl/" rel="external nofollow">اتباع التعليمات</a> الخاصة بالإضافة والمتعلقة بضبط ووردبريس ثم عليك تفعيلها.<br>
	هنالك عملٌ كثيرٌ علينا فعله لجعل شهادات <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> المثبتة حديثًا تعمل عملًا سليمًا، لكن بعد تثبيت إضافة WP Force <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> فستتأكد من عدم وجود نسختين من موقعك مما لا يضر بتقييم SEO. أبقِ في ذهنك أنَّ Google سيُكافئ المواقع التي تستعمل تشفير <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr>، لذا اعلم أنَّ انتقالك إلى استخدام شهادة <abbr title="Secure Socket Layer | طبقة المنافذ الآمنة">SSL</abbr> سيفيدك على المدى الطويل.
</p>

<h2 id="ثانيا-نقل-موقع-عادي-إلى-موقع-ووردبريس">
	ثانيًا: نقل موقع عادي إلى موقع ووردبريس
</h2>

<p>
	إذا كنتَ تنقل موقعًا من تقنيةٍ مختلفةٍ إلى ووردبريس، فعليك حكمًا أن تفهم كيفية استعمال إعادة التوجيه من النوع 301، وكيف ستساعدك إعادة التوجيه في ووردبريس في الحفاظ على تقييم SEO للصفحات القديمة.<br>
	السبب وراء استخدام إعادة التوجيه هو اختلاف التقنيات واختلاف بُنى الروابط الدائمة.
</p>

<h3 id="التقنيات-المختلفة-تستعمل-بنى-مختلفة-للروابط-الدائمة">
	التقنيات المختلفة تستعمل بُنى مختلفة للروابط الدائمة
</h3>

<p>
	انظر إلى الصفحات الأربع الآتية:<br>
	1. example.com/great-optimized-page.html<br>
	2. example.com/great-optimized-page.asp<br>
	3. example.com/great-optimized-page.php<br>
	4. example.com/index.php?page=great-optimized-page<br>
	لا يعلم Google أرتباط أيِّ صفحةٍ من الصفحات السابقة بأخرى، فلها أربعة روابط URL مختلفة تمامًا، ولا يملك Google أيّة فكرة أنَّها تُشير جميعها إلى المحتوى نفسه.<br>
	إذا كتبتَ موقعك من الصفر باستخدام PHP فستبدو الروابط الدائمة لصفحاتك كالآتية: example.com/great-optimized-page.php. أما إذا استعملتَ صفحات HTML الثابتة، فستبدو الروابط الدائمة كما يلي: example.com/great-optimized-page.html. أما إذا كنّا سننتقل من دروبال إلى ووردبريس فقد تكون بنية الروابط الدائمة مختلفةً اختلافًا جذريًا.<br>
	تتضمن خطتك نقل أحد أنواع المواقع السابقة إلى ووردبريس؛ والتي تُتيح استعمال عدِّة أشكال من الروابط الدائمة، وأشهرها يبدو كالآتي: example.com/great-optimized-page.<br>
	إذًا عند نقلك لموقعك إلى ووردبريس، فسيصبح لكل صفحة في الموقع رابطٌ دائمٌ جديدٌ بسبب اختلاف التقنيات المستعملة، وهذا ينطبق على الغالبية العظمى من التقنيات التي تحاول نقلها إلى ووردبريس.
</p>

<h3 id="كيف-نخبر-google-عن-التغييرات-في-الروابط-الدائمة">
	كيف نخبر Google عن التغييرات في الروابط الدائمة
</h3>

<p>
	وكما شرحنا أعلاه، لا يعلم Google عن تغيير الروابط الدائمة شيئًا إلا إذا أخبرتَه بذلك، وعليك فعل ذلك للحفاظ على تقييم SEO لعملائك، لذا حان الوقت الآن لتعلّم كيفية إعادة توجيه الصفحات في ووردبريس.<br>
	الطريقة التقنية لفعل ذلك هي عبر تعديل ملف <code>‎.htaccess</code>، والذي يستعمله خادوم أباتشي (Apache) ليقرأ التعليمات منه، لكن كتابة قواعد ملف <code>‎.htaccess</code> هي مهمةٌ صعبة ومن السهل تعطيل الموقع في حال ارتكاب خطأ صغير فيه؛ لكن هنالك حلٌّ آخر يوفِّر بديلًا رائعًا أقل تعقيدًا من التعديل اليدوي هو استخدام إضافة مجانية خاصة بوردبريس باسم <a href="https://wordpress.org/plugins/simple-301-redirects/" rel="external nofollow">Simple 301 Redirects</a>.<br>
	إضافة Simple 301 Redirects تسمح لنا بتمرير الزيارات إلى مكانٍ آخر ضمن النطاق نفسه، أو إلى نطاقٍ آخر مختلفٍ تمامًا، كما لو أنَّك تكتب قواعد ملف <code>‎.htaccess</code> يدويًا. يمكنك أيضًا استخدام المحارف البديلة (wildcard) لتحديد جميع الصفحات، فلنقل مثلًا أنك تريد إعادة توجيه جميع الصفحات الموجودة في domain.com/<em>‎ إلى مكانها الجديد في domain.com/app/</em>‎.<br>
	هذه صورةٌ لصفحة إعدادات إضافة Simple 301 Redirects التي تُظهِر جميع عمليات إعادة التوجيه في أحد المواقع:
</p>

<p style="text-align: center;">
	<br><a class="ipsAttachLink ipsAttachLink_image" data-fileid="23855" href="https://academy.hsoub.com/uploads/monthly_2017_06/01_simple_301_redirects_rules.png.0ebb0997b45cabaec8c1a2fec3751781.png" rel=""><img alt="01_simple_301_redirects_rules.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23855" data-unique="ankfgceop" src="https://academy.hsoub.com/uploads/monthly_2017_06/01_simple_301_redirects_rules.thumb.png.372202a4610118871c6fb4943609ff7f.png"></a>
</p>

<p>
	<br>
	‎كما ترى، الروابط الموجودة في العمود على يسار الصورة يُعاد توجيهها إلى مختلف أشكال الروابط. يجدر بالذكر أنَّ هنالك ملحق مجاني باسم <a href="https://wordpress.org/plugins/simple-301-redirects-addon-bulk-uploader/" rel="external nofollow">Bulk Uploader</a> يتبع لإضافة Simple 301 Redirects، والذي يساعدك في معالجة عشرات ومئات عمليات إعادة التوجيه عبر رفع ملف بتنسيق CSV.
</p>

<h3 id="كيف-تعثر-على-الصفحات-التي-عليك-إعادة-توجيهها">
	كيف تعثر على الصفحات التي عليك إعادة توجيهها
</h3>

<p>
	أفضل طريقة لمعرفة ما هي روابط URL التي تريد إعادة توجيهها هي إنشاء سجل بها قبل نقلك الموقع إلى ووردبريس، إذ يمكنك إنشاء ورقة عمل Excel أو Calc تحتوي جميع الروابط الدائمة الموجودة في الموقع الأصلي وأين يجب أن تُشير بعد الانتقال إلى موقع ووردبريس. يجب أن تبدو السجلات كالآتية: ‎/great-optimized-page.asp &gt; /great-optimized-page وذلك لكل صفحة موجودة في موقعك.<br>
	لكن في حال نقلتَ موقعك إلى ووردبريس ولنفترض أنّك فقدتَ سجل الصفحات التي كانت موجودةً في موقعك القديم، فتكون أفضل طريقة حينئذٍ هي رؤية ما الذي يعرفه Google عن موقعك عبر تصفح صفحة النتائج الخاصة بموقعك.<br>
	إذا كتبتَ عبارة بحث شبيهة بالعبارة الآتية site:exmaple.com في مربع البحث في Google، فستلاحظ وجود عدد كبير من روابط URL التي تُشير إلى صفحاتٍ في موقعك القديم (مثل صفحة ‎/great-optimized-page.asp)، وذلك لأنَّ Google ما يزال يعرض تلك النتائج ويُوجِّه الزوار إليها، حتى لو لم تعد موجودةً.<br>
	يجدر بك إعادة توجيه جميع النتائج التي تعثر عليها باستخدام إضافة Simple 301 Redirects، أو أيِّ إضافةٍ أخرى تُجري عملية إعادة التوجيه، أو يمكنك كتابة قواعد ملف <code>‎.htaccess</code> يدويًا. يمكنك اختبار نجاح عملية إعادة التوجيه بضغطك على أحد الروابط، فإن وجدتَ أنها تُشير إلى الصفحة المعنية في ووردبريس فذلك أمرٌ حسن، أو انتهى بك المطاف في صفحة «404» فعليك تحري ما هي المشكلة التي تمنع إعادة التوجيه إلى الصفحات الجديدة.
</p>

<h2 id="ثالثا-تغيير-بنية-الروابط-الدائمة-في-موقع-ووردبريس-موجود-مسبقا">
	ثالثًا: تغيير بنية الروابط الدائمة في موقع ووردبريس موجود مسبقًا
</h2>

<p>
	عندما تُغيّر بنية الروابط الدائمة في ووردبريس بالدخول إلى «Settings &gt; Paramalinks» (الإعدادات &gt; الروابط الدائمة)، فأنت تزيد من احتمال ظهور رسائل 404 للزوار. تحاول ووردبريس إعادة توجيه بعض أنواع التعديلات على الروابط الدائمة تلقائيًا، لكن لا تفعل ذلك لجميع أنواع التعديلات، ولسوء الحظ لا تكون القواعد التي تتبعها ووردبريس لإعادة التوجيه متناسقةً ولا يسهل فهمها، لذا لا تعتمد على ووردبريس لفعل ذلك، فعندما تُغيّر بنية الروابط الدائمة (حتى لو فعلتَ ذلك لرابطٍ دائمٍ لصفحةٍ واحدةٍ فقط) فعليك تجربة الموقع يدويًا باحثًا عن صفحات 404، وتجرِّب الروابط الدائمة القديمة، ثم تصلح أيّة صفحات 404 تعثر عليها باستخدام Simple 301 Redirects أو غيرها من الأدوات.
</p>

<h2 id="الخلاصة">
	الخلاصة
</h2>

<p>
	ليس بالضرورة أن تكون عمليات إعادة التوجيه معقدةً، لكن من المهم جدًا أن نستعمل إعادة التوجيه عند الحاجة لما لها من أثرٍ كبيرٍ في الحفاظ على تقييم الصفحات في محرِّكات البحث.
</p>

<p>
	<br>
	ترجمة –وبتصرّف– للمقال <a href="https://wpshout.com/understanding-301-redirects-wordpress-not-ruin-clients-seo/" rel="external nofollow">Understanding 301 Redirects in WordPress</a> لصاحبه Fred Meyer
</p>
]]></description><guid isPermaLink="false">274</guid><pubDate>Thu, 29 Jun 2017 09:03:14 +0000</pubDate></item><item><title>&#x643;&#x64A;&#x641;&#x64A;&#x629; &#x625;&#x62C;&#x631;&#x627;&#x621; &#x639;&#x645;&#x644;&#x64A;&#x629; &#x625;&#x639;&#x627;&#x62F;&#x629; &#x62A;&#x648;&#x62C;&#x64A;&#x647; &#x641;&#x64A; &#x648;&#x648;&#x631;&#x62F;&#x628;&#x631;&#x64A;&#x633; &#x2013; &#x62A;&#x645;&#x647;&#x64A;&#x62F;</title><link>https://academy.hsoub.com/apps/web/wordpress/%D9%83%D9%8A%D9%81%D9%8A%D8%A9-%D8%A5%D8%AC%D8%B1%D8%A7%D8%A1-%D8%B9%D9%85%D9%84%D9%8A%D8%A9-%D8%A5%D8%B9%D8%A7%D8%AF%D8%A9-%D8%AA%D9%88%D8%AC%D9%8A%D9%87-%D9%81%D9%8A-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-%E2%80%93-%D8%AA%D9%85%D9%87%D9%8A%D8%AF-r272/</link><description><![CDATA[
<p><img src="https://academy.hsoub.com/uploads/monthly_2017_06/main4.png.d15dcec1cf313655fb0ace2bdac31fca.png" /></p>

<p>
	وجدتُ العمل كمطوّر على <a href="https://academy.hsoub.com/programming/php/wordpress/" rel="">ووردبريس</a> قليل المتاعب، فإنتاج مواقع وِب جميلة هو خدمةٌ رائعةٌ نقدمها للآخرين وأمرٌ لا يؤدي إلى كارثة إذا لم تتقنه تمامًا بادئ الأمر؛ حيث لا يُشابه العمل طيارا حربيا أو في حرس الحدود!
</p>

<p style="text-align: center;">
	 
</p>

<p>
	لكن مع ذلك، هنالك استثناءات: ففي بعض الأحيان سبَّب لي عملي مشاكل وكان شعوري بالذنب وتأنيب الضمير سيؤدي بي إلى ترك عملي. ولاحظتُ أنَّ أسباب ذلك هي نفسها، ولقد وضعتها في رسمٍ توضيحي، لذا سأترك المخطط ليتحدث عنها:
</p>

<p style="text-align: center;">
	<a class="ipsAttachLink ipsAttachLink_image" data-fileid="23727" href="https://academy.hsoub.com/uploads/monthly_2017_06/01-why_quit_wordpress_development.png.59cf6c895a8b8fc6a63f18106a4c5336.png" rel=""><img alt="01-why_quit_wordpress_development.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23727" data-unique="jq2al748f" src="https://academy.hsoub.com/uploads/monthly_2017_06/01-why_quit_wordpress_development.thumb.png.cef21bc713fbdeb280eb24d6f4478ac9.png"></a>
</p>

<p>
	رغبتُ بترك عملي مرات عدّة عندما أثرّتُ على تقييم موقع العميل في محركات البحث؛ فأخطاء <a href="https://academy.hsoub.com/marketing/search-engine-optimisation/" rel="">SEO</a> لها وقعٌ كبيرٌ نظرا لأسباب كثيرة منها:
</p>

<ol>
<li>
		يمكنها أن تكلِّف عميلك قدرا كبيرا من المال، فلو كان موقع عميلك هو مصدر دخله الرئيسي، فأخطاء SEO ستؤثر على دخله الشهري، أو تدمره (وبالتالي نمط حياته).
	</li>
	<li>
		يسهل كثيرًا الوقوع بهذه الأخطاء، خصوصًا لو كنتَ على درايةً بتطوير مواقع ووردبريس، لكن معلوماتك عن بنية الإنترنت ومحركات البحث محدودة.
	</li>
	<li>
		إذا ارتكبتَ خطأً كبيرًا، فمن شبه المستحيل إصلاحه! فعلى عميلك أن ينفق أشهرًا من وقته في إعادة بناء موقعه بمساعدة خبير SEO بعد خسارته لتقييمه العالي، ولا يوجد شيءٌ يمكنك أن تفعله للمساعدة.
	</li>
</ol>
<p>
	سنناقش في هذا الدرس إحدى الأمور التي أرى المطورين غير المتمرسين يفعلونها بعملائهم، ألا وهي عدم استخدام إعادة التوجيه للروابط التي جرى تغييرها، خصوصًا عند تحويل موقع إلى ووردبريس من تقنية أخرى.
</p>

<h2 id="المفاهيم-الأساسية-عند-استخدام-إعادة-التوجيه">
	المفاهيم الأساسية عند استخدام إعادة التوجيه
</h2>

<p>
	هذا القسم ليس دليلًا شاملًا لإعادة التوجيه، وإنما يشرح الأفكار الأساسية التي يتعامل Google بناء عليها مع صفحات الويب وروابطها، ولماذا علينا أن نسعى محاولين إرضاءه عند تغيير روابط الصفحات.
</p>

<h3 id="تقييمات-البحث">
	تقييمات البحث
</h3>

<p>
	يعمل محرِّك Google للبحث داخليًا عبر تقييم الصفحات التي يمكن البحث عنها، وقد يُظهِر محرِّك Google إحدى الصفحات كأوّل نتيجة عند البحث اعتمادًا على معايير كثيرة، ويُظهِر صفحةً أخرى كثاني نتيجة، وهلم جرًا.<br>
	ولأنَّ محرِّك البحث Google يستقبل شهريًا مليار عملية بحث، فتقييم إحدى صفحات الموقع في Google تقييمًا مرتفعًا يعني الحصول على عدِّد هائل من الزيارات إلى موقعك، والذي بدوره يعني إمكانية بيع الكثير من المنتجات، أو الضغط على الإعلانات، أو توقيع العرائض، أو أيّ أمر آخر يجعلك تجني المال أو تُحقِّق هدفك من الموقع.
</p>

<p>
	التقنية المستعملة لمساعدة مواقع معيّنة لتحسين تقييمها في محرِّك Google (وغيره من محركات البحث الأقل شهرة) تسمى «Search Engine Optimization» (<a href="https://academy.hsoub.com/marketing/search-engine-optimisation/" rel="">التهيئة لمحركات البحث</a>) اختصارًا SEO، وإذا قلنا «تقييم SEO لإحدى الصفحات» فنحن نشير إلى تقييم الصفحة عند محرِّك Google.
</p>

<h3 id="الروابط-الدائمة">
	الروابط الدائمة
</h3>

<p>
	لا يُقيّم Google الأداء بناءً على كامل صفحات الموقع، وإنما لكل صفحةٍ على حدة. فلنقل مثلا أنّ لدينا صفحة رابطها example.com/great-optimized-page ذات أداءٍ جيد (لسببٍ من الأسباب) وتظهر في أعلى قائمة النتائج في إحدى عبارات البحث الشهيرة؛ مما يؤدي إلى توجيه زيارات كثيرة إلى تلك الصفحة، وقد تكون تلك الصفحة بمفردها مسؤولةً عن أغلبية زيارات (وبالتالي دخل) الموقع، حتى لو لم تكن بقية صفحات الموقع ذات أداء جيد في محرِّكات البحث.
</p>

<p>
	<a href="https://academy.hsoub.com/apps/web/wordpress/%D8%A7%D9%84%D8%AF%D9%84%D9%8A%D9%84-%D8%A7%D9%84%D8%B4%D8%A7%D9%85%D9%84-%D9%84%D9%84%D8%B1%D9%88%D8%A7%D8%A8%D8%B7-%D8%A7%D9%84%D8%AF%D8%A7%D8%A6%D9%85%D8%A9-permalinks-%D9%81%D9%8A-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-r91/" rel="">الرابط الدائم</a>(paramlink وهي كلمةٌ مركّبةٌ أصلها «permanent link») هو عنوان URL الذي يُفترَض أنَّه الرابط الدائم لإحدى الصفحات. ففي مثالنا السابق، كان الرابط الدائم للصفحة هو example.com/great-optimized-page.
</p>

<p>
	يُرسِل محرِّك Google الزوار إلى صفحتك عبر الرابط الدائم، فلو كان يوصي Google بأحد المطاعم إلى كثير من زواره، لكن رابط الصفحة لم يعد يعمل فجأة، ورَجَعَ الزوار إلى Google مشتكين من عدم وجود تلك الصفحة، فسيتوقف Google عن إظهار تلك الصفحة في نتائج البحث.
</p>

<h3 id="ما-هي-إعادة-التوجيه">
	ما هي إعادة التوجيه؟
</h3>

<p>
	يشرح Google لنا <a href="https://support.google.com/webmasters/answer/93633?hl=en" rel="external nofollow">معنى إعادة التوجيه</a> شرحًا جيدًا، لذا لنبدأ باقتباسٍ من عندهم:
</p>

<blockquote class="ipsQuote" data-ipsquote="">
	<div class="ipsQuote_citation">
		اقتباس
	</div>

	<div class="ipsQuote_contents ipsClearfix">
		<p>
			«إذا احتجتَ إلى تغيير رابط URL لإحدى الصفحات المعروضة في نتائج محرِّك البحث، فنحن ننصحك باستخدام إعادة توجيه من طرف الخادوم، وهذه هي أفضل طريقة لضمان أنَّ المستخدمين ومحرِّك البحث سيُوجَّهون إلى الصفحة المعنية. <a href="https://academy.hsoub.com/programming/general/%D8%B1%D9%85%D9%88%D8%B2-%D8%A7%D9%84%D8%A5%D8%AC%D8%A7%D8%A8%D8%A9-%D9%81%D9%8A-http-r75/" rel="">رمز الحالة 301 في HTTP</a> يعني أنَّ الصفحة قد انتقلت انتقالًا دائمًا إلى مكانٍ جديد.»<br>
			أي أنَّ إعادة التوجيه 301 تشابه تمرير البريد الوارد إلى مكتب البريد. فأنت تطلب منهم «تمرير كل الرسائل البريدية من عنواني القديم في القاهرة إلى عنواني الجديد في الإسكندرية، فلقد انتقلتُ إلى هناك انتقالًا دائمًا».<br>
			إعادة التوجيه مشابهة لما سبق، لكن لصفحات الوب وليس للعناوين البريدية، فلو احتجنا – لأيِّ سببٍ من الأسباب – إلى نقل الصفحة example.com/great-optimized-page إلى عنوانٍ جديد، فعليك ضبط عملية إعادة توجيه من النمط 301 لكي تُمرَّر زيارات مستخدمي موقعك وبرمجيات محرِّكات البحث من الرابط القديم للصفحة إلى رابطها الجديد؛ وعليك فعل ذلك سواءً كان الرابط الجديد في نطاقٍ آخر completelynewdomain.org/great-optimized-page أو أصبح example.com/a-new-permalink …إلخ.
		</p>
	</div>
</blockquote>

<h3 id="علاقة-إعادة-التوجيه-بالتهيئة-لمحركات-البحث">
	علاقة إعادة التوجيه بالتهيئة لمحركات البحث
</h3>

<p>
	وكما في مكاتب البريد، سيُسعَد Google بتحديث سجلاته عندما تُرسِل له استمارة «تغيير العنوان» (وفي حالتنا، هذه «الاستمارة» هي إعادة التوجيه ذات الرمز 301)، وبعد فترةٍ قصيرةٍ من تغييرك للرابط الدائم لصفحتك وضبط إعادة توجيه من الرابط القديم إلى الجديد، فسيبدأ Google بربط نتائج البحث إلى عنوان صفحتك الجديدة، وهذا ما يسمح للصفحة ذات الرابط الجديد بالاحتفاظ بتقييم الرابط القديم نفسه.
</p>

<p>
	ماذا يحدث إذا لم تضبط إعادة التوجيه؟ حسنًا لو لم يُغيّر أحدنا عنوان منزله بعد انتقاله، فستذهب الكثير من «المعلومات» المهمة (مثل الدعوات، واستمارات الضرائب، والرسائل البريدية …) إلى عنوانٍ قديم، وستُعاد الكثير من الطرود إلى مكتب البريد، ولن تحصل على أيٍّ منها!<br>
	هذا ينطبق أيضًا على عناوين الويب، فلو تغيّر عنوان example.com/great-optimized-page دون تمرير الزيارات إلى رابطٍ آخر، فإنّ جميع الزيارات إلى ذاك العنوان لن تكتمل، فلم تعد الصفحة متوفرة في ذاك العنوان، لذا ستظهر <a href="https://academy.hsoub.com/apps/web/wordpress/%D9%83%D9%8A%D9%81%D9%8A%D8%A9-%D8%A5%D8%B5%D9%84%D8%A7%D8%AD-%D8%A3%D9%88-%D8%AD%D8%B0%D9%81-%D8%A7%D9%84%D8%B1%D9%88%D8%A7%D8%A8%D8%B7-%D8%A7%D9%84%D9%85%D8%B9%D8%B7%D9%84%D8%A9-%D8%B9%D9%84%D9%89-%D9%85%D9%88%D9%82%D8%B9-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-%D8%A7%D9%84%D8%AE%D8%A7%D8%B5-%D8%A8%D9%83-r22/" rel="">رسالة الخطأ الشهيرة «404»</a> عند محاولة زيارة الصفحة، وهذا الرمز يعني «لا توجد صفحة مرتبطة بهذا العنوان».
</p>

<p>
	لا يحب Google إرسال الزوار إلى روابط «ميتة»، لذا سيحذف الصفحة example.com/great-optimized-page من سجلاته، ويسمح لبقية الصفحات التي تناقش الموضوع نفسه بأخذ مكان هذه الصفحة؛ وهذا يعني أنَّ السنوات الطوال التي أمضيناها في تطوير الصفحة للحصول على تقييم عال في Google قد ضاعت، ومن المرجح أنها ضاعت للأبد!
</p>

<h2 id="كيف-يبدو-الضرر-الذي-أحدث-في-تقييم-seo-لموقع-العميل">
	كيف يبدو الضرر الذي أُحدِثَ في تقييم SEO لموقع العميل
</h2>

<p>
	إذا نقلتَ لتوِّك الموقع إلى ووردبريس، وكان مبنيا على تقنية قديمة منذ عقود متضمنًا نظام تجارة إلكترونية لا يعمل تمامًا، لكن لمّا كان الموقع قديما ومتخصصا في تقديم خدماتٍ ممتازة في مجالٍ معيّن، فتقييمه أصبح مرتفعًا جدًا في Google.<br>
	أما موقع ووردبريس فهو جميل، ويُحمَّل بسرعة، وإدارته أسهل، ويبدو بمظهرٍ رائعٍ على الهواتف؛ لكن بعد نقلك لجميع منتجات الموقع إلى <a href="https://academy.hsoub.com/tags/woocommerce%20101/" rel="">WooCommerce</a> فلم تُعِد توجيه الروابط الدائمة لصفحات الموقع القديمة.
</p>

<p>
	مرّت ستة أسابيع على إطلاق الموقع الجديد، ثم أتتك رسالةٌ عبر البريد الإلكتروني من عميلك قائلًا فيها: «لقد أحببتُ الموقع الجديد، لكنني نظرتُ في <a href="https://academy.hsoub.com/marketing/performance-marketing/analytics/" rel="">تحليل Google Analytics</a> ووجدتُ أنَّ الموقع لا تأتيه زيارات من محرِّك البحث؛ إضافةً إلى انخفاض مبيعاتي من 10 آلاف دولار شهريًا قبل الانتقال إلى الموقع الجديد إلى حوالي 500 دولار بعد الانتقال إلى الموقع الجديد. هلّا أخبرتني ماذا يحدث؟».
</p>

<p>
	لقد أدركتَ خطأك هنا! فصفحات الموقع القديمة ذات التقييم العالي أصبحت تعرض الخطأ 404 (الصفحة غير موجودة) ولم تُجرِ عملية إعادة توجيه إلى الروابط الدائمة في موقعك الجديد الذي يستعمل ووردبريس؛ لكن للأسف لقد فات الأوان، فذهبت التقييمات العالية لموقع العميل، وحذفه Google من سجلاته، وأصبح عميلك يخسر آلاف الدولارات شهريًا بسبب خطئك، وأمسيتَ تفكِّر بإلقاء حاسوبك من النافذة والانضمام إلى مدرسة تدريب الطيارين الحربيين.
</p>

<p>
	لا تحسبنّ قصة الرعب السابقة غير حقيقية، بل هي شائعةٌ أكثر مما تتوقع. وفقدان تقييم SEO لصفحات موقع العميل هو أخطر الأمور التي قد تحدث عند تطوير المواقع.
</p>

<p>
	سنتحدث في <a href="https://academy.hsoub.com/apps/web/wordpress/%D9%83%D9%8A%D9%81%D9%8A%D8%A9-%D8%A5%D8%AC%D8%B1%D8%A7%D8%A1-%D8%B9%D9%85%D9%84%D9%8A%D8%A9-%D8%A5%D8%B9%D8%A7%D8%AF%D8%A9-%D8%AA%D9%88%D8%AC%D9%8A%D9%87-%D9%81%D9%8A-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-%E2%80%93-%D8%A7%D9%84%D8%A3%D8%AF%D9%88%D8%A7%D8%AA-%D9%88%D8%A7%D9%84%D8%AA%D9%82%D9%86%D9%8A%D8%A7%D8%AA-r274/" rel="">الجزء الثاني</a> من هذه المثال عن طرائق تفادي حدوث مثل هكذا قصص، بمختلف حالات استخدام ووردبريس.
</p>

<p>
	ترجمة –وبتصرّف– للمقال <a href="https://wpshout.com/understanding-301-redirects-wordpress-not-ruin-clients-seo/" rel="external nofollow">Understanding 301 Redirects in WordPress</a> لصاحبه Fred Meyer.
</p>
]]></description><guid isPermaLink="false">272</guid><pubDate>Mon, 19 Jun 2017 12:49:00 +0000</pubDate></item><item><title>&#x62E;&#x645;&#x633; &#x637;&#x631;&#x627;&#x626;&#x642; &#x644;&#x625;&#x62C;&#x631;&#x627;&#x621; &#x62A;&#x639;&#x62F;&#x64A;&#x644;&#x627;&#x62A; &#x639;&#x644;&#x649; &#x642;&#x627;&#x644;&#x628; Twenty Seventeen &#x641;&#x64A; &#x648;&#x648;&#x631;&#x62F;&#x628;&#x631;&#x64A;&#x633;</title><link>https://academy.hsoub.com/apps/web/wordpress/%D8%AE%D9%85%D8%B3-%D8%B7%D8%B1%D8%A7%D8%A6%D9%82-%D9%84%D8%A5%D8%AC%D8%B1%D8%A7%D8%A1-%D8%AA%D8%B9%D8%AF%D9%8A%D9%84%D8%A7%D8%AA-%D8%B9%D9%84%D9%89-%D9%82%D8%A7%D9%84%D8%A8-twenty-seventeen-%D9%81%D9%8A-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-r260/</link><description><![CDATA[
<p><img src="https://academy.hsoub.com/uploads/monthly_2017_05/main.jpg.90502d0f1dc5df31d914f6044a9c1921.jpg" /></p>

<p id="خمس-طرائق-لإجراء-تعديلات-على-قالب-twenty-seventeen-في-ووردبريس">
	قالب Twenty Seventeen هو أكثر قالب افتراضي تعددًا في الاستخدامات شهدته ووردبريس. لكن الخيارات التي يُتيحها هذا القالب ليس شاملة، وهنالك بعض الأمور التي قد نرغب بفعلها والتي لا يسمح القالب بها.
</p>

<p style="text-align: center;">
	<img alt="main.jpg" class="ipsImage ipsImage_thumbnailed" data-fileid="23299" data-unique="yuvyqe6jc" src="https://academy.hsoub.com/uploads/monthly_2017_05/main.jpg.67ccfec8b7a4cddd738b6e7c4e6c0e98.jpg"></p>

<p>
	<br>
	سأريك في هذا الدرس خمسة تعديلات على قالب Twenty Seventeen لإضفاء طابعك الشخصي عليه، وسنبدأ بالتخصيصات الأساسية والبسيطة ثم سننتقل إلى الأصعب والأكثر تعقيدًا.<br>
	لكن قبل أن نبدأ بشرح الشيفرات البرمجية، فلننظر أولًا إلى قائمة التخصيصات التي سنغطيها في هذا الدرس. وإذا أرعى أحدها انتباهك فانتقل واقرأ القسم الموافق له:
</p>

<ul>
<li>
		<strong>التعديل الأول: </strong>«كيفية إنشاء قائمة تحتوي روابط للمواقع الاجتماعية».
	</li>
	<li>
		<strong>التعديل الثاني:</strong> «كيفية تغيير عبارة “Proudly powered by WordPress” (أو مثيلتها بالعربية: “مدعوم بواسطة WordPress”)».
	</li>
	<li>
		<strong>التعديل الثالث: </strong>«إنشاء قائمة تنقّل بين أقسام الصفحة الرئيسية».
	</li>
	<li>
		<strong>التعديل الرابع:</strong> «إضافة شريط جانبي مخصص لكل قسم من أقسام الصفحة الرئيسية».
	</li>
	<li>
		<strong>التعديل الخامس:</strong> «كيفية إضافة صورة بارزة كبيرة جدًا لكل صفحة أو منشور».
	</li>
</ul>
<p>
	بعد انتهائنا من إجراء التعديلات السابقة، فسنحوِّل قالب Twenty Seventeen إلى موقعٍ جميلٍ وعصريٍ مناسب تمامًا للشركات أو للمدونات. ألا تصدقني؟ ألقِ نظرةً إلى الصورة الآتية، فهذه هي النتيجة المرجوة إذا اتبعت التعديلات التي سنوردها جميعها (صورة متحركة):
</p>

<p style="text-align: center;">
	<img alt="finished-product.gif" class="ipsImage" src="https://academy.hsoub.com/uploads/imageproxy/finished-product.gif.c247fe9090405b937c32161e481fd391.gif"></p>

<h2 id="التعديل-الأول-إنشاء-قائمة-تحتوي-روابط-للمواقع-الاجتماعية">
	التعديل الأول: إنشاء قائمة تحتوي روابط للمواقع الاجتماعية
</h2>

<p>
	حسنًا، هذا ليس تعديلًا وإنما ملاحظة أو تنويه إلى هذه الميزة؛ لكنه يؤدي إلى تخصيص قالب Twenty Seventeen ليلائم موقعك، لذا سنشرحه هنا.<br>
	يتضمن قالب Twenty Seventeen قائمةً تحتوي روابط لمواقع التواصل الاجتماعي ذات مظهرٍ جذاب في تذييل الصفحة.
</p>

<p style="text-align: center;">
	<img alt="2-social-links.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23287" data-unique="jxckugwfr" src="https://academy.hsoub.com/uploads/monthly_2017_05/2-social-links.png.de6ff56ae40e118326f30c56bd6baaca.png"></p>

<p>
	المشكلة هي أنَّ العديد من المستخدمين قد اشتكوا من عدم قدرتهم على اكتشاف طريقة إضافة روابط الشبكات الاجتماعية إلى هذه القائمة، لكن لا تقلق فالأمر بسيطٌ جدًا بعد أن تتعلم طريقة فعله.<br>
	كل ما عليك فعله هو إضافة قائمة فيها روابط إلى شبكات التواصل الاجتماعي وإسنادها إلى موضع «Social Links Menu» (أو «قائمة الروابط الاجتماعية» باللغة العربية).<br>
	هذه هي الخطوات بالتفصيل:
</p>

<ul>
<li>
		ابدأ بفتح المخصِّص من «Appearance &gt; Customize» (مظهر &gt; تخصيص)
	</li>
	<li>
		اضغط على خيار «Menus» (قوائم) ثم اضغط على زر «Add a Menu» (أضف قائمة)
	</li>
	<li>
		سمِّ القائمة باسمٍ واضحٍ دالٍ على وظيفتها مثل «Social Links Menu» ثم اضغط على زر «Create Menu» (إنشاء قائمة)
	</li>
	<li>
		فعِّل مربع الاختيار المجاور لعبارة «Social Links Menu» ( قائمة الروابط الاجتماعية) في قسم «Display Location» (عرض الموقع)
	</li>
</ul>
<p>
	بعد أن تنتهي من ضبط القائمة، فيجب أن تبدو كما في الصورة الآتية:
</p>

<p style="text-align: center;">
	<img alt="3-social-links-menu.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23288" data-unique="rnuwyhypt" src="https://academy.hsoub.com/uploads/monthly_2017_05/3-social-links-menu.png.4404a571c25a1634254d7c76c9001eac.png"></p>

<p>
	آخر خطوة هي الضغط على زر «Save &amp; Publish» (حفظ ونشر) في المُخصِّص لحفظ القائمة الجديدة. يجب أن تظهر قائمة الروابط الاجتماعية الآن في تذييل الصفحة.<br>
	أنا متأكد أنَّ ما سبق ليس صعبًا أبدًا، لذا لننتقل إلى أمرٍ أكثر صعوبةً!
</p>

<h2 id="التعديل-الثاني-تغيير-عبارة-proudly-powered-by-wordpress">
	التعديل الثاني: تغيير عبارة «Proudly powered by WordPress»
</h2>

<p style="text-align: center;">
	<img alt="4-proudly-powered.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23289" data-pin-nopin="true" data-unique="rqbvz45es" src="https://academy.hsoub.com/uploads/monthly_2017_05/4-proudly-powered.png.42f138a12cf30324b07a3c663dbac412.png"></p>

<p>
	هنالك سببان يدفعانك إلى تغيير النص الموجود في تذييل الصفحة الذي يقول «Proudly powered by WordPress» أو «مدعوم بواسطة WordPress»:
</p>

<ul>
<li>
		ربما تريد الإضافة إلى الجملة السابقة لتقول «مدعوم بواسطة WordPress، ومُصمَّم من شركة WebPress Designs، ومُستضاف من شركة LAMPress!».
	</li>
	<li>
		ربما تريد وضع عبارة أخرى لتصرِّح عن حقوق النشر الخاصة بموقعك مثل «جميع الحقوق محفوظة 2016، شركة MyBiz».
	</li>
</ul>
<p>
	وبغض النظر عن السبب الذي دفعك لتغيير هذه العبارة، فسأخبرك طريقة تعديلها في هذا القسم.<br>
	أوّل شيءٍ عليك فعله هو <a href="https://academy.hsoub.com/programming/php/wordpress/%D9%83%D9%8A%D9%81-%D8%AA%D9%86%D8%B4%D8%A6-%D9%82%D8%A7%D9%84%D8%A8-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-%D9%81%D8%B1%D8%B9%D9%8A-r107/" rel="">إنشاء وتفعيل قالب ابن</a> (Child theme) (ملاحظة: إذا أردت حلًا سهلًا جدًا، فكل ما عليك فعله هو تنزيل القالب الابن الذي سنعطيك إياه في نهاية هذا الدرس).<br>
	بعد إنشائك وتفعيلك للقالب الابن، فانسخ ملف <code>footer.php</code> من قالب Twenty Seventeen إلى مجلد القالب الابن، ثم افتح ملف <code>footer.php</code> المنسوخ وابحث عن السطر <code>get_template_part( 'template-parts/footer/site', 'info' );‎</code>.<br>
	لديك خياران الآن: إما أن تجعل السطر السابق تعليقًا (بإضافة <code>//</code> قبل الشيفرة) مما يؤدي إلى حذف تلك العبارة فقط، وإما أن تجعله تعليقًا ثم تضيف النص الخاص بك. هذه هي الشيفرة التي استخدمتها لإنشاء التذييل المعروض في الصورة السابقة:
</p>

<p style="text-align: center;">
	<img alt="5-custom-footer-text.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23290" data-pin-nopin="true" data-unique="nfey5r1qh" src="https://academy.hsoub.com/uploads/monthly_2017_05/5-custom-footer-text.png.d6e8101017cd71fd6834c8ae3c899506.png"></p>

<h2 id="التعديل-الثالث-إنشاء-قائمة-تنقل-بين-أقسام-الصفحة-الرئيسية">
	التعديل الثالث: إنشاء قائمة تنقّل بين أقسام الصفحة الرئيسية
</h2>

<p>
	في أحد الدروس السابقة «<a href="https://academy.hsoub.com/apps/web/wordpress/%D8%AA%D8%AE%D8%B5%D9%8A%D8%B5-%D9%82%D8%A7%D9%84%D8%A8-twenty-seventeen-%D9%81%D9%8A-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-%D9%84%D9%8A%D9%86%D8%A7%D8%B3%D8%A8-%D8%A7%D9%84%D8%B4%D8%B1%D9%83%D8%A7%D8%AA-r258/" rel="">تخصيص قالب Twenty Seventeen في ووردبريس ليناسب الشركات</a>» أضفتُ سكربت jQuery بسيط لبناء قائمة تنقل ديناميكية ضمن الصفحة الرئيسية والتي يوجد فيها روابط لمختلف أقسام الصفحة الرئيسية. ولقد أدى السكربت السابق عمله كما ينبغي، لكنه كان يحتاج إلى بعض التحسينات.<br>
	سأريك في هذا الدرس كيفية تحسينه؛ فبالإضافة إلى إنشاء قائمة تنقل لمختلف أقسام الصفحة الرئيسية، فسنحاول أيضًا حلّ مشكلة تأثير المرور فوق عناصر القائمة، وإضافة تأثير التمرير السلس (smooth scrolling) لتحسين تجربة المستخدم.<br>
	لنبدأ أولًا بشيفرة jQuery التي عليك إضافتها إلى موقعك:
</p>

<pre class="ipsCode prettyprint lang-php prettyprinted" id="ips_uid_3947_16" style="">
<span class="com">/*
 One page nav code 
 */</span><span class="pln">

jQuery</span><span class="pun">(</span><span class="pln"> document </span><span class="pun">).</span><span class="pln">ready</span><span class="pun">(</span><span class="kwd">function</span><span class="pun">(){</span><span class="pln">
  </span><span class="com">/* Add padding and id's to each front page section */</span><span class="pln">
  jQuery</span><span class="pun">(</span><span class="pln"> </span><span class="str">"h2.entry-title"</span><span class="pln"> </span><span class="pun">).</span><span class="pln">each</span><span class="pun">(</span><span class="pln"> </span><span class="kwd">function</span><span class="pun">()</span><span class="pln"> </span><span class="pun">{</span><span class="pln">
    </span><span class="kwd">var</span><span class="pln"> panelId </span><span class="pun">=</span><span class="pln"> jQuery</span><span class="pun">(</span><span class="pln"> </span><span class="kwd">this</span><span class="pln"> </span><span class="pun">).</span><span class="pln">html</span><span class="pun">().</span><span class="pln">toLowerCase</span><span class="pun">().</span><span class="pln">replace</span><span class="pun">(</span><span class="str">/\s+/</span><span class="pln">g</span><span class="pun">,</span><span class="pln"> </span><span class="str">"-"</span><span class="pun">);</span><span class="pln">
      jQuery</span><span class="pun">(</span><span class="pln"> </span><span class="kwd">this</span><span class="pln"> </span><span class="pun">).</span><span class="pln">wrapInner</span><span class="pun">(</span><span class="kwd">function</span><span class="pun">()</span><span class="pln"> </span><span class="pun">{</span><span class="pln">
        </span><span class="kwd">return</span><span class="pln"> </span><span class="str">"&lt;span style='padding-top:96px;' id='"</span><span class="pln"> </span><span class="pun">+</span><span class="pln"> panelId </span><span class="pun">+</span><span class="pln"> </span><span class="str">"'&gt;&lt;/span&gt;"</span><span class="pun">;</span><span class="pln">
      </span><span class="pun">})</span><span class="pln">
  </span><span class="pun">})</span><span class="pln">

  </span><span class="com">/* Remove navigation link highlighting */</span><span class="pln">
    jQuery</span><span class="pun">(</span><span class="str">'#top-menu li'</span><span class="pun">).</span><span class="pln">removeClass</span><span class="pun">(</span><span class="str">'current-menu-item current_page_item '</span><span class="pun">);</span><span class="pln">

  </span><span class="com">/* Add highlighting on click */</span><span class="pln">
    jQuery</span><span class="pun">(</span><span class="str">'#top-menu li a'</span><span class="pun">).</span><span class="pln">on</span><span class="pun">(</span><span class="str">'click'</span><span class="pun">,</span><span class="pln"> </span><span class="kwd">function</span><span class="pun">(</span><span class="kwd">event</span><span class="pun">)</span><span class="pln"> </span><span class="pun">{</span><span class="pln">
    jQuery</span><span class="pun">(</span><span class="kwd">this</span><span class="pun">).</span><span class="pln">parent</span><span class="pun">().</span><span class="pln">parent</span><span class="pun">().</span><span class="pln">find</span><span class="pun">(</span><span class="str">'li'</span><span class="pun">).</span><span class="pln">removeClass</span><span class="pun">(</span><span class="str">'current-menu-item'</span><span class="pun">);</span><span class="pln">
    jQuery</span><span class="pun">(</span><span class="kwd">this</span><span class="pun">).</span><span class="pln">parent</span><span class="pun">().</span><span class="pln">addClass</span><span class="pun">(</span><span class="str">'current-menu-item'</span><span class="pun">);</span><span class="pln">
  </span><span class="pun">});</span><span class="pln">

    </span><span class="com">/* Check current URL and highlight nav for current page */</span><span class="pln">
  jQuery</span><span class="pun">(</span><span class="str">'#top-menu li a'</span><span class="pun">).</span><span class="pln">each</span><span class="pun">(</span><span class="pln"> </span><span class="kwd">function</span><span class="pun">()</span><span class="pln"> </span><span class="pun">{</span><span class="pln">
      </span><span class="kwd">var</span><span class="pln"> pageUrl </span><span class="pun">=</span><span class="pln"> jQuery</span><span class="pun">(</span><span class="pln"> location </span><span class="pun">).</span><span class="pln">attr</span><span class="pun">(</span><span class="pln"> </span><span class="str">'href'</span><span class="pln"> </span><span class="pun">);</span><span class="pln">
      </span><span class="kwd">var</span><span class="pln"> navUrl </span><span class="pun">=</span><span class="pln"> jQuery</span><span class="pun">(</span><span class="pln"> </span><span class="kwd">this</span><span class="pln"> </span><span class="pun">).</span><span class="pln">attr</span><span class="pun">(</span><span class="pln"> </span><span class="str">'href'</span><span class="pln"> </span><span class="pun">);</span><span class="pln">
      </span><span class="kwd">if</span><span class="pln"> </span><span class="pun">(</span><span class="pln"> navUrl </span><span class="pun">==</span><span class="pln"> pageUrl </span><span class="pun">)</span><span class="pln"> </span><span class="pun">{</span><span class="pln">
          jQuery</span><span class="pun">(</span><span class="pln"> </span><span class="kwd">this</span><span class="pln"> </span><span class="pun">).</span><span class="pln">parent</span><span class="pun">().</span><span class="pln">addClass</span><span class="pun">(</span><span class="str">'current-menu-item'</span><span class="pun">);</span><span class="pln">
        </span><span class="pun">}</span><span class="pln"> 
    </span><span class="pun">})</span><span class="pln">
</span><span class="pun">})</span></pre>

<p>
	يمكنك إضافة هذه الشيفرة إلى ملف JavaScript الذي يُحمِّله القالب الابن (وهذا ما فعلتُ) أو يمكنك استخدام إضافة تسمح لك بإضافة شيفرات JavaScript إلى موقعك (وهذا ما نصحتك بفعله في <a href="https://academy.hsoub.com/apps/web/wordpress/%D8%AA%D8%AE%D8%B5%D9%8A%D8%B5-%D9%82%D8%A7%D9%84%D8%A8-twenty-seventeen-%D9%81%D9%8A-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-%D9%84%D9%8A%D9%86%D8%A7%D8%B3%D8%A8-%D8%A7%D9%84%D8%B4%D8%B1%D9%83%D8%A7%D8%AA-r258/" rel="">درسي السابق</a>)؛ لكن احرص على تحميل الشيفرة بعد انتهاء تحميل مكتبة jQuery.<br>
	لم يتغيّر أوّل جزء من الشيفرة وبقي كما هو مذكور في الدرس السابق، أما بقية الشيفرة فتحل مشكلة تأثير المرور فوق عناصر القائمة. ألقِ نظرةً على التعليقات الموجودة في الشيفرة السابقة لتأخذ فكرةً عمّا يجري.<br>
	إضافةً إلى ما سبق، سنجعل حركة الانتقال إلى كل قسم من أقسام الصفحة أكثر سلاسةً بتثبيت وتفعيل إضافة مجانية باسم <a href="https://wordpress.org/plugins/jquery-smooth-scroll/" rel="external nofollow">jQuery Smooth Scroll</a>.<br>
	طبعًا ما يزال عليك بناء قائمة التنقل بإضافة روابط مخصصة إلى كل قسم من أقسام الصفحة عبر استعمال اسم الصفحة المعروضة في ذاك القسم.<br>
	فمثلًا، لإضافة رابط إلى قسم «About» فعليك إنشاء رابط مخصص وجعله يشير إلى <code>‎#about</code>. لتفاصيل كاملة رجاءً ارجع إلى درس «<a href="https://academy.hsoub.com/apps/web/wordpress/%D8%AA%D8%AE%D8%B5%D9%8A%D8%B5-%D9%82%D8%A7%D9%84%D8%A8-twenty-seventeen-%D9%81%D9%8A-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-%D9%84%D9%8A%D9%86%D8%A7%D8%B3%D8%A8-%D8%A7%D9%84%D8%B4%D8%B1%D9%83%D8%A7%D8%AA-r258/" rel="">تخصيص قالب Twenty Seventeen في ووردبريس ليناسب الشركات</a>».<br>
	أعلم أنَّ إنشاء هذه القائمة يتطلب وقتًا، لكن هذا الجهد سيؤتي أكله. لم تقتنع بكلامي؟ انظر إلى النتيجة النهائية (صورة متحركة):
</p>

<p style="text-align: center;">
	<img alt="one-page-nav.gif" class="ipsImage" src="https://academy.hsoub.com/uploads/imageproxy/one-page-nav.gif.deae1690774af4767087178dc9aa9e0d.gif"></p>

<h2 id="التعديل-الرابع-إضافة-شريط-جانبي-مخصص-لكل-قسم-من-أقسام-الصفحة-الرئيسية">
	التعديل الرابع: إضافة شريط جانبي مخصص لكل قسم من أقسام الصفحة الرئيسية
</h2>

<p>
	يستخدم قالب Twenty Seventeen الفراغات البيضاء استعمالًا كثيرًا، لكنني أعلم بما تفكر به، إذ تظن أنَّ هنالك الكثير من المساحات البيضاء، ألا هل أدلك على طريقةٍ للاستفادة منها؟ تستطيع إضافة ودجات مختلفة للشريط الجانبي لكل قسمٍ من أقسام الصفحة الرئيسية، ويمكنك أيضًا إضافة شريط جانبي إلى الصفحات.<br>
	لنقل -على سبيل المثال- أنَّك تريد إضافة حقل للبحث، وقائمةً منسدلةً فيها تصنيفات موقعك، وبضعة ودجات إلى قسم المدونة في صفحتك الرئيسية. من المؤكد أنَّ القائمة ستبدو جميلة إذا استطعنا جعلها شبيهةً بتلك الموجودة في هذه الصورة:
</p>

<p style="text-align: center;">
	<img alt="7-blog-section-custom-sidebar.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23291" data-unique="u2362iqot" src="https://academy.hsoub.com/uploads/monthly_2017_05/7-blog-section-custom-sidebar.png.dd640c795f6b1a59b22fcf5e89bf49b3.png"></p>

<p>
	وبالطبع لا ترغب بإظهار نفس الودجات في قسم «About»؛ وإنما تريد إضافة شيءٍ آخر في ذاك القسم، ومن المحبَّذ إظهار شريط جانبي في قسم About في الصفحة الرئيسية وإظهار شريط جانبي آخر في صفحة <code>‎/about</code> نفسها!<br>
	أود أن أبشِّرَك بإمكانية فعل ذلك، حيث تستطيع إضافة شريط جانبي مخصص لكل قسم من أقسام الصفحة الرئيسية ثم إعادة استخدام تلك الأشرطة الجانبية –أو إنشاء أشرطة جانبية مختلفة تمامًا– في صفحات موقعك. لكن هذا التعديل ليس سهلًا، حيث سنحتاج إلى تعديل القالب الابن وسيلزمنا استخدام إضافة.<br>
	افتراضيًا، لا يُضيف قالب Twenty Seventeen أيّة أشرطة جانبية إلى أقسام الصفحة الرئيسية أو إلى أيّة صفحات. وإنما سيعرض شريطًا جانبيًا في المنشورات فقط، لكن الصفحات ستبدو وكأنها خاويةٌ لكثرة المسافات البيضاء.<br>
	لكي نغيّر ذلك ولإضافة أشرطة جانبية إلى الصفحات، فعليك القيام بعدِّة أمور:
</p>

<ul>
<li>
		نسخ ملفات القالب التي يستعملها Twenty Seventeen لعرض الصفحات وأقسام الصفحة الرئيسية.
	</li>
	<li>
		إضافة شيفرة الشريط الجانبي إلى قالب الصفحات وإلى كل قسم من أقسامٍ الصفحة الرئيسية عبر تعديل ملفات القالب.
	</li>
	<li>
		تثبيت إضافة Custom Sidebars.
	</li>
	<li>
		إنشاء شريط جانبي مخصص لكل قسم من أقسام الصفحة الرئيسية، ولكل صفحة نريد عرض الشريط الجانبي فيها.
	</li>
	<li>
		إضافة شريط جانبي لكل صفحة تريد عرضه فيها.
	</li>
</ul>
<p>
	دعني أريك كل خطوة على حدة.<br>
	- الخطوة الأولى: نسخ ملفات <code>content-page.php</code> و <code>content-front-page.php</code> و <code>content-front-page-panels.php</code> إلى مجلد القالب الابن.<br>
	ستجد الملفات السابقة في مجلد <code>‎\wp-content\themes\twentyseventeen\template-parts\page</code> وعليك نسخها جميعها.<br>
	ستحتاج إلى إعادة إنشاء نفس بنية المجلدات السابقة في مجلد القالب الابن بإنشاء مجلد جديد باسم <code>template-parts</code> ثم إنشاء مجلد جديد آخر داخله باسم <code>page</code>. ثم لصق الملفات الثلاثة السابقة في مجلد <code>page</code>.<br>
	بعد انتهاء العملية السابقة، فيجب أن تبدو بنية مجلدات القالب الابن لديك كما يلي:
</p>

<p style="text-align: center;">
	<img alt="8-page-template-files.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23292" data-unique="0d3jp65eh" src="https://academy.hsoub.com/uploads/monthly_2017_05/8-page-template-files.png.d46ddb4456e2b87b2cd238f1e279c145.png"></p>

<ul>
<li>
		الخطوة الثانية: إضافة شيفرة الشريط الجانبي إلى كل ملف من الملفات السابقة.<br>
		افتح بدايةً ملف <code>content-page.php</code> وأضف <code>‎&lt;?php get_sidebar(); ?&gt;‎</code> قبل وسم إغلاق العنصر <code>header</code> مباشرةً كما يلي:
	</li>
</ul>
<p style="text-align: center;">
	<img alt="9-content-page-code-added.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23293" data-pin-nopin="true" data-unique="kb6jwq2nx" src="https://academy.hsoub.com/uploads/monthly_2017_05/9-content-page-code-added.png.b000902471cf4d59fba286705d0b9988.png"></p>

<p>
	ثانيًا، افتح الملفين الآخرين (<code>content-front-page.php</code> و <code>content-front-page-panels.php</code>) وأضف الشيفرة الآتية قبل وسم إغلاق العنصر <code>header</code> مباشرةً في كلاهما:
</p>

<pre class="ipsCode prettyprint lang-php prettyprinted" id="ips_uid_3947_16" style="">
<code class="hljs xml"><span class="hljs-tag"><span class="tag">&lt;</span><span class="hljs-title"><span class="tag">hr</span></span><span class="tag">&gt;</span></span><span class="pln">
</span><span class="hljs-tag"><span class="tag">&lt;</span><span class="hljs-title"><span class="tag">div</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">class</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"front-page-sidebar"</span></span><span class="tag">&gt;</span></span><span class="pln">
  </span><span class="hljs-tag"><span class="tag">&lt;</span><span class="hljs-title"><span class="tag">aside</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">id</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"secondary"</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">class</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"widget-area"</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">role</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"complementary"</span></span><span class="tag">&gt;</span></span><span class="php"><span class="hljs-preprocessor"><span class="pun">&lt;?</span><span class="pln">php</span></span><span class="pln">
  </span><span class="hljs-variable"><span class="pln">$title</span></span><span class="pln"> </span><span class="pun">=</span><span class="pln"> get_the_title</span><span class="pun">();</span><span class="pln">
  dynamic_sidebar</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-variable"><span class="pln">$title</span></span><span class="pln"> </span><span class="pun">);</span><span class="pln">
  </span><span class="hljs-preprocessor"><span class="pun">?&gt;</span></span></span><span class="hljs-tag"><span class="tag">&lt;/</span><span class="hljs-title"><span class="tag">aside</span></span><span class="tag">&gt;</span></span><span class="pln">
</span><span class="hljs-tag"><span class="tag">&lt;/</span><span class="hljs-title"><span class="tag">div</span></span><span class="tag">&gt;</span></span></code></pre>

<p>
	بعد إضافة الشيفرة السابقة، فيجب أن يبدو كل من الملفين <code>content-front-page.php</code> و <code>content-front-page-panels.php</code> كما يلي (بعد إضافة الشيفرة الضرورية):
</p>

<p style="text-align: center;">
	<img alt="10-front-page-sidebar-code.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23294" data-unique="4jad6z2tw" src="https://academy.hsoub.com/uploads/monthly_2017_05/10-front-page-sidebar-code.png.77b0d9b9b17637b78e30259bf2b4fc15.png"></p>

<ul>
<li>
		الخطوة الثالثة: تثبيت إضافة <a href="https://wordpress.org/plugins/custom-sidebars/" rel="external nofollow">Custom Sidebars</a><br>
		إضافة <a href="https://wordpress.org/plugins/custom-sidebars/" rel="external nofollow">Custom Sidebars</a> المجانية متاحةٌ في موقع WordPress.org، لذا يمكنك البحث عن الكلمة المفتاحية «Custom Sidebars» في صفحة «Plugins &gt; Add New» (إضافات &gt; أضف جديد).
	</li>
	<li>
		الخطوة الرابعة: إنشاء شريط جانبي مخصص لكل قسم من أقسام الصفحة الرئيسية.<br>
		اذهب إلى «Appearance &gt; Widgets» (مظهر &gt; ودجات) لإنشاء شريط جانبي جديد لكل قسم من أقسام الصفحة الرئيسية.<br>
		انتبه الآن جيدًا لما سنفعله، لأنَّ من المهم جدًا أن تقوم بهذه العملية على أتم وجه لكي تُعرَض صفحتك الرئيسية كما يجب. اتبع الخطوات الآتية لإنشاء الأشرطة الجانبية:
		<ol>
<li>
				اضغط على زر «Create a new sidebar» (للأسف، لا توفر إضافة Custom Sidebars ترجمةً عربيةً لها)، وسمِّ كل شريط جانبي بنفس اسم الصفحة تمامًا؛ فمثلًا، لو كان أحد أقسام الصفحة الرئيسية يَعرِض صفحةً عنوانها «About» فعليك حينئذٍ أن تُنشِئ شريطًا جانبيًا بنفس الاسم: «About».<br><img alt="11-name-custom-sidebar.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23295" data-unique="wuy4p47ca" src="https://academy.hsoub.com/uploads/monthly_2017_05/11-name-custom-sidebar.png.c54ab8fa0568b053421f6bd1e97e3e80.png"><br>
				الشيفرة التي أضفناها في الخطوة الثانية إلى قوالب الصفحة الرئيسية ستبحث عن مطابقة بين اسم القسم وبين اسم الشريط الجانبي لكي تعلم ما هو الشريط الجانبي الذي يجب عرضه.
			</li>
			<li>
				اضغط على «Advanced – Edit custom wrapper code» وأضف الشيفرة الآتية:
				<ul>
<li>
						في الحقل الأول «Before Title» أضف <code>&lt;h2 class="widget-title"‎&gt;</code>
					</li>
					<li>
						في الحقل الثاني «After Title» أضف <code>&lt;‎/h2&gt;</code>
					</li>
					<li>
						في الحقل الثالث «Before Widget» أضف <code>&lt;section id="%1$s" class="widget %2$s"‎&gt;</code>
					</li>
					<li>
						في الحقل الرابع «After Widget» أضف <code>&lt;‎/section&gt;</code>
					</li>
				</ul>
</li>
		</ol>
</li>
</ul>
<p style="text-align: center;">
	<img alt="12-widget-wrapper.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23296" data-unique="9eghyfo8k" src="https://academy.hsoub.com/uploads/monthly_2017_05/12-widget-wrapper.png.7c8f18a14a1d85437450fba7c9f4dc5f.png"></p>

<p>
	هذه الشيفرة تماثل الشيفرة التي يضيفها قالب Twenty Seventeen قبل وبعد كل ودجت، وقبل وبعد كل عنوان للودجت. وبتغليف محتوى الشريط المخصص بهذه الشيفرة فأنت تضمن أنَّ التنسيق الافتراضي لقالب Twenty Seventeen سيُطبَّق على محتوى الشريط الجانبي المخصص لأقسام الصفحة الرئيسية.<br>
	3. أصبحت جاهزًا الآن لإضافة محتوى إلى الأشرطة الجانبية، لذا اختر ما تشاء من الودجات المتاحة وابنِ الأشرطة الجانبية التي تريدها لعرضها لكل قسم.<br>
	بعد أن تنتهي، فيجب أن تبدو قائمة الأشرطة الجانبية كالآتية، والتي يُطابِق اسمها اسم القسم الذي ستُعرَض بجواره:
</p>

<p style="text-align: center;">
	<img alt="13-custom-sidebars-list.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23297" data-unique="w8nafywmw" src="https://academy.hsoub.com/uploads/monthly_2017_05/13-custom-sidebars-list.png.0ca5a43e3d574ad37d5eb11f368cdf53.png"></p>

<blockquote class="ipsQuote" data-ipsquote="">
	<div class="ipsQuote_citation">
		Quote
	</div>

	<div class="ipsQuote_contents ipsClearfix">
		<p>
			لا تَعمَل ودجت «Recent Posts» (أحدث المقالات) مع هذه الطريقة، وإذا أضفتها إلى أيّ شريط جانبي مخصصٍ من الأشرطة المعروضة بجوار أقسام الصفحة، فستلاحظ أنَّ القسم الذي سيعرضها سيُحمِّل محتوى الصفحة الرئيسية بدلًا من المحتوى المخصص.
		</p>
	</div>
</blockquote>

<ul>
<li>
		الخطوة الخامسة: إضافة شريط جانبي لكل الصفحات التي تريد عرض شريط جانبي فيها.
	</li>
</ul>
<p>
	اذهب الآن إلى أيّة صفحات تريد عرض شريط جانبي فيها، وافتح المحرر، ومرِّر إلى الأسفل لكي ترى مربعًا بعنوان «Sidebars» ثم اختر الشريط الجانبي الذي تريد عرضه من القائمة المنسدلة.
</p>

<p style="text-align: center;">
	<img alt="14-sidebars-admin-meta-box.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23298" data-unique="5muj1w8ci" src="https://academy.hsoub.com/uploads/monthly_2017_05/14-sidebars-admin-meta-box.png.5e8c6fb351989ce8d702337f606a7662.png"></p>

<p>
	مرِّر إلى الأعلى واضغط على زر «Update» (تحديث) ثم اعرض الصفحة، وستلاحظ أنَّ الشريط الجانبي معروضٌ تحت عنوان الصفحة:
</p>

<p style="text-align: center;">
	<img alt="15-page-with-sidebar.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23285" data-unique="2y5fbsaq2" src="https://academy.hsoub.com/uploads/monthly_2017_05/15-page-with-sidebar.png.358c649ea64ba4d13a3d8b4646cb74ac.png"></p>

<h2 id="التعديل-الخامس-إضافة-صورة-بارزة-كبيرة-جدا-لكل-صفحة">
	التعديل الخامس: إضافة صورة بارزة كبيرة جدًا لكل صفحة
</h2>

<p style="text-align: center;">
	<a class="ipsAttachLink ipsAttachLink_image" data-fileid="23286" href="https://academy.hsoub.com/uploads/monthly_2017_05/16-full-height-featured-images-e1482083491551.png.ddd5d5210dbb62ff6d14c6e148c47186.png" rel=""><img alt="16-full-height-featured-images-e1482083491551.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23286" data-unique="ilhc4apum" src="https://academy.hsoub.com/uploads/monthly_2017_05/16-full-height-featured-images-e1482083491551.thumb.png.9b9d0ba1c5c3f304f635afbeaf44a40c.png"></a>
</p>

<p>
	<br>
	تعجبني طريقة عرض الترويسة التي تعرض فيها صورة أو مقطع فيديو في الصفحة الرئيسية لقالب Twenty Seventeen؛ لكنني لا أحب طريقة عرض الصور البارزة حيث تظهر كغيرها من الصور؛ لذا أود عرض الصورة البارزة لكل صفحة أو منشور بنفس أبعاد الصور الموجودة في الصفحة الرئيسية.<br>
	هذا أكثر التعديلات تخصيصًا للقالب، ولن أكذب عليك وأقول أنَّ الشيفرة التي ستراها بعد قليل هي شيفرةٌ بسيطةٌ وجميلة! لكنها تؤدي عملها دون مشاكل.<br>
	أوّل شيء عليك فعله هو نسخ ملف <code>header.php</code> من قالب Twenty Seventeen إلى القالب الابن؛ ثم عليك وضع الشيفرة الآتية بدلًا من كامل عنصر <code>header</code>:
</p>

<pre class="ipsCode prettyprint lang-php prettyprinted" id="ips_uid_3947_16" style="">
<code class="hljs xml"><span class="hljs-tag"><span class="tag">&lt;</span><span class="hljs-title"><span class="tag">header</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">id</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"masthead"</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">class</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"site-header"</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">role</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"banner"</span></span><span class="tag">&gt;</span></span><span class="pln">
  </span><span class="php"><span class="hljs-preprocessor"><span class="pun">&lt;?</span><span class="pln">php</span></span><span class="pln"> </span><span class="hljs-keyword"><span class="kwd">if</span></span><span class="pln"> </span><span class="pun">(</span><span class="pln"> has_post_thumbnail</span><span class="pun">()</span><span class="pln"> </span><span class="pun">&amp;&amp;</span><span class="pln"> </span><span class="pun">(</span><span class="pln"> is_single</span><span class="pun">()</span><span class="pln"> </span><span class="pun">||</span><span class="pln"> </span><span class="pun">(</span><span class="pln"> is_home</span><span class="pun">()</span><span class="pln"> </span><span class="pun">||</span><span class="pln"> </span><span class="pun">(</span><span class="pln"> is_page</span><span class="pun">()</span><span class="pln"> </span><span class="pun">&amp;&amp;</span><span class="pln"> </span><span class="pun">!</span><span class="pln"> twentyseventeen_is_frontpage</span><span class="pun">()</span><span class="pln"> </span><span class="pun">)</span><span class="pln"> </span><span class="pun">)</span><span class="pln"> </span><span class="pun">)</span><span class="pln"> </span><span class="pun">)</span><span class="pln"> </span><span class="pun">:</span><span class="pln"> </span><span class="hljs-preprocessor"><span class="pun">?&gt;</span></span></span><span class="pln">
    </span><span class="hljs-tag"><span class="tag">&lt;</span><span class="hljs-title"><span class="tag">span</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">class</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"has-header-image twentyseventeen-front-page home"</span></span><span class="tag">&gt;</span></span><span class="pln">
      </span><span class="hljs-tag"><span class="tag">&lt;</span><span class="hljs-title"><span class="tag">div</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">id</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"page-header"</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">class</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"custom-header"</span></span><span class="tag">&gt;</span></span><span class="pln">
        </span><span class="hljs-tag"><span class="tag">&lt;</span><span class="hljs-title"><span class="tag">div</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">id</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"custom-header-media"</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">class</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"custom-header-media"</span></span><span class="pln"> </span><span class="tag">&gt;</span></span><span class="pln">
          </span><span class="hljs-tag"><span class="tag">&lt;</span><span class="hljs-title"><span class="tag">div</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">id</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"wp-custom-header"</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">class</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"wp-custom-header"</span></span><span class="tag">&gt;</span></span><span class="pln">
            </span><span class="php"><span class="hljs-preprocessor"><span class="pun">&lt;?</span><span class="pln">php</span></span><span class="pln"> </span><span class="hljs-keyword"><span class="kwd">if</span></span><span class="pln"> </span><span class="pun">(</span><span class="pln"> is_home</span><span class="pun">()</span><span class="pln"> </span><span class="pun">&amp;&amp;</span><span class="pln"> </span><span class="pun">!</span><span class="pln"> twentyseventeen_is_frontpage</span><span class="pun">()</span><span class="pln"> </span><span class="pun">)</span><span class="pln"> </span><span class="pun">{</span><span class="pln">
              </span><span class="hljs-variable"><span class="pln">$page_for_posts</span></span><span class="pln"> </span><span class="pun">=</span><span class="pln"> get_option</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'page_for_posts'</span></span><span class="pln"> </span><span class="pun">);</span><span class="pln">
              </span><span class="hljs-keyword"><span class="pln">echo</span></span><span class="pln"> get_the_post_thumbnail</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-variable"><span class="pln">$page_for_posts</span></span><span class="pln"> </span><span class="pun">);</span><span class="pln">
            </span><span class="pun">}</span><span class="pln"> </span><span class="hljs-keyword"><span class="kwd">else</span></span><span class="pln"> </span><span class="pun">{</span><span class="pln">
              the_post_thumbnail</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'twentyseventeen-featured-image'</span></span><span class="pln"> </span><span class="pun">);</span><span class="pln">
            </span><span class="pun">}</span><span class="pln"> </span><span class="hljs-preprocessor"><span class="pun">?&gt;</span></span></span><span class="pln">
          </span><span class="hljs-tag"><span class="tag">&lt;/</span><span class="hljs-title"><span class="tag">div</span></span><span class="tag">&gt;</span></span><span class="pln">
        </span><span class="hljs-tag"><span class="tag">&lt;/</span><span class="hljs-title"><span class="tag">div</span></span><span class="tag">&gt;</span></span><span class="pln">
        </span><span class="hljs-tag"><span class="tag">&lt;</span><span class="hljs-title"><span class="tag">div</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">class</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"site-branding"</span></span><span class="tag">&gt;</span></span><span class="pln">
          </span><span class="hljs-tag"><span class="tag">&lt;</span><span class="hljs-title"><span class="tag">div</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">class</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"wrap"</span></span><span class="tag">&gt;</span></span><span class="pln">
            </span><span class="hljs-tag"><span class="tag">&lt;</span><span class="hljs-title"><span class="tag">div</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">class</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"site-branding-text"</span></span><span class="tag">&gt;</span></span><span class="pln">
              </span><span class="hljs-tag"><span class="tag">&lt;</span><span class="hljs-title"><span class="tag">h1</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">class</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"site-title"</span></span><span class="tag">&gt;</span></span><span class="pln">
                </span><span class="php"><span class="hljs-preprocessor"><span class="pun">&lt;?</span><span class="pln">php</span></span><span class="pln"> </span><span class="hljs-keyword"><span class="kwd">if</span></span><span class="pln"> </span><span class="pun">(</span><span class="pln"> is_home</span><span class="pun">()</span><span class="pln"> </span><span class="pun">&amp;&amp;</span><span class="pln"> </span><span class="pun">!</span><span class="pln"> twentyseventeen_is_frontpage</span><span class="pun">()</span><span class="pln"> </span><span class="pun">)</span><span class="pln"> </span><span class="pun">{</span><span class="pln">
                  </span><span class="hljs-variable"><span class="pln">$page_for_posts</span></span><span class="pln"> </span><span class="pun">=</span><span class="pln"> get_option</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'page_for_posts'</span></span><span class="pln"> </span><span class="pun">);</span><span class="pln">
                  </span><span class="hljs-keyword"><span class="pln">echo</span></span><span class="pln"> get_the_title</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-variable"><span class="pln">$page_for_posts</span></span><span class="pln"> </span><span class="pun">);</span><span class="pln">
                </span><span class="pun">}</span><span class="pln"> </span><span class="hljs-keyword"><span class="kwd">else</span></span><span class="pln"> </span><span class="pun">{</span><span class="pln">
                  the_title</span><span class="pun">();;</span><span class="pln">
                </span><span class="pun">}</span><span class="pln"> </span><span class="hljs-preprocessor"><span class="pun">?&gt;</span></span></span><span class="pln">
              </span><span class="hljs-tag"><span class="tag">&lt;/</span><span class="hljs-title"><span class="tag">h1</span></span><span class="tag">&gt;</span></span><span class="pln">
            </span><span class="hljs-tag"><span class="tag">&lt;/</span><span class="hljs-title"><span class="tag">div</span></span><span class="tag">&gt;</span></span><span class="pln">
          </span><span class="hljs-tag"><span class="tag">&lt;/</span><span class="hljs-title"><span class="tag">div</span></span><span class="tag">&gt;</span></span><span class="pln">
        </span><span class="hljs-tag"><span class="tag">&lt;/</span><span class="hljs-title"><span class="tag">div</span></span><span class="tag">&gt;</span></span><span class="pln">
        </span><span class="hljs-tag"><span class="tag">&lt;</span><span class="hljs-title"><span class="tag">a</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">href</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"#content"</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">class</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"menu-scroll-down"</span></span><span class="tag">&gt;</span></span><span class="php"><span class="hljs-preprocessor"><span class="pun">&lt;?</span><span class="pln">php</span></span><span class="pln"> </span><span class="hljs-keyword"><span class="pln">echo</span></span><span class="pln"> twentyseventeen_get_svg</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-keyword"><span class="pln">array</span></span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'icon'</span></span><span class="pln"> </span><span class="pun">=&gt;</span><span class="pln"> </span><span class="hljs-string"><span class="str">'arrow-right'</span></span><span class="pln"> </span><span class="pun">)</span><span class="pln"> </span><span class="pun">);</span><span class="pln"> </span><span class="hljs-preprocessor"><span class="pun">?&gt;</span></span></span><span class="hljs-tag"><span class="tag">&lt;</span><span class="hljs-title"><span class="tag">span</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">class</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"screen-reader-text"</span></span><span class="tag">&gt;</span></span><span class="php"><span class="hljs-preprocessor"><span class="pun">&lt;?</span><span class="pln">php</span></span><span class="pln"> _e</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'Scroll down to content'</span></span><span class="pun">,</span><span class="pln"> </span><span class="hljs-string"><span class="str">'twentyseventeen'</span></span><span class="pln"> </span><span class="pun">);</span><span class="pln"> </span><span class="hljs-preprocessor"><span class="pun">?&gt;</span></span></span><span class="hljs-tag"><span class="tag">&lt;/</span><span class="hljs-title"><span class="tag">span</span></span><span class="tag">&gt;</span></span><span class="hljs-tag"><span class="tag">&lt;/</span><span class="hljs-title"><span class="tag">a</span></span><span class="tag">&gt;</span></span><span class="pln">
      </span><span class="hljs-tag"><span class="tag">&lt;/</span><span class="hljs-title"><span class="tag">div</span></span><span class="tag">&gt;</span></span><span class="pln">
    </span><span class="hljs-tag"><span class="tag">&lt;/</span><span class="hljs-title"><span class="tag">span</span></span><span class="tag">&gt;</span></span><span class="pln">
  </span><span class="php"><span class="hljs-preprocessor"><span class="pun">&lt;?</span><span class="pln">php</span></span><span class="pln"> </span><span class="hljs-keyword"><span class="kwd">else</span></span><span class="pln"> </span><span class="pun">:</span><span class="pln"> get_template_part</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'template-parts/header/header'</span></span><span class="pun">,</span><span class="pln"> </span><span class="hljs-string"><span class="str">'image'</span></span><span class="pln"> </span><span class="pun">);</span><span class="pln"> </span><span class="hljs-keyword"><span class="pln">endif</span></span><span class="pun">;</span><span class="hljs-preprocessor"><span class="pun">?&gt;</span></span></span><span class="pln">

  </span><span class="php"><span class="hljs-preprocessor"><span class="pun">&lt;?</span><span class="pln">php</span></span><span class="pln"> </span><span class="hljs-keyword"><span class="kwd">if</span></span><span class="pln"> </span><span class="pun">(</span><span class="pln"> has_nav_menu</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'top'</span></span><span class="pln"> </span><span class="pun">)</span><span class="pln"> </span><span class="pun">)</span><span class="pln"> </span><span class="pun">:</span><span class="pln"> </span><span class="hljs-preprocessor"><span class="pun">?&gt;</span></span></span><span class="pln">
    </span><span class="hljs-tag"><span class="tag">&lt;</span><span class="hljs-title"><span class="tag">div</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">class</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"navigation-top"</span></span><span class="tag">&gt;</span></span><span class="pln">
      </span><span class="hljs-tag"><span class="tag">&lt;</span><span class="hljs-title"><span class="tag">div</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">class</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"wrap"</span></span><span class="tag">&gt;</span></span><span class="pln">
        </span><span class="php"><span class="hljs-preprocessor"><span class="pun">&lt;?</span><span class="pln">php</span></span><span class="pln"> get_template_part</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'template-parts/navigation/navigation'</span></span><span class="pun">,</span><span class="pln"> </span><span class="hljs-string"><span class="str">'top'</span></span><span class="pln"> </span><span class="pun">);</span><span class="pln"> </span><span class="hljs-preprocessor"><span class="pun">?&gt;</span></span></span><span class="pln">
      </span><span class="hljs-tag"><span class="tag">&lt;/</span><span class="hljs-title"><span class="tag">div</span></span><span class="tag">&gt;</span></span><span class="hljs-comment"><span class="com">&lt;!-- .wrap --&gt;</span></span><span class="pln">
    </span><span class="hljs-tag"><span class="tag">&lt;/</span><span class="hljs-title"><span class="tag">div</span></span><span class="tag">&gt;</span></span><span class="hljs-comment"><span class="com">&lt;!-- .navigation-top --&gt;</span></span><span class="pln">
  </span><span class="php"><span class="hljs-preprocessor"><span class="pun">&lt;?</span><span class="pln">php</span></span><span class="pln"> </span><span class="hljs-keyword"><span class="pln">endif</span></span><span class="pun">;</span><span class="pln"> </span><span class="hljs-preprocessor"><span class="pun">?&gt;</span></span></span><span class="pln">

</span><span class="hljs-tag"><span class="tag">&lt;/</span><span class="hljs-title"><span class="tag">header</span></span><span class="tag">&gt;</span></span></code></pre>

<p>
	ثم علينا إضافة بعض شيفرات CSS إلى القالب الابن لكي تُنسَّق الصور البارزة مثل الصور الموجودة في الصفحة الرئيسية:
</p>

<pre class="ipsCode prettyprint lang-php prettyprinted" id="ips_uid_3947_16" style="">
<code class="hljs css"><span class="hljs-comment"><span class="com">/* Force sticky navigation into position */</span></span><span class="pln">
</span><span class="hljs-id"><span class="com">#page-header</span></span><span class="com"> </span><span class="hljs-rules"><span class="com">{</span><span class="pln">
  </span><span class="hljs-rule"><span class="hljs-attribute"><span class="pln">margin</span><span class="pun">-</span><span class="pln">bottom</span></span><span class="pun">:</span><span class="hljs-value"><span class="pln"> </span><span class="hljs-number"><span class="lit">0</span></span><span class="pln"> </span><span class="hljs-important"><span class="pun">!</span><span class="pln">important</span></span></span></span><span class="pun">;</span><span class="pln">
</span><span class="hljs-rule"><span class="pun">}</span></span></span><span class="pln">
</span><span class="hljs-comment"><span class="com">/* Force header image to full height */</span></span><span class="pln">
</span><span class="hljs-id"><span class="com">#custom-header-media</span></span><span class="com"> </span><span class="hljs-rules"><span class="com">{</span><span class="pln">
  </span><span class="hljs-rule"><span class="hljs-attribute"><span class="pln">height</span></span><span class="pun">:</span><span class="hljs-value"><span class="pln"> </span><span class="hljs-number"><span class="lit">100</span></span><span class="lit">vh</span></span></span><span class="pun">;</span><span class="pln">
  </span><span class="hljs-rule"><span class="hljs-attribute"><span class="pln">max</span><span class="pun">-</span><span class="pln">height</span></span><span class="pun">:</span><span class="hljs-value"><span class="pln"> </span><span class="hljs-number"><span class="lit">100</span></span><span class="pun">%</span></span></span><span class="pun">;</span><span class="pln">
  </span><span class="hljs-rule"><span class="hljs-attribute"><span class="pln">overflow</span></span><span class="pun">:</span><span class="hljs-value"><span class="pln"> hidden</span></span></span><span class="pun">;</span><span class="pln">
  </span><span class="hljs-rule"><span class="hljs-attribute"><span class="pln">position</span></span><span class="pun">:</span><span class="hljs-value"><span class="pln"> relative</span></span></span><span class="pun">;</span><span class="pln">
</span><span class="hljs-rule"><span class="pun">}</span></span></span></code></pre>

<p>
	انسخ الشيفرة السابقة وألصقها في ملف الأنماط <code>style.css</code> في القالب الابن.<br>
	الشيفرة التي وضعناها في ملف <code>header.php</code> والتنسيق الذي أضفناه إلى ملف <code>style.css</code> سيُجبِر الصورة لأن تكون بكامل الارتفاع؛ لكن بسبب الطريقة الديناميكية التي تُضاف فيها الفئات (classes) وتُحذَف؛ فإنَّ شريط التنقل الثابت (sticky) لن يعمل مباشرةً؛ وإنما علينا إضافة شيفرة jQuery إلى قالبنا لفعل ذلك.<br>
	يمكنك إضافة الشيفرة الآتية إلى ملف JavaScript ضمن القالب الابن أو إلى إضافة، لكن احرص على أن يُحمَّل الملف بعد تحميل مكتبة jQuery.
</p>

<pre class="ipsCode prettyprint lang-php prettyprinted" id="ips_uid_3947_16" style="">
<code class="hljs coffeescript"><span class="hljs-regexp"><span class="com">//</span></span><span class="com"> Sticky nav </span><span class="hljs-literal"><span class="com">on</span></span><span class="com"> pages </span><span class="hljs-keyword"><span class="com">and</span></span><span class="com"> posts</span><span class="pln">

</span><span class="hljs-reserved"><span class="kwd">var</span></span><span class="pln"> body </span><span class="pun">=</span><span class="pln"> jQuery</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'body'</span></span><span class="pln"> </span><span class="pun">);</span><span class="pln">
</span><span class="hljs-reserved"><span class="kwd">var</span></span><span class="pln"> navigation </span><span class="pun">=</span><span class="pln"> body</span><span class="pun">.</span><span class="pln">find</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'.navigation-top'</span></span><span class="pln"> </span><span class="pun">);</span><span class="pln">
</span><span class="hljs-reserved"><span class="kwd">var</span></span><span class="pln"> customHeader </span><span class="pun">=</span><span class="pln"> body</span><span class="pun">.</span><span class="pln">find</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'.custom-header'</span></span><span class="pln"> </span><span class="pun">);</span><span class="pln">
</span><span class="hljs-reserved"><span class="kwd">var</span></span><span class="pln"> navigationOuterHeight </span><span class="pun">=</span><span class="pln"> navigation</span><span class="pun">.</span><span class="pln">outerHeight</span><span class="pun">();</span><span class="pln">
</span><span class="hljs-keyword"><span class="kwd">if</span></span><span class="pln"> </span><span class="pun">(</span><span class="pln"> body</span><span class="pun">.</span><span class="pln">hasClass</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'has-header-image'</span></span><span class="pln"> </span><span class="pun">)</span><span class="pln"> </span><span class="pun">)</span><span class="pln"> </span><span class="pun">{</span><span class="pln">
  </span><span class="hljs-reserved"><span class="kwd">var</span></span><span class="pln"> headerOffset </span><span class="pun">=</span><span class="pln"> customHeader</span><span class="pun">.</span><span class="pln">innerHeight</span><span class="pun">()</span><span class="pln"> </span><span class="pun">-</span><span class="pln"> navigationOuterHeight</span><span class="pun">;</span><span class="pln">
</span><span class="pun">}</span><span class="pln">
jQuery</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-built_in"><span class="pln">window</span></span><span class="pln"> </span><span class="pun">).</span><span class="hljs-literal"><span class="pln">on</span></span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'scroll'</span></span><span class="pun">,</span><span class="pln"> </span><span class="hljs-reserved"><span class="kwd">function</span></span><span class="pun">()</span><span class="pln"> </span><span class="pun">{</span><span class="pln">
  </span><span class="hljs-keyword"><span class="kwd">if</span></span><span class="pln"> </span><span class="pun">(</span><span class="pln"> jQuery</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-built_in"><span class="pln">window</span></span><span class="pln"> </span><span class="pun">).</span><span class="pln">scrollTop</span><span class="pun">()</span><span class="pln"> </span><span class="pun">&gt;=</span><span class="pln"> headerOffset </span><span class="pun">)</span><span class="pln"> </span><span class="pun">{</span><span class="pln">
    navigation</span><span class="pun">.</span><span class="pln">addClass</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'site-navigation-fixed'</span></span><span class="pln"> </span><span class="pun">);</span><span class="pln">
  </span><span class="pun">}</span><span class="pln"> </span><span class="hljs-keyword"><span class="kwd">else</span></span><span class="pln"> </span><span class="pun">{</span><span class="pln">
    navigation</span><span class="pun">.</span><span class="pln">removeClass</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'site-navigation-fixed'</span></span><span class="pln"> </span><span class="pun">);</span><span class="pln">
  </span><span class="pun">}</span><span class="pln">
</span><span class="pun">});</span></code></pre>

<p>
	رائع! عندما تضيف الآن صورةً بارزةً إلى صفحةٍ أو منشور، فستُعرَض بكامل ارتفاع الشاشة، كما هي الترويسات الموجودة في الصفحة الرئيسية.
</p>

<h2 id="جميع-التعديلات-السابقة-في-قالب-ابن-وحيد">
	جميع التعديلات السابقة في قالب ابن وحيد
</h2>

<p>
	لقد أجرينا الكثير من التعديلات في هذا الدرس وقد يصعب على البعض تطبيقها، ولتسهيل الأمر عليك، فقد أجريتُ هذه التعديلات على قالب ابن <a href="https://github.com/jpen365/five-hacks-for-twenty-seventeen" rel="external nofollow">ورفعته على GitHub</a>؛ لذا إذا لم تجد نفسك متفرغًا للقيام بكل التعديلات السابقة ولا ترغب بإنشاء قالب ابن يدويًا لكن التعديلات أعجبتك وتريد تطبيقها على موقعك، فكل ما عليك فعله هو <a href="https://github.com/jpen365/five-hacks-for-twenty-seventeen/releases" rel="external nofollow">تنزيل الملف المضغوط</a> ثم رفعه إلى موقعك وتفعيل القالب.<br>
	إضافةً إلى ما سبق، عليك تثبيت إضافة <a href="https://wordpress.org/plugins/custom-sidebars/" rel="external nofollow">Custom Sidebars</a> وإضافة <a href="https://wordpress.org/plugins/jquery-smooth-scroll/" rel="external nofollow">jQuery Smooth Scroll</a> لكي تتمكن من الوصول إلى جميع التخصيصات التي أجريناها في هذا الدرس.<br>
	بعد ذلك، عليك إنشاء أقسام الصفحة الرئيسية وقائمة مخصصة للتنقل فيها والمشروحة بالتفصيل في درسنا السابق «<a href="https://academy.hsoub.com/apps/web/wordpress/%D8%AA%D8%AE%D8%B5%D9%8A%D8%B5-%D9%82%D8%A7%D9%84%D8%A8-twenty-seventeen-%D9%81%D9%8A-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-%D9%84%D9%8A%D9%86%D8%A7%D8%B3%D8%A8-%D8%A7%D9%84%D8%B4%D8%B1%D9%83%D8%A7%D8%AA-r258/" rel="">تخصيص قالب Twenty Seventeen في ووردبريس ليناسب الشركات</a>»  ثم خصِّص قائمة روابط مواقع التواصل الاجتماعي، واكتب النص الذي تريده في التذييل، وأضف الأشرطة الجانبية لأقسام الصفحة الرئيسية، وستظهر عندك النتيجة النهائية نفسها.<br>
	ترجمة -وبتصرّف- للمقال <a href="https://premium.wpmudev.org/blog/five-hacks-twenty-seventeen/" rel="external nofollow">‎5 Excellent Ways to Hack the Twenty Seventeen WordPress Theme</a> لصاحبه Jon Penland.
</p>
]]></description><guid isPermaLink="false">260</guid><pubDate>Sat, 20 May 2017 21:05:04 +0000</pubDate></item><item><title>&#x62A;&#x62E;&#x635;&#x64A;&#x635; &#x642;&#x627;&#x644;&#x628; Twenty Seventeen &#x641;&#x64A; &#x648;&#x648;&#x631;&#x62F;&#x628;&#x631;&#x64A;&#x633; &#x644;&#x64A;&#x646;&#x627;&#x633;&#x628; &#x627;&#x644;&#x634;&#x631;&#x643;&#x627;&#x62A;</title><link>https://academy.hsoub.com/apps/web/wordpress/%D8%AA%D8%AE%D8%B5%D9%8A%D8%B5-%D9%82%D8%A7%D9%84%D8%A8-twenty-seventeen-%D9%81%D9%8A-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-%D9%84%D9%8A%D9%86%D8%A7%D8%B3%D8%A8-%D8%A7%D9%84%D8%B4%D8%B1%D9%83%D8%A7%D8%AA-r258/</link><description><![CDATA[
<p><img src="https://academy.hsoub.com/uploads/monthly_2017_05/main2.jpg.a4114a5cb87dde8570aee1e07b02c6eb.jpg" /></p>

<p id="تخصيص-قالب-twenty-seventeen-في-ووردبريس-ليناسب-الشركات">
	يأتي قالب Twenty Seventeen كقالب افتراضي مع إصدار <a href="https://make.wordpress.org/core/4-7/" rel="external nofollow">ووردبريس 4.7</a>، وهذا القالب الموجّه للشركات والأعمال يُظهِر انحرافًا واضحًا في القوالب الافتراضي التي كانت تأتي مع ووردبريس والتي كانت متمحورة حول المدونات، والذي يُبيّن تحوّل ووردبريس من منصة تدوين إلى منصةٍ قادرةٍ على إنشاء جميع أنواع مواقع الويب.
</p>

<p style="text-align: center;">
	<img class="ipsImage ipsImage_thumbnailed" data-fileid="23300" data-unique="vsraiwedh" src="https://academy.hsoub.com/uploads/monthly_2017_05/main2.jpg.f93c313032502e871732fca7bb8eb419.jpg" alt="main2.jpg"></p>

<p>
	<br>
	إذا كنتَ تخطط لتجربة قالب Twenty Seventeen فستلاحظ أنَّ هذا القالب يختلف جذريًا عن القوالب التي سبقته، فالقوالب الافتراضية السابقة لا تتطلب إعدادًا مطولًا وكان الغرض منها هو استعمالها لإنشاء مدونات؛ لكن الأمر مختلفٌ مع قالب Twenty Seventeen.<br>
	نعم، تستطيع استعمال هذا القالب كقالبٍ لمدونتك، لكن هذا ليس هو الغرض الذي صُمِّمَ هذا القالب لأجله، فهو مصممٌ لإنشاء مواقع لشركات باستخدام صفحة رئيسية تُمثِّل صفحة هبوط (landing page) مُقسمَّةٍ إلى أقسام، ويمكن أن ترى ذلك بوضوح بالنظر إلى <a href="http://2017.wordpress.net/" rel="external nofollow">الموقع التجريبي الرسمي</a> لهذا القالب.<br>
	النتيجة التي أدى لها هذا التغيير في الهدف من القالب هي جعل إعداد قالب Twenty Seventeen يأخذ وقتًا أطول من بقية القوالب الافتراضية.<br>
	سنستكشف في هذا الدرس قالب Twenty Seventeen وما الذي يستطيع تقديمه، وسأريك كيفية إعداد القالب لضبط صفحة هبوط احترافية بسهولة.<br>
	ملاحظة: يجب أن تعلم أنَّ هذا الدرس مبنيٌ على نسخة قالب Twenty Seventeen المُضمَّنة بإصدار ووردبريس 4.7 RC، ويُفتَرَض أنَّ هذه النسخة مُطابِقة للنسخة النهائية من القالب التي ستوضَع في إصدار 4.7، لكن يُحتَمَل وجود بعض التعديلات الصغيرة.
</p>

<h2 id="لمحة-عن-قالب-twenty-seventeen">
	لمحة عن قالب Twenty Seventeen
</h2>

<p style="text-align: center;">
	<a class="ipsAttachLink ipsAttachLink_image" data-fileid="23241" href="https://academy.hsoub.com/uploads/monthly_2017_05/1-twenty-seventeen.png.6306c1eedf94f322c6ed86a6f3882936.png" rel=""><img alt="1-twenty-seventeen.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23241" data-unique="ixqo8fmzv" src="https://academy.hsoub.com/uploads/monthly_2017_05/1-twenty-seventeen.thumb.png.348f8012ad4ea6cdc083eb53d796916f.png"></a>
</p>

<p>
	<br>
	انتشرت في الآونة الأخيرة فكرة استخدام الصفحة الرئيسية كصفحة هبوط لمواقع الشركات، ويسمح لنا قالب Twenty Seventeen –المُضمَّن افتراضيًا في ووردبريس–بإنشاء صفحة هبوط جذابة.<br>
	لكي تأخذ فكرةً عن إمكانيات هذا القالب، فانظر إلى <a href="http://2017.wordpress.net/" rel="external nofollow">الموقع التجريبي الرسمي</a>.<br>
	ستلاحظ مباشرةً مقطع الفيديو المعروض في الترويسة. مرِّر إلى الأسفل قليلًا وسترى التصميم -الذي يُقسِّم الصفحة إلى أقسام- جليًا أمامك، فكلُّ قسمٍ مفصولٍ عن غيره بصورة خلفية مُطبّقٌ عليها تأثير اختلاف المنظور (parallax) والتي تحتل كامل طول وعرض نافذة المتصفح.<br>
	شريط التنقل بسيطٌ جدًا وهو ثابتٌ في أعلى الصفحة. ويُستعمَل خطٌ وحيدٌ ألا وهو <a href="https://fonts.google.com/specimen/Libre+Franklin" rel="external nofollow">Libre Franklin</a> في عموم القالب مع تنوعٍ في أوزانه (weights) وألوانه وتنسيقه.<br>
	بعد ضبط القالب ضبطًا سليمًا، فيُمثِّل قالب Twenty Seventeen قالبًا عصريًا ذا مظهرٍ احترافي، مبنيًا على خطٍ سهل القراءة، واستخدامٍ قويٍ للعناصر البصرية اللافتة للنظر مع استخدام المسافات البيضاء استعمالًا صحيحًا.
</p>

<h2 id="كيفية-إنشاء-أقسام-في-الصفحة-الرئيسية">
	كيفية إنشاء أقسام في الصفحة الرئيسية
</h2>

<p>
	بأخذ كمية العمل التي أجراها Matt Mullenweg على المُخصِّص (Customizer) في الآونة الأخير بالحسبان، فلن نُفاجأ أنَّ كمًّا كبيرًا من إعداد قالب Twenty Seventeen سنجريه في المُخصِّص.<br>
	تُبيّن الصورة الآتية الخيارات المتاحة في المُخصِّص بعد تفعيل قالب Twenty Seventeen:
</p>

<p style="text-align: center;">
	<img alt="2-twenty-seventeen-customizer.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23242" data-unique="wig3zhiv3" src="https://academy.hsoub.com/uploads/monthly_2017_05/2-twenty-seventeen-customizer.png.24a9ef5f741e351226b5d8ef34ac5fc6.png"></p>

<p>
	<br>
	إضافةً إلى الميزات الافتراضية مثل ضبط القوائم والودجات، يمكننا أن نضبط من المُخصِّص صورةَ (أو فيديو) الترويسةِ، ونُبدِّل الألوان إلى نظام ألوانٍ مختلف، ونُسنِد المحتوى إلى أقسام الصفحة الرئيسية.<br>
	يتضمن إصدار ووردبريس 4.7 ميزةً جديدةً اسمها «visible edit shortcuts» ، حيث تظهر هذه الميزة على شكل أيقونات زرقاء كما في الصورة أعلاه، والضغط على أي اختصارٍ من هذه الاختصارات سيؤدي إلى فتح قائمة المخصص المسؤولة عن تعديل هذا الجزء من الموقع.<br>
	هذا سيُسهِّل تعديل الكثير من الميزات في قالب Twenty Seventeen مثل صورة الترويسة، وعنوان الموقع والشعار اللفظي له، والمحتوى الذي يظهر في كل قسم من أقسام الصفحة. فكل ما عليك فعله هو العثور على المحتوى الذي تشاء تعديله ثم الضغط على الاختصار الظاهر بجواره، ثم تخصِّصَه كما تشاء.<br>
	تأتي ووردبريس 4.7 بميزةٍ أخرى في المُخصِّص التي يمكنك أن تراها في خيار «Additional CSS» (بالعربية: «تنسيقات CSS الإضافية»)، وهذه الميزة أصبحت متوافرةً لكامل القوالب المثبّتة في ووردبريس 4.7 وليست خاصةً بقالب Twenty Seventeen.<br>
	لشرح كيفية ضبط قالب Twenty Seventeen فسأحاول إعداده كما لو كنتُ سأستخدمه لموقعي الشخصي.
</p>

<h3 id="الخطوة-الأولى-إنشاء-صفحة-لكل-قسم-من-أقسام-الصفحة-الرئيسية">
	الخطوة الأولى: إنشاء صفحة لكل قسم من أقسام الصفحة الرئيسية
</h3>

<p style="text-align: center;">
	<img alt="3-create-pages.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23243" data-unique="1igm6117s" src="https://academy.hsoub.com/uploads/monthly_2017_05/3-create-pages.png.60ef1ea9fbd61ee9976c35132fe5b521.png"></p>

<p>
	<br>
	علينا أولًا إنشاء بضع صفحات:
</p>

<ul>
<li>
		إنشاء صفحة لنستعملها كصفحة رئيسية ثابتة.
	</li>
	<li>
		إنشاء صفحة لنستعلمها للمدونة أو لعرض المنشورات.
	</li>
	<li>
		إنشاء أربع صفحات إضافية تتضمن المحتوى الذي نريد عرضه في أقسام الصفحةالرئيسية.
	</li>
</ul>
<p>
	أنشِئ ثلاث صفحات إضافية إذا كنتَ تُخطِّط لاستعمال مدونتك أو صفحة المنشورات كقسمٍ من أقسام الصفحة الرئيسية.<br>
	أما للموقع الذي سنضبطه في هذا الدرس، فسأنشِئ صفحةً رئيسيةً، وصفحة للمدونة، وصفحة about، وصفحة services، وصفحة contact.
</p>

<h3 id="الخطوة-الثانية-إضافة-صورة-بارزة-لكل-صفحة">
	الخطوة الثانية: إضافة صورة بارزة لكل صفحة
</h3>

<p>
	للاستفادة من تأثير اختلاف المنظور (parallax) فسنحتاج إلى صورةٍ بارزةٍ (featured image) كبيرة والتي ستُشكِّل جزءًا من أقسام الصفحة الرئيسية. لن تحتاج إلى إضافة صورة بارزة لصفحة Home التي أنشأتها في الخطوة السابقة، لكن يجب أن تُضيف صورةً بارزةً لجميع الصفحات الأخرى.
</p>

<p style="text-align: center;">
	<img alt="4-set-featured-image.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23244" data-unique="l21cw8ea3" src="https://academy.hsoub.com/uploads/monthly_2017_05/4-set-featured-image.png.f75bbb33eb4a2fe7e2ebf8e0b51640bb.png"></p>

<p>
	<br>
	الصور التي تستعملها النسخة التجريبية من Twenty Seventeen بقياس 2000×1200 بكسل، استعمل الصور التي تكون أبعادها قريبةً من الرقم السابق؛ أما الصور الصغيرة فستعطي نتيجةً سيئةً.<br>
	استعملتُ في المثال صورًا مجانيةً من <a href="http://stocksnap.io/" rel="external nofollow">StockSnap</a> وأعدتُ تحجيمهم جميعًا إلى حوالي 2000 بكسل بالعرض و 1200 بكسل بالطول (± 10%).
</p>

<h3 id="الخطوة-الثالثة-إسناد-صفحة-رئيسية-ثابتة-وصفحة-للمنشورات">
	الخطوة الثالثة: إسناد صفحة رئيسية ثابتة وصفحة للمنشورات
</h3>

<p style="text-align: center;">
	<img alt="5-static-front-page.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23245" data-unique="uw5ol8qzs" src="https://academy.hsoub.com/uploads/monthly_2017_05/5-static-front-page.png.0a7b1a83721fb3f7bac5fa13cdcc7923.png"></p>

<p>
	<br>
	حان الوقت الآن لبدء عملية التخصيص، افتح المُخصِّص بالذهاب إلى «Appearance &gt; Customize» (مظهر &gt; تخصيص) في لوحة التحكم أو عبر الضغط على زر «Customize» (تخصيص) في شريط الإدارة الظاهر في الواجهة الأمامية لموقعك.<br>
	اختر عنصر «Static Front Page» (صفحة رئيسية ثابتة) من القائمة وأجرِ التعديلات الآتية:
</p>

<ul>
<li>
		تحت عنوان «Front page displays» (تعرض الصفحة الرئيسية)، انتقِ «Astatic page» (صفحة ثابتة).
	</li>
	<li>
		في قائمة «Front page» (الصفحة الرئيسية) المنسدلة اختر الصفحة الرئيسيةالتي أنشأتها سابقًا.
	</li>
	<li>
		في قائمة «Posts page» (صفحة المقالات) المنسدلة اختر صفحة المنشورات أوالمدونة.
	</li>
</ul>
<p>
	لا تنسَ الضغط على زر «Save &amp; Publish» (حفظ ونشر)، ثم انتقل إلى الخطوة التالية.
</p>

<h2 id="الخطوة-الرابعة-إسناد-كل-صفحة-إلى-قسم-من-أقسام-الصفحة-الرئيسية">
	الخطوة الرابعة: إسناد كل صفحة إلى قسمٍ من أقسام الصفحة الرئيسية
</h2>

<p style="text-align: center;">
	<img alt="6-assign-front-page-panels.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23246" data-unique="iexighzml" src="https://academy.hsoub.com/uploads/monthly_2017_05/6-assign-front-page-panels.png.c6946a26e41e218b1334b47d6e492b70.png"></p>

<p>
	<br>
	لإسناد مختلف الصفحات التي أنشأتَها مسبقًا إلى أقسام الصفحة الرئيسية فاضغط على عنصر «Theme Options» (خيارات القالب) في قائمة المُخصِّص. ثم استخدم القوائم المنسدلة لإسناد كل صفحة إلى القسم الملائم لها والذي تريد إظهارها فيه.
</p>

<h3 id="الخطوة-الخامسة-إنشاء-قائمة-التنقل-الرئيسية">
	الخطوة الخامسة: إنشاء قائمة التنقل الرئيسية
</h3>

<p>
	يمكنك إنشاء قائمة التنقل عبر الخيار «Menus» (قوائم) من داخل قائمة المُخصِّص أو عبر الذهاب إلى صفحة «Appearance &gt; Menus» (مظهر &gt; قوائم) في لوحة التحكم. وبغض النظر عن مكان إنشائك للقائمة، فأحب أن أنوِّه إلى أنَّ إنشاء القوائم لم يتغير في إصدار 4.7، أي أنشِئ القائمة كما فعلت سابقًا ثم أسندها إلى المكان المُسمى «Top Menu» (القائمة العلوية).
</p>

<h3 id="الخطوة-السادسة-إضافة-فيديو-كترويسة-للصفحة">
	الخطوة السادسة: إضافة فيديو كترويسة للصفحة
</h3>

<p style="text-align: center;">
	<img alt="7-twenty-seventeen-video-header.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23247" data-unique="z20eo42zy" src="https://academy.hsoub.com/uploads/monthly_2017_05/7-twenty-seventeen-video-header.png.fc37528cb0e4931a3d20e1874bcb29b2.png"></p>

<p>
	<br>
	لنضع مقطع فيديو بدلًا من صورة الترويسة الافتراضية «المملة». اذهب إلى القسم الملائم في المُخصِّص عبر الضغط على أيقونة التعديل الزرقاء أو ابحث عن خيار «Header Media» (وسائط الترويسة) في المُخصِّص.<br>
	ارفع أو اختر مقطع الفيديو الذي تريد استخدامه، ويمكنك أيضًا وضع رابط URL لفيديو على موقع يوتيوب إذا أردتَ ذلك. إذا أردتَ رفع مقطع فيديو فاعلم أنَّ من الأفضل أن تكون أبعاد الفيديو 2000×1200 بكسل.<br>
	اخترتُ <a href="https://videos.pexels.com/videos/man-typing-on-a-keyboard-1132" rel="external nofollow">مقطع فيديو مجاني</a> لأستعمله في موقعي، وهو بأبعاد 1920×1080 بكسل، ولا يتوافق تمامًا مع الأبعاد المُستحسنة، لكنه يبدو بشكلٍ جيد في الموقع.<br>
	أنهينا الآن إنشاء الصفحة الرئيسية مع إسناد الأقسام المختلفة إليها. هذه هي الصفحة التي أنشأتُها في موقعي باتباع الخطوات التي ذكرناها أعلاه (هذه الصورة متحركة):
</p>

<p style="text-align: center;">
	<img alt="twenty-seventeen-final-product.gif" class="ipsImage" src="https://academy.hsoub.com/uploads/imageproxy/twenty-seventeen-final-product.gif.e72b3ba6c7ee71c9f62f203e56a56ec4.gif"></p>

<h3 id="إنشاء-قائمة-تنقل-بين-أقسام-الصفحة-الرئيسية">
	إنشاء قائمة تنقّل بين أقسام الصفحة الرئيسية
</h3>

<p>
	إحدى الميزات غير الموجودة في قالب Twenty Seventeen هي دعم التنقل بين أقسام الصفحة الرئيسية. فمن الجميل أن تتمكن من الانتقال إلى القسم الذي تريده في الصفحة الرئيسية مباشرةً؛ لكن لحسن الحظ، يمكن إضافة هذه الميزة المُغفَلة بسهولة.<br>
	أوّل ما علينا فعله هو إنشاء قائمة التي تُشير روابطها إلى خاصية <code>id</code> لأقسام الصفحة الرئيسية بدلًا من إشارتها إلى صفحات مختلفة في موقعك. ولفعل ذلك، علينا إنشاء قائمة مخصصة التي تبدو روابطها كما في الصورة:
</p>

<p style="text-align: center;">
	<img alt="9-link-to-ids.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23238" data-unique="8iuu8mon4" src="https://academy.hsoub.com/uploads/monthly_2017_05/9-link-to-ids.png.ab7f68eeeef4162fe8e65c4b952f1370.png"></p>

<p>
	<br>
	عند كتابة مُعرِّفات <code>id</code> في القائمة السابقة، فاستعمل أسماء الصفحات المُعروضة في أقسام الصفحة الرئيسية، لكن اجعل حالة الأحرف صغيرة وضع شرطة <code>-</code> بدلًا من الفراغات.<br>
	إذا ثبّتتَ ووردبريس في مجلدٍ فرعي (وهذا شائعٌ جدًا خصوصًا للمواقع المطوَّرة في بيئات التطوير المحلية) فعليك تضمين المجلد الفرعي في الروابط التي تُدخِلها في القائمة التي أنشأتها. فمثلًا، كان الموقع التجريبي الذي أعمل عليه موجودًا في الرابط <a href="http://localhost/wp4point7" rel="external nofollow">http://localhost/wp4point7</a> وهذا يعني أنَّ ووردبريس مثبتةٌ في مجلدٍ فرعي (<code>‎/wp4point7</code>) ولكي تعمل الروابط عملًا سليمًا، فسأحتاج إلى تضمين اسم المجلد الفرعي في رابط URL كما يلي: <code>‎/wp4point7/#about</code>.<br>
	أما إذا لم تُثبِّت ووردبريس في مجلدٍ فرعي، فلا حاجة إلى وضع اسم المجلد واستعمل البُنية الظاهرة في الصورة أعلاه.<br>
	بعد إنشاء قائمة التنقل فستحتاج إلى إضافة مُعرِّفات <code>id</code> لكل قسم من أقسام الصفحة. يمكنك فعل ذلك بطريقتين.<br>
	الحل الأسهل هو إضافة مُعرِّفات <code>id</code> مباشرةً إلى عناوين الصفحة باستخدام مُحرِّر الصفحات في ووردبريس، وذلك بإضافة شيفرة HTML مباشرةً إلى حقل العنوان.
</p>

<p style="text-align: center;">
	<img alt="10-add-the-id-to-page-editor.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23239" data-unique="02h2b9bi4" src="https://academy.hsoub.com/uploads/monthly_2017_05/10-add-the-id-to-page-editor.png.7d19f36a80ef2dfa5322e55e9913f133.png"></p>

<p>
	<br>
	لاحظ أنَّه لإضافة مُعرِّف <code>id</code> كان علي وضع العنوان ضمن عنصر <code>&lt;span&gt;</code>، وكان المُعرِّف مكتوبًا بأحرفٍ صغيرة مع وضع شرطات <code>-</code> بدلًا من الفراغات. وهذا يعني أنَّ المُعرِّفات التي نضعها هنا ستُطابِق تلك التي وضعناها في روابط قائمة التنقل. إضافة إلى أنني أضفتُ حاشيةً علوية (top padding) بمقدار 96 بكسل. وعندما يُضغَط على الروابط فستؤدي قيمة الحاشية السابقة إلى دفع المحتوى باتجاه الأسفل لكي نتمكن من رؤية العنوان تحت شريط التنقل الثابت في أعلى الصفحة.<br>
	لكي أكون صادقًا معك، أرى أنَّ هذه الطريقة غير عملية ولا أحبِّذ استعمالها. والطريقة التي أُفضِّلها هي إضافة عنصر <code>span</code> ومُعرِّف <code>id</code> والحاشية باستخدام jQuery. وبهذا لن أحتاج إلى تعديل عناوين الصفحات وإضافة شيفرات إليها، وسأحصل على نفس النتيجة في نفس الوقت.<br>
	هذه هي الشيفرة التي كتبتُها والتي تفعل ما نرغب به:
</p>

<pre class="ipsCode prettyprint lang-html prettyprinted" id="ips_uid_6413_9">
<code class="hljs javascript">jQuery( <span class="hljs-string">"h2.entry-title"</span> ).each( <span class="hljs-function"><span class="hljs-keyword">function</span><span class="hljs-params">()</span> {</span>
  <span class="hljs-keyword">var</span> panelId = jQuery( <span class="hljs-keyword">this</span> ).html().toLowerCase().replace(<span class="hljs-regexp">/\s+/g</span>, <span class="hljs-string">"-"</span>);
  jQuery( <span class="hljs-keyword">this</span> ).wrapInner(<span class="hljs-function"><span class="hljs-keyword">function</span><span class="hljs-params">()</span> {</span>
    <span class="hljs-keyword">return</span> <span class="hljs-string">"&lt;span style='padding-top:96px;' id='"</span> + panelId + <span class="hljs-string">"'&gt;&lt;/span&gt;"</span>;
  })
})</code></pre>

<p>
	ما تفعله الشيفرة السابقة هو العثور على عنوان كل قسم ثم وضعه في عنصر <code>span</code> مع تنسيقٍ مناسب؛ وستُنشِئ الشيفرة مُعرِّف <code>id</code> بقيمةٍ مناسبة بأخذ عنوان القسم وجعله بحالةٍ صغيرة وبإبدال الشرطات بالفرغات. فلو كان عندما قسمٌ بعنوان My Blog (كما في الصورة السابقة)، فالشيفرة السابقة تُضيف خاصية <code>id</code> الآتية: <code>id='my-blog'‎</code> وهي نفس الصيغة التي استعملتها عند إنشاء روابط قائمة التنقل.<br>
	لتحميل الشيفرة السابقة إلى موقعك فيمكنك إضافتها في أحد المكانين الآتيين: ملف JavaScript الذي يُشكِّل جزءًا من قالب ابن لقالب Twenty Seventeen، أو إلى إضافةٍ التي تُضيف شيفرات JavaScript مخصصة.<br>
	اتخذتُ الطريقة الثانية في موقعي واستعملتُ <a href="https://github.com/jpen365/custom-css-and-js-plugin" rel="external nofollow">إضافةً لتحميل شيفرات JavaScript و CSS</a> إلى الموقع والمشروحة في مقالة <a href="https://premium.wpmudev.org/blog/theme-modification-plugin/" rel="external nofollow">How to Turn Any WordPress Theme Modification into a Simple Plugin</a>، لكن يمكنك استخدام إضافة أخرى مثل <a href="https://wordpress.org/plugins/custom-css-js/" rel="external nofollow">Simple Custom CSS and JS</a> لتحميل شيفرة jQuery السابقة.<br>
	بعد إضافة شيفرة jQuery وإنشاء قائمة التنقل، فسأريك كيف أصبحت قائمة التنقل في موقعي (صورة متحركة):
</p>

<p style="text-align: center;">
	<br><br><img alt="twenty-seventeen-dynamic-navigation.gif" class="ipsImage" src="https://academy.hsoub.com/uploads/imageproxy/twenty-seventeen-dynamic-navigation.gif.51f6b9667be44cdd81d1058e0f21e255.gif"></p>

<p>
	<br><br>
	رائع، لقد أصبح قالب Twenty Seventeen جاهزًا كصفحة هبوط، وأضفنا إليه شريطًا للتنقل بين أقسام الصفحة. إذا أردتَ إضافة أشياء أخرى إلى ما أنشأناه، فخذ هذه التحسينات بالحسبان:
</p>

<ul>
<li>
		<a href="https://premium.wpmudev.org/blog/wordpress-redirection-plugins/" rel="external nofollow">إضافة قواعد إعادة توجيه</a> لكي يتمكن أيُّ شخصٍ يزور أحد صفحاتك المعروضة كقسمٍ في صفحتك الرئيسية أن يُعاد توجيهه إلى القسم المناسب في الصفحة الرئيسية. فمثلًا، أعد توجيه الصفحة <a href="http://example.com/contact" rel="external nofollow">http://example.com/contact</a> إلى القسم الآتي في الصفحة الرئيسية <a href="http://example.com/#contact" rel="external nofollow">http://example.com/#contact</a>.
	</li>
	<li>
		إذا قررتَ استخدام jQuery لتفعيل ميزة التنقل بين أقسام الصفحة الرئيسية، فضع <a href="https://academy.hsoub.com/programming/php/wordpress/%D8%AA%D8%B9%D8%B1%D9%81-%D8%B9%D9%84%D9%89-%D8%A7%D9%84%D9%88%D8%B3%D9%88%D9%85-%D8%A7%D9%84%D8%B4%D8%B1%D8%B7%D9%8A%D8%A9-%D9%81%D9%8A-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-r150/" rel="">وسومًا شرطيةً</a> (conditional tags) لتحميل الشيفرة في الصفحة الرئيسية فقط.
	</li>
	<li>
		إذا تضمن موقعك صفحاتٍ إضافيةً لا تمثِّل أقسامًا في صفحتك الرئيسية، فأضف تلك الصفحات إلى قائمة التنقل، وأنقل جمع روابط التنقل الخاصة بأقسام الصفحة الرئيسية إلى قائمة فرعية تظهر عند الضغط على كلمة «Home» كما في الصورة أدناه.
	</li>
</ul>
<p style="text-align: center;">
	<img alt="12-dropdown-menu.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23240" data-unique="bg8lq5hlp" src="https://academy.hsoub.com/uploads/monthly_2017_05/12-dropdown-menu.png.408db32b3fa8b7a15fd364133c7c5146.png"></p>

<h2 id="الخلاصة">
	الخلاصة
</h2>

<p>
	قالب Twenty Seventeen بدأ عصرًا جديدًا من قوالب ووردبريس (القوالب الافتراضية على الأقل)، ومن الواضح أنَّ مطوري ووردبريس الذين يقفون خلف قالب Twenty Seventeen ملتزمون بدفع ووردبريس لتصبح أكثر من منصة تدوين ولتدخل عالم مواقع الشركات والتجارة الإلكترونية.<br>
	يوفِّر قالب Twenty Seventeen تصميمًا عصريًا للصفحة الرئيسية التي تُقسَّم إلى أقسام؛ لكن ضبطه يحتاج وقتًا أطول وجهدًا أكثر مقارنةً بما سبقه من القوالب الافتراضية.<br>
	رأيتَ في هذا الدرس كيف أنَّ الجهد المبذول لإعداد القالب قد آتى أُكله، وأنَّ النتيجة كانت موقعًا احترافيًا وجذابًا والذي لم نكن لنحلم بتحقيقه باستخدام القوالب الافتراضية السابقة.<br>
	ترجمة -وبتصرّف- للمقال <a href="https://premium.wpmudev.org/blog/twenty-seventeen-wordpress-theme/" rel="external nofollow">How to Customize the Free Twenty Seventeen WordPress Theme for Business</a>لصاحبه Jon Penland.
</p>
]]></description><guid isPermaLink="false">258</guid><pubDate>Mon, 15 May 2017 21:04:00 +0000</pubDate></item><item><title>14 &#x623;&#x62F;&#x627;&#x629;&#x64B; &#x62A;&#x633;&#x627;&#x639;&#x62F;&#x643; &#x639;&#x644;&#x649; &#x641;&#x647;&#x645; &#x633;&#x644;&#x648;&#x643; &#x632;&#x648;&#x627;&#x631; &#x645;&#x648;&#x642;&#x639;&#x643; &#x623;&#x648; &#x645;&#x62F;&#x648;&#x646;&#x62A;&#x643; &#x648;&#x627;&#x62D;&#x62A;&#x64A;&#x627;&#x62C;&#x627;&#x62A;&#x647;&#x645;</title><link>https://academy.hsoub.com/apps/web/wordpress/14-%D8%A3%D8%AF%D8%A7%D8%A9%D9%8B-%D8%AA%D8%B3%D8%A7%D8%B9%D8%AF%D9%83-%D8%B9%D9%84%D9%89-%D9%81%D9%87%D9%85-%D8%B3%D9%84%D9%88%D9%83-%D8%B2%D9%88%D8%A7%D8%B1-%D9%85%D9%88%D9%82%D8%B9%D9%83-%D8%A3%D9%88-%D9%85%D8%AF%D9%88%D9%86%D8%AA%D9%83-%D9%88%D8%A7%D8%AD%D8%AA%D9%8A%D8%A7%D8%AC%D8%A7%D8%AA%D9%87%D9%85-r257/</link><description><![CDATA[
<p><img src="https://academy.hsoub.com/uploads/monthly_2017_05/main.png.a8ae521be6bfb10ebc1c0d56293221f4.png" /></p>

<p>
	لقد أنشأتَ شركتك لتلبي احتياجات مستخدميك، أليس كذلك؟ سواءً كنتَ ستساعدهم شخصيًا أو على الهاتف أو عبر البريد الإلكتروني، وتستطيع مساعدتهم أيضًا –دون تدخلٍ منك– عبر موقعك الإلكتروني. وسواءً أكانوا زبائن محتملين يستكشفون الموقع، أو زوارًا مشتركين في موقعك لكنهم لم يشتروا شيئًا بعد، أو أنَّهم زبائن يدفعون لقاء خدماتك؛ لكن الأمر ليس مهمًا، وإنما المهم أن تتواصل معهم دومًا.
</p>

<p>
	وما لم تكن تسأل زوارك عمّا يفعلون، فكيف ستعرف شعورهم تجاه شركتك؟ هذا الأمر مهمٌ جدًا خصوصًا لموقعك الإلكتروني، الذي يُشكِّل دعامةً أساسيةً لشركتك والذي أنفقته عليه مالًا ووقتًا كثيرًا لبنائه.
</p>

<p>
	أقتبس المقولة الآتية من <a href="http://www.huffingtonpost.com/vala-afshar/50-important-customer-exp_b_8295772.html" rel="external nofollow">Esteban Kolsky</a>:
</p>

<blockquote class="ipsQuote" data-ipsquote="">
	<div class="ipsQuote_citation">
		Quote
	</div>

	<div class="ipsQuote_contents ipsClearfix">
		<p>
			«يشتكي زبونٌ واحدٌ من أصل 26 زبونًا مستاءً من خدمتك، أما البقية فيبقون صامتين. الدرس الذي يجب أن نتعلمه هنا هو أنَّ الشركات يجب ألّا تظن أنَّ عدم شكوى الزبائن هو علامةٌ لرضاهم. فالعدو الحقيقي لك هو عدم مبالاتهم بك.»
		</p>
	</div>
</blockquote>

<p>
	العبرة من الكلام السابق هي: لو شعر الزبون بعدم الرضى بأيِّ حالٍ من الأحوال، فلا تظن أنه سيأتي إليك شاكيًا؛ ما لم يكن زبونًا أمضى وقتًا طويلًا في شراء منتجاتك وكان مخلصًا لك (لكن مع ذلك، لا أضمن لك أنَّه سيشتكي)، فلماذا يضيعوا أوقاتهم لكي يُعلِموك بأنَّ الموقع لا يفتح بسرعة أو أنَّ هنالك تحذيرًا أمنيًا يظهر في متصفحهم؟ عليك أن تكتشف ذلك بنفسك.
</p>

<p>
	إذا لم تكن تحاول اكتشاف سلوك زوار موقعك بنفسك، فحان الوقت لفعل ذلك؛ وستساعدك القائمة الآتية التي تضم 14 أداةً «تتجسس» على زوار موقعك لمحاولة فهم ما الذي تفعله بشكلٍ جيد في موقعك، وما الذي لا تجيده…
</p>

<h2>
	الأدوات التي تساعدك في فهم سلوك زوارك واحتياجاتهم
</h2>

<p>
	أيُّ شخصٍ يأخذ وقتًا ليتفاعل مع موقعك يتوقع أن يحصل على شيءٍ ما في المقابل، وصحيحٌ أنَّ المقابل يختلف من موقعٍ لآخر، لكن هنالك قاعدة ثابتة: زوار موقعك (وزبائنك المحتملون والقدامى) لا يريدون وجود أمرٍ يعكِّر عليهم زيارتهم لموقعك.
</p>

<p>
	لكن دون استعمال الأدوات الصحيحة، فقد لا تعرف ما الذي يزعج زوارك. صحيحٌ أنَّ Google Analytics يمكن أن يُشير إلى وجود مشكلة ما، لكنه ليس كافيًا في أغلب الأوقات. فلا تركن إلى Google Analytics وحده ليخبرك كامل القصة. فمعدلات الارتداد العالية (High bounce rates) سيئة جدًا، لكن هل يمكنك أن تعرف السبب؟
</p>

<p>
	هنالك عدِّة طرائق يمكنك استعمالها لتعرف ما الذي يفعله زوارك، وأدوات التحليل مثل أداة Google Analytics لا تكفي أبدًا، لذا اطلع على كامل القائمة.
</p>

<h2>
	أدوات التحليل
</h2>

<p>
	لنبدأ بمراجعة الأرقام!
</p>

<h3>
	Google Analytics
</h3>

<p style="text-align: center;">
	<img alt="1-Google-Analytics.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23203" data-unique="kuiula9xr" src="https://academy.hsoub.com/uploads/monthly_2017_05/1-Google-Analytics.png.2b10d7be4527bb3373197a3217dea7da.png"></p>

<p>
	حسنًا، أعلمُ أنني قلتُ منذ قليل أنَّ <a href="https://analytics.google.com/analytics/" rel="external nofollow">Google Analytics </a>ليس «كافيًا»، لكنه ما يزال جزءًا مهمًا من ترسانة الأدوات «التجسسية» على زوارك، حيث يتيح لك معرفة:
</p>

<ul>
<li>
		من هم زوار موقعك، بما في ذلك الموقع الجغرافي، والتوزع الديموغرافي، والأجهزة والمتصفحات التي يستعملونها، وهلم جرًا.
	</li>
	<li>
		كيف وجدوا موقعك، هل هو عبر وسائل التواصل الاجتماعي، أو عبر البحث العادي، أو البحث المدفوع، وهكذا.
	</li>
	<li>
		أين ذهبوا أوّلَ ما زاروا موقعك، وكم مَكِثوا فيه.
	</li>
	<li>
		ما هي الأهداف التي حققوها من زيارة موقعك، بما في ذلك ملء نماذج HTML، أو قراءة عدد معيّن من المقالات، أو شراء بعض البضائع …إلخ.
	</li>
</ul>
<p>
	هنالك الكثير من المعلومات التي نستطيع الحصول عليه من Google Analytics، لذا اعتمد على نظام التقارير الخاص بهم لتبسيط الأمر، وذلك بإعداد تقارير تَتَتبّع معدلات الارتداد وخروج الزوار من موقعك وغير ذلك. يمكنك أيضًا الانتباه إلى توجّه زوارك في الوقت الحقيقي.
</p>

<p>
	اقرأ أيضًا: <a href="https://academy.hsoub.com/tags/%D9%85%D8%AF%D8%AE%D9%84%20%D8%A5%D9%84%D9%89%20google%20analytics/" rel="">سلسلة مدخل إلى Google Analytics</a>
</p>

<h3>
	إضافة Google Analytics Dashboard for WP
</h3>

<p style="text-align: center;">
	<img alt="2-GA-for-WP.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23204" data-unique="qp9jb3ow0" src="https://academy.hsoub.com/uploads/monthly_2017_05/2-GA-for-WP.png.c19ad520275d0830909cbfe11ee5249c.png"></p>

<p>
	بعد أن تضبط Google Analytics في موقعك، فيمكنك أن تُضيفه إلى لوحة تحكم ووردبريس، وبهذا ستضمن أنَّه في كل مرة تدخل فيها إلى لوحة تحكم ووردبريس فستتذكر أن تتحقق من نشاط الموقع.
</p>

<p>
	هنالك الكثير من الإضافات المتوافرة لفعل ذلك، لكنِّ إضافة «<a href="https://wordpress.org/plugins/google-analytics-dashboard-for-wp/" rel="external nofollow">Google Analytics Dashboard for WP</a>» هي أشهرها وأعلاها تقييمًا؛ وبالإضافة إلى إظهارها للقطة شاشة لنشاط موقعك في الوقت الحقيقي، فهي تخبرك أيضًا معلوماتٍ عن مدى تحقيق هدفك، ومعدلات الارتداد، وأخطاء 404 (الناجمة عن محاولة الزائر الدخول إلى صفحة غير موجودة)، والكثير غير ذلك.
</p>

<h3>
	Kissmetrics
</h3>

<p style="text-align: center;">
	<img alt="3-Kissmetrics.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23205" data-unique="umab2ocmc" src="https://academy.hsoub.com/uploads/monthly_2017_05/3-Kissmetrics.png.40a8641e31b4bc69e934a57139f9b2db.png"></p>

<p>
	لنتحدث عن مسار التحويل الخاص بموقعك، والذي هو المسار المثالي الذي يملكه كل موقع والذي يؤدي إلى تحويل الزائر إلى زبون عندما يصل إلى نهاية هذا المسار؛ وربما بنيتَ موقعك بناءً استراتيجيًا اعتمادًا على هذا المفهوم. وأحد الأشياء التي لا تستطيع أدوات التحليل إخبارك بها هي ما الذي يحدث في ذاك المسار: فماذا يفعل زوارك؟ وما الذي يدفعهم لمغادرة الموقع؟ وهكذا.
</p>

<p>
	<a href="https://www.kissmetrics.com/" rel="external nofollow">خدمة Kissmetrics </a>هي خدمةٌ مدفوعة، لكنها تعطيك رؤية واضحة عن سلوك زوارك وكيف تتجنب أيّة عثرات في هذا المسار.
</p>

<h3>
	Chartbeat
</h3>

<p style="text-align: center;">
	<img alt="4-Chartbeat.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23206" data-unique="cerf6lrc8" src="https://academy.hsoub.com/uploads/monthly_2017_05/4-Chartbeat.png.7a1c7a7d9eae64e41150c8dfc53dd699.png"></p>

<p>
	إذا كان في موقعك محتوىً كثير وكنت تريد معرفة إن كان ذلك المحتوى ناجحًا أم فاشلًا اعتمادًا على سلوك زوارك، فأداة <a href="https://chartbeat.com/" rel="external nofollow">Chartbeat </a>هي أداةٌ رائعةٌ تستحق التجربة. حيث تستعمل هذه الأداة نهجًا متعدد المسارات لتتبع سلوك زوارك (بما في ذلك مدة التركيز على المحتوى، ومعدّلات التوقف عن القراءة …إلخ.) أثناء قراءتهم لمحتوى موقعًا. ثم تعطيك القدرة على تعديل وتحسين محتواك في الوقت الحقيقي اعتمادًا على سلوكهم.
</p>

<h2>
	أدوات تتبع نشاط الزوار عبر خرائط التفاعل
</h2>

<p>
	تحليل البيانات هو الخطوة الأولى لمعرفة إذا كانت هنالك مشكلة في موقعك أم لا، أمّا خرائط التفاعل (heat maps) فهي الخطوة الثانية التي يجب أن تتخذها لتساعدك في إصلاح الخلل الذي يحدث مع زوارك.
</p>

<h3>
	Heatmap
</h3>

<p>
	هذه <a href="https://heatmap.me/" rel="external nofollow">الأداة</a> التي تُنشِئ خرائط التفاعل هي خيارٌ جيد لنبدأ به، ليس لأنها متوافرة مجانًا، بل لأن هنالك <a href="https://wordpress.org/plugins/heatmap-for-wp/" rel="external nofollow">إضافةً</a> يمكنك استعمالها في ووردبريس.
</p>

<p>
	صحيحٌ أنَّ أدوات إنشاء خرائط التفاعل التي سنذكرها في هذا الدرس تُسجِّل نفس نوع المعلومات تقريبًا، وكل واحدة منها لها ميزات خاصة. وميزة هذه الأداة أنَّها تُسجِّل النشاط على مختلف الأنظمة والأجهزة، مما يعطيك نظرةً أفضل على نقاط ضعف التصميم المتجاوب لموقعك.
</p>

<h3>
	SeeVolution
</h3>

<p style="text-align: center;">
	<img alt="5-Seevolution.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23207" data-unique="i7htd0cjx" src="https://academy.hsoub.com/uploads/monthly_2017_05/5-Seevolution.png.dc8b98f249f6d46bfb1dd027e9611b21.png"></p>

<p>
	تقنية خرائط التفاعل التي توفرها أداة <a href="https://www.seevolution.com/" rel="external nofollow">SeeVolution</a> تحاول عرض ما يلي إلى مستخدميها:
</p>

<ul>
<li>
		أكثر المناطق التي يُضغَط عليها في الموقع.
	</li>
	<li>
		أكثر الأماكن التي تتحرك عليها الفأرة (وبالتالي، أكثر المناطق التي تلفت انتباه زوارك).
	</li>
	<li>
		نسبة الزوار الذين يُمرِّرون إلى أسفل الصفحة.
	</li>
</ul>
<p>
	إذا كنتَ مهتمًا بمعرفة ما الذي يُعرَض من موقعك وفيما إذا كانت هنالك نقاط ضعف لا تجذب انتباه الزوار، فهذه الأداة ستوجِّهك للطريق الصحيح.
</p>

<h3>
	CrazyEgg
</h3>

<p style="text-align: center;">
	<img alt="6-CrazyEgg.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23208" data-unique="eku62i6yc" src="https://academy.hsoub.com/uploads/monthly_2017_05/6-CrazyEgg.png.cbc0c2627bb7cbb43df2c06d06c3c1d7.png"></p>

<p>
	أداة <a href="https://www.crazyegg.com/" rel="external nofollow">CrazyEgg</a> شبيهةً بتقنية خرائط التفاعل التي توفرها أداة SeeVolution، الفرق الرئيسي بينهما هو وجود أداة «Confetti».
</p>

<p>
	هذه الأداة لا تعرض ما هي أكثر المناطق التي ينقر عليها زوار موقعك فحسب، لكنها توفر أيضًا إحصائيات عن الزوار بناءً على طريقة تعرفهم على موقعك أو الذين وصلوا إلى موقعك عبر كلمات بحث معيّنة. لنقل مثلًا أنَّه يأتيك عددٌ كبيرٌ من الزوار الذين بحثوا عن كلمةٍ مفتاحيةٍ معيّنة، لكن أغلبية الزوار قد خرجوا من الموقع دون اتخاذ أيّة إجراءات، وهذا دليلٌ قويٌ على وجود مشكلة في استخدامك لتقنية SEO. أي أنَّ هذه الأداة مفيدةٌ للتعرف على توجهات زوارك.
</p>

<h3>
	إضافة Hotspots Analytics
</h3>

<p style="text-align: center;">
	<img alt="7-Hotspots-Analytics-plugin.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23209" data-unique="64p2zfopp" src="https://academy.hsoub.com/uploads/monthly_2017_05/7-Hotspots-Analytics-plugin.png.0036aa780251d67c80711793c5a96f83.png"></p>

<p>
	هل تبحث عن أداةٍ مجانيةٍ توفِّر لك خرائط التفاعل وتريد أن تعمل على ووردبريس؟ انظر إذًا إلى إضافة «<a href="https://wordpress.org/plugins/hotspots/" rel="external nofollow">Hotspots Analytics</a>»، حيث ستريك هذه الإضافة المواضع الموجودة في موقعك والتي ينقر عليها (أو يلمسها) زوارك كثيرًا. توجد في هذه الإضافة ميزةٌ تريك توزّع النقرات على فترةٍ من الزمن، وستستفيد من هذه الميزة إذا عدَّلتَ في تصميم موقعك وأردتَ أن تعرف كيف يمكن أن تغيّر هذه التعديلات في سلوك زوارك.
</p>

<h2>
	أدوات المحادثة الحية
</h2>

<p>
	هل توفِّر ميزة المحادثة الحية في موقعك؟ إذا كان جوابك هو النفي، فأنصحك بأن تستعمل أداةً بسيطةً لتعرف وجهات نظر زبائنك.
</p>

<h3>
	GoSquared
</h3>

<p style="text-align: center;">
	<img alt="8-GoSquared.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23210" data-unique="5ad3bfhh7" src="https://academy.hsoub.com/uploads/monthly_2017_05/8-GoSquared.png.77c57f98bac78619b768bf73c3c6bc9c.png"></p>

<p>
	قد تظن أنَّ استعمال أدوات المحاثة الحية مقتصرٌ على شركات التجارة الإلكتروني التي تريد التفاعل مع الزبائن لزيادة احتمال بيع منتجاتها. لكنك ستُفاجأ من كثرة الاستخدامات التي ستجدها لبرمجيات المحادثة الحية؛ إحدى ميزاتها غير المتوقعة هي معرفة إن كان زوارك على وشك مغادرة الموقع.
</p>

<p>
	فباستخدام أدوات مثل <a href="https://www.gosquared.com/acquire/" rel="external nofollow">GoSquared</a>، يمكنك أن تُنشَأ تواصلًا مع زوارك، وتتبعهم أثناء رحلتهم في موقعك، وتوفر لهم اهتمامًا ومساعدةً عندما يتحدثون معك.
</p>

<h3>
	إضافة Live Chat by Formilla
</h3>

<p style="text-align: center;">
	<img alt="9-Live-chat-by-Formilla.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23211" data-unique="pxfefik4a" src="https://academy.hsoub.com/uploads/monthly_2017_05/9-Live-chat-by-Formilla.png.0803b6daf5754822d6cc6f3fb5f2b680.png"></p>

<p>
	أحد أفضل الأمور التي تستطيع توفيرها لزوار موقعك هو أن يكون دعمك وإجابتك لأسئلتهم تفاعليًا؛ وعند استخدام نافذة محادثة صغيرة في الطرف السفلي من صفحتك، فأنت تخبرهم أنَّك موجودٌ إذا ما احتاجوا لك.
</p>

<p>
	هذه <a href="https://wordpress.org/plugins/formilla-live-chat/" rel="external nofollow">الإضافة</a> تطلب من الزوار مشاركة بريدهم الإلكتروني أولًا قبل بدء المحادثة، وتوفِّر لهم «حسابًا» لكن تعلم مَن هم (وفي أي منطقةٍ يتواجدون، ومن أين أتوا إلى موقعك … إلخ.). وهذه فرصةٌ إضافيةٌ لكي تفهم فيها سلوك زوار موقعك، ولكي تعلم إذا كانوا يواجهون مشاكل أثناء تواجدهم في الموقع.
</p>

<h2>
	أدوات التتبع الشاملة
</h2>

<p>
	إذا كنتَ تظن أنَّ خرائط التفاعل جميلة، فقد كان الوقت الآن لترى أدواتٍ متكاملة التي تتضمن تتبعًا عبر خرائط التفاعل، وتسجيلًا لسلوك الزوار في الموقع، وتحليلًا لمسار التحويل (conversion funnel analysis)، والمزيد.
</p>

<h3>
	Clicktale
</h3>

<p style="text-align: center;">
	<img alt="10-Clicktale.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23212" data-unique="m5kzuii0i" src="https://academy.hsoub.com/uploads/monthly_2017_05/10-Clicktale.png.9d10aec359aa2df807a258447c9a8777.png"></p>

<p>
	إذا كان وقتك ضيقًا وأردتَ أن تعرف مباشرةً ما الذي يُضغَط وبأي تواتر ومِن مَن، فأنصحك باستعمال خرائط التفاعل، لكن إذا أردتَ أن تُشاهد بالتفصيل ما الذي يفعله الزائر في موقعك، فانظر إلى التسجيل الذي توفره أداة <a href="https://www.clicktale.com/" rel="external nofollow">Clicktale</a>.
</p>

<p>
	هذه الأداة تُسجِّل جلسة مستخدم سطح المكتب أو الهاتف في موقعك، وتريك كيف حرَّكوا الفأرة في موقعك، ومتى مرَّروا إلى الأسفل، أو كيف ضغطوا على قائمة التنقل، وأداة Clicktale تتضمن خرائط تفاعل وتحليلًا لمسار التحويل، لكي تستطيع إنشاء دراسة تفصيلية عن زوار موقعك وسلوكهم.
</p>

<h3>
	hotjar
</h3>

<p style="text-align: center;">
	<img alt="11-Hotjar.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23213" data-unique="yj85bujkb" src="https://academy.hsoub.com/uploads/monthly_2017_05/11-Hotjar.png.0f517a605a964c7b0505e1dc4b05a883.png"></p>

<p>
	أداة <a href="https://www.hotjar.com/" rel="external nofollow">hotjar</a> هي أداةٌ شاملةٌ لتتبع الزوار وتعطيك كل التفاصيل التي تحتاج لها لكي تفهم سلوكهم ولكي تقيّم أداء موقعك. هذه الأداة تملك عدِّة ميزات تستحق الاستكشاف إذا أردتَ أن تحثّ زوارك على التواصل معك عبر الاستفتاءات والاستبيانات.
</p>

<h3>
	LuckyOrange
</h3>

<p style="text-align: center;">
	<img alt="12-LuckyOrange.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23214" data-unique="rm59pf351" src="https://academy.hsoub.com/uploads/monthly_2017_05/12-LuckyOrange.png.e68f8e4945b1a7b8b9cf19072957ec49.png"></p>

<p>
	يجب أن تُدرِك في هذه اللحظة أنَّ كل الأدوات الشاملة تمتلك نفس الميزات. وإذا كنتَ تبحث عن أداةٍ تُسجِّل كل الأمور السابقة (إضافةً إلى غيرها) فانظر إلى أداة <a href="http://www.luckyorange.com/" rel="external nofollow">LuckyOrange</a>.
</p>

<p>
	من السهل البدء باستخدام هذه الأداة؛ وهذه قائمةٌ بميزات تتبع الزوار التي تأتي معها:
</p>

<ul>
<li>
		صفحة التحليل
	</li>
	<li>
		تسجيلات الموقع
	</li>
	<li>
		خرائط تفاعل ديناميكية
	</li>
	<li>
		محادثة حية
	</li>
	<li>
		تحليل لمسار التحويل
	</li>
	<li>
		نموذج لكتابة مراجعة أو للتواصل
	</li>
	<li>
		استفتاءات لأخذ رأي الزبائن
	</li>
</ul>
<h2>
	الأدوات السلوكية
</h2>

<p>
	أخيرًا وليس آخرًا، لنتحدث عن أهمية اختبار A/B للتجسس احترافيًا على زوار الموقع.
</p>

<h3>
	اختبار A/B
</h3>

<p style="text-align: center;">
	<img alt="13-AB_testing_03_735.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23215" data-unique="g9xe23z70" src="https://academy.hsoub.com/uploads/monthly_2017_05/13-AB_testing_03_735.png.a43ffbc6c239e0a0b7d395f6538e591b.png"></p>

<p>
	صحيحٌ أنَّ <a href="https://premium.wpmudev.org/blog/ab-testing/" rel="external nofollow">اختبار A/B</a> ليس ضروريًا للتجسس على سلوك زوار موقعك، لكنه يساعدك في فهم ما الذي يجعلهم مستائين.
</p>

<p>
	لذا، إذا قمتَ بكل إجراءات التحليل، وتتبعتَ الزوار عبر خرائط التفاعل، وفعّلتَ إمكانية المحادثة الحية مع زوارك، ولكنك ما زلتَ لا تعرف ما السبب وراء مغادرة زوارك للموقع، فاستخدام اختبار A/B للتأكد من نظريتك. فهذا الاختبار هو أسهل طريقة للتأكد من جودة اتخاذ منهج مختلف لمحتوى موقعك أو لتصميمه أو لمسار التحويل، والعديد من أدوات اختبار A/B مبنيةٌ في ووردبريس ولا تحتاج إلى استخدام أدوات خارجية.
</p>

<h2>
	الخلاصة
</h2>

<p>
	هل تريد أن يقل معدّل ارتداد الزوار وأن يزداد زمن بقائهم في موقعك؟ وتريد أن ترى المسار الذي اتبعه كل زائر في موقعك؟ وتريد أن تمنح زوارك تجربةً خاصةً والتي لن يحصلوا عليها من موقعٍ منافسٍ لك؟
</p>

<p>
	لا تنتظر أن يظهر الزوار من العدم (لأنك قد تنتظر إلى الأبد حتى يحدث ذلك)، وابدأ بالتجسس عليهم وانظر كيف تستطيع تحسين موقعك.
</p>

<p>
	ترجمة -وبتصرّف- للمقال<a href="https://premium.wpmudev.org/blog/sneaky-online-tools-spy-on-site-visitors" rel="external nofollow">‎14 Sneaky Online Tools to Help You Spy on Your Site’s Visitors</a> لصاحبته Brenda Barron.
</p>
]]></description><guid isPermaLink="false">257</guid><pubDate>Sat, 13 May 2017 04:06:29 +0000</pubDate></item><item><title>&#x625;&#x646;&#x634;&#x627;&#x621; &#x62A;&#x635;&#x646;&#x64A;&#x641;&#x627;&#x62A; &#x645;&#x62E;&#x635;&#x635;&#x629; &#x644;&#x623;&#x642;&#x633;&#x627;&#x645; &#x634;&#x631;&#x643;&#x62A;&#x643; &#x639;&#x644;&#x649; &#x645;&#x648;&#x642;&#x639; &#x648;&#x648;&#x631;&#x62F;&#x628;&#x631;&#x64A;&#x633;</title><link>https://academy.hsoub.com/apps/web/wordpress/%D8%A5%D9%86%D8%B4%D8%A7%D8%A1-%D8%AA%D8%B5%D9%86%D9%8A%D9%81%D8%A7%D8%AA-%D9%85%D8%AE%D8%B5%D8%B5%D8%A9-%D9%84%D8%A3%D9%82%D8%B3%D8%A7%D9%85-%D8%B4%D8%B1%D9%83%D8%AA%D9%83-%D8%B9%D9%84%D9%89-%D9%85%D9%88%D9%82%D8%B9-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-r256/</link><description><![CDATA[
<p><img src="https://academy.hsoub.com/uploads/monthly_2020_06/5eeaeff260218_-------.jpg.b9a4354da6732945347751447de7bd2c.jpg" /></p>

<p id="إنشاء-تصنيفات-مخصصة-لأقسام-شركتك-على-موقع-ووردبريس">
	تأتيني عادةً أسئلةٌ عمّا إذا كانت <a href="https://academy.hsoub.com/apps/web/wordpress/wordpress-multisite/" rel="">شبكةٌ متعددة المواقع تعمل على ووردبريس</a> هي خيارٌ مناسبٌ لمواقع الشركات التي لديها أقسامٌ متنوعةٌ ذات طابعٍ مختلف. ويكون جوابي عادةً هو «نعم»، يمكن لشبكةٍ متعددة المواقع فعل ذلك.<br>
	لكن ليس من الضروري إنشاء موقعٍ منفصلٍ لكل قسمٍ من أقسام شركتك (حتى لو استعملتَ شبكةً متعددة المواقع تعتمد على ووردبريس)؛ فإذا أردتَ مشاركة المحتوى غير الخاص بقسمٍ معيّن، أو كانت «هوية» (identity) أقسام شركتك تتشابه كثيرًا، أو إذا كان عندك موقعٌ مستقل ولا ترغب بتحويله إلى شبكةٍ متعددة المواقع، فهنالك دومًا طريقةٌ للالتفاف على هذه الإشكالية دون تفعيل الشبكة متعددة المواقع.<br>
	سأريك في هذا المنشور طريقة فعل ذلك باستخدام «التصنيفات المخصصة» (custom taxonomies). حيث سنُنشِئ تصنيفًا باسم «division» الذي يمكن إسناد المنشورات والصفحات إليه، لذا ستتمكن من تحديد ما هي الأقسام التي يجب وضع كل منشور أو صفحة فيها. ثم سنُنشِئ ملف قالب لذاك التصنيف، مما يعني إمكانية عرض المحتوى الموجود في كل قسم بالشكل الذي تريده.<br>
	سنحتاج إلى كتابة بعض الشيفرات لإنشاء إضافة (plugin) وإنشاء ملف في قالبك، لكن الشيفرة لن تكون صعبةً، وسنستخدم «قالب ابن» تابع للقالب الافتراضي Twenty Sixteen لكن يمكنك استخدام هذه الطريقة على أيّ قالب تشاء. سنُنشِئ أيضًا ملفًا لتسجيل (register) التصنيف المخصص، ومن الأفضل فعل ذلك عبر إضافة، لكيلا تخسر الشيفرة التي تُنشِئ التصنيف المخصص في حال تغيّر قالب مستقبلًا.<br>
	لنبدأ بالعمل.
</p>

<h2 id="تجهيز-القالب-الابن">
	تجهيز القالب الابن
</h2>

<p>
	قبل أن نبدأ، يجب أن نملك:
</p>

<ul>
<li>
		موقعًا تطويريًا أو مخصصًا للتجريب يعمل على ووردبريس، والذي يُمثِّل نسخةً من موقع الشركة الذي لديك. لكن أحذِّرك أن تفعل ذلك على موقعٍ إنتاجي، وإنما ارفع الملفات إلى الموقع الإنتاجي بعد أن تتأكد أنَّها تعمل دون مشاكل.
	</li>
	<li>
		محرِّر شيفرات.
	</li>
	<li>
		أحد القوالب، الذي يمكن أن يكون قالبًا خاصًا بشركتك، أو قالب ابن للقالب Twenty Sixteen (كالذي أستعمله)، إذا كنتَ ستستخدم قالب ابن فتأكَّد أنَّ قالب Twenty Sixteen مثبّتٌ لديك.
	</li>
</ul>
<p>
	ابدأ بإنشاء قالب ابن وتفعيله، إلا أنّي لن أشرح هذا بالتفصيل، وإنما سأحيلك إلى <a href="https://academy.hsoub.com/programming/php/wordpress/%D9%83%D9%8A%D9%81-%D8%AA%D9%86%D8%B4%D8%A6-%D9%82%D8%A7%D9%84%D8%A8-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-%D9%81%D8%B1%D8%B9%D9%8A-r107/" rel="">درسٍ آخر</a>.<br>
	هذه هي الشيفرة التي سأستخدمها في ملف <code>style.css</code> في القالب الابن:
</p>

<pre class="ipsCode prettyprint lang-php prettyprinted" id="ips_uid_1121_7" style="">
<span class="com">/*
Theme Name:     WPMU DEV Taxonomy for Company Website Divisions
Theme URI:      https://github.com/rachelmccollin/wpmu-taxonomy-company-divisions
Description:    Theme to support WPMU DEV post on custom menu items
Author:         Rachel McCollin
Author URI:     http://rachelmccollin.co.uk/
Template:       twentysixteen
Version:        1.0
*/</span><span class="pln">

</span><span class="lit">@import</span><span class="pln"> url</span><span class="pun">(</span><span class="str">"../twentysixteen/style.css"</span><span class="pun">);</span></pre>

<p>
	ربما تلاحظ من الشيفرة السابقة أنني رفعتُ الملفات الخاصة بهذا الدرس على <a href="https://github.com/rachelmccollin/wpmu-taxonomy-company-divisions" rel="external nofollow">GitHub</a>، يمكنك أن تنزلها من هناك وتستعملها بدلًا من إنشائها يدويًا. أنشَأتُ أيضًا <a href="http://rachelmccollin.co.uk/wpmu-taxonomy-company-divisions/" rel="external nofollow">موقعًا تجريبيًا</a>.<br>
	بعد أن تفعِّل القالب الابن، فستلاحظ أنَّه يبدو كقالب Twenty Sixteen الافتراضي:
</p>

<p style="text-align: center;">
	<img alt="1-starting-site.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23172" data-unique="2auu448jr" src="https://academy.hsoub.com/uploads/monthly_2017_05/1-starting-site.png.f2da759a16cc1db7de3ae46328c0c4a9.png"></p>

<h2 id="تسجيل-التصنيف-المخصص-في-ووردبريس">
	تسجيل التصنيف المخصص في ووردبريس
</h2>

<p>
	الخطوة التالية هي تسجيل التصنيف المخصص عبر إنشاء إضافة. إلا أنَّك تستطيع إضافة الشيفرة إلى ملف <code>functions.php</code> في قالبك، لكن المشكلة هي أنَّ هذه الشيفرة ستُحذف (وسيختفي التصنيف المخصص الجديد) في حال حدَّثتَ قالبك في المستقبل.<br>
	أنشِئ ملفًا جديدًا في مجلد الإضافات <code>plugins</code> (الموجود في مجلد <code>wp-content</code>) وأعطهِ اسمًا مناسبًا، وافتحه وأضف إليه التعليقات الآتية:
</p>

<pre class="ipsCode prettyprint lang-php prettyprinted" id="ips_uid_1121_7" style="">
<code class="hljs java"><span class="pun">&lt;?</span><span class="pln">php
</span><span class="hljs-javadoc"><span class="com">/**
* Plugin Name: WPMU DEV Register Division Taxonomy
* Plugin URI: https://github.com/rachelmccollin/wpmu-taxonomy-company-divisions
* Description: Registers a 'division' taxomy for use in your copmany website.
* Version: 1.0
* Author: Rachel McCollin
* Author URI: http://rachelmccollin.co.uk
*/</span></span></code></pre>

<p>
	أضف الآن هذه الدالة لتسجيل التصنيف المخصص:
</p>

<pre class="ipsCode prettyprint lang-php prettyprinted" id="ips_uid_1121_7" style="">
<code class="hljs php"><span class="hljs-function"><span class="hljs-keyword"><span class="kwd">function</span></span><span class="pln"> </span><span class="hljs-title"><span class="pln">wpmudev_register_taxonomy</span></span><span class="hljs-params"><span class="pun">()</span></span><span class="pln"> </span><span class="pun">{</span></span><span class="pln">

  </span><span class="hljs-variable"><span class="pln">$labels</span></span><span class="pln"> </span><span class="pun">=</span><span class="pln"> </span><span class="hljs-keyword"><span class="pln">array</span></span><span class="pun">(</span><span class="pln">
        </span><span class="hljs-string"><span class="str">'name'</span></span><span class="pln">              </span><span class="pun">=&gt;</span><span class="pln"> __</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'Divisions'</span></span><span class="pln"> </span><span class="pun">),</span><span class="pln">
        </span><span class="hljs-string"><span class="str">'singular_name'</span></span><span class="pln">     </span><span class="pun">=&gt;</span><span class="pln"> __</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'Division'</span></span><span class="pln"> </span><span class="pun">),</span><span class="pln">
        </span><span class="hljs-string"><span class="str">'search_items'</span></span><span class="pln">      </span><span class="pun">=&gt;</span><span class="pln"> __</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'Search Divisions'</span></span><span class="pln"> </span><span class="pun">),</span><span class="pln">
        </span><span class="hljs-string"><span class="str">'all_items'</span></span><span class="pln">         </span><span class="pun">=&gt;</span><span class="pln"> __</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'All Divisions'</span></span><span class="pln"> </span><span class="pun">),</span><span class="pln">
        </span><span class="hljs-string"><span class="str">'edit_item'</span></span><span class="pln">         </span><span class="pun">=&gt;</span><span class="pln"> __</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'Edit Divisions'</span></span><span class="pln"> </span><span class="pun">),</span><span class="pln">
        </span><span class="hljs-string"><span class="str">'update_item'</span></span><span class="pln">       </span><span class="pun">=&gt;</span><span class="pln"> __</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'Update Divisions'</span></span><span class="pln"> </span><span class="pun">),</span><span class="pln">
        </span><span class="hljs-string"><span class="str">'add_new_item'</span></span><span class="pln">      </span><span class="pun">=&gt;</span><span class="pln"> __</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'Add New Division'</span></span><span class="pln"> </span><span class="pun">),</span><span class="pln">
        </span><span class="hljs-string"><span class="str">'new_item_name'</span></span><span class="pln">     </span><span class="pun">=&gt;</span><span class="pln"> __</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'New Division Name'</span></span><span class="pln"> </span><span class="pun">),</span><span class="pln">
        </span><span class="hljs-string"><span class="str">'menu_name'</span></span><span class="pln">         </span><span class="pun">=&gt;</span><span class="pln"> __</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'Divisions'</span></span><span class="pln"> </span><span class="pun">),</span><span class="pln">
    </span><span class="pun">);</span><span class="pln">

    </span><span class="hljs-variable"><span class="pln">$args</span></span><span class="pln"> </span><span class="pun">=</span><span class="pln"> </span><span class="hljs-keyword"><span class="pln">array</span></span><span class="pun">(</span><span class="pln">
        </span><span class="hljs-string"><span class="str">'labels'</span></span><span class="pln"> </span><span class="pun">=&gt;</span><span class="pln"> </span><span class="hljs-variable"><span class="pln">$labels</span></span><span class="pun">,</span><span class="pln">
        </span><span class="hljs-string"><span class="str">'hierarchical'</span></span><span class="pln"> </span><span class="pun">=&gt;</span><span class="pln"> </span><span class="hljs-keyword"><span class="kwd">true</span></span><span class="pun">,</span><span class="pln">
        </span><span class="hljs-string"><span class="str">'sort'</span></span><span class="pln"> </span><span class="pun">=&gt;</span><span class="pln"> </span><span class="hljs-keyword"><span class="kwd">true</span></span><span class="pun">,</span><span class="pln">
        </span><span class="hljs-string"><span class="str">'args'</span></span><span class="pln"> </span><span class="pun">=&gt;</span><span class="pln"> </span><span class="hljs-keyword"><span class="pln">array</span></span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'orderby'</span></span><span class="pln"> </span><span class="pun">=&gt;</span><span class="pln"> </span><span class="hljs-string"><span class="str">'term_order'</span></span><span class="pln"> </span><span class="pun">),</span><span class="pln">
        </span><span class="hljs-string"><span class="str">'show_admin_column'</span></span><span class="pln"> </span><span class="pun">=&gt;</span><span class="pln"> </span><span class="hljs-keyword"><span class="kwd">true</span></span><span class="pln">
    </span><span class="pun">);</span><span class="pln">

    register_taxonomy</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'division'</span></span><span class="pun">,</span><span class="pln"> </span><span class="hljs-keyword"><span class="pln">array</span></span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'post'</span></span><span class="pun">,</span><span class="pln"> </span><span class="hljs-string"><span class="str">'page'</span></span><span class="pln"> </span><span class="pun">),</span><span class="pln"> </span><span class="hljs-variable"><span class="pln">$args</span></span><span class="pun">);</span><span class="pln">

</span><span class="pun">}</span><span class="pln">
add_action</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'init'</span></span><span class="pun">,</span><span class="pln"> </span><span class="hljs-string"><span class="str">'wpmudev_register_taxonomy'</span></span><span class="pln"> </span><span class="pun">);</span></code></pre>

<p>
	الشيفرة السابقة ستُسجِّل تصنيفًا باسم <code>division</code> وتعطي لافتاتٍ مناسبةً له وتضبط عنوانًا سيظهر في القائمة… وتحدِّد الشيفرة السابقة أيضًا أنَّنا نستطيع إضافة هذا التصنيف إلى المنشورات والمقالات وذلك عبر تمرير الوسيط <code>array( 'post', 'page' )</code> إلى دالة <a href="https://codex.wordpress.org/Function_Reference/register_taxonomy" rel="external nofollow"><code>register_taxonomy()‎</code></a>.<br>
	فعِّل الإضافة في موقعك، ويجب أن تملك الآن وصولًا إلى تصنيفٍ جديد عندما تحاول تحرير الصفحات والمنشورات:
</p>

<p style="text-align: center;">
	<img alt="2-new-post.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23173" data-unique="8nc6d3nel" src="https://academy.hsoub.com/uploads/monthly_2017_05/2-new-post.png.ca504ba152b306c27584c42621b7a4d8.png"></p>

<p>
	يمكنك الآن إنشاء عناصر ضمن التصنيف الجديد تُمثِّل أقسام شركتك، ثم تُسنِد إليها المنشورات والصفحات.
</p>

<h2 id="عرض-أقسام-شركتك-في-الموقع">
	عرض أقسام شركتك في الموقع
</h2>

<p>
	لقد أنشأتُ بعض المحتوى من منشوراتٍ وصفحاتٍ وأسندته إلى أقسامٍ مختلفة. هذه بضعة منشوراتٍ من التي أضفتُها:
</p>

<p style="text-align: center;">
	<img alt="3-posts-with-divisions.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23174" data-unique="kgj5n0rvk" src="https://academy.hsoub.com/uploads/monthly_2017_05/3-posts-with-divisions.png.808abc59387cad63161f11c89e89675d.png"></p>

<p>
	أنشأتُ أيضًا بعض الصفحات للأقسام، وأنشأتُ أيضًا صفحاتٍ عامةً:
</p>

<p style="text-align: center;">
	<img alt="4-pages-with-divisions.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23175" data-unique="od8n7zblw" src="https://academy.hsoub.com/uploads/monthly_2017_05/4-pages-with-divisions.png.5e6bea0fcfe530b46c0c59e91f8953b6.png"></p>

<p>
	يمكنك الآن إضافة جميع صفحاتك وأقسامك إلى قائمة التنقل الأساسية في موقعك، لكن لا تُضف المنشورات، لأنها ستُعرضَ في صفحات الأرشيف. لقد فعلتُ ما سبق في صفحة «Menus» (القوائم) في لوحة التحكم:
</p>

<p style="text-align: center;">
	<img alt="5-nav-menu.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23176" data-unique="n8wf8rebr" src="https://academy.hsoub.com/uploads/monthly_2017_05/5-nav-menu.png.5755d1143b491c478101ce30a22d889a.png"></p>

<p>
	ستُنشِئ ووردبريس صفحة أرشيف تلقائيًا لكل قسم من أقسام شركتك، وستعرض تلك الصفحات باستعمال أكثر صفحات القالب تحديدًا والموجودة في قالبك (وفقًا <a href="https://wphierarchy.com/" rel="external nofollow">لهيكلية ملفات القوالب</a>).<br>
	هذه هي صفحة الأرشيف لتصنيف «Research and Development»:
</p>

<p style="text-align: center;">
	<img alt="6-default-taxonomy-archive.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23177" data-unique="q9fcempjy" src="https://academy.hsoub.com/uploads/monthly_2017_05/6-default-taxonomy-archive.png.c1592a12d9c08e2712bddcaf26daea1d.png"></p>

<p>
	قامت ووردبريس بعملها على أتم وجه، فوضعت المنشورات والصفحات المُسنَدَة إلى التصنيف. لكنها تعرضها بترتيبٍ زمني كما قد تتوقع، لكنني أفضِّل عرض جميع الصفحات أولًا متبوعةً بالمنشورات، ولفعل ذلك سأُنشِئ صفحة أرشيف للتصنيف المُخصص وأستعمل فيها نسخةً مخصصةً من حلقة الدوران في ووردبريس (يسمونها the loop).
</p>

<h2 id="إنشاء-صفحة-أرشيف-للتصنيفات-المخصصة">
	إنشاء صفحة أرشيف للتصنيفات المخصصة
</h2>

<p>
	لعرض صفحة أرشيف التصنيفات المخصصة كما نشاء، فعلينا إنشاء ملف قالب باسم <code>taxonomy-divsion.php</code> ولنفعل ذلك بنسخ ملف قالب موجود مسبقًا ثم تعديله.<br>
	إذا كان في قالب ملفٌ باسم <code>archive.php</code> فأنشِئ نسخةً منه وسمِّها <code>taxonomy-divsion.php</code>، أما إذا لم يكن في قالبك الملف السابق، فانسخ الملف <code>index.php</code>. ولأنني أعمل مع قالب Twenty Sixteen فأُنشِئ نسخةً من ملف <code>archive.php</code> وأضعه في مجلد القالب الابن باسم <code>taxonomy-divsion.php</code>.<br>
	علينا أولّا تعديل التعليقات في بداية الملف لكي تصف بدقة محتويات هذا الملف:
</p>

<pre class="ipsCode prettyprint lang-php prettyprinted" id="ips_uid_1121_7" style="">
<code class="hljs java"><span class="pun">&lt;?</span><span class="pln">php
</span><span class="hljs-javadoc"><span class="com">/**
 * The template for displaying division archive pages
 */</span></span></code></pre>

<p>
	اعثر الآن على الشيفرة المسؤولة عن حلقة التكرار، وهي تبدو كالآتي في حال نسختَها من قالب Twenty Sixteen:
</p>

<pre class="ipsCode prettyprint lang-php prettyprinted" id="ips_uid_1121_7" style="">
<code class="hljs fsharp"><span class="pun">&lt;?</span><span class="pln">php
</span><span class="hljs-comment"><span class="com">// Start the Loop.</span></span><span class="pln">
</span><span class="hljs-keyword"><span class="kwd">while</span></span><span class="pln"> </span><span class="pun">(</span><span class="pln"> have_posts</span><span class="pun">()</span><span class="pln"> </span><span class="pun">)</span><span class="pln"> </span><span class="pun">:</span><span class="pln"> the_post</span><span class="pun">();</span><span class="pln">
    </span><span class="com">/*
     * Include the Post-Format-specific template </span><span class="hljs-keyword"><span class="com">for</span></span><span class="com"> the content.
     * If you want </span><span class="hljs-keyword"><span class="com">to</span></span><span class="com"> </span><span class="hljs-keyword"><span class="com">override</span></span><span class="com"> this </span><span class="hljs-keyword"><span class="com">in</span></span><span class="com"> a child theme, </span><span class="hljs-keyword"><span class="com">then</span></span><span class="com"> include a file
     * called content-___.php (where ___ is the Post Format name) </span><span class="hljs-keyword"><span class="com">and</span></span><span class="com"> that will be used instead.
     */</span><span class="pln">
    get_template_part</span><span class="pun">(</span><span class="pln"> </span><span class="str">'template-parts/content'</span><span class="pun">,</span><span class="pln"> get_post_format</span><span class="pun">()</span><span class="pln"> </span><span class="pun">);</span><span class="pln">
</span><span class="hljs-comment"><span class="com">// End the loop.</span></span><span class="pln">
</span><span class="typ">Endwhile</span><span class="pun">;</span></code></pre>

<p>
	الشيفرة السابقة تستدعي ملفًا من Twenty Sixteen باسم <code>content.php</code>، سنبقي على الشيفرة السابقة، لكننا سنُشغِّلها مرتين: مرة للمنشورات ومرة للصفحات.<br>
	عدِّل حلقة التكرار في ملف القالب لتصبح كما يلي:
</p>

<pre class="ipsCode prettyprint lang-php prettyprinted" id="ips_uid_1121_7" style="">
<code class="hljs xml"><span class="php"><span class="hljs-preprocessor"><span class="pun">&lt;?</span><span class="pln">php</span></span><span class="pln">
</span><span class="hljs-comment"><span class="com">// Start the first Loop - pages.</span></span><span class="pln">
</span><span class="hljs-keyword"><span class="kwd">while</span></span><span class="pln"> </span><span class="pun">(</span><span class="pln"> have_posts</span><span class="pun">()</span><span class="pln"> </span><span class="pun">)</span><span class="pln"> </span><span class="pun">:</span><span class="pln"> the_post</span><span class="pun">();</span><span class="pln">
    </span><span class="hljs-variable"><span class="pln">$posttype</span></span><span class="pln"> </span><span class="pun">=</span><span class="pln"> get_post_type</span><span class="pun">(</span><span class="pln"> get_the_ID</span><span class="pun">()</span><span class="pln"> </span><span class="pun">);</span><span class="pln">
    </span><span class="hljs-keyword"><span class="kwd">if</span></span><span class="pln"> </span><span class="pun">(</span><span class="pln"> </span><span class="hljs-variable"><span class="pln">$posttype</span></span><span class="pln"> </span><span class="pun">==</span><span class="pln"> </span><span class="hljs-string"><span class="str">'page'</span></span><span class="pln"> </span><span class="pun">)</span><span class="pln"> </span><span class="pun">{</span><span class="pln">

        get_template_part</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'template-parts/content'</span></span><span class="pun">,</span><span class="pln"> get_post_format</span><span class="pun">()</span><span class="pln"> </span><span class="pun">);</span><span class="pln">

    </span><span class="pun">}</span><span class="pln">
</span><span class="hljs-comment"><span class="com">// End the loop.</span></span><span class="pln">
</span><span class="hljs-keyword"><span class="pln">endwhile</span></span><span class="pun">;</span><span class="pln">
rewind_posts</span><span class="pun">();</span><span class="pln">
</span><span class="hljs-comment"><span class="com">// Start the second Loop - posts.</span></span><span class="pln">
</span><span class="hljs-keyword"><span class="kwd">while</span></span><span class="pln"> </span><span class="pun">(</span><span class="pln"> have_posts</span><span class="pun">()</span><span class="pln"> </span><span class="pun">)</span><span class="pln"> </span><span class="pun">:</span><span class="pln"> the_post</span><span class="pun">();</span><span class="pln">
    </span><span class="hljs-variable"><span class="pln">$posttype</span></span><span class="pln"> </span><span class="pun">=</span><span class="pln"> get_post_type</span><span class="pun">(</span><span class="pln"> get_the_ID</span><span class="pun">()</span><span class="pln"> </span><span class="pun">);</span><span class="pln">
    </span><span class="hljs-keyword"><span class="kwd">if</span></span><span class="pln"> </span><span class="pun">(</span><span class="pln"> </span><span class="hljs-variable"><span class="pln">$posttype</span></span><span class="pln"> </span><span class="pun">==</span><span class="pln"> </span><span class="hljs-string"><span class="str">'post'</span></span><span class="pln"> </span><span class="pun">)</span><span class="pln"> </span><span class="pun">{</span><span class="pln">

        get_template_part</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'template-parts/content'</span></span><span class="pun">,</span><span class="pln"> get_post_format</span><span class="pun">()</span><span class="pln"> </span><span class="pun">);</span><span class="pln">

    </span><span class="pun">}</span><span class="pln">
</span><span class="hljs-comment"><span class="com">// End the loop.</span></span><span class="pln">
</span><span class="hljs-keyword"><span class="typ">Endwhile</span></span><span class="pun">;</span></span></code></pre>

<p>
	الشيفرة السابقة ستؤدي إلى استدعاء حلقة التكرار مرتين، لكنها ستطلب الصفحات والمنشورات من قاعدة البيانات مرةً واحدةً فقط، وهذا أفضل من استخدام <code>WP-Query</code> لإنشاء طلبية جديدة. سنتحقق في بداية الحلقة فيما إذا كان «نوع المنشور» (post type) مساوٍ للقيمة <code>page</code> وفي حال تحقق الشرط فسنعرض الصفحة، ثم سنُعيد الكرّة مرةً أخرى للمنشورات العادية ذات النوع <code>post</code>.<br>
	احفظ الملف السابق وستجد أنَّ صفحة الأرشيف أصبحت تعرض الصفحات أولًا ثم المنشورات:
</p>

<p style="text-align: center;">
	<img alt="7-new-taxonomy-archive.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23178" data-unique="zwlfbxx06" src="https://academy.hsoub.com/uploads/monthly_2017_05/7-new-taxonomy-archive.png.9f28b38476f7e506dad9377557368d97.png"></p>

<p>
	هذه هي شيفرة ملف القالب كاملةً:
</p>

<pre class="ipsCode prettyprint lang-php prettyprinted" id="ips_uid_1121_7" style="">
<code class="hljs xml"><span class="php"><span class="hljs-preprocessor"><span class="pun">&lt;?</span><span class="pln">php</span></span><span class="pln">
</span><span class="hljs-comment"><span class="com">/**
 * The template for displaying division archive pages
 */</span></span><span class="pln">
get_header</span><span class="pun">();</span><span class="pln"> </span><span class="hljs-preprocessor"><span class="pun">?&gt;</span></span></span><span class="pln">

    </span><span class="hljs-tag"><span class="tag">&lt;</span><span class="hljs-title"><span class="tag">div</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">id</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"primary"</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">class</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"content-area"</span></span><span class="tag">&gt;</span></span><span class="pln">
        </span><span class="hljs-tag"><span class="tag">&lt;</span><span class="hljs-title"><span class="tag">main</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">id</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"main"</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">class</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"site-main"</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">role</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"main"</span></span><span class="tag">&gt;</span></span><span class="pln">

        </span><span class="php"><span class="hljs-preprocessor"><span class="pun">&lt;?</span><span class="pln">php</span></span><span class="pln"> </span><span class="hljs-keyword"><span class="kwd">if</span></span><span class="pln"> </span><span class="pun">(</span><span class="pln"> have_posts</span><span class="pun">()</span><span class="pln"> </span><span class="pun">)</span><span class="pln"> </span><span class="pun">:</span><span class="pln"> </span><span class="hljs-preprocessor"><span class="pun">?&gt;</span></span></span><span class="pln">

            </span><span class="hljs-tag"><span class="tag">&lt;</span><span class="hljs-title"><span class="tag">header</span></span><span class="pln"> </span><span class="hljs-attribute"><span class="atn">class</span></span><span class="pun">=</span><span class="hljs-value"><span class="atv">"page-header"</span></span><span class="tag">&gt;</span></span><span class="pln">
                </span><span class="php"><span class="hljs-preprocessor"><span class="pun">&lt;?</span><span class="pln">php</span></span><span class="pln">
                    the_archive_title</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'&lt;h1 class="page-title"&gt;'</span></span><span class="pun">,</span><span class="pln"> </span><span class="hljs-string"><span class="str">'&lt;/h1&gt;'</span></span><span class="pln"> </span><span class="pun">);</span><span class="pln">
                    the_archive_description</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'&lt;div class="taxonomy-description"&gt;'</span></span><span class="pun">,</span><span class="pln"> </span><span class="hljs-string"><span class="str">'&lt;/div&gt;'</span></span><span class="pln"> </span><span class="pun">);</span><span class="pln">
                </span><span class="hljs-preprocessor"><span class="pun">?&gt;</span></span></span><span class="pln">
            </span><span class="hljs-tag"><span class="tag">&lt;/</span><span class="hljs-title"><span class="tag">header</span></span><span class="tag">&gt;</span></span><span class="hljs-comment"><span class="com">&lt;!-- .page-header --&gt;</span></span><span class="pln">

            </span><span class="php"><span class="hljs-preprocessor"><span class="pun">&lt;?</span><span class="pln">php</span></span><span class="pln">
            </span><span class="hljs-comment"><span class="com">// Start the first Loop - pages.</span></span><span class="pln">
            </span><span class="hljs-keyword"><span class="kwd">while</span></span><span class="pln"> </span><span class="pun">(</span><span class="pln"> have_posts</span><span class="pun">()</span><span class="pln"> </span><span class="pun">)</span><span class="pln"> </span><span class="pun">:</span><span class="pln"> the_post</span><span class="pun">();</span><span class="pln">

                </span><span class="hljs-variable"><span class="pln">$posttype</span></span><span class="pln"> </span><span class="pun">=</span><span class="pln"> get_post_type</span><span class="pun">(</span><span class="pln"> get_the_ID</span><span class="pun">()</span><span class="pln"> </span><span class="pun">);</span><span class="pln">
                </span><span class="hljs-keyword"><span class="kwd">if</span></span><span class="pln"> </span><span class="pun">(</span><span class="pln"> </span><span class="hljs-variable"><span class="pln">$posttype</span></span><span class="pln"> </span><span class="pun">==</span><span class="pln"> </span><span class="hljs-string"><span class="str">'page'</span></span><span class="pln"> </span><span class="pun">)</span><span class="pln"> </span><span class="pun">{</span><span class="pln">

                    get_template_part</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'template-parts/content'</span></span><span class="pun">,</span><span class="pln"> get_post_format</span><span class="pun">()</span><span class="pln"> </span><span class="pun">);</span><span class="pln">

                </span><span class="pun">}</span><span class="pln">

            </span><span class="hljs-comment"><span class="com">// End the loop.</span></span><span class="pln">
            </span><span class="hljs-keyword"><span class="pln">endwhile</span></span><span class="pun">;</span><span class="pln">

            rewind_posts</span><span class="pun">();</span><span class="pln">

            </span><span class="hljs-comment"><span class="com">// Start the second Loop - posts.</span></span><span class="pln">
            </span><span class="hljs-keyword"><span class="kwd">while</span></span><span class="pln"> </span><span class="pun">(</span><span class="pln"> have_posts</span><span class="pun">()</span><span class="pln"> </span><span class="pun">)</span><span class="pln"> </span><span class="pun">:</span><span class="pln"> the_post</span><span class="pun">();</span><span class="pln">

                </span><span class="hljs-variable"><span class="pln">$posttype</span></span><span class="pln"> </span><span class="pun">=</span><span class="pln"> get_post_type</span><span class="pun">(</span><span class="pln"> get_the_ID</span><span class="pun">()</span><span class="pln"> </span><span class="pun">);</span><span class="pln">
                </span><span class="hljs-keyword"><span class="kwd">if</span></span><span class="pln"> </span><span class="pun">(</span><span class="pln"> </span><span class="hljs-variable"><span class="pln">$posttype</span></span><span class="pln"> </span><span class="pun">==</span><span class="pln"> </span><span class="hljs-string"><span class="str">'post'</span></span><span class="pln"> </span><span class="pun">)</span><span class="pln"> </span><span class="pun">{</span><span class="pln">

                    get_template_part</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'template-parts/content'</span></span><span class="pun">,</span><span class="pln"> get_post_format</span><span class="pun">()</span><span class="pln"> </span><span class="pun">);</span><span class="pln">

                </span><span class="pun">}</span><span class="pln">

            </span><span class="hljs-comment"><span class="com">// End the loop.</span></span><span class="pln">
            </span><span class="hljs-keyword"><span class="pln">endwhile</span></span><span class="pun">;</span><span class="pln">

            </span><span class="hljs-comment"><span class="com">// Previous/next page navigation.</span></span><span class="pln">
            the_posts_pagination</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-keyword"><span class="pln">array</span></span><span class="pun">(</span><span class="pln">
                </span><span class="hljs-string"><span class="str">'prev_text'</span></span><span class="pln">          </span><span class="pun">=&gt;</span><span class="pln"> __</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'Previous page'</span></span><span class="pun">,</span><span class="pln"> </span><span class="hljs-string"><span class="str">'twentysixteen'</span></span><span class="pln"> </span><span class="pun">),</span><span class="pln">
                </span><span class="hljs-string"><span class="str">'next_text'</span></span><span class="pln">          </span><span class="pun">=&gt;</span><span class="pln"> __</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'Next page'</span></span><span class="pun">,</span><span class="pln"> </span><span class="hljs-string"><span class="str">'twentysixteen'</span></span><span class="pln"> </span><span class="pun">),</span><span class="pln">
                </span><span class="hljs-string"><span class="str">'before_page_number'</span></span><span class="pln"> </span><span class="pun">=&gt;</span><span class="pln"> </span><span class="hljs-string"><span class="str">'&lt;span class="meta-nav screen-reader-text"&gt;'</span></span><span class="pln"> </span><span class="pun">.</span><span class="pln"> __</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'Page'</span></span><span class="pun">,</span><span class="pln"> </span><span class="hljs-string"><span class="str">'twentysixteen'</span></span><span class="pln"> </span><span class="pun">)</span><span class="pln"> </span><span class="pun">.</span><span class="pln"> </span><span class="hljs-string"><span class="str">' &lt;/span&gt;'</span></span><span class="pun">,</span><span class="pln">
            </span><span class="pun">)</span><span class="pln"> </span><span class="pun">);</span><span class="pln">
        </span><span class="hljs-comment"><span class="com">// If no content, include the "No posts found" template.</span></span><span class="pln">
        </span><span class="hljs-keyword"><span class="kwd">else</span></span><span class="pln"> </span><span class="pun">:</span><span class="pln">
            get_template_part</span><span class="pun">(</span><span class="pln"> </span><span class="hljs-string"><span class="str">'template-parts/content'</span></span><span class="pun">,</span><span class="pln"> </span><span class="hljs-string"><span class="str">'none'</span></span><span class="pln"> </span><span class="pun">);</span><span class="pln">
        </span><span class="hljs-keyword"><span class="pln">endif</span></span><span class="pun">;</span><span class="pln">
        </span><span class="hljs-preprocessor"><span class="pun">?&gt;</span></span></span><span class="pln">

        </span><span class="hljs-tag"><span class="tag">&lt;/</span><span class="hljs-title"><span class="tag">main</span></span><span class="tag">&gt;</span></span><span class="hljs-comment"><span class="com">&lt;!-- .site-main --&gt;</span></span><span class="pln">
    </span><span class="hljs-tag"><span class="tag">&lt;/</span><span class="hljs-title"><span class="tag">div</span></span><span class="tag">&gt;</span></span><span class="hljs-comment"><span class="com">&lt;!-- .content-area --&gt;</span></span><span class="pln">

</span><span class="php"><span class="hljs-preprocessor"><span class="pun">&lt;?</span><span class="pln">php</span></span><span class="pln"> get_sidebar</span><span class="pun">();</span><span class="pln"> </span><span class="hljs-preprocessor"><span class="pun">?&gt;</span></span></span><span class="pln">
</span><span class="php"><span class="hljs-preprocessor"><span class="pun">&lt;?</span><span class="pln">php</span></span><span class="pln"> get_footer</span><span class="pun">();</span><span class="pln"> </span><span class="hljs-preprocessor"><span class="pun">?&gt;</span></span></span></code></pre>

<h2 id="تنسيق-أقسام-الشركة-بشكل-مختلف">
	تنسيق أقسام الشركة بشكلٍ مختلف
</h2>

<p>
	أصبح لدينا الآن ملف قالب يعرض صفحات ومنشورات أقسم الشركة بالطريقة التي نرغب بها، وحان الوقت الآن لجعل صفحات الأقسام تختلف بصريًا عن بعضها بإضافة بعض التنسيق إليها.<br>
	يمكنك أن تُنسِّق أقسام موقعك كما تشاء، وربما ستُنسِّقها أكثر مما سأريك إياه في هذا الدرس، إلا أنني سأريك كيف تغيّر ألوان بعض أجزاء الصفحات والمنشورات وصفحات الأرشيف لكل قسم، لجعلها تتميز عن بعضها.<br>
	يمكنك أن تفعل ذلك في صفحة الأنماط التابعة للقالب الابن (أو في صفحة الأنماط في القالب الأساسي إن لم تكن تستعمل قالب ابن).<br>
	افتح ملف <code>style.css</code> وأضف القواعد الآتية إليه:
</p>

<pre class="ipsCode prettyprint lang-php prettyprinted" id="ips_uid_1121_7" style="">
<code class="hljs css"><span class="hljs-class"><span class="pun">.</span><span class="pln">term</span><span class="pun">-</span><span class="pln">research</span><span class="pun">-</span><span class="pln">development</span></span><span class="pln"> </span><span class="hljs-class"><span class="pun">.</span><span class="pln">page</span><span class="pun">-</span><span class="pln">header</span></span><span class="pln"> </span><span class="hljs-rules"><span class="pun">{</span><span class="pln">
    </span><span class="hljs-rule"><span class="hljs-attribute"><span class="pln">border</span><span class="pun">-</span><span class="pln">top</span></span><span class="pun">:</span><span class="hljs-value"><span class="pln"> </span><span class="hljs-number"><span class="lit">4</span></span><span class="lit">px</span><span class="pln"> solid </span><span class="hljs-hexcolor"><span class="com">#d8a518</span></span></span></span><span class="com">;</span><span class="pln">
</span><span class="hljs-rule"><span class="pun">}</span></span></span><span class="pln">
</span><span class="hljs-class"><span class="pun">.</span><span class="pln">term</span><span class="pun">-</span><span class="pln">research</span><span class="pun">-</span><span class="pln">development</span></span><span class="pln"> </span><span class="hljs-class"><span class="pun">.</span><span class="pln">page</span><span class="pun">-</span><span class="pln">title</span></span><span class="pln"> </span><span class="hljs-rules"><span class="pun">{</span><span class="pln">
    </span><span class="hljs-rule"><span class="hljs-attribute"><span class="pln">color</span></span><span class="pun">:</span><span class="hljs-value"><span class="pln"> </span><span class="hljs-hexcolor"><span class="com">#d8a518</span></span></span></span><span class="com">;</span><span class="pln">
</span><span class="hljs-rule"><span class="pun">}</span></span></span><span class="pln">

</span><span class="hljs-class"><span class="pun">.</span><span class="pln">term</span><span class="pun">-</span><span class="pln">operations</span></span><span class="pln"> </span><span class="hljs-class"><span class="pun">.</span><span class="pln">page</span><span class="pun">-</span><span class="pln">header</span></span><span class="pln"> </span><span class="hljs-rules"><span class="pun">{</span><span class="pln">
    </span><span class="hljs-rule"><span class="hljs-attribute"><span class="pln">border</span><span class="pun">-</span><span class="pln">top</span></span><span class="pun">:</span><span class="hljs-value"><span class="pln"> </span><span class="hljs-number"><span class="lit">4</span></span><span class="lit">px</span><span class="pln"> solid </span><span class="hljs-hexcolor"><span class="com">#5674A0</span></span></span></span><span class="com">;</span><span class="pln">
</span><span class="hljs-rule"><span class="pun">}</span></span></span><span class="pln">
</span><span class="hljs-class"><span class="pun">.</span><span class="pln">term</span><span class="pun">-</span><span class="pln">operations</span></span><span class="pln"> </span><span class="hljs-class"><span class="pun">.</span><span class="pln">page</span><span class="pun">-</span><span class="pln">title</span></span><span class="pln"> </span><span class="hljs-rules"><span class="pun">{</span><span class="pln">
    </span><span class="hljs-rule"><span class="hljs-attribute"><span class="pln">color</span></span><span class="pun">:</span><span class="hljs-value"><span class="pln"> </span><span class="hljs-hexcolor"><span class="com">#5674A0</span></span></span></span><span class="com">;</span><span class="pln">
</span><span class="hljs-rule"><span class="pun">}</span></span></span><span class="pln">

</span><span class="hljs-class"><span class="pun">.</span><span class="pln">term</span><span class="pun">-</span><span class="pln">sales</span></span><span class="pln"> </span><span class="hljs-class"><span class="pun">.</span><span class="pln">page</span><span class="pun">-</span><span class="pln">header</span></span><span class="pln"> </span><span class="hljs-rules"><span class="pun">{</span><span class="pln">
    </span><span class="hljs-rule"><span class="hljs-attribute"><span class="pln">border</span><span class="pun">-</span><span class="pln">top</span></span><span class="pun">:</span><span class="hljs-value"><span class="pln"> </span><span class="hljs-number"><span class="lit">4</span></span><span class="lit">px</span><span class="pln"> solid </span><span class="hljs-hexcolor"><span class="com">#FE6763</span></span></span></span><span class="com">;</span><span class="pln">
</span><span class="hljs-rule"><span class="pun">}</span></span></span><span class="pln">
</span><span class="hljs-class"><span class="pun">.</span><span class="pln">term</span><span class="pun">-</span><span class="pln">sales</span></span><span class="pln"> </span><span class="hljs-class"><span class="pun">.</span><span class="pln">page</span><span class="pun">-</span><span class="pln">title</span></span><span class="pln"> </span><span class="hljs-rules"><span class="pun">{</span><span class="pln">
    </span><span class="hljs-rule"><span class="hljs-attribute"><span class="pln">color</span></span><span class="pun">:</span><span class="hljs-value"><span class="pln"> </span><span class="hljs-hexcolor"><span class="com">#FE6763</span></span></span></span><span class="com">;</span><span class="pln">
</span><span class="hljs-rule"><span class="pun">}</span></span></span><span class="pln">

</span><span class="hljs-class"><span class="pun">.</span><span class="pln">term</span><span class="pun">-</span><span class="pln">sales</span></span><span class="pln"> </span><span class="hljs-class"><span class="pun">.</span><span class="pln">page</span><span class="pun">-</span><span class="pln">header</span></span><span class="pln"> </span><span class="hljs-rules"><span class="pun">{</span><span class="pln">
    </span><span class="hljs-rule"><span class="hljs-attribute"><span class="pln">border</span><span class="pun">-</span><span class="pln">top</span></span><span class="pun">:</span><span class="hljs-value"><span class="pln"> </span><span class="hljs-number"><span class="lit">4</span></span><span class="lit">px</span><span class="pln"> solid </span><span class="hljs-hexcolor"><span class="com">#78D400</span></span></span></span><span class="com">;</span><span class="pln">
</span><span class="hljs-rule"><span class="pun">}</span></span></span><span class="pln">
</span><span class="hljs-class"><span class="pun">.</span><span class="pln">term</span><span class="pun">-</span><span class="pln">sales</span></span><span class="pln"> </span><span class="hljs-class"><span class="pun">.</span><span class="pln">page</span><span class="pun">-</span><span class="pln">title</span></span><span class="pln"> </span><span class="hljs-rules"><span class="pun">{</span><span class="pln">
    </span><span class="hljs-rule"><span class="hljs-attribute"><span class="pln">color</span></span><span class="pun">:</span><span class="hljs-value"><span class="pln"> </span><span class="hljs-hexcolor"><span class="com">#78D400</span></span></span></span><span class="com">;</span><span class="pln">
</span><span class="hljs-rule"><span class="pun">}</span></span></span></code></pre>

<p>
	هذا سيُضيف تنسيقًا لترويسات صفحات الأرشيف باستهداف الأنماط (classes) المُطبَّقة على العنصر <code>body</code> وذلك اعتمادًا على التصنيفات التي استخدمتها.<br>
	ستحتاج إلى تعديل القيم السابقة بما يتوافق مع أسماء أقسام شركتك، يمكنك أن ترى أسماء الأصناف المولّدة تلقائيًا عبر تفحص شيفرة HTML في صفحة أرشيف القسم في موقعك، وستكون مرتبطةً بالعنصر <code>body</code>.<br>
	استعملتُ اللون الأصفر في صفحة تصنيف «Research and Development» لتمييزها:
</p>

<p style="text-align: center;">
	<img alt="8-taxonomy-archive-styled.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23179" data-unique="w1p1dfz5i" src="https://academy.hsoub.com/uploads/monthly_2017_05/8-taxonomy-archive-styled.png.b614c6d2eeba391e11ac27b96cfd18a8.png"></p>

<p>
	يمكنك إضافة المزيد إلى صفحة الأنماط، فربما تريد تنسيق المنشورات التابعة لمدونتك العامة بشكلٍ يختلف عن تنسيق منشورات بقية الأقسام الأخرى، ويمكنك أيضًا تنسيق الصفحات والمنشورات التابعة لمختلف الأقسام بأشكالٍ متنوعة. يمكنك أيضًا تنسيق قائمة التنقل الرئيسية لكي تُطابِق تنسيق بقية الصفحة. أي أنَّ خياراتك ليست محدودة، ومن الممكن أن تجعل مظهر صفحات أقسام شركتك مختلفةً عن بعضها تمامًا.
</p>

<h2 id="الخلاصة">
	الخلاصة
</h2>

<p>
	باستخدام التقنيات التي شرحناها في هذا الدرس، يمكننا إنشاء موقع لشركة فيه أقسامٌ مختلفة، وتعرض تلك الأقسام المحتوى المتعلق بها فقط، ونستطيع استخدام فئات CSS التي تُضيفها ووردبريس إلى عنصر <code>body</code> لتنسيق تلك الأقسام بشكلٍ مختلف.<br>
	يمكنك أن تكمل المشوار في تنسيق الصفحات، وذلك بإضافة صور أو خلفيات أو يمكنك تغيير الخطوط وذلك عبر صفحة الأنماط. وتستطيع أيضًا إنشاء ملف قالب مختلف لكل قسم، وذلك باستعمال هيكلية ملفات القوالب استعمالًا صحيحًا لتعرف طريقة تسمية الملفات.<br>
	كل ما سبق يعني أنَّك إذا كنتَ تعمل على موقعٍ موجودٍ مسبقًا ولم تشأ إنشاء مواقع مخصصة لكل قسم من أقسام شركتك، فيمكن لموقع ووردبريس وحيد أن يضفي طابعًا خاصًا لكل قسم من أقسام الشركة.<br>
	ترجمة -وبتصرّف- للمقال <a href="https://premium.wpmudev.org/blog/custom-taxonomy-departments-divisions-company-website/" rel="external nofollow">How to Create a Custom Taxonomy for Departments or Divisions on a Company WordPress Site</a>لصاحبته Rachel McCollin.
</p>
]]></description><guid isPermaLink="false">256</guid><pubDate>Tue, 09 May 2017 21:00:00 +0000</pubDate></item><item><title>&#x637;&#x631;&#x64A;&#x642;&#x629; &#x639;&#x631;&#x636; &#x645;&#x62D;&#x62A;&#x648;&#x649; &#x645;&#x62E;&#x635;&#x635; &#x644;&#x645;&#x646;&#x627;&#x637;&#x642; &#x62C;&#x63A;&#x631;&#x627;&#x641;&#x64A;&#x629; &#x645;&#x639;&#x64A;&#x651;&#x646;&#x629; &#x628;&#x627;&#x633;&#x62A;&#x62E;&#x62F;&#x627;&#x645; &#x648;&#x648;&#x631;&#x62F;&#x628;&#x631;&#x64A;&#x633;</title><link>https://academy.hsoub.com/apps/web/wordpress/%D8%B7%D8%B1%D9%8A%D9%82%D8%A9-%D8%B9%D8%B1%D8%B6-%D9%85%D8%AD%D8%AA%D9%88%D9%89-%D9%85%D8%AE%D8%B5%D8%B5-%D9%84%D9%85%D9%86%D8%A7%D8%B7%D9%82-%D8%AC%D8%BA%D8%B1%D8%A7%D9%81%D9%8A%D8%A9-%D9%85%D8%B9%D9%8A%D9%91%D9%86%D8%A9-%D8%A8%D8%A7%D8%B3%D8%AA%D8%AE%D8%AF%D8%A7%D9%85-%D9%88%D9%88%D8%B1%D8%AF%D8%A8%D8%B1%D9%8A%D8%B3-r254/</link><description><![CDATA[
<p><img src="https://academy.hsoub.com/uploads/monthly_2017_05/main.png.e2b51bbc206a3898bd8430940ad260cf.png" /></p>

<p>
	هل جميع الزيارات التي تأتي موقعك هي زياراتٌ «جيدة»؟ إذا نظرتَ إلى الأمر بسطحية فقد تظن ذلك، لكن من الأفضل أن تُمعِن النظر في الزيارات التي تأتي إلى موقعك، فليست جميع الزيارات لها أغراضٌ حسنة!
</p>

<p style="text-align: center;">
	<img alt="main.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23113" data-unique="iwzlmicmz" src="https://academy.hsoub.com/uploads/monthly_2017_05/main.png.7b520412387c988e9ca91b508df474c9.png"></p>

<p>
	هنالك الكثير من الأسباب وراء رغبتك بالتحكم بالأماكن الجغرافية المسموح لها بالوصول إلى موقعك:
</p>

<ol>
<li>
		إذا كانت عندك شركةٌ محلية ولم ترغب بإضاعة التّدفّق bandwith الخاص بخادومك على زياراتٍ لن تستفيد منها آتيةٍ من دولٍ أخرى. ففي النهاية لن يهتم بسلعك إلا السكان المحليون، ولن تلقي لها العائلات الموجودة في أقصاع الأرض بالًا.
	</li>
	<li>
		إذا كنت منزعجًا من التحليل الشهري لموقعك الذي يخرِّبه أولئك المزعجون الذين يلمؤن موقعك بالرسائل عديمة المعنى…
	</li>
	<li>
		إذا كانت شركتك تستهدف الزبائن الموجودين في منطقة جغرافية مُحدَّدة لأنَّ خدماتك مطلوبة جدًا في تلك المناطق دون وجود منافسة حقيقية من شركاتٍ أخرى.
	</li>
	<li>
		إذا كنتَ تخاف على موقعك من المخترقين من الدول الأخرى، وتريد أن تجعله أكثر أمانًا.
	</li>
</ol>
<p>
	لن يكون للموقع الجغرافي لزوار بعض المواقع أثرًا فيها، لكنه قد يُشكِّل عاملًا مهمًا في بعضها الآخر. فالسبب الوحيد لبنائك موقعًا (باستخدام ووردبريس) هو لكي تصل إلى الجمهور الصحيح، وهذا هو السبب وراء أهمية تحسين أداء موقعك، وأمانه.
</p>

<p>
	لكن إن كنت تظن أنَّ استهداف منطقة جغرافية معيّنة سيفيدك في إيصال رسالتك، فأكمل قراءة هذا الدرس.
</p>

<h2>
	موارد تساعدك في تحديد المنطقة الجغرافية التي تأتي الزيارات منها
</h2>

<p>
	يمكن أن تخبرك أداة Google Analytics من أين تأتي زيارات موقعك جغرافيًا. فكل مرة يزور أحدهم موقعك، فسيخبر عنوان IP للزائر برمجيةَ Google Analytics (أو أيّة برمجية أخرى تُسجِّل هذه المعلومات) عن المكان الجغرافي الذي يزور منه هذا الشخص موقعك.
</p>

<p>
	التصنيف عبر القارات:
</p>

<p style="text-align: center;">
	<img alt="1-Geo-Continent.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23104" data-unique="mb4kf9i4t" src="https://academy.hsoub.com/uploads/monthly_2017_05/1-Geo-Continent.png.54c88616f84036573bb9bf13d73c4129.png"></p>

<p>
	أو عبر الدول:
</p>

<p style="text-align: center;">
	<img alt="2-Geo-Countries.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23105" data-unique="giyujn5sw" src="https://academy.hsoub.com/uploads/monthly_2017_05/2-Geo-Countries.png.93197660eda0263b7f15a71f733a5f1a.png"></p>

<p>
	أو عبر المدن:
</p>

<p style="text-align: center;">
	<img alt="3-Geo-Cities.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23106" data-unique="r3k2flk9z" src="https://academy.hsoub.com/uploads/monthly_2017_05/3-Geo-Cities.png.33b87477153738d73c0ed15a3144e13d.png"></p>

<p>
	أظنَّ أنَّ الفكرة قد وصلتك.
</p>

<p>
	وصحيحٌ أنَّ أداة Google Analytics مفيدةٌ في معرفة من أين تأتي زيارات موقعك، لكن هذا الأداة لن تساعدك في زيادة الزيارات من مناطق جغرافية معيّنة إلى موقعك (أو بالعكس، تخفيض عدد الزيارات من مناطق أخرى). لكن إذا كنتَ تريد أن تُحدِّد من أين يأتي زوارك، فانظر إلى إحصائيات Google Analytics أولًا.
</p>

<p>
	بعد أن تأخذ فكرةً لا بأس بها عن أماكن قدوم زوار موقعك، فحان الوقت لكي تُقيّم إن كان هؤلاء الزوار مناسبين لموقعك أم لا.
</p>

<p>
	هنالك الكثير من الأدوات الخارجية التي يمكنك استخدامها لتحسين موقعك من ناحية توجيه المحتوى لمناطق جغرافية معيّنة. CDNs هي أداةٌ رائعة لكي تستعملها لتوجيه محتواك لجميع أنحاء العالم، لكن لا توجد خواديم لموقعك في جميع أنحاء العالم. يمكنك أيضًا استخدام <a href="https://support.google.com/webmasters/answer/62399" rel="external nofollow">Google Webmaster Tools</a> لتحديد دولة لتكون هدفًا لموقعك.
</p>

<p>
	إذا كنتَ تتساءل في نفسك عن ووردبريس، فللأسف لا توجد ميزة مُضمَّنة في ووردبريس لمساعدة المطورين بتحسين المواقع التي يطورنها جغرافيًا. لكن هنالك عددٌ من الإضافات التي تساعدك في تلبية احتياجاتك بهذا الخصوص.
</p>

<h2>
	الاستخدامات المختلفة لاستهداف الزوار جغرافيًا
</h2>

<p>
	إذا أردتَ حجب الوصول إلى موقعك من دولة معيّنة، أو تستهدف أخرى، أو تُظهِر منتجات معيّنة اعتمادًا على الدولة التي يزور منها الزبون موقعك، أو حتى توفير محتوى مختلف بناءً على الموقع الجغرافي؛ فستحتاج حينئذٍ إلى إضافةٍ لكي تستطيع فعل ذلك.
</p>

<p>
	هذه بعض الإضافات التي قد تساعدك في استهداف زوار معيّين بناءً على عناوين IP الخاصة بهم.
</p>

<h2>
	إضافات لتوفير محتوى مخصص اعتمادًا على الموقع الجغرافي
</h2>

<p>
	هذه الإضافات مناسبة لتوفير محتوى اعتمادًا على الدولة.
</p>

<h3>
	GeoTargeting Lite
</h3>

<p style="text-align: center;">
	<img alt="4-GeoTargeting-Lite.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23107" data-unique="ijdvl81sw" src="https://academy.hsoub.com/uploads/monthly_2017_05/4-GeoTargeting-Lite.png.f2369313d341d706e359421439aa7a73.png"></p>

<p>
	هذه هي <a href="https://wordpress.org/plugins/geotargeting/" rel="external nofollow">النسخة المجانية</a> من إضافة GeoTargeting Pro الشاملة والتي سنذكرها أدناه. الفرق الوحيد بين هذه الإضافة وإضافة GeoTargeting Pro هو أنَّ هذه الإضافة تسمح لك بجعل المحتوى يستهدف دولةً معيّنةً فقط، وإذا أردتَ ميزاتٍ متقدمة أو قدرةً على حجب الوصول لدول معيّنة، فعليك استخدام إضافة لهذا الغرض، أو شراء إضافة GeoTargeting Pro الكاملة.
</p>

<h3>
	Geo Targeting add-on for Icegram
</h3>

<p style="text-align: center;">
	<img alt="5-icegram-addon.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23108" data-unique="7eznz9c8j" src="https://academy.hsoub.com/uploads/monthly_2017_05/5-icegram-addon.png.f8fda8a70e1d1a91f6946c94e630231e.png"></p>

<p>
	إذا كنتَ تستخدم إضافة <a href="http://www.icegram.com/all-features/" rel="external nofollow">Icegram</a> لوردبريس (الإضافة المدفوعة، وليست المجانية)، فربما تكون مهتمًا في معرفة أنَّ هنالك إمكانية تثبيت <a href="http://www.icegram.com/addons/geo-targeting/" rel="external nofollow">إضافة لتوجيه المحتوى</a> جغرافيًا. فيمكن توسعة الإضافة الرائعة لإنشاء حملة تسويقية لكي تستهدف مناطق جغرافية معيّنة.
</p>

<h2>
	إضافات لعرض إعلانات اعتمادًا على الموقع الجغرافي
</h2>

<h3>
	AdRotate
</h3>

<p>
	إذا كنتَ تُخطِّط للكسب من وراء موقعك وكنت تريد تقديم إعلانات مختلفة اعتمادًا على الدولة أو الولاية أو المدينة، فانظر إلى إضافة AdRotate. تتوافر نسخة مجانية من هذه الإضافة في موقع ووردبريس، لكن <a href="https://ajdg.solutions/products/adrotate-for-wordpress/features/" rel="external nofollow">النسخة المدفوعة</a> توفِّر إمكانية توجيه الإعلانات إلى مناطق جغرافية.
</p>

<h3>
	Advanced Ads
</h3>

<p style="text-align: center;">
	<img alt="6-Advanced-Ads.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23109" data-unique="by3o9r2hu" src="https://academy.hsoub.com/uploads/monthly_2017_05/6-Advanced-Ads.png.29e09f1ebec663b11c66ff2e8e74505b.png"></p>

<p>
	هذه إضافةٌ أخرى للإعلانات التي توفر إمكانية توجيه الإعلانات إلى مناطق جغرافية معيّنة. وعلى الرغم من أنَّ هذه <a href="https://wordpress.org/plugins/advanced-ads/" rel="external nofollow">الإضافة مجانية</a>، لكن عليك تثبيت إضافات geotargeting و geoblocking لها وتلك الإضافات غير مجانية. أما لو أردتَ تخصيص قواعد استهداف المناطق الجغرافية، فهذه هي الإضافة التي ستحتاج لها.
</p>

<h2>
	إضافات الحجب حسب المناطق الجغرافية
</h2>

<p>
	استعمل هذه الإضافات عندما تريد حجب دول أو مناطق كاملة من الوصول إلى موقعك.
</p>

<h3>
	IP Geo Block
</h3>

<p style="text-align: center;">
	<img alt="7-IP-Geo-Block.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23110" data-unique="d29ly6c86" src="https://academy.hsoub.com/uploads/monthly_2017_05/7-IP-Geo-Block.png.5c5314a690abd2761ee4d430034977c7.png"></p>

<p>
	جعل المحتوى يستهدف مناطق معيّنة يؤدي إلى توفير محتوى متنوع للزوار من مناطق مختلفة، أما الهدف من الحجب هو منع الوصول تمامًا من مناطق معيّنة، وهذا لا يعني منع الزوار فقط، وإنما حجب الأشخاص الذين يحاولون اختراق موقعك لأغراضٍ خبيثة. <a href="https://wordpress.org/plugins/ip-geo-block/" rel="external nofollow">هذه الإضافة</a> يمكنها أن تحجب الزوار عبر عناوين IP أو يمكن حجب دول كاملة من الوصول إلى موقعك عبر:
</p>

<ul>
<li>
		صفحة تسجيل الدخول
	</li>
	<li>
		نموذج التعليقات
	</li>
	<li>
		جميع المداخل الموجودة في السند الخلفي (back-end) لموقعك.
	</li>
</ul>
<h3>
	iQ Block Country
</h3>

<p style="text-align: center;">
	<img alt="8-iQ-Block-Country.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23111" data-unique="r90g0wevz" src="https://academy.hsoub.com/uploads/monthly_2017_05/8-iQ-Block-Country.png.ac6193fb361e8301de1362dea372a152.png"></p>

<p>
	إذا كنت مهتمًا بتقليل عدد زوار موقعك، فيمكنك استخدام <a href="https://wordpress.org/plugins/iq-block-country/" rel="external nofollow">هذه الإضافة</a>، وهنالك عددٌ من الأسباب يدفعك لذلك:
</p>

<ul>
<li>
		محاولة إصلاح مصدر المشكلة التي تخرِّب إحصائيات موقعك.
	</li>
	<li>
		توفير محتوى خاص للمستخدمين القادمين من دول أخرى.
	</li>
	<li>
		منع المخترقين من العثور على موقعك.
	</li>
</ul>
<h2>
	إضافة شاملة لتوجيه المحتوى ولحجبه اعتمادًا على الموقع الجغرافي
</h2>

<p>
	أما إذا أردتَ تحكمًا كاملًا بتوجيه محتواك أو إعادة توجهيه أو حجب الزوار بناءً على موقعهم الجغرافي، فانظر إلى الإضافة الآتية.
</p>

<h3>
	GeoTargeting Pro
</h3>

<p style="text-align: center;">
	<img alt="9-GeoTargeting-Pro.png" class="ipsImage ipsImage_thumbnailed" data-fileid="23112" data-unique="s297ne2es" src="https://academy.hsoub.com/uploads/monthly_2017_05/9-GeoTargeting-Pro.png.6ce6d3fd41a1a66d6f99b71ab502f147.png"></p>

<p>
	هذه هي <a href="https://timersys.com/plugins/geotargeting-pro/" rel="external nofollow">إضافةٌ مدفوعةٌ</a> التي تساعد المواقع الكبيرة (أو شبكةً متعددة المواقع) التي تحتاج إلى توفير محتواها اعتمادًا على الموقع الجغرافي للزوار من كل الدول حول العالم. ستملك تحكمًا كاملًا بأنواع المحتوى الذي سيُخدِّم إلى مختلف الزوار وما هي الصفحات التي سيُعاد توجيه الزوار إليها. المحتوى القابل للتوجيه حسب الموقع الجغرافي يتضمن: منشورات المدونة، والصفحات الثابتة، وقوائم التنقل، والودجات…
</p>

<h2>
	الخلاصة
</h2>

<p>
	قد تجد أنَّ توجيه المحتوى أو حجبه اعتمادًا على الموقع الجغرافي مفيدٌ جدًا عندما تحاول الوصول إلى الجمهور المناسب لموقعك، وتُبعد الزوار غير المفيدين، وتُحسِّن من أداء موقعك، وتزيد من حمايته.
</p>

<p>
	إذا كنت تتساءل إن كان موقعك سيستفيد من توجيه المحتوى اعتمادًا على الموقع الجغرافي، وكان في ذهنك جمهورٌ يقطنُ في منطقةٍ معيّنة، فأنصحك بإلقاء نظرةٍ على الإضافات والأدوات السابقة.
</p>

<p>
	ترجمة -وبتصرّف- للمقال <a href="https://premium.wpmudev.org/blog/geotargeting-wordpress/" rel="external nofollow">A Guide to Geotargeting and Geographic-Specific Content for WordPress</a> لصاحبته Brenda Barron.
</p>
]]></description><guid isPermaLink="false">254</guid><pubDate>Wed, 03 May 2017 16:30:33 +0000</pubDate></item></channel></rss>
