Unlimited WordPress themes, graphics, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Web Design
  2. HTML & CSS
Webdesign

8 نصائح وتقنيات لتعديل جملة! قوالب

by
Length:LongLanguages:

Arabic (العربية/عربي) translation by Muhammad Hasrullah (you can also view the original English article)

بدأت للتو إنشاء جملة! القالب والخلط حول كيفية حقاً الحصول على مقبض على تعديله؟ تحقق من هذه النصائح البسيطة والحيل التي تعطيك التحكم بصورة أفضل عند تصميم موقعك جملة.

عندما بدأت بإنشاء نماذج Joomla لأول مرة ، كان هناك بعض الأشياء التي كنت محتارًا بشأنها. كيف أقوم بتعديل صفحة واحدة فقط دون التأثير على الآخرين؟ كيف أقوم بتغيير هيكل وحدة نمطية بحيث يكون من الأسهل استخدام النمط؟ في هذه المقالة سوف نذهب أكثر من كيفية معالجة هذه المشاكل وتبحث عن حلول سريعة أخرى يمكنك استخدام بسرعة حتى عملك تطوير قالب جملة.


ملخص الدرس:

  1. إعداد مضيف تركيب جملة.
  2. اختيار إطار قالب جيدة للعمل مع (حيث كنت أنت لا إعادة اختراع العجلة).
  3. استخدام بيانات URL من المستعرض إلى نمط صفحات فردية في جملة.
  4. انهيار مواقع الوحدة النمطية.
  5. تسجيل في التصميم.
  6. استخدام لاحقات فئة الوحدة النمطية لجعل وحدات فريدة من نوعها.
  7. تعديل قوالب نمطية حيث أنهم أسهل للنمط.
  8. إضافة في الشرطية IE القديمة العادية لإصلاح أخطاء "إنترنت إكسبلورر"

تلميح 1: تركيب جملة Localhost

قبل أن يمكنك تعديل وتطوير القالب الخاص بك، تحتاج إلى أن يكون تركيب جملة للعمل مع. استخدام نوع من البط ل windows أو MAMP ل Mac (سأكون باستخدام نوع من البط في هذا المثال)، نحن ذاهبون لإنشاء تثبيت جملة بسيطة استضافت الحق على جهاز الكمبيوتر الخاص بك حتى يمكنك البدء مع التعديلات القالب.

أولاً، اذهب إلى www.wampserver.com/en. في الصفحة الرئيسية انقر فوق "تحميل أحدث إصدار من Wampserver 2."

الآن انقر على وصلة التحميل للإصدار 32 بت أو الإصدار 64 بت من وامب (تبعاً لإصدار Windows لديك). إذا كنت لا تعرف أي إصدار لديك، انقر فوق على ابدأ الجرم السماوي ونوع "dxdiag" في حقل البحث. داخل أداة تشخيص DirectX وسوف أقول لكم الإصدار الذي كنت تعمل إلى جانب نظام التشغيل. تحميل وامب وتشغيل.exe لتثبيت البرنامج باستخدام الدليل الافتراضي من C:\wamp. كما سيطلب المستعرض الذي تريد استخدامه لمعاينة الافتراضية، ولكن أنا ابدأ استخدام هذا فقط اختر explorer.exe. لن نذهب إلى استخدام SMTP أو البريد الإلكتروني حتى مجرد ترك تلك كقيم افتراضية ومن ثم إطلاق وامب.

سوف تظهر أيقونة في علبة شريط المهام الخاصة بك لنوع من البط، وينبغي أن يكون اللون البرتقالي. وهذا يعني أن الخادم المضيف المحلي غير متصل. لتشغيله على الإنترنت (حيث يمكنك أن تبدأ العمل معه) الأيسر على الرمز وحدد "بدء تشغيل كافة الخدمات". ثم الأيسر على الأيقونة مرة أخرى وحدد "وضع عبر إنترنت". سيبدأ هذا الخادم المضيف المحلي على الجهاز الخاص بك.

ملاحظة: إذا كان لديك أشياء مثل Skype أو Teamviewer قيد التشغيل على جهاز الكمبيوتر الخاص بك، وهذا يمنع وامب من الدخول إلى الإنترنت لذا تأكد من إيقاف تشغيل هذه البرامج قبل محاولة بدء تشغيل localhost.

الآن أن لدينا إعداد الملقم localhost، يمكن أن ننتقل إلى تحميل أحدث تركيب جملة للعمل مع. حاليا هو أحدث إصدار من جملة 1.7 ولكن نحن ذاهبون إلى استخدام جملة 1.5 لهذا البرنامج التعليمي؛ هو أكثر استقرارا ولديه أكثر من الملحقات والقوالب المتوفرة لذلك.

اذهب إلى www.joomla.org. مرة واحدة هناك انقر على الزر "تحميل جملة" في الوسط الأيسر من الصفحة. قم بالتمرير لأسفل والبحث عن أحدث إصدار من جملة 1.5. وفي وقت كتابة هذا التقرير من 1.5.23 ونريد الحزمة الكاملة، لذا انقر فوق الارتباط بعنوان "الرمز البريدي" لتحميل البرنامج. الآن انتقل إلى الدليل C:\wamp\www وقم بإنشاء مجلد جديد يسمى "جملة". نسخ ملف مضغوط جملة قمت بتحميلها فقط إلى هذا المجلد واستخراجه مع أداة مثل 7zip أو WinRAR الذي كلاهما متاح لتحميل من download.com. وهذا استخراج الحزمة جملة بأكملها في هذا الدليل وتسمح لك لتثبيته.

لتركيب جملة، تذهب إلى المتصفح الخاص بك واكتب "localhost/جملة/التثبيت". إذا كان كل شيء على ما يرام، سوف تظهر لك الصفحة "اختر لغة". اختر اللغة الخاصة بك وانقر فوق الزر "التالي" في الركن الأيمن العلوي. للتحقق من التثبيت المسبق، يجب أن لا تحتاج إلى تعديل أي شيء، لذا انقر فوق "التالي". مرة أخرى، انقر فوق "التالي" لقبول رخصة جنو العمومية.

وهنا يأتي الجزء الأهم من التثبيت: إنشاء قاعدة البيانات والمستخدم. حاليا ليس لدينا مجموعة واحدة بعد ذلك سوف نقوم بإنشاء ذلك الآن.

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

في الحقل "إنشاء قاعدة بيانات جديدة"، اكتب اسم قاعدة البيانات التي قمت باختيارها. شيء من هذا القبيل "قالب" سيكون كافياً. يتم الآن إنشاء قاعدة بيانات وسوف تظهر لك أنه لا توجد أية جداول حاليا في مجال تكنولوجيا المعلومات. والخطوة التالية لإنشاء مستخدم مع كافة الأذونات حتى يمكن الوصول إلى قاعدة البيانات من جملة. انتقل إلى علامة التبويب "الامتيازات" في الجزء العلوي وانقر فوق "إضافة مستخدم جديد".

في هذه الشاشة الجديدة، اكتب اسم المستخدم الذي تريد استخدامه. لقد اخترت "template_user" كاسم المستخدم الخاص بي و "1234" لكلمة السر الخاصة بي. ومن الواضح أن على خادم حقيقي قد ترغب في استخدام طريقة أكثر أماناً من هذا شيء للمستخدم وكلمة المرور الخاصة بك، ولكن localhost ليس جداً ذات الصلة. لتعبئة حقل المضيف في "localhost". الآن تحت ذلك، حيث تقول قاعدة البيانات للمستخدم، الافتراضي يجب أن يكون زر الخيار الأخير. إذا لم يكن انقر فوق الزر الراديو آخر أن يقول شيئا مثل "منح جميع الامتيازات في قاعدة بيانات' قالب '". الحق تحت ذلك، إلى جانب "امتيازات العالمية"، انقر فوق الارتباط "التحقق من جميع" وثم انقر فوق الزر "انتقال" في أسفل الزاوية اليمنى.

أدناه مثال على إظهار ما يجب أن تبدو عليه.

والآن بعد أن يتم إنشاء المستخدم وقاعدة البيانات الخاصة بك، يمكنك العودة إلى الشاشة تركيب جملة ووضع هذه العناصر في الحقول الموجودة في قاعدة البيانات: أولاً، نوع قاعدة البيانات هو "الخلية"، ومن ثم قمت بكتابة في "localhost" لاسم المضيف. اكتب اسم المستخدم الذي قمت بإنشائه وكلمة المرور. للاجهاز عليه نوع في اسم قاعدة البيانات الذي كان "قالب"، ثم انقر فوق التالي. في شاشة تكوين FTP فقط ترك كل شيء كما هو، وانقر فوق "التالي" دون تمكين طبقة نظام الملف FTP.

الشاشة الأخيرة هو "التكوين الرئيسي" للتثبيت. اكتب اسم الموقع الخاص بك وأنا ذاهب لاستدعاء "قالب نصائح". نوع البريد الإلكتروني الخاص بك، كلمة المرور admin (نحن فقط استخدام 1234 مرة أخرى في هذا المثال) ثم قم بتأكيد كلمة مرور المشرف. عندما كنت قد بدأت أولاً بإنشاء قوالب، أود أن أوصى تثبيت نموذج البيانات لأنه يعطي الموقع إحساس "كاملة" عندما كنت في محاولة لتصميم، بدلاً من البدء بقائمة فارغة. إذا لم تثبيت عينة البيانات، عندما تذهب إلى جملة موقعك بعد أن ننتهي هنا أنها ستكون فارغة إلى حد كبير مع أي محتوى على الإطلاق لنمط مع.

ملاحظة: بمجرد كنت أصبحت أكثر تقدما مع تعديل قالب، لن ترغب في تثبيت عينة البيانات بعد الآن. وسوف يستغرق مزيدا من الوقت لتتمكن من إلغاء تثبيت كل من هذا المحتوى وهمية مما سيوفر لك المساعدة في تصور الطريقة التي تبدو فيها القالب.

لذا انقر فوق الزر "تثبيت" نموذج البيانات وثم انقر فوق الزر "التالي".

الخطوة الأخيرة والنهائية لتركيب جملة (الوعد) هو إزالة دليل "التثبيت" من المجلد "جملة" قمت بإنشائه في وامب. اذهب إلى C:\wamp\joomla وحذف دليل التثبيت بالكامل. انتقل الآن إلى localhost/جملة وسترى أنه قد تم تركيب جملة ونحن مستعدون للذهاب مع تثبيت القالب ونحن ذاهبون للعمل مع.


نصيحة 2: اختيار إطار القالب

في الآونة الأخيرة في جملة قالب أطر كل الهذيان لأنها تسمح لك بإكمال قالب بشكل أسرع، وقد أنجز الكثير من العمل في القالب نفسه. وتشمل بعض الأطر الأكثر شعبية والإطار اﻻعوجاج YooTheme جسرية Rockettheme. كل من هذه الأطر قد بنيت من الألف إلى الياء حتى بعد علاج لإنجاز المهام المتكررة المملة في كل قالب وأنها تشمل أيضا ميزات كبيرة مثل الجوال القالب والخلفية ميزات مضمنة التي تسمح لك بتغيير الطريقة التي يبدو بها القالب دون تعديل أي شيء حتى باستخدام معلمات الخلفية. لبقية هذه النصائح والأمثلة، سيتم استخدام قالب يوثيمي التي تستخدم إطار اﻻعوجاج 6.

ملاحظة: يجب عليك شراء اشتراك قالب YooTheme استخدام قالب في موقع الويب الخاص بك، وتعديله، ولكن الأمر يستحق الأموال الإضافية التي أنفقت لإنقاذ لكم الكثير من الوقت على المدى الطويل.

وتشمل بعض موفري الإطار والتخصص:

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

بعد تحميل القالب، انتقل إلى localhost/جملة/المسؤول. اكتب في "المسؤول" لاسم المستخدم الخاص بك و "1234" كلمة مرور لتسجيل الدخول إلى الخلفية. في الأعلى شريط تحوم حول ملحقات ومن ثم انقر فوق "تثبيت/إلغاء التثبيت". في الحقل ملف حزمة تحميل انقر فوق "استعراض" والعثور على قالب الحزمة التي قمت بتحميلها إلى الكمبيوتر الخاص بك. الآن انقر فوق "تحميل ملف أمبير؛ تثبيت "الزر. يتم الآن تثبيت القالب الخاص بك، ولكن لديك لتنشيطه بالفعل كالقالب لإكمال خطوة واحدة.

