الكاتب:
خالد الحوراني 
16 مايو, 2009
الزيارات: 349
السلام عليكم،
مثال بسيط موجود لدي أحببت أن أشارككم به وهو مثال لعملية جمع بسيطة باستخدام مكتبة jQuery وتقنية الأجاكس.
ملاحظة: يجب تشغيل الملفات داخل المخدم المحلي لأنها تحتوي على صفحات PHP أما الأجاكس لوحدها فلاتحتاج لأي سيرفر لأنها تعتمد على الجافاسكربت و XML.
صفحة (index.php)
<code>
<html>
<head>
<script src="jquery.js"></script>
<script language="javascript">
$(function(){
$("#add").click(function(){
$.post("calc.php", { x: $("#x").val(), y: $("#y").val() },
function(data){
$("#result").append("The result: " + data);
});
});
});
</script>
</head>
<body>
<form action="calc.php" method="post">
<input type="text" id="x" name="x"><br/>
<input type="text" id="y" name="y"><br/>
<input type="submit" value="Normal Add"><br/>
<input type="button" id="add" value="Ajax Add"><br/>
</form>
<div id="result"></div>
</body>
</html>
</code>بالتأكيد ملف jQuery يجب أن يكون موجود في نفس مسار هذه الصفحة (هكذا حددناه في السطر الثالث)، بكل بساطة تقوم باستدعاء تابع post.$ الموجود في مكتبة jQuery والذي يقوم بتغليف تابع الأجاكس التلقيدي بحيث يريحك من الاستثناءات كمتصفح IE، ونقوم بتمرير ثلاثة وسائط للتابع هم مسار واسم الصفحة التي سيرسل لها البيانات وسيأخذ منها النتائج، الثاني هي مجموعة المتحولات والتي يجب أن تكون بنفس اسم المتحولات في الصفحة التي ستقوم بالحساب (calc.php)، أما الثالث فهو تابع يستقبل وسيط واحد هو النتيجة التي جاءتنا من تلك الصفحة حيث نقوم بطباعة هذه النتيجة داخل div المسماة result.
أما الصفحة التي تقوم بالحساب (calc.php):
</code>
<?php
$x = $_POST['x'];
$y = $_POST['y'];
echo $x + $y;
?>
</code>
حمل ملف المثال:
الكاتب:
خالد الحوراني 24 يناير, 2009
الزيارات: 1,033
960 هو إطار عمل لل CSS ولكن ليس كباقي أطر العمل، ديناميكي لدرجة كبيرة ويوفر الكثير من الوقت. اسم الإطار جاء من العرض 960 المشهور بالتصميم، العرض 960 بكسل مفضل لدى أغلب المصممين لأنه يلائم معظم الشاشات (أقل دقة للشاشات الآن هي بعرض 1024).
ميزة 960 الأساسية هي تقسيم الصفحة لوضع الهيكل الأساسي أو مايسمى prototyping، إذن هي طريقة سريعة لتصميم هيكلية الصفحة.
في gs يوجد هيكلين أساسيين، 12 عمود أو 16 عمود وبالطبع عرض الهيكلين هو 960 بيكسل، سنتكلم عن هيكل ال 12 عمود وهيكل 16 سيكون شبيهاً به، الغرض أن نتعلم كيف نصمم بواسطة هذا الإطار الرائع.
أولاً ألقي نظرة على صفحة المثال، ستلاحظ بأن هيكل ال 12 عمود فيه عدة مخططات، مثلاً المخطط الأول المكتوب عليه 940px يمثل div واحد كبير يشغل مساحة ال 12 عمود، شاهد الصنف (class) المسند لهذا div ستلاحظ أنه (grid_12)، جميع أصناف gs تأخذ هذا الاصطلاح في التسميات: gs_numberOfRows حيث numberOfRows يمثل عدد الأعمدة التي يشغلها هذا div.
أيضاً شاهد مخطط (140px, 780px)، ال div 140 لها صنف grid_2 أي تأخذ مكان عمودين. أما ال div 780 فتأخذ مكان عشرة أعمدة، إذن اسم صنفها سيكون grid_10، أظن أن الفكرة اتضحت الآن.
والآن سأقوم بتصميم موقع سريع كمثال لنتعلم منه، سأتوجه لمجلد templates ومن ثم photoshop واختار ملف (960_grid_12_col.psd) لأحرره في الفوتوشوب واصمم الموقع كما أريد، لنفرض أني أريد هكذا تصميم (أضفت الطبقات البرتقالية):
المزيد
الكاتب:
خالد الحوراني 22 يناير, 2009
الزيارات: 215
بسم الله الرحمن الرحيم،
بفضل من الله تعالى وتوفيقه أتممت إضافة يملي مع الوورد بريس، الإضافة تقوم بإضافة خدمة يملي لحقل العنوان والمحتوى عند إنشاء تدوينة جديدة، حقل البحث، وحقول التعليق. كل هذه الخيارات يمكنك تفعيلها أو تعطيلها بكل بساطة، أيضاً يمكنك تحديد اللغة ومكان ظهور صندوق يملي!
الإضافة يوجد معها شرح لكيفية التنصيب والاستخدام، شاهد الصور بعد تركيب وتفعيل الإضافة:
- صندوق التعليق
- تدوينة جديدة
جربوها في صندوق البحث بأعلى المدونة أو في صندوق التعليق وأعطوني آرائكم (إذا كنت من زوار المدونة ففرغ الكاش أو اضغط ctrl+f5).
حالياً تحميل الإضافة سيتم من هنا في المدونة ريثما يتم الموافقة على الإضافة في الموقع الرسمي لإضافات الووردبريس، تحميل إضافة يملي
الكاتب خالد الحوراني
