يساعد المكون الإضافي Content Views في حل مشكلة التصميم غير القياسي لصفحات المدونة الرئيسية (وغيرها). افتراضيًا، يعرض قالب الموقع منشورات المدونة الواحدة تلو الأخرى، بدءًا من الأحدث. من خلال تحرير القالب، يمكنك ضبط عرض التاريخ والعنوان والفئات والمؤلف وبعض المعلمات الأخرى، ولكن لا يمكن تغيير منطق اختيار المشاركات كثيرًا (دون إضافة كود ووظائف PHP خاصة). لذلك، يمكن أن تكون وحدة اليوم مفيدة للعديد من المبتدئين ومطوري WordPress.
يسمح لك بتخصيص عرض المنشورات على صفحات المدونة الرئيسية وصفحات المدونة الأخرى دون أي معرفة برمجية متخصصة - يمكنك تنزيله من هنا. الاسم الموجود على صفحة المستودع طويل جدًا إلى حد ما " الاستعلام عن المشاركات حسب الفئة... وعرض المشاركات على الصفحة في تخطيط الشبكة بدون ترميز - طرق عرض المحتوى"، إذا قمت بتثبيت WordPress من خلال لوحة الإدارة، فحاول البحث عن مفتاح طرق عرض المحتوى. إصدار WP المطلوب أعلى من 3.3 ويصل إلى 4.2.2 (في وقت كتابة هذا المنشور)، تم تنزيل الوحدة بأكثر من 10 آلاف. مرات، والتصنيف هو الحد الأقصى تقريبا!
إمكانيات الوحدة كبيرة جدًا ولا تتعلق بالصفحة الرئيسية فقط.مع ذلك يمكنك:
من حيث المبدأ، يمكنك ضبط عرض أحدث المشاركات حسب الفئة، وهو ما ذكرته عندما ذكرت (عبر WP_Query). ولكن لن يفهم كل مستخدم هذا، ويعمل البرنامج الإضافي لطرق عرض المحتوى على تبسيط المهمة إلى حد كبير. دعونا نفكر عمل أكثر تفصيلامع الوحدة النمطية.
بعد التثبيت، سيظهر قسم البرنامج المساعد في لوحة الإدارة إعدادات عرض المحتوى. لإنشاء عنصر عرض منشور جديد، انقر فوق الرابط "إضافة جديد".
هنا تنقسم المهمة إلى عنصرين:
في الخطوة الأولى عليك تحديد نوع المنشور - صفحة أو منشور. يمكنك تضمين أو استبعاد معرفات محددة من القائمة. تحدد المعلمة Limit عدد العناصر.
أسفل المرشحات المتقدمة، تحدث كل الأشياء الممتعة. في لقطة الشاشة، ترى كيف قمت بالتحقق من معلمة التصنيفات وقمت بتعيين التحديد حسب الفئة. بعد ذلك، قمت بتحديد الفئة التي سيتم عرض المشاركات منها. من الممكن الاختيار وفقًا لعدة عناوين أو استبعاد بعضها من القائمة العامة.
بالإضافة إلى المعلمة Taxonomies هناك:
تحتوي علامة التبويب "إعدادات العرض" على إعدادات مظهر الكتلة:
هناك ثلاثة تنسيقات للعرض: الشبكة، والقائمة القابلة للطي، والقائمة القابلة للتمرير. بالنسبة إلى "الشبكة"، يمكنك اختيار عدد العناصر لكل عمود و/أو عمودين عند عرضها. قم أيضًا بوضع علامة على الحقول التي تريد عرضها لكل عنصر: التاريخ والعنوان والنص والصورة المصغرة. يمكنك اختيار فتح الرابط في نافذة جديدة.
كل هذه الإعدادات تسمح لك بالحصول عليها النوع الصحيحعرض أحدث المشاركات للصفحات الرئيسية أو الصفحات الأخرى للموقع.
بعد تحديد كافة المعلمات، احفظ العنصر. في قائمة "جميع العروض"، يمكنك رؤية قائمة بجميع الكتل والأكواد القصيرة التي تم إنشاؤها لإدراجها. يمكنك نشرها على صفحات عاديةمدونة أو في قالب عبر وظيفة الاتصال بالرمز القصير:
أخيرًا، أود أن أقول إن البرنامج المساعد يحتوي على إصدار Pro، والذي يحتوي على القليل عدد كبيرالخيارات والإعدادات. يكلف 29 دولارًا لموقع واحد أو 89 دولارًا لخمسة مواقع. 2 يضاف هنا خيارات اضافيةعرض بينتيريست, إنه ممتلئاستبدال عرض أحدث المنشورات في أرشيفات الفئات والعلامات والمؤلفين، ويظهر دعم WooCommerce، ويتم إضافة آلية السحب والإفلات، وغيرها الكثير معلمات مختلفةل مظهركتل. من حيث المبدأ، كانت النسخة المجانية كافية بالنسبة لي لحل مشكلة التصميم الأصلي للصفحة الرئيسية لموقع WordPress.
طرق عرض المحتوى هي واحدة من أفضل الإضافاتعرض المشاركات والصفحات على ووردبريس. بمساعدتها، يمكنك عرض أي صفحات موقع على شبكة الإنترنت في شكل إعلانات ملونة مع إضافة الصور المصغرة (الصور). قد يحتوي عرض الصفحة على العنوان والوصف والمؤلف وتاريخ النشر. من الممكن أيضًا عرض عناوين وإدخالات معينة حسب الفئات والعلامات. إن المكون الإضافي لطرق عرض المحتوى قادر على تنفيذ أي فكرة لدى مشرف الموقع تقريبًا لعرض المنشورات. ستجد في هذه المقالة المعلومات التالية "الاستنتاج اخر المشاركاتعلى WordPress"، و"عرض المشاركات باستخدام الصور المصغرة لـ WordPress"، و"عرض المشاركات حسب المعرف على WordPress".
آخر.نقوم هنا بتكوين كيفية فتح عنصر عند النقر على العنوان أو الصورة المصغرة أو الزر التالي: في علامة تبويب جديدة أو حالية.
في رأيي الشخصي نسخة مجانيةيعمل البرنامج المساعد لطرق عرض المحتوى بشكل جيد بما فيه الكفاية مستوى عال. يشتري نسخة للمحترفينلا حاجة، الميزات القياسيةيعرض البرنامج المساعد بشكل مثالي أي مجموعة من المنشورات والصفحات تقريبًا.
إذا كنت لا تعرف كيفية عرض الصفحات أو المنشورات على موقع WordPress الخاص بك بطريقة جميلة ومبتكرة، فإن المكون الإضافي Content Views سيساعدك في ذلك. لا تحتاج إلى الخوض في التعليمات البرمجية، ما عليك سوى تكوين عرض المحتوى وسيقوم المكون الإضافي تلقائيًا بعرض الصفحات التي تحتاجها في مقالة منفصلة أو عنصر واجهة مستخدم.
في بعض الأحيان يكون من المفيد إخفاء و/أو إظهار بعض المحتوى في منشورات/صفحات WordPress وفقًا لشروط معينة. وتختلف الأحوال والمواقف. لنفترض أنك تقيم مسابقة على موقع الويب الخاص بك ويجب أن تظهر شروط المسابقة أو نتائجها تلقائيًا على الموقع في اليوم السابع عشر الشهر الحالي. أو تقوم بتوزيع الروابط على موقعك، لكنك لا تريد أن يراها الجميع، بل فقط مستخدمي الموقع المسجلين. أو تقبل استبيانات على الموقع من الجمهور ولكنك تريد عرض الاستبيان على الموقع فقط من اليوم الأول حتى العاشر من كل شهر... إلخ.
الإضافات التي تتحكم محتوى ووردبريسبالطبع، هناك عدد كبير. ليس من الواضح ما إذا كانت تلبي جميع المواقف المطلوبة. لكن القيام بذلك بنفسك (دون استخدام المكونات الإضافية) ليس بالأمر الصعب. سوف نستخدم الرموز القصيرة - مجموعة بسيطة من الوظائف لإنشاء رموز الماكرو واستخدامها في محتوى المنشورات/الصفحات. سنقوم بترميز بعض المواقف النموذجيةوبناءً عليها، يمكنك إنشاء وظيفتك الخاصة.
في كل موقف نحتاج إلى وظيفة الرمز القصير، وعادة ما يتم إدراجها في الملف وظائف.phpالموضوع الحالي ومثال للاستخدام المباشر في نص المنشور/الصفحة.
يمكن إخفاء بعض المحتوى الموجود على الصفحة عن المستخدمين غير المسجلين (بالطبع لن تتمكن الروبوتات من رؤيته أيضًا). محركات البحث). عادةً ما يقومون بإخفاء: روابط لتنزيل ملف، وإجابة لسؤال، وبقية المحتوى (من أجل تحفيز المستخدمين على التسجيل، وما إلى ذلك).
الوظيفة logged_in_user_content($atts, $content = null) ( if (is_user_logged_in() && !is_null($content) && !is_feed()) ( return $content; ) return "متاح للمستخدمين المسجلين فقط"; ) add_shortcode("vizible" "، "logged_in_user_content");
فقط المستخدمين المسجلين سوف يرون هذا النص. سيتم استبعاده أيضًا من البحث.
لدى المستخدمين المسجلين أيضًا أدوار مختلفة (). يمكنك تشغيل المحتوى على موقعك إذا كنت تستخدم تدرجات وصول المستخدم على موقعك:
الوظيفة content_by_user($attr, $content = null) ( $defaults = array("capability" => ""); extract(shortcode_atts($defaults, $attr)); if (current_user_can($capability) && !is_null($ content) && !is_feed()) ( return $content; ) return "ليس لديك الحقوق الكافية" ) add_shortcode("rolecontent", content_by_user");
الاستخدام في نص المنشور/الصفحة:
هذا الجزء من المحتوى مرئي للمستخدمين، ج الحقوق المقابلةمتصل.
يمكنك استخدام الخيارات التالية:
إذا كنت تريد جعل جزء من المحتوى مرئيًا في نطاق زمني محدد من كل شهر (على سبيل المثال، من اليوم الأول إلى اليوم العاشر)، فيمكنك استخدام رمز قصير مثل هذا:
الوظيفة content_countdown($atts, $content = null)( extract(shortcode_atts(array("ot" => "", "do" => ""), $atts)); $dt=date("j"); إذا ($dt>=$ot && $dt<=$do) { return $content; } } add_shortcode("data", "content_countdown");
الاستخدام في نص المنشور/الصفحة:
نعرض للمستخدمين ما سيكون متاحًا فقط من اليوم الأول إلى اليوم العاشر (ضمنًا) من كل شهر.
يمكن أن يكون مفيدًا، على سبيل المثال، إذا قمت بتلخيص بعض النتائج في اليوم الثلاثين من كل شهر. ويتم ذلك بنفس الطريقة كما في الحالة السابقة مع بعض التعديلات:
الدالة content_countdown_data($atts, $content = null)( extract(shortcode_atts(array("chislo" => ""), $atts)); $dt=date("j"); if ($dt==$chislo ) (إرجاع محتوى $; ) ) add_shortcode("datas"، "content_countdown_data");
الاستخدام في نص المنشور/الصفحة:
هذا المحتوى سوف في متناول المستخدمينفقط في يوم 30 من كل شهر.
يمكن إخفاء/إظهار المحتوى في يوم محدد من الأسبوع (الاثنين، الثلاثاء، إلخ)
الدالة content_countdown_w($atts, $content = null)( extract(shortcode_atts(array("chislo" => ""), $atts)); $dt=date("w"); if ($dt==$chislo ) (إرجاع محتوى $; ) ) add_shortcode("week", "content_countdown_w");
الاستخدام في نص المنشور/الصفحة:
هذا المحتوى سوف متاح فقط في أيام معينة من الأسبوع.يكفي أن تحدد في المعلمة رقم سريأيام الأسبوع: من 0 (الأحد) إلى 6 (السبت)لعرض المحتوى على موقع الويب الخاص بك في شهر منفصل من العام (لست متأكدًا من أن أي شخص يحتاج إليه، ولكن لا يزال)، نستخدم الرمز القصير التالي:
الدالة content_countdown_month($atts, $content = null)( extract(shortcode_atts(array("month" => ""), $atts)); $dt=date("n"); if ($dt==$month ) (إرجاع محتوى $; ) ) add_shortcode("month", "content_countdown_month");
الاستخدام في نص المنشور/الصفحة:
سيكون هذا المحتوى متاحًا للمستخدمين فقط في شهر يناير. حدد الرقم: من 1 إلى 12.
ماذا لو كنت بحاجة إلى إظهار/إخفاء المحتوى في الصيف أو الشتاء فقط؟ أم في الربع الأول من العام؟ يمكننا إنشاء رمز قصير مثل هذا:
الوظيفة content_countdown_months($atts, $content = null)( extract(shortcode_atts(array("ot" => "", "do" => ""), $atts)); $dt=date("n"); إذا ($dt>=$ot && $dt<=$do) { return $content; } } add_shortcode("months", "content_countdown_months");
الاستخدام في نص المنشور/الصفحة:
سيكون المحتوى متاحًا فقط في الربع الأول من العام، من الأشهر 1 إلى 3 (شاملاً).
يمكنك إخفاء المحتوى الذي لن يراه زوار موقعك إلا بعد مرور تاريخ معين. سيكون مثل هذا الرمز مطلوبًا للإبلاغ عن قدوم العام الجديد، ونهاية المنافسة، والماراثون على الموقع، وما إلى ذلك.
الدالة content_countdown_day($atts, $content = null)( extract(shortcode_atts(array("month" => "", "day" => "", "year" => ""), $atts)); $remain = ceil((mktime(0,0,0,(int)$month,(int)$day,(int)$year) - time())/86400); if($remain > 1)( return $daysremain = "الأيام المتبقية - (تبقى)"; ) else if($remain == 1)( return $daysremain = "Remaining 1 day"; ) else( return $content; ) ) add_shortcode("newyear", "content_countdown_day");
الاستخدام في نص المنشور/الصفحة:
السنة الجديدة! دعونا نحتفل!
تم تصميم جميع الرموز القصيرة المذكورة أعلاه لإخفاء/إظهار بعض أكواد HTML على صفحاتك. ولكن ماذا يحدث إذا قمت بإرفاق رمز قصير في رمز قصير؟ هذا صحيح، لن يعمل الرمز القصير المتداخل. سيحدث هذا التعارض، على سبيل المثال، إذا حاولت تضمين رمز قصير نموذج الاتصال، على سبيل المثال مثل هذا:
[contact-form-7 id="6122" title="نموذج الاتصال"] !}
لكي يعمل الرمز القصير في الرمز القصير لـ WordPress، نحتاج إلى استبدال سطر واحد فقط في وظائف الرموز القصيرة الواردة هنا. خط:
إرجاع محتوى $؛
وحل محله:
إرجاع do_shortcode($content);
كل شيء يجب أن يعمل!
يعد WordPress عقارًا سهلاً في عالم تطوير الويب. كان العديد من الأشخاص الذين بدأوا في استخدام هذه المنصة يبحثون في البداية عن طريقة سهلة (ومجانية) لإنشاء موقع ويب بسيط. كل هذا يمكن القيام به من خلال القليل من البحث على Google والنصائح المقدمة في مخطوطة WordPress. في الأساس، "أردت فقط أن أجربه وقد نجح كل شيء."
ومع ذلك، فإن العديد من المستخدمين لا يتوقفون عند هذا الحد التعارف البسيط. بدلا من ذلك، يبدأون في استخدام النظام بنشاط. لقد توصلوا إلى المزيد من الأفكار. إنهم يقومون بالتجربة. تجربة الإضافات الجديدة. افتح فايربوج. الجميع. لقد تم بالفعل تجاوز نقطة اللاعودة. هل توافق على ذلك، هل هذه القصة مشابهة لقصتك؟ ل مستخدمي ووردبريسمن الطبيعي أن ترغب في المزيد والمزيد من جوانب إدارة موقعك. تريد تصميمًا فريدًا ووظائف مثبتة وتخصيصًا لجميع التفاصيل.
لحسن الحظ، نظام ووردبريسمصممة خصيصا لهذا الغرض. يسمح هيكلها المرن بالإضافة إلى بنيتها المعيارية لأي شخص بتغيير أي شيء تقريبًا على موقعه على الويب.
من بين الاكثر أدوات مهمةبخصوص السيطرة الكاملةالموقع، يمكنك وضع علامة على قوالب الصفحة. إنها تسمح للمستخدمين بتغيير تصميم ووظائف موقعهم على الويب بشكل جذري. هل تريد إنشاء رأس مختلف تمامًا لصفحتك الرئيسية؟ بسهولة. شريط جانبي إضافي سيظهر فقط على صفحة المدونة؟ لا مشكلة. صفحة 404 فريدة من نوعها؟ لو سمحت!
إذا كنت تريد معرفة كيف يمكن لقوالب صفحات WordPress أن تساعدك في حل هذه المشكلات، فتابع القراءة. ومع ذلك، أولا سوف نعطي بعض معلومات اساسيةمن الضروري فهم كيفية عمل قوالب الصفحات في WordPress.
ماذا نعني عندما نتحدث عن القوالب في سياق WordPress؟ باختصار، القوالب هي ملفات تخبر WordPress بكيفية الإخراج أنواع مختلفةمحتوى.
أكثر شرح مفصل: عندما يقوم شخص ما بتقديم طلب لعرض جزء من موقعك، منصة ووردبريسيحدد المحتوى الذي يريد المستخدم تلقيه والجزء الذي يجب عرضه من موقعك.
سيحاول WordPress بعد ذلك استخدام القالب الأكثر ملاءمة المتوفر في موضوعك لهذا الجزء من الموقع. أي واحد يعتمد بالضبط على التسلسل الهرمي لقوالب WordPress. يمكنك رؤية كيف يبدو هذا التسلسل الهرمي في لقطة الشاشة أدناه.
التسلسل الهرمي للقالب عبارة عن قائمة بالعناصر المألوفة ملفات ووردبريسالقوالب التي تم ترتيبها لتحديد الملف الذي له الأولوية القصوى.
يمكنك التفكير في هذا التسلسل الهرمي كشجرة قرارات. عندما يحاول WordPress تحديد كيفية العرض الصفحه الحاليه، فإنه ينتقل إلى أسفل التسلسل الهرمي للقالب حتى يجد القالب الأول الذي يطابق الصفحة المطلوبة. على سبيل المثال، إذا حاول شخص ما الوصول إلى http://yoursite.com/category/news، فسيبحث WordPress عن قالب مطابق بهذا الترتيب:
يوجد في أسفل التسلسل الهرمي ملف Index.php. يتم استخدامه لعرض أي محتوى لا يحتوي على قالب متخصص. إذا كان القالب في مرتبة أعلى في التسلسل الهرمي، فسيستخدمه WordPress تلقائيًا لعرض المحتوى المطلوب.
بالنسبة للصفحات، القالب القياسي هو ملف page.php. إذا لم يكن هناك قالب أفضل متاح (مثل archive.php لصفحات الأرشيف)، فسيستخدم WordPress page.php لعرض محتوى جميع الصفحات على موقعك.
ومع ذلك، في معظم الحالات هناك حاجة لتغيير التصميم والمظهر والوظيفة المناطق الفرديةموقع. في هذه الحالة، يتم استخدام قوالب الصفحة. قوالب مخصصةتسمح لك الصفحات بتخصيص أي جزء من موقعك دون التأثير على الباقي.
ربما تكون قد رأيت هذا بالفعل أثناء العمل. على سبيل المثال، كثيرون اليوم مواضيع ووردبريستأتي مع خيارات لعرض صفحاتك في وضع ملء الشاشة، أو إضافة شريط جانبي إضافي أو تغيير موقعه، وما إلى ذلك. يتم تنفيذ كل هذا عادة من خلال القوالب. هناك عدة طرق للقيام بذلك، وسوف ننظر إليها بعد ذلك.
أولاً، كلمة تحذير: نظرًا لأن العمل باستخدام القوالب يتضمن تحرير ملفات السمات النشطة وتعديلها، فإننا نوصي باستخدام سمة فرعية لإجراء هذه التعديلات. بهذه الطريقة لن تتم الكتابة فوق تغييراتك عند تحديث السمة الأصلية.
هناك ثلاث طرق رئيسية لاستخدام قوالب الصفحات المخصصة في WordPress: الإضافة عبارات شرطيةل القالب الموجود; وإنشاء قالب لصفحة معينة ستحتل مرتبة أعلى في التسلسل الهرمي؛ بالإضافة إلى التعيين المباشر للقوالب إلى صفحات معينة. سننظر في كل من هذه الطرق على حدة.
استخدام العلامات الشرطية في القوالب القياسية
أسهل طريقة لإجراء التغييرات هي صفحة منفصلةهو استخدام العلامات الشرطية في قالبها. وكما يوحي الاسم، تُستخدم هذه العلامات لإنشاء وظائف يتم تنفيذها فقط عند استيفاء شرط ما. في سياق قوالب الصفحات، يكون هذا مثل "قم بالإجراء X فقط على الصفحة Y".
عادةً، تتم إضافة العلامات الشرطية إلى قالب page.php الخاص بموضوعك (إلا إذا كنت تريد تغيير جزء آخر من الموقع). أنها تساعدك على إجراء تغييرات فقط من أجل الصفحة الرئيسيةأو الصفحة الرئيسية أو صفحة المدونة أو أي صفحة أخرى على موقعك.
فيما يلي بعض العلامات الشرطية الشائعة:
على سبيل المثال، إذا قمت بإضافة page.php إلى القالب بدلاً من ذلك علامة قياسية get_header(); بالكود التالي، سوف تحصل على رأس مخصص يسمى header-shop.php عند عرض الصفحة http://yoursite.com/products.
إذا (is_page("المنتجات")) ( get_header("shop"); ) آخر ( get_header(); )
مثال جيدباستخدام هذا الرمز: إذا كان لديك متجر على موقعك وتريد عرض صورة رأسية مختلفة أو قائمة معدلة على صفحة المتجر. يمكنك إجراء التغييرات المناسبة على header-shop.php لضمان ظهور كل ذلك على موقعك.
ومع ذلك، لا تقتصر العلامات الشرطية على صفحة واحدة فقط. يمكنك ضبط عدة شروط في وقت واحد:
إذا (is_page("products")) ( get_header("shop"); ) elseif (is_page(42)) ( get_header("about"); ) else ( get_header(); )
في هذا المثال، قمنا بوضع شرطين من شأنهما تغيير سلوك الصفحات المختلفة على موقعك. بالإضافة إلى تحميل رأس المتجر المذكور أعلاه، نقوم بتحميل header-about.php على الصفحة ذات المعرف 42. بالنسبة لجميع الصفحات الأخرى سيتم عرض الرأس القياسي.
إنشاء قوالب الصفحة في التسلسل الهرمي لقالب WordPress
تُعد العلامات الشرطية طريقة رائعة لإجراء تغييرات صغيرة على قوالب صفحتك. وبطبيعة الحال، يمكنك إنشاء تعديلات أكبر بناءً على عدة عبارات شرطية. أجد هذا الحل مرهقًا وغير مريح للغاية، وسأختار إنشاء قوالب مخصصة بدلاً من ذلك.
إحدى الطرق للقيام بذلك هي استخدام التسلسل الهرمي لقالب WordPress. كما رأينا بالفعل، سيقوم WordPress بالاطلاع على قائمة جميع القوالب الممكنة واختيار القالب الأول الذي يطابق الصفحة المطلوبة. بالنسبة للصفحات، يبدو التسلسل الهرمي كما يلي:
تأتي أولاً قوالب الصفحات المخصصة التي تم تعيينها مباشرة لهذه الصفحة. إذا كان هناك قالب واحد على الأقل، فسيستخدمه WordPress بغض النظر عن وجود قوالب أخرى. سنتحدث عن قوالب الصفحات المخصصة لاحقًا.
سيبحث WordPress بعد ذلك عن قالب الصفحة الذي يتضمن الارتباط الثابت للصفحة المعنية. على سبيل المثال، إذا قمت بتضمين ملف page-about.php في ملفات السمات الخاصة بك، فسيستخدم WordPress هذا الملف لعرض صفحة "حول" الخاصة بك أو أي صفحة أخرى موجودة على http://www.yoursite.com/about .
يمكنك تحقيق نفس الشيء عن طريق تحديد معرف صفحتك. على سبيل المثال، إذا كانت نفس الصفحة تحتوي على معرف 5، فسيستخدم WordPress قالب page-5.php إذا كان موجودًا؛ لن يحدث هذا إلا في حالة عدم وجود قوالب صفحات ذات أولوية أعلى في التسلسل الهرمي.
يمكنك معرفة معرف أي صفحة بمجرد المرور فوق عنوانها في قسم "جميع الصفحات" في الواجهة الخلفية لـ WordPress. سيكون المعرف موجودًا في الرابط الذي يعرضه متصفحك.
ربط قوالب الصفحات المخصصة
بالإضافة إلى القوالب التي يمكن أن يستخدمها WordPress تلقائيًا، يمكنك دائمًا ربط القوالب المخصصة بها صفحات مختلفة. كما تعلمت من التسلسل الهرمي للقالب، فإن القوالب المخصصة هي الأعلى في الأولوية.
كما هو الحال مع ربط القوالب بصفحات معينة، ستحتاج إلى إنشاء قالب وربطه بالصفحة التي خططت لاستخدامه فيها. يمكن القيام بهذا الأخير بطريقتين قد تكون على دراية بهما بالفعل. فقط في حالة، سنوضح لك كيفية القيام بذلك.
ربط قالب صفحة مخصص عبر محرر WordPress
في محرر ووردبريسيمكنك العثور على حقل يسمى سمات الصفحة. أنه يحتوي على قائمة القالب.
يمكنك الاختيار من هذه القائمة أي ما هو متاح قوالب ووردبريس. ما عليك سوى تحديد القالب المناسب، ثم حفظ صفحتك أو تحديثها.
إعداد قالب مخصص عبر التحرير السريع
يمكن فعل الشيء نفسه دون الذهاب إلى محرر WordPress. انتقل إلى قسم "جميع الصفحات" وقم بتمرير مؤشر الماوس فوق أي عنصر من القائمة. ستظهر قائمة على الشاشة تتضمن عنصر التحرير السريع.
انقر فوق هذا العنصر لتحرير معلمات الصفحة مباشرة من القائمة. سترى نفس القائمة المنسدلة التي تسمح لك بتحديد قالب الصفحة. حدد قالبًا وقم بتحديث الصفحة. مستعد.
ليس من الصعب جدا، أليس كذلك؟ ومع ذلك، ماذا لو لم يكن لديك قالب صفحة مخصص حتى الآن؟ كيفية إنشائه؟ لا تقلق، سنناقش هذا في القسم التالي.
إن إنشاء قوالب صفحة مخصصة ليس عملية معقدة، ولكن هناك بعض التفاصيل التي يجب مراعاتها. دعونا نلقي نظرة على هذه العملية خطوة بخطوة.
إحدى الطرق الجيدة لبدء إنشاء قالب صفحة مخصص هي نسخ القالب الموجود فيه هذه اللحظةتستخدم بالفعل ل الصفحة المطلوبةفي موضوعك. من الأسهل تغييره بالفعل الكود الموجودبدلاً من كتابة صفحة كاملة من الصفر. في معظم الحالات، سيكون هذا هو ملف page.php.
إذا لم تتمكن من تحديد القالب الذي سيتم استخدامه لصفحة معينة، فيمكنك استخدام المكون الإضافي What The File.
سأستخدم موضوع Twenty Twelve كمثال. هذا ما يبدو عليه قالب الصفحة القياسي:
كما ترون، لا يوجد شيء مثير للاهتمام: مكالمات منتظمةرأس وتذييل، بالإضافة إلى حلقة في المنتصف. ستبدو الصفحة هكذا:
بعد تعريف القالب القياسيسنحتاج إلى نسخه. سوف نستخدم النسخة المكررة لإجراء التغييرات اللازمة على صفحتنا. سنحتاج أيضًا إلى إعادة تسميته.
يمكنك تسمية الملف كما تريد. الشيء الرئيسي هو أنه لا يبدأ بأسماء ملفات السمات المحجوزة. لا ينبغي عليك تسمية الملف page-something.php أو بطريقة مماثلةنظرًا لأن WordPress سيعتبره قالبًا مخصصًا.
من الأفضل تسمية الملف بحيث يعكس جوهر القالب. على سبيل المثال، my-custom-template.php. في حالتنا، سوف نسميها custom-full-width.php.
الآن نحن بحاجة إلى إخبار WordPress أن هذا ملف جديدهو قالب صفحة مخصص. للقيام بذلك، سنقوم ببساطة بضبط رأس الملف:
سيظهر اسم القالب في قسم سمات الصفحة بصفحة محرر WordPress. تأكد من تغييره بنفسك.
حان الوقت الآن للعمل مع رمز القالب. في مثالنا، سنقوم بإزالة الشريط الجانبي من الصفحة التجريبية.
يعد هذا أمرًا سهلاً نسبيًا - ما عليك سوى إزالة get_sidebar(); من قالب الصفحة ونتيجة لذلك، أصبح القالب الخاص بي كما يلي:
بعد حفظ الملف المعدل، نحتاج إلى تحميله على الموقع. يمكن تخزين قوالب الصفحات المخصصة في أماكن مختلفة:
أفضّل إنشاء مجلد page_templates فيه موضوع الطفلووضع كافة القوالب التعسفية فيه. هذه هي أسهل طريقة بالنسبة لي للوصول إلى الملفات التي تم تغييرها.
الخطوة الأخيرة: نحتاج إلى تفعيل قالب الصفحة. كما ذكرنا سابقًا، يتم ذلك في قسم سمات الصفحة → القوالب في محرر WordPress. نقوم بحفظ الصفحة وعرضها - ونرى ما لدينا قالب جديدعملي (بدون الشريط الجانبي):
ليس من الصعب جدا، أليس كذلك؟ لا تقلق، ستتمكن من صقل مهاراتك في صنع النماذج في وقت قصير. لإعطائك فكرة عن كيفية استخدام هذه القوالب بالضبط، سأعرض لك بعض حالات الاستخدام المثيرة للاهتمام.
كما ذكرنا سابقًا، يمكن استخدام قوالب الصفحة لأغراض مختلفة. يمكنك تخصيص كل منطقة تقريبًا في أي صفحة. العائق الوحيد في هذا المسار هو خيالك (ومهاراتك في البرمجة).
قالب لعرض الصفحات بالعرض الكامل للشاشة
الحالة الأولى التي سننظر إليها هي نسخة موسعة من القالب التجريبي الذي أنشأناه أعلاه. لقد قمنا بالفعل بإزالة الشريط الجانبي عن طريق إزالة get_sidebar(); من الكود. ومع ذلك، كما ترون في لقطة الشاشة، لا تزال الصفحة لا تظهر بالعرض الكامل للشاشة، نظرًا لأن قسم المحتوى ظل محاذيًا لليسار.
لإصلاح ذلك، نحتاج إلى العمل مع CSS، وخاصة هذا القسم:
محتوى الموقع (طفو: يسار؛ عرض: 65.1042%؛)
تحدد سمة العرض عرض المحتوى الخاص بنا على 65.1042% من مساحة متاحة. نريد زيادة هذه القيمة.
إذا قمنا ببساطة بتغيير قيمة العرض إلى 100%، ففي النهاية سيتم عرض جميع صفحات موقعنا بالعرض الكامل للشاشة - لا نحتاج إلى هذا. خطوتنا الأولى هي تغيير فئة div بالمعرف = الأساسي في قالبنا المخصص. يمكنك تغييره إلى class = "site-content-fullwidth". نتيجة:
يمكننا الآن ضبط CSS لفئتنا المخصصة:
العرض الكامل لمحتوى الموقع ( float: left; width: 100%; )
ونتيجة لذلك، سيشغل المحتوى الشاشة بأكملها:
صفحات ديناميكية 404 مع مناطق عناصر واجهة المستخدم
تظهر صفحة 404 عندما يحاول المستخدم الوصول إلى صفحة غير موجودة على موقعك. يحدث هذا نتيجة خطأ مطبعي، أو رابط غير صحيح، أو بسبب تغيير الرابط الثابت للصفحة.
على الرغم من أنه لا أحد يحب تلقي 404 صفحة، إلا أنها تلعب دورًا مهمًا لموقعك على الويب. غالبًا ما يكون محتواها هو العامل الحاسم في ما إذا كان الشخص سيتخلى على الفور عن موقعك أو يحاول البحث عن محتوى آخر عليه.
تعد كتابة 404 صفحة من الصفر عملية صعبة للغاية، خاصة إذا لم تكن لديك خبرة كبيرة. من الأفضل تضمين مناطق عناصر واجهة المستخدم في القالب الخاص بك حتى تتمكن من تغيير المحتوى المعروض على الشاشة بمرونة.
ولهذا السبب على وجه التحديد، سنستخدم ملف 404.php الذي يأتي مع قالب Twenty Twelve (هل تتذكر التسلسل الهرمي للقالب؟). ولكن قبل أن نغير أي شيء فيه، دعونا ننشئ القطعة الجديدةعن طريق لصق الكود في ملف jobs.php:
Register_sidebar(array("name" => "Page 404", "id" => "404", "description" => __("محتوى صفحة الخطأ 404 يظهر هنا."), "before_widget" => "
سيؤدي هذا إلى إخراج عنصر واجهة المستخدم الجديد الخاص بنا في الواجهة الخلفية لـ WordPress. وللتأكد من ظهوره فعليًا على موقعنا، نحتاج إلى إضافته السطر التاليكود إلى ملف صفحة 404 في الموقع المناسب:
في حالتي أريد استبدال نموذج البحث بـ get_search_form(); في القالب إلى منطقة القطعة. هذا هو ما يبدو:
بعد تحميل القالب إلى الموقع، يمكننا ملء منطقة القطعة الجديدة:
إذا انتقلنا الآن إلى صفحة 404، فسنرى عناصر واجهة مستخدم جديدة:
قالب الصفحة لعرض أنواع المنشورات المخصصة
تعد أنواع المنشورات المخصصة طريقة رائعة لتقديم المحتوى الذي يحتوي على مجموعات البيانات والتصميم والإعدادات الأخرى الخاصة به. إحدى حالات الاستخدام الشائعة لهذه الأنواع من المنشورات هي عناصر المراجعة: الكتب والأفلام وما إلى ذلك. في حالتنا، نريد إنشاء قالب صفحة يعرض عناصر المحفظة.
نحتاج أولاً إلى إنشاء نوع المنشور المخصص لدينا. يمكن القيام بذلك يدويًا أو من خلال مكون إضافي. يمكنني أن أوصي بالمكون الإضافي Types لهذا الغرض. سيسمح لك بإنشاء أنواع منشورات مخصصة وحقول مخصصة بسهولة.
قم بتثبيت الأنواع وتنشيطها، وأضف نوع منشور مخصص، واجعله ثابتًا "محفظة"، وقم بتكوين الحقول التي تحتاجها (على سبيل المثال، إضافة صورة مصغرة)، واضبط الخيارات الأخرى واحفظها.
الآن بعد أن أصبح لدينا نوع منشور المحفظة، نحتاج إلى عرضه على الموقع. أول شيء سنفعله هو الإنشاء الصفحة المطلوبة. يرجى ملاحظة أنه إذا قمت بتحديد المحفظة كعملة ثابتة لملفك نوع تعسفيالسجلات، يجب ألا تحتوي الصفحة على نفس السلسلة الثابتة. لقد استقرت على محفظة العملاء وأضفت بعض النصوص الإضافية.
بعد إضافة بعض العناصر إلى قسم المحفظة، نحتاج إلى عرضها على الصفحة مباشرة بعد المحتوى الرئيسي.
للقيام بذلك نستخدم نسخة مكررة من page.php. لننسخ الملف، ونسميهPortfolio-template.php ونغير عنوانه:
ومع ذلك، في هذه الحالة سنحتاج إلى إجراء بعض التغييرات على القالب الأصلي. إذا نظرت إلى كود page.php، سترى أنه يستدعي قالبًا آخر، content-page.php (get_template_part('content', 'page');). سنحتاج في هذا الملف إلى الكود التالي:
كما ترون، يتم استدعاء عنوان الصفحة ومحتواها هنا. وبما أننا بحاجة إليها أيضًا في قسم المحفظة، فسننسخ هذه الأجزاء إلى قالب page.php الخاص بنا. وستكون النتيجة على النحو التالي:
Get_header(); ?>
لعرض عناصر المحفظة على صفحتنا، سنحتاج إلى إضافة الكود التالي مباشرة بعد استدعاء the_content():
"محفظة"، // أدخل نوع المنشور المخصص "orderby" => "date"، "order" => "DESC"،)؛ $loop = new WP_Query($args); إذا($loop->have_posts()): بينما($loop->have_posts()): $loop->
ونتيجة لذلك، سيتم عرض نوع منشور مخصص على صفحتنا:
لا يبدو الأمر جميلًا، لذا دعونا نضيف بعض التصميم هنا:
/* منشورات المحفظة */ .portfolio ( -webkit-box-shadow: 0px 2px 2px 0px rgba(50, 50, 50, 0.75); -moz-box-shadow: 0px 2px 2px 0px rgba(50, 50, 50, 0.75)؛ ظل الصندوق: 0px 2px 2px 0px rgba(50, 50, 50, 0.75); الهامش: 0 0 20px; العرض: 20%؛ ) .portfolio-image img ( نصف قطر الحدود: 0؛ ) .portfolio-work ( العرض: كتلة مضمنة؛ الحد الأقصى للعرض: 80%؛ ) .portfolio h3 (الحدود السفلية: 1 بكسل صلب #999 حجم الخط: 1.57143rem؛ الهامش: 0 0 15 بكسل؛
الوضع أفضل بكثير الآن، ألا تعتقد ذلك؟
إليك كل التعليمات البرمجية الخاصة بقالب صفحة المحفظة:
صفحة الأعضاء مع الصور الرمزية
المثال التالي لاستخدام القالب الخاص بنا هو صفحة الأعضاء. نريد إدراج مؤلفي موقعنا، بما في ذلك صورهم، بالإضافة إلى عدد المشاركات التي نشروها تحت أسمائهم. وستكون النتيجة النهائية على النحو التالي:
سنبدأ بنفس الملف المختلط كما كان من قبل ونضيف إليه رمزًا لعرض قائمة المشاركين.
يأتي قالب Twenty Fourteen الافتراضي مزودًا بصفحة أعضاء افتراضية. يمكنك العثور على هذا القالب في مجلد قوالب الصفحة المسمى contributors.php.
لكن إذا بحثت في هذا الملف فلن تجد إلا الاستدعاء التالي: tyuntyfourteen_list_authors();. من الواضح أن هذا مرتبط بالوظيفة الموجودة في ملف function.php الخاص بالقالب. نحن مهتمون بالجزء التالي:
"ID"، "orderby" => "post_count"، "order" => "DESC"، "who" => "authors"،)); foreach ($contributor_ids كـ $contributor_id): $post_count = count_user_posts($contributor_id); // تابع إذا لم يقم المستخدم بنشر منشور (حتى الآن). إذا (! $post_count) (تابع؛) ?>
">
سنضيفه مباشرة أسفل استدعاء the_content() ونحصل على النتيجة التالية:
الآن دعونا نضع بعض التصميم:
/* صفحة المساهم */ .contributor ( border-bottom: 1px Solid rgba(0, 0, 0, 0.1); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box- الحجم: مربع الحدود؛ العرض: كتلة مضمنة؛ الحشو: 48 بكسل 10 بكسل؛ الصلبة rgba(0, 0, 0.1); : 0 ) .ملخص المساهم (عائم: يسار;) .اسم المساهم(وزن الخط: عادي; الهامش: 0!مهم;) .رابط منشورات المساهم (لون الخلفية: #24890d; الحدود: 0 لا شيء نصف قطر الحدود: 0 ؛ اللون: #fff؛ حجم الخط: 12 بكسل؛ ارتفاع الخط: 10 بكسل 30 بكسل 11 بكسل؛
مستعد. شكرا لك أربعة وعشرون!
صفحة الأرشيف التي تم تغييرها
يأتي Twenty Twelve مع القالب الخاص به لصفحات الأرشيف. سيتم استخدامه، على سبيل المثال، إذا حاولت عرض المشاركات السابقة من فئة معينة.
ومع ذلك، أود أن أفعل شيئًا أكثر إثارة للاهتمام، مثل Problogger: صفحة تتيح للأشخاص الحصول على محتوى إضافي طرق مختلفة. ويتم ذلك مرة أخرى باستخدام قالب الصفحة.
يمكننا إضافة الكود التالي مباشرة أسفل the_content() في ملفنا، والذي يستخدم على سبيل المثال:
ستحتاج أيضًا إلى بعض التصميم للبحث:
نموذج بحث الأرشيف ( الحشو: 10 بكسل 0؛ محاذاة النص: المركز؛ )
وستكون النتيجة على النحو التالي:
إليك الملف بأكمله حتى تتمكن من فهم ما هو:
لا تنس ربط هذا القالب بالصفحة!