انتقل إلى "ملحقات" في الشريط العلوي من الخلفية جملة وثم انقر فوق "قالب إدارة". عنوان القالب قمت بتثبيت ذلك للبحث عن القالب الخاص بك في قائمة قوالب "yoo_nano" وثم انقر فوق الزر الراديو إلى اليسار منه. ثم انقر فوق رمز النجمة وهو الزر "افتراضي" في الركن الأيمن العلوي. الآن تم تعيين القالب الجديد الخاص بك كما سيتم استخدام جملة واحدة. قم بتحديث الصفحة الرئيسية الخاصة بك وسترى التغييرات!


تلميح 3: تصميم صفحات فردية

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

الآن، الجزء الثاني من هذا الواقع هو وضع هذه المتغيرات للعمل كفئات CSS على<body>العلامة حتى يمكنك الاستفادة منها. نسخ ولصق التعليمة البرمجية التالية إلى الفئة = ""class الأساسي في القالب الخاص بك.

النتيجة النهائية يجب أن تبدو مثل هذا:

الآن دعنا نلقي نظرة على معلمات URL الموقع جملة. للشروع في العمل، انقر فوق أحد الارتباطات الموجودة على صفحاتها الأولى أن يذهب إلى صفحة أخرى في الموقع. على سبيل المثال، في بلدي صفحة قمت بالنقر على "مواصلة القراءة" كما هو موضح أدناه. قد تكون بعض الروابط ضمني حتى مجرد البحث عن ارتباط يحتوي على المتغيرات التي تبين أن الأمر ليس محرك بحث ودية.

الآن إذا نظرتم إلى شريط العناوين في المستعرض الخاص بك سوف تشاهد المعلمات المرتبطة بهذا العنوان خاص هو موضح هنا:

http://localhost/joomla/index.php?option=com_content&view=article&id=44:joomla-security-strike-team&catid=1:latest-news&Itemid=50

كما ترون أعلاه، هو الخيار الخاص بهذه الصفحة "com_content". عرض هذه الصفحة "المادة" و itemid لهذه الصفحة هو "50". Itemid إشارة إلى عنصر القائمة الفردية الذي ترتبط به هذه المادة. تذكر، في جملة كل شيء لا بد أن يكون itemid قائمة المقترنة به خلاف ذلك لا يمكنك تعيين وحدات لذلك. ذلك باستخدام هذه المعلومات من عنوان URL، أن المعلومات متاحة الآن لاستخدام عن طريق المتغيرات التي تم إنشاؤها في<head>من المستند.

دعونا نلقي نظرة على الصفحة نحن الآن على. أدناه رسم عرض الأجزاء التي أريد تعديل حصرا لهذه الصفحة، وليس غيرها.

أسهل طريقة لمعرفة أين رمز المغلق لهذين العنصرين استخدام أداة مطور مثل الحرائق (لفايرفوكس) أو أدوات المطور بكت (بالنسبة للكروم). استخدام الحرائق، وأنا ذاهب إلى المرور عبر هذه العناصر ونتطلع لنرى أين المغلق لكل عنصر من عناصر فردية.

كما ترون، نحن نعمل مع علامة H1 مع الفئة من "عنوان". لنفرض أننا نريد تغيير هذا لون النص إلى اللون الأحمر. ابحث على الجانب الأيمن من لوحة الحرائق يمكن أن أرى أن هناك أنماط المرتبطة بهذا العنصر في system.css، trebuchet.css، base.css، إلخ. وعادة ما تحتاج إلى استخدام القالب الرئيسي CSS للقالب الخاص بك في إجراء تعديلات مثل هذا حتى يتم استدعاؤه لهذا القالب layout.css. للقالب الخاص بك يمكن أن يسمى شيء من هذا القبيل template_css. أو template.css أو حتى base.css. بغض النظر عن ذلك، تذهب إلى أحد هذه الملفات CSS عن طريق الانتقال إلى C:\wamp\joomla\templates\[template name]\css\layout.css. (يمكن أن يكون هذا المسار مختلفة بالنسبة للقالب الخاص بك). مرة واحدة في الداخل، قم بالتمرير إلى الأسفل (للتأكد من أنه هو النمط الأكثر تحديداً في هذا الملف) وإضافة بعض التعليمات البرمجية مثل هذا.

