الووردبريس wp
مثال
في الاعلى في شريط القائمة، اضغط على الاتصال بنا ولاحظ تقنية الpopup
قبل ما نبدأ شرح التركيب نزل الملفات (صفحة الPHP وملف الستايل)
أولا
في لوحة التحكم الخاصة في الوورد بريس
نذهب الى المظهر>المحرر>header.php
ونضيف كود الphp في الاعلى بعد اغلاق وسم head
< ?php
//If the form is submitted
if(isset($_POST[´submit´])) {
//Check to make sure that the name field is not empty
if(trim($_POST[´contactname´]) == ´´) {
$hasError = true;
} else {
$name = trim($_POST[´contactname´]);
}
//Check to make sure that the subject field is not empty
if(trim($_POST[´subject´]) == ´´) {
$hasError = true;
} else {
$subject = trim($_POST[´subject´]);
}
//Check to make sure sure that a valid email address is submitted
if(trim($_POST[´email´]) == ´´) {
$hasError = true;
} else if (!eregi("^[A-Z0-9._%-]+@[A-Z0-9._%-]+.[A-Z]{2,4}$", trim($_POST[´email´]))) {
$hasError = true;
} else {
$email = trim($_POST[´email´]);
}
//Check to make sure comments were entered
if(trim($_POST[´message´]) == ´´) {
$hasError = true;
} else {
if(function_exists(´stripslashes´)) {
$comments = stripslashes(trim($_POST[´message´]));
} else {
$comments = trim($_POST[´message´]);
}
}
//If there is no error, send the email
if(!isset($hasError)) {
$emailTo = ´3nkboot.management@gmail.com´; //Put your own email address here
$body = "name: $name nnEmail: $email nnSubject: $subject nnComments:n $comments";
$headers = ´From: My Site <´.$emailTo.´>´ . "rn" . ´Reply-To: ´ . $email;
mail($emailTo, $subject, $body, $headers);
$emailSent = true;
ثـــانيــــاً
نضيف التالي
1.مكتبة الجيكويري
2.اضافة الvalidation
3.اضافة الpopup
4.ملف الستايل
كما أسلفنا في الدرس السابق، سبق وأضفنا 3 نقاط (مكتبة الجيكويري – اضافة الvalidation – ملف الستايل)
باقي اضافة الpopup
انزلها من هنا
اضغط هنا
كيف راح نربط الملفات بالهيدر؟
لربط ملف الستايل
اول شيء، نقوم برفعه الى ملف الCSS الخاص بالقالب المستخدم
ثم نكتب الكود التالي
<link rel="stylesheet" type="tex
t/css" media="all" href="<?php bloginfo(´template_directory´); ?>/css/general.css" />
</link>
لربط اضافة الpopup
نرفعها الى ملف القالب الرئيسي
ونكتب الكود التالي
اخر شيء في المرحلة الاولى
نضيف هذا الكود قبل نهاية وسم الهيد
<script type="text/javascript">
$(document).ready(function(){
$("#contactform").validate();
});
</script>
انتهينا من المرحلة الاولى
في ملف الheader.php
ننزل الى الاسفل حتى نرى هذا الكود
<ul><li><a href="<?php echo home_url(); ?>">الرئيسية</a></li>
< ?php wp_list_categories(´title_li=´); ?></ul>
ليس من الضروري ان يكون الكود مشابه 100%
نضيف عليه التالي
<li><a id="button">الإتصال بنا</a></li>
ليصبح كالتالي
<li><a href="<?php echo home_url(); ?>">الرئيسية</a></li>
< ?php wp_list_categories(´title_li=´); ?>
<li><a id="button">الإتصال بنا</a></li>
</ul>
أخيراً
في آخر ملف الheader.php
نكتب الكود التالي
<div id="popupContact"><a id
="popupContactClose">x</a><div id="contactArea"><div id="contact-wrapper"><
?php if(isset($hasError)) { //If errors are found ?><p class="error">الرجاء التأكد من جميع الفراغات<
/p>< ?php } ?>< ?php if(isset($emailSent) && $emailSent == true) { //If email is sent ?>
<p><strong>تم الارسال</strong></p><p>شكراً <strong>< ?php echo $name;?></strong>
سيتم الرد عليك قريباً</p>< ?php } ?><form method="post" action="<?php echo $_SERVER[
´PHP_SELF´]; ?>" id="contactform"><div><label for="name"><strong>الإسم:</strong></label>
<input type="text" size="41" name="contactname" id="contactname" value="" class="required" />
</div><div><label for="email"><strong>البريد الالكتروني:</strong></label>
<input type="text" size="41" name="email" id="email" value="" class="required email" /></div>
<div><label for="subject"><strong>العنوان:</strong></label>
<input type="text" size="41" name="s
ubject" id="subject" value="" class="required" /></div><div><label for="message"><strong
>الرسالة:</strong></label><textarea rows="5" cols="50"
name="message" id="message" class="required"></textarea>
</div><input type="submit" value="ارسال" name="submit" />
rm></div></div></div><div id="backgroundPopup"><
الاكاديمية العربية لفنون التصميم و الجرافيك
استبعاد صفحة من القائمة العلوية – YourColor
السلام عليكم ورحمة الله وبركاته
في هذا الشرح سوف نتناول طريقة استبعادة صفحة او صفحات من القائمة العلوية للسكريبت الووردبريس كما تعلمون اذا كترة الصفحات قد ياخد مظهر القائمة شكل سيئ وقد وقعت في هذه المشكلة وقمنا بحلها الان ندخل في صلب الموضوع , هناك طريقتين الاولى بالنسبة للقوالب التي لا تدعم القوائم والثاني لقوالب التي تدعم القوائم والطريقة الثانية فكرني بها الاخ مهاب شكرا لك على الاستفسار
طريقة الاولى للقوالب التي لا تدعم القوائم
اول شيء يجب معرفة رقم ال post تبع الصفحة وهنا سوف اقوم بشرح طريقة الحصول عليه نتوجه الى قائمة الصفحات من لوحة التحكم وبعد ذاك نقوم بالتالي
عند وضع الماوس على رابط اي صفحة شاهد شريط الحالات اسفل سوف تشاهد رقم الصفحة التي نحتاجها مثال
الرقم باللون الاحمر هو الذي سوف نحتاج في عملنا هذا
الان سوف نقوم بتعديل الترويسة (header.php) اول شيء ابحث عن الكود التالي في الترويسة
قم بتغيره بالكود التالي :
وبهذا نكو قد استبعدنا الصفحة التي نريد من القائمة
مثال على موقعي :
ملاحظة :
اذا اردت ان تقوم باستبعاد العديد من الصفحات قم بالتالي
لاحظ كيف تم ادراج الفواصل بين كل صفحة و الاخرى
الطريقة الثانية للقوالب التي تدعم القوائم
هذه القوالب بطبيعة الحال تدعم القوائم وستجد انهم استعملوا كود برمجي عوض عن الكود الذي اشرنا له فوق وغالبا ما يكون على الشكل التالي
في هذه الحالة لن نقوم بتغيير اي شيء في هذا الكود فقط سنقوم بالخطوات التالية :
نتوجه الى القوائم من قائمة المظهر :
بعدها نقوم بانشاء قائمة قم باعطائها اي اسم :
بعد انشاء القائمة سوف تظهر لك المربع الجانبي التالي :
هنا المربع يحتوي على الامكان التي تستعمل القوائم مثلا اختر المكان main menu واختر بعدها اسم القائمة التي قمت بانشائها وقم بالحفظ, المهم الان ستجد في الاسفل مربعين اختر اما التصنيفات او الصفحات المهم قمت باخد المربع الخاص بالتصنيفات وهو بالشكل التالي:
المهم هنا نقوم بوضع علامة على التصنيفات التي نود ظهورها في القائمة وبالعكس بالنسبة لتصنيفات التي تود استبعادها وقم بالضغط على اضف للقائمة
المهم هنا سوف تلاحظ اضافة التصنيفات التي اردتها ان تظهر فقط في القائمة لا تنسى ان تقوم بحفظ القائمة
الى هنا انتهينا من شرح هذه الطريقة البسيطة والى اللقاء في شروحات اخرى واتمنى ان تستفيدوا من هذا الشرح
اذا كانت هناك اي مشاكل او استفسارات قم وضع تعليق وسوف اجيب عليك ان شاء الله في اقرب فرصة
والسلام عليكم ورحمة الله وبركاته
الاكاديمية العربية لفنون التصميم و الجرافيك
التصنيف:
الووردبريس wp
Tagged with: