في الدرس السابق من هذه السلسلة، تعرفنا على بعض مميزات قالب s_ وإستعرضنا مجلدات القالب وبعض الملفات الأساسية، وفي هذا الدرس سنكمل الإطلاع على الملفات الأساسية وسنحاول شرح مهمة بعض الشيفرات والدوال البرمجية بالإضافة الى الإشارة الى بعض الممارسات الجيدة في تطوير قوالب ووردبريس والتي يمكن أن نتعلمها من …
كنت في الماضي قد قمت بإنشاء العديد من مثل هذا التأثير باستخدام الفوتوشوب، ولكن مع ظهور CSS3 وجلبها للكثير من الخصائص المدهشة فقد قررت أن أقوم بدرس حول كيفية إنشاء ذلك التأثير بمساعدة واستخدام التدرجات (gradients) والمرشحات (filters) الموجودة في CSS3. سوف نستخدم التدرجات (gradients) والمرشحات (filte…
أكاد أجزم أنك سمعت ورأيت تأثير parallax في عالم تصميم وتطوير المواقع، فقد أصبح هذا التأثير أحد أجمل التأثيرات وأكثرها استخدامًا، فهو يعطي للزائر تجربة مميزة وفريدة عندما يقوم بتصفح الموقع نزولًا وصعودًا (scroll up and down). في هذا الدرس سوف نستخدم عدد من إضافات jQuery الجاهزة لإنشاء هذا التأثير. …
إدارة الصور هي واحدة من الأشياء التي غالبا ما أجدها صعبة، فأنا معتاد على التعامل مع النماذج وجداول قواعد البيانات، لكن التعامل مع الملفات ليس سهلا بالنسبة لي، فإذا كنت قد بدأت للتو مع Laravel وبدأت تشعر بالصعوبة والضيق، فأنا أشعر بألمك. لحسن الحظ، أساسيات إدارة الصور في Laravel لن تكون صعبة إذا فهم…
إذا كنت تُصمّم قالبًا جديدًا لووردبريس أو تعدّل قالبًا جاهزًا، فإن الخطوط المُخصّصة ستجدّد منظر قالبك. في حين تأتي متصفحات الإنترنت بخطوط جاهزة افتراضية، وهي التي تستدعيها في ملف style.css، استخدام نفس الخطوط التي يستخدمها الآخرين يبدو مملًا بعض الشيء. لحسن الحظ، بإمكانك إضافة الخط الذي تختاره بسهول…
حتى الآن تعلمنا كيفية تثبيت وإعداد Laravel، بالإضافة إلى إعداد بعض المشاريع والمهام والموارد المضمّنة و عرضهم على المستخدم، كما أنشأنا وظائف الإنشاء والتعديل والحذف، وفي هذا الفصل سوف نختم الدرس عن طريق إضافة استمارة التحقق. استمارة التحقق من جانب الخادم على الرغم من أن استمارات الإنشاء والتعديل تع…
في الدرس السابق قمنا باستخدام برنامج فوتوشوب لتصميم واجهة موقع لغابة افتراضية باسم "Pinewood Forest". أمّا في هذا الدرس فسوف نقوم بتكويد ذلك التصميم باستخدام لغتي HTML وCSS وتحويله إلى صفحة ويب كاملة. كما سنقوم أيضًا باستخراج الصور الموجودة في التصميم لاستعمالها في الموقع. في حال أنك لم ت…
حتى الآن تعلمنا كيفية تثبيت وإعداد Laravel، بالإضافة إلى أننا قمنا بـإعداد بعض موارد المشاريع والمهام وعرضهم للمستخدم. في هذا الدرس، سنتعلم كيفية إنشاء وتعديل وحذف الصفحات والإجراءات. إضافة روابط التصفح قبل أن نفعل أي شيء، سنقوم بإضافة روابط create/edit/delete/back إلى صفحات المشاريع والمهام: @ex…
ووردبريس هو منصة رائعة لإدارة المحتوى. إذا كنت تملك أيّ محتوى يأتي في شكل وحدات شبيهة بالمقالات (أو ما شابهها مثل منتجات) فلا أجد سببا يدفعك لعدم استخدام ووردبريس. قد يكون التعاون باستخدام سكربت ميديا ويكي سهل أيضا، واستخدام دروبال مع أنظمة الشركات يعد أمرا سهلا وشائعا، لكن ووردبريس له مكانته أيضا ف…
بعد أن انتهينا من إعداد قواعد البيانات والطرق (routes)، سوف نتحدث في هذا الجزء عن المتحكِّمات (Controllers)، النماذج (مع العلاقات)، والعروض views. (بما في ذلك نظام blade ومخططات المحتوى). مساعدات النماذج Form Helpers في Laravel بعد كل هذه الإعدادات، إذا ذهبنا الآن (في المتصفح) إلى projects/ فسوف نح…
سنقوم اليوم بإذن الله ببناء قائمة أخرى مُطَعَّمة بتأثيرات fancy hover‏. وسأعتمد التصميم ‏المُسطح الشائع مُستخدمًا الألوان الزاهية والأيقونات الرائعة، وأُطبّق تقنيات CSS‏ المتعددة، وبذلك يُصبح هذا الدرسُ ‏مقالةً رائعةً لمصممي الويب.‏ مفهوم القائمة قبل أن نبدأ بأي تنسيقات، سنقوم بإنشاء الهيكل الأساسي…
شجرة مسار الصفحة (سنقوم بتسميتها لاحقًا بـالمسار) هي عبارة عن التفريعة الكاملة للصفحة بدءًا من الصفحة ‏الرئيسة للموقع، ثم التصنيف الرئيس للصفحة وأي تصنيفات فرعية لها، ومن ثم اسم الصفحة الحالية، مع وجود ‏روابط للبندين الأولين في الشجرة دون الأخير لأنه مفتوح أمامك حاليًا في المسار.‏ هناك تقنيات وخص…
عند قيامك بتطبيق خصائص ‏CSS‏ المتعددة بشكل مرتب، سينتج لديك أشكال ومناظر ساحرة، خصوصًا إذا ‏كان مضافًا إليها بعض من الحِيَل ‏CSS3 Tricks‏. دعنا نلق نظرة على معرض الصور الفورية (‏Polaroid‏) ‏بتنسيق ‏CSS‏ خالص. (‏Polaroid‏ تعني الصور التي تستطيع التقاطها واستخراجها على هيئة بطاقة مباشرة ‏من الكاميرا…
من أهم مميزات ‏CSS3‎‏ أنها تقلل من استخدام الصور في تصاميم الويب، وتسمح لك بإنشاء أشكال مختلفة ‏بواسطتها. فالأشكال الشائعة التي تراها عادة في ‏فوتوشوب أو ‏Illustrator‏ يمكنك عملها الآن بكل ‏سهولة مستخدمًا ‏CSS3‎‏. تقوم الخصائص الجديدة مثل ‏transform‏ و ‏border-radius‏ بإضافة تشكيلات ‏جديدة إلى الأشك…
في هذا المقال القصير سوف نصنع تنبيها مؤقتا بسيطا عبر CSS animations. ما سنفعله بالتحديد هو إظهار تنبيه بسيط أو عبارة ما أسفل الشاشة لمدة معينة، ثم إخفائها. وسوف سنعمل شريط تقدم (progress bar) لنعرف كم تبقى من الوقت ليختفي التنبيه. ستكون تنبيهات هذا الدرس من الشكل التالي: بالنسبة للهيكلة فسوف نستخد…
رؤوس الجداول الثابتة ليست بالأمر الجديد في مواقع الويب. على عكس الورق، حيث يستطيع القارئ نقل نظره بسرعة إلى أعلى الشاشة ليعرف في أي عمود هو، لكن أبعاد الشاشة تجعل من قراءة الجداول الطويلة أمر صعبا. رؤوس الجداول الثابتة، كما يشير اسمها، تبقى ثابتة في أعلى الجدول حتى وإن نزلنا أكثر في الجدول. يساعد ا…
واحد من أكثر الأشياء المفيدة في ووردبريس ما يسمى بالوسوم الشرطية (Conditional Tags)، حيث ستمكنك من البرمجة بسهولة وفهم الكود الذي تكتبه كأنك تقرأ نص باللغة الإنجليزية. سنقوم في هذا الدرس بدراسة طريقة عمل الوسوم الشرطية مع إيضاح بعض النقاط الخفية والمبهمة مع قائمة بأكثر الوسوم الشرطية المفيدة وسنختم…
يعتبر Laravel أشهر إطار ويب بلغة PHP، ولقد شهد إصداره الخامس العديد من التغييرات وتمت إضافة الكثير من المميزات الجديدة، ولذلك لتعلم أساسيات هذا الإطار سوف نقوم بإنشاء تطبيق Todo List، وسوف نتعلم من خلال هذا التطبيق الكثير من المفاهيم والطرق البرمجية حتى نتمكن من التعامل والتوسع مع إطار Laravel 5. …
كل يوم ينمو ووردبريس ويتطور أكثر فأكثر وفي جميع الدول العالم الناطقة باللغة الإنجليزية وغيرها، وأغلب البرمجة في ووردبريس تتم باللغة الإنجليزية بالإضافة إلى أغلب الإضافات والقوالب تكتب بسلاسل نصية باللغة الإنجليزية على الرغم من أن أكثر من نصف مستخدميه لغتهم الأصلية ليست الإنجليزية. هذا المقال، تعزيز …
يجذب ووردبريس بسبب قوته، وشهرته، وتوثيقه الكثير من طاقة “افعل ذلك بنفسك”، فبشكل عام هذا يبدو رائع، فهذه شهادة على أن الناس لديها آمال عالية في ووردبريس، وهذه طريقة ممتازة لتعلمه، لكن للأسف، فإن جهود “افعل ذلك بنفسك” غالبا ما تكون خاطئة. كمطور، غالبا ما أجد أن هذه جهود الفردية تسقط بالكامل، أو أجد نف…