حفظ ملف CSS، وقم بتحديث الصفحة. إذا كنت قد فعلت ذلك بشكل صحيح فإنه ينبغي تغيير العنوان في هذه الصفحة إلى اللون الأحمر. إذا انتقلت إلى صفحة أخرى على الرغم من أن ستلاحظ أنه لم يتغير على الباقي منها. إذا كنت تريد فقط تغيير هذا النمط على الصعيد العالمي فإنه سيؤثر على الموقع بأكمله. أدناه ما النتيجة لتغيير هذا النمط:

لجعل التغيير الثاني للنص "الكاتب"، كنت مجرد تسليط الضوء على العنصر مع الحرائق بنفس الطريقة، الشكل ما هو اسم منه، وحيث أنه يجري نصب في ملفات CSS، وثم استخدام المتغيرات PHP من URL مرة أخرى إلى أسلوب. حتى أنا ذاهب إلى نمط "الكاتب" فقط على هذه الصفحة، جعله أكبر واللون الأزرق.

لاحظ أعلاه استخدمت مجموعة مثيرة لاهتمام من المتغير $itemid والمتغير $view. يمكنك استخدام المغلق لسلسلة فئتين معا لجعلها أكثر تحديداً. أن ما تقوله هذه التعليمات البرمجية أعلاه: itemid يجب أن تكون 50 لهذه الصفحة ويجب أن يكون عرض المادة خلاف ذلك لا يتم تطبيق هذا المغلق. أنها تسمح لك تستهدف العناصر حتى أكثر تحديداً.

استخدام نفس الفكرة ولكن مع PHP إذا كانت البيانات بدلاً من ذلك: باستخدام هذه الفكرة نفسها ، يمكننا أيضًا تشغيل PHP if كانت هناك عبارات في index.php أو template.php من نموذج موقعك لإجراء تغييرات استنادًا إلى متغيرات عنوان URL هذه. على سبيل المثال، نفترض أن لدينا وحدة موقف مجموعة حتى مع فئة div تسمى "عرض الشرائح". هنا مثال على ذلك:

أريد فقط هذا العرض يظهر على الصفحة مع itemid 50-أي مكان آخر. ذلك إلى الكتابة فوق الإعدادات التي تحددها للوحدة النمطية في الخلفية حيث كنت أقول له عناصر القائمة التي تريد أن يظهر بها. ولذلك نحن التفاف للقيام بذلك if كان البيان حول الكتلة div كما هو موضح أدناه:

الآن هذا شعبة سوف تظهر فقط في هذه الصفحة، وسيتم إزالتها من التعليمات البرمجية إذا نحن لسنا في itemid 50. استخدام هذه التقنيات طوال الوقت مع القوالب، وهم مفيد للغاية، حيث أوصى الحصول على جداً الذين اعتادوا على استخدامها.


نصيحة 4: انهيار مواقع الوحدة النمطية

استخدام مواقع الوحدة النمطية القابلة للطي في جملة إلى حد كبير ضرورة إلا إذا كنت تريد مواقع لتظهر حتى بالنسبة لنماذج فارغة. على سبيل المثال، نفترض أن لديك وحدة نمطية في العمود الأيمن من الموقع الخاص بك في شعبة تسمى "right_col". على صفحة معينة لا تريد العمود الأيمن لتظهر إذا كان لا يوجد شيء في ذلك. إذا لم يكن لديك من انهيار if وضع بيان حول تلك الوحدة النمطية معين، حتى إذا كان هناك أي شيء ممكن على هذه الصفحة لهذا الموقف فإنه سوف لا تزال تظهر. سوف ينتهي مع عمود حق فارغة مع أي شيء في ذلك.

للتأكد من أن العمود الأيمن يطوي عند فارغة، يمكنك تحديد موقع الوحدة نمطية موجودة أو إنشاء الخاصة بك. قوالب مختلفة بطرق مختلفة لإنشاء وحدات العد if البيان (كونتمودوليس هو تنهار if كان البيان). قالب 6 اﻻعوجاج، هو مكتوب مثل هذا:

ولكن للقوالب الأخرى، يمكن أن يكون أكثر تبسيطية مثل هذا: (التعليمات البرمجية أدناه هي الطريقة الأكثر شيوعاً للكتابة كونتمودوليس if البيان)

ملاحظة: من أجل كونتمودوليس للعمل، يجب أن يكون هناك وحدة موقف بين if كان بيان ذلك أنها يمكن أن نرى إذا كان أي شيء يتم نشرها في هذا الموقف أم لا. حتى على سبيل المثال، في التعليمات البرمجية أعلاه يبحث كونتمودوليس لمعرفة إذا كان أي شيء يتم نشرها في موقف "الحق". إذا لم يكن الأمر كذلك، لن يتم عرض right_column الفئة div كاملة. إذا كان هناك شيء ما نشرت في هذا الموقف، سوف تظهر كل شيء بين بداية if كان البيان و endif الختامية.

في جوهره، هو مفهوم بسيط يسمح الصفحة الخاصة بك أن تكون أكثر دينامية، لذلك إذا أردت صفحات مختلفة يكون لديك تخطيطات مختلفة وهذا ما يسمح لك بالقيام بذلك. محاولة الجمع بين كونتمودوليس if كان البيان مع متغير محدد موقع معلومات ونصائح أعلاه جعل القالب حتى أكثر مرونة. منذ جملة نظام إدارة محتوى، الفكرة وراء ذلك أن تكون دينامية ومرنة.


تلميح 5: تسجيل في التصميم

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

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

دعونا ننظر في مثال بسيط لما يمكن أن تفعله مع هذا الرمز. دعونا نقول لبعض السبب في أنني أريد لون خلفية رأس صفحة مختلفة للمستخدمين المسجلين. وهذا من السهل جداً القيام به الآن منذ أن كنت تستخدم معرف #members لتحديد ذلك.

وهذا إلى حد كبير كل ما في الأمر. وهذا يمكن أن يكون مفيداً لتغيير خلفية على وحدة نمطية، أو مواقع أخرى في جميع أنحاء موقع الويب الخاص بك (تعكس ترقية أو أيا كان يمكن أن يخطر لك).


تلميح 6: لاحقات فئة الوحدة النمطية

هناك قد يأتي وقت عندما كنت في وضع قالب حيث تريد جعل وحدة نمطية محددة لها نظرة تشعر بأن الآخرين لا حصة. على سبيل المثال، نفترض أن لديك وحدة نمطية وظيفة منتدى أن أي شخص يريد أن ترعى ويودون الشعار الموجود بجوار العنوان وحدة قائلا "مدعوم من قبل XYZ" أو شيء بهذا المعني. وهذه بفضل ما يسمى لاحقات فئة الوحدة النمطية. لاحقة فئة الوحدة نمطية فئة إضافية تضاف في عن طريق المعلمات الخلفية في الوحدة النمطية نفسها. على سبيل المثال، دعونا أولاً نلقي نظرة على كيفية إضافة لاحقة فئة الوحدة نمطية.

مرة أخرى، أطر مختلفة تعمل بطرق مختلفة ولكن في هذه الحالة طريقة لإضافة وحدة نمطية فئة لاحقة بوضع نمط--[أيا كان اللاحقة ستكون]. قوالب أخرى قد تحتاج فقط-[اسم لاحقة] دون نمط أمامه. أوصى بالنظر في الوثائق الخاصة بك إطار خاص لتوضيح.

الذهاب إلى الخلفية localhost في localhost/جملة/المسؤول تثبيت جملة. ثم انتقل إلى الشريط العلوي والذهاب إلى "ملحقات" ثم انقر فوق حول إدارة الوحدة النمطية. العثور على الوحدة النمطية المحددة التي تريد العمل مع، أو حتى إنشاء واحد جديد إذا كنت تريد. على سبيل المثال إنشاء وحدة نمطية يسمى "الوحدة النمطية للفئة اللاحقة"، ووضعها في العمود الأيمن من القالب الخاص بي. أدناه رسم ما يشبه الصفحة:

إشعار على الجانب الأيمن هناك حقل يسمى "الوحدة النمطية للفئة اللاحقة" ووضعت في نمط المياه كلاحقة بي منذ هذا قالب اﻻعوجاج. تطبيق هذه التغييرات إلى الوحدة النمطية وثم انتقل إلى الواجهة. إذا كنت تستخدم الحرائق وتحوم فوق الوحدة النمطية التي قمت بإنشائها، فإنه ينبغي أن تظهر أن لاحقة الفئة الخاصة بك الآن فئة CSS في الوحدة النمطية نفسها.

يمكنك الآن استخدام هذا لأسلوب الوحدة النمطية ولكن تريد وأنها سوف تؤثر فقط على هذه الوحدة النمطية (أو أي دولة أخرى أن تقوم بتعيين هذه لاحقة فئة الوحدة النمطية ل). هنا هو مثال للتعليمات البرمجية التي اعتدت على إنشاء التصميم البسيط لهذه الوحدة النمطية:

وهنا قبل وبعد لقطة من التغييرات:

إذا كنت لا تريد هذه الوحدة لتبدو وكأنها هذا بعد الآن، أنا فقط إزالة اللاحقة فئة الوحدة النمطية من المعلمة في إدارة وحدة وأنه يعود إلى القيمة الافتراضية. التالي سنلقي نظرة على كيفية تعديل القالب الفعلي من الوحدة النمطية حيث يكون لديك تحكم أفضل لأنها الإخراج والتصميم.


تلميح 7: قوالب نمطية أسهل

لاحقات فئة الوحدة النمطية كبيرة للتصميم الوحدات الفردية، ولكن ماذا يحدث عندما تريد تغيير القالب الفعلي للوحدة النمطية؟ كلما قمت بعمل قالب، واحدة من الأشياء التي أود القيام به تسهيل الوحدة النمطية إلى نمط بإنشاء هيكل شعبة مثل هذا:

هذا جيد جداً ليكون كقالب الوحدة نمطية لأنه يمكنك تحقيق طن من تبدو مختلفة لوحدة نمطية فقط مع هذه divs الثلاثة. تشريح من Photoshop وتحويله إلى القالب أسهل بكثير بهذه الطريقة. إلقاء نظرة على وحدة التخطيط الأصلي في القالب أنا باستخدام:

لدينا علامة h3، علامة الفقرة، وهذا كل شيء. لا تستطيع أن تفعل الكثير التصميم لهذه الوحدة مع هذه العناصر اثنين فقط، حتى لجعلها أسهل لنمط هذا لدينا لتعديل قالب الوحدة الفعلية نفسها. مرة أخرى، هذا يختلف في كل قالب، لكن بشكل عام كنت تبحث عن نفس الملفات--أنها قد تكون فقط في مواقع مختلفة.

لهذا القالب خاص أنا ابحث عن هذه الملفات:

  1. [template name]\warp\layouts\modules\templates\default-1.php
  2. [template name]\layouts\module.php

1.php الافتراضية عناصر module.php وملف قالب الوحدة الفعلية القوالب النمطية التي ترتبط بالمواقف التي. كيف عرفت أن الافتراضي-1.php كان قالب الوحدة النمطية المستخدمة للعمود الأيسر؟ باستخدام module.php أستطيع أن أرى القالب الذي يرتبط مع العمود الأيمن بهذه التعليمات البرمجية:

كما ترون أعلاه، وكل وحدة الموقف قد $style المرتبطة به. في هذه الحالة كل ما تسمى "الخط". لهذا القالب، دعا العمود الأيمن هو فعلا الشريط الجانبي، حيث بحثت عن الشريط الجانبي، وتبين أن $style كان يساوي "خط". التمرير أسفل آخر يرتبط هذا الملف أستطيع أن أرى أي من القوالب النمطية مع $style "الخط".

في حالة التبديل هذا يمكنك أن ترى أن القضية 'الخط' وقد $template "الافتراضي-1". النمط الافتراضي الوحدة النمطية لجميع المواقف الافتراضي-1 كذلك، ما لم يحدد خلاف ذلك. الآن أن أعرف قالب الوحدة النمطية الذي يرتبط بهذا الموقف وحدة، أنا يمكن تحريره لاحتياجات بلدي.

فتح الافتراضي-1.php الآن، يمكننا أن نرى التعليمات البرمجية تبدو مثل هذا:

كما ترون، سهل جداً. ليس هناك كثير من divs في وجود نمط مع. نريد إضافة في divs عرضتها عليكم أعلاه لتسهيل هذه الوحدة النمطية للتحكم. تغيير التعليمات البرمجية أعلاه لتبدو مثل هذا:

حصلت على التخلص من الشارة لأنه لم أكن أريد أن تظهر في قالب الوحدة النمطية لبلدي، ولكن عليك يمكن الاحتفاظ بها إذا كنت تريد. الشارة هو فقط تصميم قوالب اﻻعوجاج المرتبطة لاحقات فئة الوحدة النمطية. الآن أن لدينا هذا التخطيط في المكان، أسهل بكثير لنمط الوحدة النمطية. أدناه مثال لقدر أكبر من المرونة:

وهنا هو رمز لتحقيق هذا النمط (أعرف أن هذه تركيبات لونية قبيحة حقاً، ولكن كنت تستخدم لأغراض التوضيح:


تلميح 8: إصلاح إنترنت مستكشف الأخطاء

ونحن جميعا نعرف أن Internet Explorer هو لعنة لوجودنا، لذلك أنا لا يمكن إكمال هذا البرنامج التعليمي دون بما في ذلك الشرطية IE الأساسية التي تسمح لك للعناصر الخاصة بالنمط على الصفحة استناداً إلى أي إصدار من إنترنت إكسبلورر كنت تستهدف. ليس هذا تلميح جملة على حدة، ولكن أنا ذاهب لتظهر لك كيفية تطبيقه في جملة.

ملاحظة: هذا الأسلوب هو لإصلاحات سريعة ولا ينبغي أن تستخدم لإصلاح كافة الأخطاء IE. إذا كان لديك الكثير من الأخطاء التي تحتاج إلى أن تكون ثابتة، يجب عليك استخدام ورقة أنماط IE فقط الذي يحمل فقط عند الناس يستخدمون هذا مستعرض معين.

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

كما ترون أعلاه، وأنا أشعر باستهداف Internet Explorer 7 مع هذه الشرطية. يمكن أيضا بسهولة استهداف إصدارات IE الأخرى فقط عن طريق تغيير في 7 6 أو 8. وضع حق الشرطي الأول أدناه الخاص بك فتح<body>العلامة ومن ثم وضع حق الشرطي الثاني أعلاه إغلاق</body>العلامة مثلما فعلنا مع الأعضاء تسجيل الدخول المشروطة التي استخدمناها في وقت سابق. الآن باستخدام CSS يمكنك جعل التغييرات الصغيرة إصلاح الخلل في موقع الويب الخاص بك. دعنا نقول لديك شريط بحث والنص مرتفع جداً في IE7. إذا قمت بتغيير المغلق للعنصر مباشرة وسوف تؤثر على كل المستعرض التي تم تقديم بشكل صحيح وخبط تلك بدلاً من ذلك. أفضل طريقة لكتابة css مثل هذا:

الآن أنا باستخدام محدد معين هو الالتفاف صفحة ويب بأكملها لاستهداف فقط الخلل في برنامج Internet Explorer 7، وأنه لن يؤثر على غيرها من المتصفحات الحديثة الذي جعلها بادئ ذي بدء بشكل صحيح. مرة أخرى، لن إصلاح كل خطأ واحد لشركة أي أي بهذه الطريقة لأن كنت سوف سخام ورقة الأنماط الرئيسية للموقع. لإصلاحات سريعة طريقة سهلة للحصول على هذه المهمة.


الاستنتاج

هذا كل شيء على هذه النصائح السريعة في قوالب جملة! وآمل هذه النصائح سوف تكون ذات فائدة جيدة مع مغامرات الخاصة بك في تصميم قالب جملة وتجعل من الأسهل بالنسبة لك لتخصيص موقع الويب الخاص بك. شكرا للقراءة.

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.