الفريق العربي للبرمجةأرشيف المنتديات · 2000 – 2023
نسخة أرشيفية للقراءة فقط — التسجيل والمشاركة مغلقان، والمحتوى محفوظ كما كان.

درس حول تصميم موقع

مثبّترائج
بدأه بسام العيساوي في 12 يناير 2009 · 80 رد · 113,343 مشاهدة · في منتدى تطوير المواقع بـ PHP
مشاركة: واتساب X فيسبوك تيليجرام
#26

نلاحظ من المثال السابق أن أي تعليق سيتم إظهاره فورا دون ترك مجال للمدير بالموافقه أو عدم الموافقه على هذا التعليق

لذلك سنقوم بإضافة حقل جديد في قاعدة البيانات وليكن : active_blog ونضيف حقل لتاريخ الإضافة فهذا مهم :) وليكن : date_blog

ALTER TABLE `blog` ADD `date_blog` VARCHAR( 20 ) NOT NULL ,
ADD `active_blog` INT( 1 ) NOT NULL ;
 ALTER TABLE `blog` CHANGE `active_blog` `active_blog` INT( 1 ) NOT NULL DEFAULT '0'

الآن نقوم بالتعديل على القالب الخاص بنموذج البلوغ ونظيف حقل خاص بالتفعيل كمايلي :

$form_blog='<form name="blog_form" method="post" action="">
<input type=text size=40 name=active_blog value=0>
<br>
Author:
<input type=text size=40 name=author><br>
<br>
E-mail:
<input type=text size=40 name=mail><br>
<br>
Text:<br>
<textarea cols=60 rows=10 name=text></textarea><br>
<input name="blog_submit" type="submit">
</form>';

وضعنا القيمة صفر لهذا المتغير , وصفر تعني عدم إظهار التعليق , بينما واحد تعني إظهار التعليق . يمكن وضع هذه القيمة في جدول الإعدادات .

يتم تعديل جملة السيكول الخاصه بإضافة التعليق :

     mysql_query("INSERT INTO `blog` (
    `id` ,
    `blog_name` ,
    `blog_email` ,
    `blog_comment` ,
    `blog_other`,`date_blog`,`active_blog`
    )
    VALUES (
    NULL , '$author', '$mail', '$text', '$other_text','".time()."',$active_blog
    );");

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

في جمله عرض التعليقات نعدل جملة السيكول ونضيف لها (where active_blog=1)

الآن يأتي دور لوحة التحكم لنضيف صفحة جديده من خلالها يمكن التحكم في البلوغ كما يلي :

تم عمل نسخ لصفحة مدير الصفحات لآنها أقرب صفحة لما نريد عمله ... وبعدها قمنا بالتعديلات اللازم لتصبح كما يلي :

<?
 $ro=mysql_fetch_array(mysql_query("Select * From sett where id=17"));
  if($_COOKIE["no_hack"]==$ro[2]){
    setcookie("no_hack",$ro[2], time()+3600);
  }else{
    setcookie("no_hack",'', time()+3600);
    session_unset();
    session_destroy();
echo '<meta http-equiv="refresh" content="0; url=?out=1" />';
exit();}


if($act){
    $result = mysql_query("Select * From blog where id=$act");
    $row = mysql_fetch_array($result, MYSQL_NUM);
    if($row[6]){$val_act=0;}else{$val_act=1;}
    mysql_query("UPDATE `blog` SET active_blog = '$val_act' WHERE `id`=$act");
    $error_msg="Activate done!";
}
if($delete){
  mysql_query("delete from blog where id=$delete");
  $error_msg="Deleted done!";
}


$admin_page_text="

<table style='width: 40%;'  border='1' >
	<tr>
		<td>Nu.</td>
		<td>Author name</td>
		<td> </td>
		<td> </td>
	</tr>
";
$result = mysql_query("Select * From blog  ORDER BY id  ASC");
while ($row = mysql_fetch_array($result, MYSQL_NUM))
{
  $admin_page_text.= "
	<tr>
		<td>$row[0]</td>
		<td>$row[1]</td>
		<td><a href='?p=$p&act=$row[0]'><img src='images/$row[6]act.png' alt='Active/Deactive' border=0 /></a></td>
		<td><a href='?p=$p&delete=$row[0]'><img src='images/delete.gif' alt='delete' border=0 /></a></td>
	</tr>
	<tr>
		<td colspan='4'>$row[3]</td>
	</tr>
  ";
}
?>

وهذه صورة لصفحة البلوغ في لوحة التحكم

post-21336-1238572034_thumb.png

ولسا الدرس ما إنتهى وإن شاء الله في تتمه قريبا

هذه نسخة من الموقع site1.03.zip... ربما لن تعمل بشكل صحيح لآنها تعتمد على السيرفر في الروابط , لوحة التحكم تعمل بشكل ممتاز على السيرفر المحلي , تم حذف المحرر وبقي المجلد الخاص به لسهوله تحميل النسخة , يوجد داخل مجلد المحرر (FCKeditor) ملف إقرأني فيه مسار لتحميل نسخة من المحرر

تم تعديل هذه المشاركة بواسطة bastr3 في 1 أبريل 2009 في 11:39

CMS Sfhati , Website Generator


نظام إدارة المحتوى صفحتي ... جربه الآن 


 


small-logo.png

#27

@ (رؤى) .. بارك الله بك , ماتطلبيه ليس صعبا فعمليه بناء سله إلكترونيه أمر بسيط نوعا ما وغير معقد

يمكن أن نبدأ قريبا بإكمال هذا الدرس وشرح سله إلكترونيه صغيره لتعم الفائدة

بالنسبه لدروس من هذا بحثت باللغه العربيه ولم أجد للأسف... ربما لأن كلمات البحث التي أستخدمها ليست صحيحه

, إنتظروني بعد خمسة أيام إن شاء الله سأبدأ بإكمال الدرس

CMS Sfhati , Website Generator


نظام إدارة المحتوى صفحتي ... جربه الآن 


 


small-logo.png

#28

السلام عليكم و رحمة الله و بركاته...

شكراً لك أخي "bastr3" على هذا الموضوع الرائع....بالنسبة لي جاء في وقته المناسب تماماً...هذا عين ما أحتاجه:).

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

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

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

1- المشكلة الأولى كانت في كود صفحة ال index.php ( الموضوع في الصفحة الأولى من الموضوع ) حيث أنه عند الضغط على Login في الفورم لم يكن يحصل معي شيء، بل يتم تفريغ حقلي إسم المستخدم و كلمة السر و أبقى على فورم الدخول !. لم تحل معي المشكلة إلا عندما قمت بتعريف متغييرين عند الدخول مباشرة في حلقة سؤال ال if ، أصبح الكود عندي كالتالي:

if($_REQUEST['login'])
{  // عملية تسجيل دخول المدير
	$useradmin=$_REQUEST['useradmin'];
	$passadmin=$_REQUEST['passadmin'];
    $result = mysql_query("SELECT * FROM users WHERE user_name = '$useradmin' AND user_pass = '$passadmin' LIMIT 1",$link);  // الإستعلام عن وجود هذا الإسم وكلمة السر في جدول المستخدمين

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

المشكلة الثانية هي في الكود:

if($IDUSER_ADMIN){    // إذا كانت جلسة العمل قائمة ستظهر الأزرار والوصلات للوحة التحكم
    $button_link="<a href='?p=admin'>صفحة الإدارة</a>";//جعلنا اللينكات في متغير لكي نتمكن من إضافة لينكات أخرى بكل سهوله
   $body ="مرحباً بك <br> $username.<br><a href='?out=1'> تسجيل الخروج </a><br/>$button_link";
   if($p){ @include($p.".php"); }   // هنا يتم دمج الصفحة التي نريدها فقط بذكر إسمها دون إمتداد وعلامة ال@ وضعت فقط لكي لايظهر خطأ في حال قام شخص بكتابة إسم صفحة غير موجوده

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

هل من الممكن أخي "bastr3" أن توضح لنا أكثر ما هو المقصود بالمتغير $p و بال @include و بهذا السطر عموماً و التعليق عليه، أشعر أني مشكلتي فيه:

if($p){ @include($p.".php"); }   // هنا يتم دمج الصفحة التي نريدها فقط بذكر إسمها دون إمتداد وعلامة ال@ وضعت فقط لكي لايظهر خطأ في حال قام شخص بكتابة إسم صفحة غير موجوده

شكراً لك مرة أخرى أخي "bastr3" على هذا الموضوع الرائع...و أرجو أن تتحمل تلميذ جديد عندك سيكثر عليك بالأسئلة:).

#29

@موظف :

اقتباس
و أرجو أن تتحمل تلميذ جديد عندك سيكثر عليك بالأسئلةregular_smile.gif.

بالعكس هذا يجعل القارئ يستفيد من أكثر ...

مشكلتك في السؤالين واحده

للأسف في البداية كان عندي خطأ وهو جعل المتغيرات كما في بي أتش بي 4 , كان المفروض جعل المتغيرات مسجله من الأصل , ما أقصدة هو تفعيل الريجيستر جلوبال

ففي حاله عدم تفعيل الريجيستر جلوبال تكون هناك مشاكل كثيره بكل النواحي لم أنتبه لها إلا حديثا

لحل المشاكل وعدم تفعيل register_global تكلمنا عنها في الصفحة السابعه.

هناك ثغره يمكن أن تحدث في أمر إنكلود

if($p){ @include($p.".php"); }

هذا السطر يعني دمج الصفحة التي داخل المتغير p إلى صفحة الإندكس , ولكن يمكن أن يستغل الهاكر هذه الثغر بدمج صفحات من الخارج

لذلك إقترحت جعل الصفحات في مصفوفه والتأكد من الصفحة إذا كانت من ضمن المصفوفه أم لا أو جعل قيمة المتغير P رقم وكل رقم يرمز إلى صفحة معينه

سيتم تطبيق الشرح قريبا

أعتذر بشده عن التأخر في إكمال الدروس ولكن وقتي ضيق

CMS Sfhati , Website Generator


نظام إدارة المحتوى صفحتي ... جربه الآن 


 


small-logo.png

#30

كما قلنا هذا السطر من الكود فيه ثغرة

 if($p){ @include($p.".php"); }

وهذه الثغره كافية لتدمير السيرفر الخاص بالموقع , كيف ذلك؟ قم بالبحث عن ثغرة ريموت فايل إنكلود

لإغلاق هذه الثغرة إقترحت وضع اسماء الملفات في مصفوفة , وذلك لتحديد الملفات التي سيتم إحتواؤها (عمل إنكلود لها).

نبدأ : بسم الله , في ملف الكونف نقوم بتعريف متغير

$file_include= array
(
	"admin",
	"blog",
	"manag_template",
	"page",
	"sett"
);

ونبدل سطر الإنكلود بهذا الكود :

foreach($file_include as $true_file){
  if($true_file==$p){@include($p.".php");}
}

وبهذا يتم إغلاق هذه الثغره ....

CMS Sfhati , Website Generator


نظام إدارة المحتوى صفحتي ... جربه الآن 


 


small-logo.png

#31

@Eng.Hakeem

@ yemen_design

بارك الله بكما ....

اقتباس
بعد أسبوع إن شاء الله سنبدأ في الجزء الثاني من الدوره في موضوع منفصل ... في هذا الموضوع

بما إنو الموضوع مثبت رح نكمل هون :) مشان ما نتشتت

CMS Sfhati , Website Generator


نظام إدارة المحتوى صفحتي ... جربه الآن 


 


small-logo.png

#32

بسم الله الرحمن الرحيم

أولا ... نبدأ في سؤال , ماذا سنحتاج في هذه الدورة ؟

الموضوع كما نعرف هو بناء موقع إلكتروني بلغة البي أتش بي وقاعدة بيانات من نوع ماي سيكول من الصفر وبدون إستخدام سكريبتات خارجية , لا مانع طبعا من إستخدام سكريبتات خارجية ولكن الهدف هو فهم الكود كامل .

في الجزء الأول من هذه الدورة قمنا ببناء موقع يحتوي على :

1- لوحة تحكم لمدير الموقع .

2- صفحة للتحكم بإضافة صفحات للموقع وتحديد مكان ظهورها وتفعيلها وحذفها وتعديلها وترتيبها.

3- صفحة للتحكم بالمستخدمين إضافة وحذف وتعديل فقط .

4- صفحة للتحكم بإعدادات الموقع مثل إسم الموقع وحقوق النسخ والكلمات المفتاحية مع إمكانيه إضافة المزيد من الإعدادات .

5- صفحة للتحكم في قوالب الموقع وتفعيل قالب معين مع إمكانيه رفع قالب جديد بصيغه مضغوطه وتم شرح كيفيه عمل قالب بشكل سريع ومفصل .

6- تم عملية محاولة إضافة مدونه ولكن لم تكن العمليه ناجحه لأنها تحتاج إلى شرح أطول وإن شاء الله سيتم شرح كيفيه إضافة بلغ إنز من خلال لوحة التحكم كما نرى في مجلة جمله وورد بريس .

7- تم تطبيق الموقع على تقنية الويب2 وهذا لتكون الدورة ذات فائدة فهذه التقنية هي السائدة في هذا الوقت .

ماذا سنعمل في الجزء الثاني من هذه الدورة ؟

بإذن الله سيتم التالي :

1- طريقة إستخدام الأجاكس .

2- عمل قالب للوحة التحكم .

3- عمل إضافة مثل المدونه وشرح طريقة إضافتها أو حذفها من لوحة التحكم

4- عمل تعديلات مثل إضافة صلاحيات للمستخدمين وتحديد الصفحة الرئيسية وغيرها .

ستكون الدروس غير مرتية كما هو موضح في الأعلى ,,, ولكن سيتم شرح ماهو مناسب في الوقت المناسب

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

CMS Sfhati , Website Generator


نظام إدارة المحتوى صفحتي ... جربه الآن 


 


small-logo.png

#33

نبدأ الدرس الأول من الجزء الثاني من هذه الدورة ....

في البداية سنقوم بإستخدام مكتبه خاصه بالجافا سكريبت ... هذه المكتبه قمت بتصفحها سريعا ووجدت أنهاتحتوي على عدة أدوات يمكن الإستفادة منها وسنقوم بإستخدام مايلزم من خلال الدروس , إسم المكتبه دوجو

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

بعد رفع مكتبة دوجو على الموقع نقوم بوضع هذا الكود في الهيدر للموقع ليتم إستدعاء مانريد من المكتبه (هذا ما أريده في موقعنا هنا ولكن المكتبه كبيرة وفيها الكثير من الأدوات يمكنك دراستها فيما بعد)

	<!--  CSS includes -->
	<link href="/dojo/dijit/themes/nihilo/nihilo.css" rel="stylesheet" type="text/css" />
	<link href="/dojo/dojo/resources/dojo.css" rel="stylesheet" type="text/css" />
	<style type="text/css">
		@import "/dojo/dojox/highlight/resources/highlight.css";
		@import "/dojo/dojox/highlight/resources/pygments/default.css";
		@import "/dojo/dojo/resources/dojo.css";
		@import "/dojo/dojox/grid/_grid/Grid.css";
		@import "/dojo/dojox/grid/_grid/nihiloGrid.css";
	</style>
	<!-- dojo / requires -->
	<script type="text/javascript" src="/dojo/dojo/dojo.js"></script>

البدي والجافاسكريبت بعد البدي كما يلي :

<body class="nihilo">
<script language="javascript">
  dojo.require("dijit.form.NumberSpinner");
  dojo.require("dijit.form.CheckBox");
  dojo.require("dijit.form.CurrencyTextBox");
  dojo.require("dijit.Menu");
  dojo.require("dijit.form.Button");
  dojo.require("dijit.form.ValidationTextBox");
  dojo.require("dojox.validate.regexp");
  dojo.require("dijit.Dialog");
  dojo.require("dojo.parser"); // scan page for widgets
</script>

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

في قالب ستجيل الدخول سنغير الكود إلى :

<div align="center">
<form method="POST" action="?">
  <div class="container">
	<table>
	  <tr>
		<td class="label">User Name:</td>
		<td class="field">
		  <input type="text" name="useradmin" id="name"/>
	  </td>
	  </tr>
	  <tr>
		<td class="label">
		  Password:
		</td>
		<td class="field">
		  <input type="password" name="passadmin" id="address"/> <input type="hidden" name="login" value="login"/>
		</td>
	  </tr>
	</table>
	<button type="submit" id="1465" dojoType="dijit.form.Button"  onClick='this.submit();'  iconClass="plusIcon">  Login  </button>
	<button type="submit" name="forget" id="1466" dojoType="dijit.form.Button"  onClick='this.submit();'  iconClass="plusIcon">  Forget password  </button>
  </div>
</form>
</div>

كما سنستخدم الستايل التالي للطبقة (DIV) التي إسمها كونتينر في النموذج السابق

<style type="text/css">
  .container {
	margin-top: 10px;
	color: #292929;
	width: 300px;
	border: 1px solid #BABABA;
  /*  background-color: #ddd;*/
	padding: 10px;
	margin-left: 10px;
	margin-bottom: 1em;
	-o-border-radius: 10px;
	-moz-border-radius: 12px;
	-webkit-border-radius: 10px;
	-webkit-box-shadow: 0px 3px 7px #adadad;
	border-radius: 10px;
	-moz-box-sizing: border-box;
	-opera-sizing: border-box;
	-webkit-box-sizing: border-box;
	-khtml-box-sizing: border-box;
	box-sizing: border-box;
	overflow: hidden;
  }
  .container .label {
	font-size: small;
	font-family: Verdana;
  }
</style>
أتمنى يكون الجميع بعرفوا شو معني ستايل وكيفيه إستخدامه .. سأقوم بشرح سريع لما سيحدث بعد وضع الستايل السابق ...

قبل المضي بشرح الستايل أنظر إلى الصور والتي توضح مدى تفوق وتقدم كل من المتصفحات التاليه :

المتصفح الرجعي والذي لايعرف معنى ويب2 إنترنت إكسبلولر من شركة مايكروسوفت

post-21336-1246336660_thumb.png

متصفح فايرفوكس الشهير من شركة موزيلا وهو يعتبر من أقوى المتصفحات ونلاحظ فقدانه لبعض الخصائص من الويب2 مثل الضل

post-21336-1246336665_thumb.png

متصفح جووجل كروم من شركة جووجل يتميز بالسرعه والخفة ولكنه يفتقد إلى الإضافات ونلاحظ كيف أصبح الشل مع الضل

post-21336-1246336652_thumb.png

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

	<div id="a" class="b">
		<span>bassam</span>
	</div>

هنا نستخدم الستايل تنسيق الكود السابق وبذلك يمكننا أن نضع الستايل الذي نريد ومن ثم تغييره دون الحاجه للدخول إلى الكود والتعديل عليه

الآن يمكننا التحكم في الطبقه من خلال الآي دي أو من خلال الكلاس

من خلال الآي دي سيكون تحديد الستايل بعلامة المربع أما الكلاس فيكون من خلال النقطه كما يلي :

<style>
.b{
  background-color: #FF0066;
}
#a{
  border: solid #990000;
}
</style>

post-21336-1246337413_thumb.png

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

<style>
.b span{
  color: #FFFFFF;
  font-weight:bold;
  font-size: large;
  margin: 10px;
}
</style>

post-21336-1246337674_thumb.png

هناك خصائص كثيره يمكن أن توفر كود وبذلك تصبح الصفحة خفيفه والستايل منفصل تماما عن الصفحة ...

نكمل فيما بعد بإذن الله

تم تعديل هذه المشاركة بواسطة bastr3 في 30 يونيو 2009 في 07:56

CMS Sfhati , Website Generator


نظام إدارة المحتوى صفحتي ... جربه الآن 


 


small-logo.png

#34

الدرس الثاني من القسم الثاني من الدورة

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

ALTER TABLE `users` ADD `real_name` VARCHAR( 250 ) NOT NULL ,
ADD `date_birth` VARCHAR( 20 ) NOT NULL ,
ADD `nationality` VARCHAR( 20 ) NOT NULL ;

وسيتم إضافة جدول جديد بإسم perm إختصار لصلاحيات بحيث يتم تخزين إسم الصفحة ورقم المستخدم في هذا الجدول ... تقسيم الجدول كالتالي :

CREATE TABLE IF NOT EXISTS `perm` (
  `id` int(20) NOT NULL AUTO_INCREMENT,
  `user_id` int(20) NOT NULL,
  `perm` varchar(100) COLLATE latin1_general_ci NOT NULL,
  PRIMARY KEY (`id`)
) ;

الأن نبدأ في صفحة المستخدمين لنظورها ولكن قبل ذلك سنقوم بتعديل كود موجود داخل ملف الكونف وهو

$file_include= array
(
    "admin",
    "blog",
    "manag_template",
    "page",
    "sett"
);

قمنا بعمله لإغلاق ثغرة الريموت أكسيس إذا بتذكروا :) أكيد لا تذكرون بتقدرو ترجعولها ....

رح يصير الكود كالتالي لكي نتمكن من إظهار الأزرار بشكل دايناميكي :

$file_include['admin']='User managemrent';
$file_include['manag_template']='Site template';
$file_include['page']='Pages editor';
$file_include['sett']='Site setting';
$file_include['blog']='Blog';

لاحظوا المفتاح هو إسم الصفحة بدون الإمتداد والقيمة هي التي ستظهر للمستخدم

في صفحة الإنديكس للوحة التحكم نضيف بعد نجاح عملية تسجيل الدخول هذه الأسطر لتخزين الصفحات المتاح للمستخدم الدخول إليها

	    session_register ( "P_PERM" );
    	$result1=mysql_query ( "Select * From perm where user_id='$row[0]'", $link1 );
    	while ( $row1 = mysql_fetch_array ( $result1, MYSQL_NUM ) ) {
           $P_PERM[$row1[2]]=$row1[0];
        }

بنفس الصفحة يتم إستبدال هذا الكود الخاص بإظهار روابط للصفحات

   $button_link="<a href='?'>main page</a> | <a href='?p=admin'>Admin page</a>  | <a href='?p=sett'>Setting</a>
      | <a href='?p=manag_template'>Template manager</a>  | <a href='?p=page'>Page manager</a>  | <a href='?p=blog'>blog manager</a> ";

إلى

   $button_link= '<div class="wireframeauramenu"><ul><li><a href="?">Home</a></li>';
    foreach($P_PERM as $k=>$v){ $button_link.= '<li><a href="?p='.$k.'">'.$file_include[$k].'</a></li>'; }
   $body ="welcome $username [<a href='?out=1'> Loguot </a>]<br/>$button_link</ul></div>";

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

في نفس الصفحة يتم تعديل عملية إحتواء الصفحات (include) لأنها ستعتمد على الصفحات المسموح الدخول إليها فقط ...

يتم إستبدال

foreach($file_include as $true_file){
  if($true_file==$p){@include($p.".php");}
}

إلى

		if ($P_PERM[$p]) {
			include ($p.".php");
		} else {
			$err_msg ="permission is denain!";
		}

نلاحظ هنا إستخدام متغير $err_msg وهو يعبر عن خطأ وهناك متغيرات في صفحة المدير ستلاحظها تعبر عن تمام العمليه أو تنبيه أو تحذير كل هذه المتغيرات سيتم إستغلالها للتحكم بالمسجات بطرق عديده غير الطريقة التقليدية وهي أليرت التي تسبب نوبه قلبيه للمستخدم ... حاليا ستجد هذه المسج متاحة عند حذف أي مستخدم لذلك سيتم وضع كود الجافاسكريبت هذا في نفس الصفحة (الرئيسيه ) ليتم تنبيه المدير بحذف حساب شخص ما

function ConfirmChoice(Luc){
	answer = confirm("Do you really want to delete this record?")
	if (answer !=0)
	{
		location = Luc
	}
}

الآن نرجع إلى صفحة مدير المستخدمين ونقوم بتعديلها لتصبح كما يلي ...

<?
  if($no_hack!=session_id()){
    session_unset();
    session_destroy();
echo '<meta http-equiv="refresh" content="0; url=?" />';
exit();}
 if($edit==1 || $delete==1){ $wor_msg= "this is master user";$edit=0;$delete=0; }


	$admin_page_text.= "<br><a href='?p=$p&show=1'>Show all users</a> | <a href='?p=$p&ADD_NEW=1'>Add new user</a><br>";



if ($B1){
		$result=mysql_query("Select * From users where user_name='$usr' ",$link);
		while ($row = mysql_fetch_array($result, MYSQL_NUM))
		{
		    if($row[0]==$HID1){}else{
			$T1no=1;
			$err_msg='This user already exist.';
            }
		}

		if (!$T1no){
		if ($HID1){
			$result=mysql_query ("UPDATE users SET user_name = '$usr', user_pass='$pswd' , real_name = '$real_name',date_birth = '$date_b', nationality='$nationality'  WHERE id = '$HID1' ",$link);
		    mysql_query("Delete From perm Where user_id=$HID1",$link);
            foreach($_POST['prm'] as $v){ mysql_query("INSERT INTO perm (`user_id` , `perm`) VALUES ('$HID1', '$v')",$link); }
            $suc_msg="Update done!";
		}else{
            $result=mysql_query("INSERT INTO users (`user_name` , `user_pass`, `real_name` ,`date_birth`, `nationality` ) VALUES ('$usr', '$pswd','$real_name','$date_b', '$nationality')",$link);
            foreach($_POST['prm'] as $v){ mysql_query("INSERT INTO perm (`user_id` , `perm` ) VALUES ('".mysql_insert_id($link)."', '$v')",$link); }
             $suc_msg="New user added!";
		}}

		$usr='';$pswd='';
        $real_name='';	$date_b='';$nationality='';
		}

	if($Delete){
		mysql_query("Delete From users Where id=$Delete",$link);
		mysql_query("Delete From perm Where user_id=$Delete",$link);
        $wor_msg="User was deleted!";
	}

if($show){
		$admin_page_text.= '<div class="box" style="width: 700px;"> <table style="width: 100%" class="tbl_1" cellspacing="1">';
		$result=mysql_query("Select * From users",$link);
		while ($row = mysql_fetch_array($result, MYSQL_NUM))
		{
           if($color=='DDE6FF'){$color='F0F0F0';}else{$color='DDE6FF';}
		$admin_page_text.= "
            <tr bgcolor='#$color'>
              <td>$row[1]</td>
              <td><a href='?p=$p&Edit=$row[0]'><img border='0' src='images/b_edit.png' alt='Edit this user'></a></td>
              <td><a href=\"#\" onclick=\" ConfirmChoice('?p=$p&Delete=$row[0]'); return false;\">
              <img border='0' src='images/b_drop.png' alt='Delete this user'></a></td>
            </tr>";
		}
		$admin_page_text.= "</table></div>";
}

if($Edit){
	$result=mysql_query("Select * From users Where id=$Edit",$link);
	while ($row = mysql_fetch_array($result, MYSQL_NUM))
	{
		$usr=$row[1];
		$pswd=$row[2];
  		$real_name=$row[3];
		$date_b=$row[4];
		$nationality=$row[5];
    	$result1=mysql_query("Select * From perm Where user_id=$Edit",$link);
    	while ($row1 = mysql_fetch_array($result1, MYSQL_NUM))
    	{
    		$perm[$row1[2]]='checked="checked"';
    	}
	}

    $butn_val="Update";
}

if($Edit || $ADD_NEW){
  if(!$butn_val){$butn_val="Add new";}

$admin_page_text.='
<div class="box" style="width: 700px;">
<div align="left">
<form method="POST" action="?p='.$p.'">
  <table id="tbl2">
  <tr>
    <td>user</td>
  </tr>
  <tr>
    <td><input name="usr" value="'.$usr.'">
	<input type="hidden" name="HID1" Value="'.$Edit.'"></td>
  </tr>
  <tr>
    <td> </td>
  </tr>
  <tr>
    <td>password</td>
  </tr>
  <tr>
    <td><input name="pswd" value="'.$pswd.'"></td>
  </tr>
  <tr>
    <td> </td>
  </tr>
  <tr>
    <td>Real name</td>
  </tr>
  <tr>
    <td><input name="real_name" value="'.$real_name.'">
	<input type="hidden" name="HID1" Value="'.$Edit.'"></td>
  </tr>
  <tr>
    <td> </td>
  </tr>
  <tr>
    <td>Date of birth</td>
  </tr>
  <tr>
    <td><input name="date_b" value="'.$date_b.'"></td>
  </tr>
  <tr>
    <td> </td>
  </tr>
  <tr>
    <td>Nationality</td>
  </tr>
  <tr>
    <td><input name="nationality" value="'.$nationality.'"></td>
  </tr>
  <tr>
    <td> </td>
  </tr>
  <tr>
    <td>
';


$i=0;
foreach($file_include as $k=>$v){ $i++; $admin_page_text.= ' <input type="checkbox" dojoType="dijit.form.CheckBox" id="cp_'.$i.'" name="prm['.$i.']" value="'.$k.'" '.$perm[$k].' /><label for="cp_'.$i.'">'.$v.'</label><br />'; }

$admin_page_text.='    </td>
  </tr>
</table>
<input type="hidden" name="B1" value="dd">
  <p>
  <button type="submit" id="1465" dojoType="dijit.form.Button" iconClass="plusIcon">  '.$butn_val.'  </button> 
  <button id="14652"  onclick="window.open(\'?p='.$p.'\',\'_self\')"  dojoType="dijit.form.Button" name="B2" iconClass="plusIcon">  Cancel  </button>
  </p>
</form>
</div>
</div> ';
 } ?>

نكمل في الحلقة القادمه :)

CMS Sfhati , Website Generator


نظام إدارة المحتوى صفحتي ... جربه الآن 


 


small-logo.png

#35

الدرس الثالث من القسم الثاني من الدورة

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

بسم الله نبدأ ...

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

*ملاحظه ------------------------------------------------------------------

-سيتم تنسيق العمل ليعمل لوكلي بحيث يتم تنزيل النسخة هنا وتتم إختبارها من قبلكم بكل سهوله .

-يمكنك الإشتراك بهذا الموضوع ليضلك كل جديد من خلال خيارات في أعلى الموضوع وبعدها إختيار أخبرني بجديد هذا الموضوع لتكون على إطلاع بكل جديد يحدث هنا فبعد تثبيت الموضوع ربما الكثير لا يلاحظ إضافة جديد ..

------------------------------------------------------------------------------------

سنقوم بعمل خيار هل تريد رابط ذكي أم لا .. لآن هناك إستضافه لا تقبل بوجود ملف .htaccess الذي تكلمنا عنه سابقا

في جدول الخيارات ننشيء حقل جديد بإسم

%smart path%

هذا الخيار إذا كانت قيمته 1 يعني رابط ذكي فعال و صفر يعني العكس

في صفحة الإنديكس للمجله (الصفحة الرئيسيه) نقوم بإضافة

if(sett_site('%smart path%')){ $TEMPLATE_link='/'; }
 $TEMPLATE_link.='template/'.sett_site('%Template_style%').'/';
 $TEMPLATE_link1='template/'.sett_site('%Template_style%').'/';
 include $TEMPLATE_link1."template.inc";
 if(sett_site('%smart path%')){ $button_temp=$button_temp_smart; }

السطر الأول يضيف سلاش إلى رابط مجلد القالب لآن الرابط الذكي كما قلنا يحتاج أن نعرف رابط القالب والصور بهذه الطريقة (يمكنك الرجوع إلى درس الرابط الذكي لفهم المقصود)

طبعا في حاله عدم تفعيل الرابط الذكي يتم حذف السلاش

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

$button_temp_smart='<LI><A href="/page/%row_1%/%row0%/" %current%>%row1%</A></LI>';
 $button_temp='<LI><A href="?id=%row0%" %current%>%row1%</A></LI>';

أخيرا في حالة تفعيل الرابط الذكي يجب أن نضع هذا الكود في ملف .htaccess

RewriteEngine on
 RewriteRule ^page/(.*)/([0-9]+)/(.*)$ ?id=$2

غير ذلك يتم حذف الكود السابق من الملف المذكور وبهذا نكون قد أتممنا عملية تفعل وعدم تفعيل الرابط الذكي :)

تم تعديل تصميم لوحة التحكم لتصبح كما في الشكل :

post-21336-1247811296_thumb.png

كما تم حذف صفحة البلوغ لتصبح فيما بعد عباره عن إضافة للمجله

حتى الآن هذا العمل لوكلي يعني ربما لن تجده في الموقع وأحاول عمل الفكرة كامله لوكلي وبعدها أطرحها هنا ليتم تجربتها والتحدث في إمكانيات تطويرها إن شاء الله

تم تعديل هذه المشاركة بواسطة bastr3 في 17 يوليو 2009 في 09:17

CMS Sfhati , Website Generator


نظام إدارة المحتوى صفحتي ... جربه الآن 


 


small-logo.png

#36

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

كما تم إستخدام الأجاكس في صفحة المستخدمين , إذا أردت مشاهدة الإضافات فقط قم بزيارة صفحة المستخدمين في لوحة التحكم , عملية الحذف بتقنية الأجاكس

CMS Sfhati , Website Generator


نظام إدارة المحتوى صفحتي ... جربه الآن 


 


small-logo.png

#37

الدرس الرابع من القسم الثاني من الدورة

كما رأينا في الدرس السابق لم يتم التطرق إلى شرح تفصيلي لعمليات قمنا بها وذلك لآنني رأيت أن الأمر أصبح واضح لكل من يتابع معنا فلا داعي لشرح التفاصيل الغير مهمه , طبعا سيتم شرح بعض التقنيات التي تعتمد على الجافاسكريبت لكي تكون واضحه بشكل أفضل ولكن بعد أن يكتمل أو تكتمل ملفات المكتبه فإلى الآن يتم التعديل عليها بناء على ما يتطلبه الأمر ,,,

درسنا اليوم عن تصميم الموقع بشكل أفضل وأسهل , لا حظنا إستخدام الويب2 في بداية الدورة للقوالب الخاصه بالموقع , ربما أن الكثير لم يستوعب الفكرة أو فكر في نفسة وقال التصاميم التي يمكن عملها بسيطه وليست جميله إطلاقا , حقيقة الأمر كذلك إذا كان المصمم غير متخصص وأنا لست مصمم لذلك رأيتم القوالب المتخلفه التي وضعتها :)

منذ فترة وجدت موقع يحتوي على قوالب جاهزه وتصاميم جميله جدا وكلها على تقنيه الويب2 لذلك سأقوم بوضع أكثر من تصميم من هذا الموقع ويتم شرح تصميم واحد وباقي التصاميم على غرار التصميم الأول ..

أنتظرونا .... لنا رجعه قريبه بإذن الله

عدنا

هذا القالب الرئيسي بعد دراستة وتصميمه ليحتوي على أمكانيات كبيرة في التصميم

إسم الملف

template.inc

مسار الملف

/www/template/name of design/here!

المحتوى للملف

<?
$my_simple_tmplt='<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <meta name="author" content="Dave Shea" />
    <meta name="keywords" content="design, css, cascading, style, sheets, xhtml, graphic design, w3c, web standards, visual, display" />
    <meta name="description" content="A demonstration of what can be accomplished visually through CSS-based design." />
    <meta name="robots" content="all" />
    <link href="'.$TEMPLATE_link.'155.css" rel="stylesheet" type="text/css" />
    <title>%title%</title>
</head>
<body id="css-zen-garden">
<div id="container">
    <div id="intro">
        <div id="pageHeader"><h1></h1></div>

        <div id="quickSummary">
            <p class="p1"></p>
            <p class="p2"><span>Download Blood CMS <a href="blood-1.02.zip" title="blood-1.02.zip">Zip file</a> OR <a href="blood-1.02.gz" title="blood-1.02.gz">gz file</a></span></p>
        </div>
    </div>

    <div id="supportingText">
        <div id="explanation">
            <h3>%title%</h3>
            <p class="p1">
                %content%
            </p>
        </div>
    </div>
        <div id="footer">
            %button_up%
        </div>
    <div id="linkList">
        <div id="linkList2">
            <div id="lselect">
                <h3 class="select"><span>Select a Design:</span></h3>
                <ul>
                    %button%
                </ul>
            </div>
        </div>
    </div>
</div>
<div id="extraDiv1"><span></span></div><div id="extraDiv2"><span></span></div><div id="extraDiv3"><span></span></div>
<div id="extraDiv4"><span></span></div><div id="extraDiv5"><span></span></div><div id="extraDiv6"><span></span></div>
%Copyrights%
</body>
</html>';

$button_temp_smart='<LI><A href="/page/%row_1%/%row0%/" %current%>%row1%</A></LI>';
$button_temp='<LI><A href="?id=%row0%" %current%>%row1%</A></LI>';
$buttonup_temp_smart='<A href="/page/%row_1%/%row0%/" %current%>%row1%</A>';
$buttonup_temp='<A href="?id=%row0%" %current%>%row1%</A>';

?>

تم شرح هذا الملف من قبل في بداية الدورة تقريبا

ولكن ما يهمني في شرح هذا الملف هو الليرات أو الطبقات أو الديفز

(div)

من خلال الستايل كود يمكننا التحكم بكل جزئية في هذا الملف وقد شرحت بشكل سريع كيف نستغل الآي دي وإسم الكلاس لأي وسم في كود هتمل

مثلا في الملف السابق يوجد 4 ليرات وضعت فقط للتصميم ولإعطاء فاعليه أعلى للتحكم بالتصميم نأخذ هذه اللير

<div id="extraDiv1">

إذا أردنا من هذه اللير أن تكون في الزاويه اليسرى وفيها شعار كهذا

post-21336-1247858346_thumb.gif

<style>
#extraDiv1{
  top: 0px;
  left: 0px;
  background-image: url(logo.gif);
  width: 160px;
  height: 87px;
  position: relative;
  margin: 0px;
  padding: 0px;
}
</style>

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

سأضع ملف ال

Css

لكي تنظروا إليه وأتمنى أن تتبعوا كل لير في الملف التالي وكل وسم من الوسوم الموجوده في القالب السابق لتجدوا هنا كيف تم التحكم في النص المحتوى للوسم والصور كيف تم تركيبها وتنسيقها وكل هذا بملف واحد صغير نسبيا

body {
    background: #2F3027 url(back.jpg) no-repeat;
    font:0.7em Tahoma, Arial, Verdana, sans-serif;
    color:#666;
    margin:0;
    padding:0;
}
a{
    color:#BD8100;
    text-decoration:none;
}
a:hover{
    background:#BD8100;
    color:#FFF;
}
h3{
    margin:0;
    padding:0;    
}
h3 span{
    display:none;
}
acronym{ 
    border-bottom:1px dotted;
}
.accesskey{
    text-decoration:underline;
}
ul{
    margin: 0;
    padding:10px 0px 10px 10px;
    list-style: none;
}

li{
    padding-right: 12px;
    padding-bottom: 0.6em;
    background:url(li_bullet.gif) no-repeat 100% 2px;
}
#container {
    margin:0;
    padding:0;
}
/* Intro */
#intro{
    width:467px;
}
#pageHeader h1{
    margin:0 0 0 16px;
    height:367px;
    background:url(page_header.gif) no-repeat;
    text-indent:-2000px;
}
#pageHeader h2,
#quickSummary .p1{
    display:none;
}
#quickSummary .p2{
    margin:0 0 0 16px;
    padding-left:343px;
    font-size:6px;
    height:82px;
    background:url(quicksummary_back.gif) no-repeat;
    white-space:no-wrap;
}
#quickSummary .p2 span{
    visibility:hidden;
}
#quickSummary .p2 a{
    width:36px;
    height:20px;
    float:left;
    visibility:visible;
    text-indent:-2000px;
    margin:-7px 17px 0 0;
    padding:0;
}
#quickSummary .p2 a:hover{
    background:none;
}
#preamble{
    margin:0 0 0 16px;
    padding:0;
    background:url(txt_back.gif) repeat-y;    
}
#preamble h3{
    height:69px;
    background:url(theroad_back.gif) no-repeat;    
}
#preamble p{
    line-height:1.4em;
    padding:19px 19px 5px 19px;
    margin:0;
}
/* Supporting Text */
#supportingText{
    width:467px;
    background:url(txt_back.gif) repeat-y 16px;
}
#supportingText p{
    font-size:11px;
    line-height:1.4em;
    padding:19px 19px 5px 19px;
    margin:0;
}
#supportingText h3{
    margin:0;
    padding:0;
    height:107px;
}
#explanation,
#participation, 
#benefits,
#requirements{
    margin:0 0 0 16px;    
}
#explanation h3{
    background:url(explanation_back.gif) no-repeat;
    text-align: center;
}
#participation h3{
    background:url(participation_back.gif) no-repeat;
}
#benefits h3{
    background:url(benefits_back.gif) no-repeat;
}
#requirements h3{
    background:url(requirements_back.gif) no-repeat;
}
#footer{
    margin:0 0 0 16px;
    padding-top:58px;
    padding-bottom:20px;
    padding-left:20px;
    background:url(footer_back.gif) no-repeat;
    text-align:left;

}
#footer a{
    margin:3px;
    padding:2px 5px;
    font-weight:bold;    
}
/* Link List */
#linkList {
    position:absolute;
    top:64px;
    left:467px;
    width:226px;
    background:url(linklist_back.gif) no-repeat;
    padding-top:62px;
    text-align:right;
}
#linkList acronym{ 
    border:none;
}
.select{
    background:url(select_back.gif) no-repeat 100% 0;    
    height:30px;
}
.archives{
    background:url(archives_back.gif) no-repeat 100% 0;    
    height:27px;
}
.resources{
    background:url(resources_back.gif) no-repeat 100% 0;    
    height:27px;
}

تم إن شاء ثلاث قوالب جديده على غرار هذا القالب وهذه صور مصغره لكل قالب ويمكنك مشاهدة القالب عن طريق موقع المجله :)

http://www.bloodspotsite.com

post-21336-1247860308_thumb.gif

post-21336-1247860334_thumb.gif

post-21336-1247860360_thumb.gif

تم تعديل هذه المشاركة بواسطة bastr3 في 17 يوليو 2009 في 22:53

CMS Sfhati , Website Generator


نظام إدارة المحتوى صفحتي ... جربه الآن 


 


small-logo.png

#38

السلام عليكم ورحمة الله وبركاته ....

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

على كل ربما أن المتابعين ليسوا من الأعضاء وهناك زوار كثر لذلك من يريد التفاعل فعليه بالتسجيل في هذا المنتدى والتسجيل غير معقد يتم تفعيل العضويه فورا , ولم يريد التعليق في موقع المجله فقد قمت بوضع نظام تعليقات لكل درس لكي يتسنى للزائر المشاركه

اقتباس
url : http://www.bloodspotsite.com

url admin page : http://www.bloodspotsite.com/administrator

usr : admin

password : 123

شكرا لكم :)

تم تعديل هذه المشاركة بواسطة bastr3 في 19 يوليو 2009 في 06:57

CMS Sfhati , Website Generator


نظام إدارة المحتوى صفحتي ... جربه الآن 


 


small-logo.png

#39

السلام عليكــم ورحمـة الله وبركاتــه.

أشكرك أخي الكريم على مجهودك الطيب و إفادتك للأخرين.

موضوع شيق و ممتع. و القيام بنظام تصرف في المحتوى CMS لأمر مثير حقا للإنتباه.

أرجو أن يوفقك الله للمزيد من العمل لإكمال هذا البرنامج و سأحاول بإذن الله المشاركة في إنجاز هذا المشروع.

أقوم حاليا بدراسة و متابعة النص البرمجي و هناك ملاحظات أرجو أن يكون في مناقشتها إتماما للفائدة و تحسين لجودة المصدر.

أولا من الضروري جدا معالجة ثغرة ال GLOBAL REGISTRY التي تعتبر ثغرة لا يمكن الإستهانة بها حقيقة.

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

مثال:

إذا كان عندك متغير باسم $IDUSER_ADMIN في النص البرمجي و وضعت في ذيل رابط الصفحة السطر التالي:

?IDUSER_ADMIN=1

فالنتيجة عند تنفيذ الصفحة تكون بإسناد قيمة واحد للمتغير $IDUSER_ADMIN

أنظر النتيجة مباشرة :

http://www.bloodspotsite.com/administrator/?IDUSER_ADMIN=1&username=hacker

و هذا مثال أخر:(إذا كنت لا تحب تكبد مشقة إدخال كلمة المرور و إسم الولوج)

http://www.bloodspotsite.com/administrator...p;passadmin=123

الحل:

إستعمال كل من $_[]POST و $_GET[] لاستقبال المتغيرات المرسلة.

للتذكير فإن $_GET[] تستعمل لاستقبال المتغيرات المرسلة عن طريق ذيل رابط الصفحة.

و $_POST[] تستعمل لاستقبال المتغيرات المرسلة عن طريق </form><form>

#40

أشكرك أخي عبد الولي على ردك الإيجابي

بالنسبه لـ

اقتباس
أولا من الضروري جدا معالجة ثغرة ال GLOBAL REGISTRY التي تعتبر ثغرة لا يمكن الإستهانة بها حقيقة.

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

على كل تم حل هذه الثغره من خلال تعديل الكود إلى :

if(session_is_registered('IDUSER_ADMIN')){

أما من ناحية

اقتباس
و هذا مثال أخر:(إذا كنت لا تحب تكبد مشقة إدخال كلمة المرور و إسم الولوج)

فأنا لا أراها ثغره لآن الهاكر أو أي شخص يستطيع إرسال بيانات عن طرق جت وبوست فلماذا أهتم بالمتغيرات القادمه من هاتين العمليتين؟خصوصا وأن كل المتغيرات القادمه يتم تصفيتها عن طريق هذا الكود :

foreach($_GET as $KEy => $VAl){ $$KEy=htmlspecialchars(strip_tags(addslashes($VAl))); }
foreach($_POST as $KEy => $VAl){ $$KEy=htmlspecialchars(strip_tags(addslashes($VAl))); }

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

CMS Sfhati , Website Generator


نظام إدارة المحتوى صفحتي ... جربه الآن 


 


small-logo.png

#41

الدرس الخامس من القسم الثاني من الدورة

وعليكــم السـلام ورحمة الله وبركاتـه..

في هذا الدرس سنتحدث عن مكتبة الجافاسكريبت التي إستخدمناها وهي من تأليفي :) لذلك شرحها أصبح من إختصاصي ...

في أي المواقع تم إستخدام هذه المكتبه ؟

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

كما تم إستخدامها في حذف المستخدم بشكل أجاكس وبطريقة إختفاء متدرج (fade out)

نأتي الأن للشرح ...

المكتبه في ملف يدعى

blood.js in www/jsblood.js

الدوال الموجوده فيه :

أولا دالة

getData(dataSource, divID,added)

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

مثال لإستخدام هذه الداله :

قم بتحميل ملف المكتبة blood.js

المثال:

<script type="text/javascript" src="http://www.bloodspotsite.com/js/blood.js"></script>
    <div id="type_here">result here</div>
    <a href="java script:getData('http://localhost/blood.php?id=34', 'type_here',0)">get result now</a>

ملاحظه : لايمكن تنفيذ ملف موجود في سيرفر آخر من خلال الأجاكس يعني لو قمت بإستبدال لوكال هوست إلى ياهوو دوت كم لن يعمل الكود لآن الملف يجب ان يكون في نفس السيرفر وتدعى هذه العمليه

domain crossing

ثانيا دالة :

Q_ajax(Q_ajax)

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

<a href="java script:Q_ajax('http://localhost/blood.php?id=34')">get result now</a>

سيتم تنفيذ الصفحة ولكن لن تظهر أي نتائج عندك ...

ثالثا دالة :

هذه الداله تحتوي على عدة دوال بداخلها لذلك وضعت كودها كامل

function ConfirmChoice(Luc,id)
{
	answer = confirm("Do you really want to delete this record?")
	if (answer !=0)
	{
        Q_ajax(Luc);
        opacity(id,100,0, 500);
        setTimeout("hide_d('"+id+"')",500);

	}
}

تأخذ متغيرين الأول رابط الصفحة لتنفيذه والثاني اللير التي سيتم إخفاؤها ليظهر الحدث

تحتوي بداخلها على الداله السابقه لتنفيذ الرابط وداله جديده وهي

opacity(id,100,0, 500);

وتأخذ هذه الداله أربعة متغيرات الأول اللير والثاني من أي شفافيه يبدأ 100 تعني غير شفاف وصفر تعني شفاف والمتغير الثالث إلى أي شفافيه تريد الإنتقال والمتغير الأخير خلال كم مللي من الثانيه تريد تنفيذ عمليه الإنتقال من الشفافيه

الداله الأخيره التي تحتويها هي

hide_d('id')

وتعني إخفاء اللير وهو المتغير id

مثال :

<div id="delete_this">this row user</div>
    <a href="java script:ConfirmChoice('http://localhost/blood.php?id=34', 'delete_this')">Delete row user</a>

هناك داله تدعى show_d(theTable)

وهي عكس

hide_d('id')

يعني تظهر اللير

يبقى دوال لم يتم إستخدامها وربما لن نستخدمها في الملف السابق وسيتم التعديل على هذه الدوال بما يناسب عملنا ولكن كفكره كيف تم عمل الحركات في المجله , تم إرفاق الأمثله السابقة مع ملف

blood.php

لتتمكن من فحص المثال بسرعه , ملاحظه الملف السابق يجب وضعه في اللوكال هوست .

(مافي نموذج للمرفقات !!! لذلك تم رفع الملف على هذا الرابط : إضغط هنا)

دمتم في رعاية الله

شكرا لكم :)

CMS Sfhati , Website Generator


نظام إدارة المحتوى صفحتي ... جربه الآن 


 


small-logo.png

#42

الدرس السادس من القسم الثاني من الدورة

بســم الله الـرحمــن الرحيــم

في هذا الدرس سنقوم بعمل قصاصات لمجلتنا الصغيره

معنى قصاصات أي مانراه في جميع المواقع من تقنية الويب 2 وهي

RSS

للمزيد حول هذه الكلمة أرجو زيارة هذا الرابط من ويكيبيديا الحرة

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

?xml version="1.0"  encoding="utf-8"?>
<!-- RSS generated by Radio UserLand v8.0.5 on 9/30/2002; 4:00:00 AM Pacific -->
<rss version="2.0" xmlns:blogChannel="http://backend.userland.com/blogChannelModule">
	<channel>
		<title>Scripting urorbit web tools </title>
		<link>http://www.urorbit-tools.com/</link>
		<description>Urorbit web tools free and easy to use.</description>
		<language>ar</language>

		<blogChannel:blink>http://www.urorbit-tools.com/blog</blogChannel:blink>
		<copyright>Copyright 2008-2009 urorbit</copyright>
		<lastBuildDate>Wed, 26 Aug 2009 19:58:15 -0500</lastBuildDate>
		<docs>http://urorbit-tools.com/rss.php</docs>
<image><title>Urorbit News</title><url>http://www.urorbit-tools.com/files/image/160x70.png</url><link>http://www.urorbit-tools.com/</link></image>
		<generator>Radio saprinna v8.0.5</generator>

		<category domain="saprinna">1765</category>
		<ttl>40</ttl>

		<item>
			<title>أداة أنشئ نموذج تم تجهيزها</title>
			<link>http://www.urorbit-tools.com/?ids=9&id=2&n=45</link>

			<description><![CDATA[<p>قم بإنشاء نموذج إتصال أو نموذج للتوظيف أو نموذج إستطلاع رأي أيا كان النموذج فالأمر غاية في البساطة</p>]]></description>
			<guid>http://www.urorbit-tools.com/?ids=9&id=2&n=45</guid>
			<pubDate>Wednesday, 26 August 2009 13:7:8</pubDate>
			<category>Tools</category>
		</item>

		<item>

			<title>تحميل الملف الصوتي</title>
			<link>http://www.urorbit-tools.com/?ids=9&id=2&n=43</link>
			<description><![CDATA[<p>الآن بإمكانك رفع الملف الصوتي وتحميل الأداة إلى موقعك فورا ... </p>]]></description>
			<guid>http://www.urorbit-tools.com/?ids=9&id=2&n=43</guid>
			<pubDate>Wednesday, 19 August 2009 21:17:6</pubDate>

			<category>Tools</category>
		</item>
		  	</channel>

</rss>

نلاحظ أن الملف مقسوم إلى قسمين , الأول هو معلومات عامة عن القصاصات والموقع والقسم الثاني وهو العناصر التي تتكرر بناء على الأخبار أو الأحداث التي حصلت في الموقع ....

أعتقد أن القسم الأول ﻻ يحتاج إلى شرح فهو واضح, إسم الموقع وعنوانه ونبذه عنه والحقوق وصورة شعار الموقع , القسم الثاني وهو العناصر items يتكون من

العنوان

الرابط

نبذه عن الموضوع

تاريخ طرح الموضوع

المجموعه التي ينتمي إليها الموضوع

سنبدأ في كود البي أتش بي لصناعه هذا الملف

أوﻻ : ما الأقسام التي نريد عمل خلاصات لها ؟؟؟

مجلتنا ﻻ تحتوي على الكثير :) هنا نحتاج لعمل خلاصات فقط للصفحات حاليا , إذن نحتاج إلى عنوان الصفحة كعنوان للخلاصة ومقطع صغير من الصفحة تقريبا 300 حرف للنبذه عن هذه الصفحة , ورابط الصفحة وتاريخ إضافة الصفحة أو التعديل عليها مثلا والمجموعه ستكون ثابته وهي صفحات ...

قمنا بإضافة حقل جديد في قاعدة البيانات في جدول الصفحات وهو

ALTER TABLE `pages` ADD `last_update` VARCHAR( 20 ) NOT NULL ;

سيتم تخزين الوقت في هذا الحقل بصيغة

time();

وتم التعديل على صفحة

page.php in administrator folder

في عمليتي الإضافة والتعديل مايلي

:

      mysql_query("INSERT INTO pages (  `id` ,`page_name` ,`Page_cont`,`last_update`)VALUES (NULL , '$title_edit', '$FCKeditor1','".time()."');");

      mysql_query("UPDATE `pages` SET page_name = '$title_edit',Page_cont = '$FCKeditor1', last_update='".time()."' WHERE `id`=$id_edit");

الآن سنقوم بإنشاء صفحة بإسم

rss.php

ونكتب بها التالي :

<?
include "conf.php";

$date=date("r");
echo '<?xml version="1.0"  encoding="utf-8"?>';
?>

<!-- RSS generated by Radio UserLand v8.0.5 on 9/30/2002; 4:00:00 AM Pacific -->
<rss version="2.0" xmlns:blogChannel="http://backend.userland.com/blogChannelModule">
    <channel>
        <title>Blood Spot Site CMS</title>
        <link>http://www.bloodspotsite.com/</link>
        <description>مجلة تعليميه لكيفية عمل موقع على لغه البي أتش بي وماي سيكول .</description>
        <language>ar</language>

        <blogChannel:blink>http://www.bloodspotsite.com/</blogChannel:blink>
        <copyright>Copyright 2009 bloodspotsite</copyright>
        <lastBuildDate><?=$date?></lastBuildDate>
        <docs>http://bloodspotsite.com/rss.php</docs>
<image><title>bloodspotsite Pages</title><url>http://www.bloodspotsite.com/image/160x70.png</url><link>http://www.bloodspotsite.com/</link></image>
        <generator>Radio saprinna v8.0.5</generator>

        <category domain="saprinna">1765</category>
        <ttl>40</ttl>
<?

$result = mysql_query("Select * From pages where page_active=1  ORDER BY `last_update` DESC LIMIT 10");
while ($row = mysql_fetch_array($result, MYSQL_BOTH))
{
    $t = ($row['last_update']) ? getdate($row['last_update']) : getdate(time());
    $link = (sett_site('%smart path%')) ? "http://www.bloodspotsite.com/page/".urlencode($row['page_name'])."/" : "http://www.bloodspotsite.com/?id=";
    $link1 = (sett_site('%smart path%')) ? "/" : "";
            echo "
        <item>
            <title>".$row['page_name']."</title>
            <link>".$link.$row[0].$link1."</link>
            <description><![CDATA[".substr($row['Page_cont'],0,300)."]]></description>
            <guid>".$link.$row[0].$link1."</guid>
            <pubDate>".$t['weekday'].", ".$t['mday']." ".$t['month']." ".$t['year']." ".$t['hours'].":".$t['minutes'].":".$t['seconds']."</pubDate>
            <category>صفحات</category>
        </item>
            ";

}

?>

      </channel>
</rss>

الكود ليس بحاجة إلى ذلك الشرح

قمنا بالتأكد من كيفيه الرابط المستخدم ذكي أو عادي

وجعلنا جملة السيكول تأتي بآخر عشرة صفحات تم إنشاؤها أو تعديلها ويمكن عمل عدد الصفحات عباره عن إعدادات يمكن التحكم بها وكذلك الأمر بالنسبه للمعلومات العامه في ترويسة الخلاصه كإسم الموقع واللغة وغير ذلك

أتمنى أن يكون الدرس مفهوم وجيد :) شكرا لكم

لرؤية الخلاصات في مجلتنا إتبع الرابط

http://www.bloodspotsite.com/rss.php

تم تعديل هذه المشاركة بواسطة bastr3 في 27 أغسطس 2009 في 05:12

CMS Sfhati , Website Generator


نظام إدارة المحتوى صفحتي ... جربه الآن 


 


small-logo.png

#43

الدرس السابع من القسم الثاني من الدورة

بســم الله الـرحمــن الرحيــم

درسنا اليوم حول طريقة عمل بحث في المجله ...

عملية البحث تحتاج إلى خوارزميه معقدة خصوصا مع اللغة العربية , لذلك لن نتطرق للبحث بشكل كبير وإنما ستكون عملية بحث بسيطه ومفيده من الناحية العليمة

لنقم بدراسة سريعه لعميله البحث ..

*البحث يعتمد بنسبه كبيرة على جمل السيكول لذلك يهمنا معرفة أساسيات في هذه اللغة

*هناك كلمات صغيرة يجب إستبعادها عن البحث مثل حروف الجر وغيرها

*يمكن البحث عن أكثر من كلمة

*اللغة العربية مشاكل الترميز في البحث

*اللغة العربية الحروف المتشابه والتشكيل مثل أ إ ا ة ه هـ ًَُؤ

هذا باختصار ماسيواجه أي مبرمج في البدء في عملية برمجة نظام بحث لموقع صغير :(

لذلك يعتمد كثيرون على كلاسات جاهزه وكثيرا ماتكون غير داعمه للغه العربية

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

لنبدأ بسم الله ...

البحث سيكون داخل الصفحات فلا يوجد لدينا الآن سوى الصفحات :)

سنبحث داخل محتىوى الصفحة بالإضافة إلى عنوان الصفحة وسنقوم بسرد جميع الصفحات التي تحتوي على كلمات البحث مع روابط للصفحات

سنقوم بفتح الملف الرئيسي أقصد الصفحة الرئيسيه

index.php

وإضافة مجموعه أوامر وهي


توضع بعد بدء الجلسة

if($Search) include(dirname(__FILE__).'/search.php');
إذا تم عمل بحث نقوم بجلب صفحة البحث وتنفيذها
يوضع الكود في أي مكان تحت الكود السابق

نقوم بتعديل السطر التالي لنتمكن من مشاهدة نتائج البحث
$my_simple_tmplt = str_replace('%content%', $content.$echo_search_temp, $my_simple_tmplt);
لاحظ أضفنا متغير نتائج البحث بالإضافة إلى محتويات الصفحة أي في حالة طلب صفحة ستظهر محتويات الصفحة وفي حالة عمل بحث ستظهر محتويات البحث.
define('YOUCANINCLUDE', 'Yes'); //   لنتمكن من فتح الصفحات التي نقوم بعمل إنكلود لها

الآن سنقوم بإضافة قالب لنتائج البحث وسيكون بسيط جدا كما يلي



$search_temp='<A href="?id=%search_row0%">%search_row1%</A><br>';
$search_temp_smart='<A href="/page/%search_row_1%/%search_row0%/">%search_row1%</A><br>';

هذا سيتم تعديله على جميع القوالب التي لدينا لذلك لابد من وجود طريقة أفضل للقيام بتعديل القوالب يعني عمل نظام في لوحة التحكم للتحكم في كل قالب وكل جزئية منه

الآن نقوم بإنشاء صفحة جديده في الموقع في مجلد الورت يعني بجانب الصفحة الرئيسيه ونسميها

search.php

ونضع فيها الكود التالي :


if (!defined('YOUCANINCLUDE')) exit('No direct script access allowed');// عملية حماية للصفحة من الدخول إليها بشكل مباشر ممايعطي للهاكر فرصة أكبر
if ($Search) {
$echo_search_temp = "<br/> Search about $Search <br />";
$sx = explode(" ", $Search); //هنا نقوم بفصل الكلمات ووضعها في مصفوفه بناء على السبيس
if (!is_array($sx)) $sx[0] = $Search; // التأكد من المصفوفه إذا كان هناك أكثر كلمة وإلا فاجعل العنصر الأول من المصفوفه هو كلمة البحث
foreach ($sx as $k) {
if (strlen($k) > 3) { // إبعاد الكلمات التي تكون أقل من ثلاثة حروف من البحث وهي عادة ماتكون حروف الجر
$sql_SX1 .= " $sql_SX BINARY page_name like '%$k%' or BINARY Page_cont like '%$k%' "; // إنشاء جملة السيكول كلمة BINARY لحل مشكله الترميز العربي
$sql_SX = " or "; // هنا أنت مخير ففي حالة أو يتم جلب جميع الصفحات التي تحتوي على أي كلمة من كلمات البحث أما في حالة و يتم جلب الصفحات التي تحتوي على جميع كلمات البحث
}
}

$result = mysql_query("Select id,page_name From pages where page_active=1 and ( $sql_SX1 )"); // تم التأكد من أن عملية البحث لن تتم إﻻ على الصفحات التي تم تفعيلها والسماح لها بالظهور
while ($row = mysql_fetch_array($result, MYSQL_NUM)) {
$old_var = array("%search_row1%", "%search_row_1%", "%search_row0%");
$new_var = array($row[1], urlencode($row[1]), $row[0]);
$echo_search_temp .= str_replace($old_var, $new_var, $search_temp);
}
}
?>
<?

الآن لم يبقى سوى عمل نموذج بحث ووضعه في الموقع لنبدأ في عملية التجربة

النموذج كما يلي :


'<table cellpadding="0px" cellspacing="0px">
<tr>
<td style="border-style:solid none solid solid;border-color:#4B7B9F;border-width:1px;">
<input type="text" name="Search" style="width:100px; border:0px solid; height:17px; padding:0px 3px; position:relative;">
</td>
<td style="border-style:solid;border-color:#4B7B9F;border-width:1px;">
<input type="submit" value="" style="border-style: none; background: url(\'/template/searchbutton3.gif\') no-repeat; width: 24px; height: 20px;">
</td>
</tr>
</table>
</form>
<form method=post action='/'>".

أهم ما في هذا النموذج هو إسم الحقل النصي يجب أن يكون

Search

الآن من يريد التفكير في كيفية تطوير هذا النظام ... أقصد نظام البحث ؟

نريد فكرة عن كيفية عمل تعدد صفحات إذا كانت النتائج أكثر من عشره

كما نريد فكرة البحث في النتائج كما هو الحال في جووجل

وفكرة إستخدام القواعد مثل الناقص والزائد

وأي أفكار أخرى يمكنكم المشاركة فيها

CMS Sfhati , Website Generator


نظام إدارة المحتوى صفحتي ... جربه الآن 


 


small-logo.png

#44

الدرس الثامن من القسم الثاني من الدورة

السلام عليكــم ورحمـة الله وبركاتــه ،،

بعد طول إنقطاع نعود إليكم :) , في هذا الدرس سنتعرف على كيفيه إنشاء عداد للزوار

أولا نقوم بإنشاء جدول ليتم حفظ رقم الجلسه والوقت الذي بدأت فيه الجلسة وحالة الجلسه يعني مازالت قائمة أم إنتهت ...

 CREATE TABLE `blood_cms`.`guest_counter` (
`id` INT( 20 ) NOT NULL AUTO_INCREMENT PRIMARY KEY ,
`session_id` VARCHAR( 40 ) NOT NULL ,
`time` VARCHAR( 20 ) NOT NULL ,
`stat` INT( 1 ) NOT NULL DEFAULT '0'
) ENGINE = MYISAM

بعد ذلك نقوم بعمل مجلد بإسم

guest_counter

ونضع بداخلة ملف بإسم

index.php

ونكتب هذه الشيفرة داخل الملف الذي قمنا بإنشاءه

<?
# هنا متغير يحمل وقت هذه اللحظه
$tm = time();
# هنا وقت بعد نصف ساعه من الآن ويمكنك تغييرها فعدد الدقائق هي الثلاثين
$timeout = $tm - (30*60);
# هنا متغير يحمل رقم الجلسة
$Session_id=session_id();
mysql_query("Update `guest_counter` set stat=1, session_id='' WHERE time < $timeout");
# في السطر السابق جمله سيكول تعمل على جعل المتغير stat يصبح واحد للجلسات التي مضى عليها أكثر من نصف ساعه ويتم إفراغ قيمة رقم الجلسه

# عمليه التأكد من وجود هذه الجلسه حاليا في حال وجودها لن يتم عمل شيء , غير ذلك يتم تخزين الجلسه
$insert_or_not = mysql_num_rows(mysql_query("SELECT * FROM `guest_counter` where stat=0 and session_id='$Session_id' "));
echo $insert_or_not;
if(!$insert_or_not){
# هنا يتم تعبئة الحقول
	mysql_query("INSERT INTO `guest_counter` (`session_id`	,`stat` ,`time`)
							   VALUES ('$Session_id', 0 , '$tm');");
}

# لعرض عدد المتواجدين الآن من الأعضاء
$count = mysql_num_rows(mysql_query("SELECT * FROM `guest_counter` where stat=0 "));
# عدد الذين تواجدوا اليوم من الأعضاء
$count_day = mysql_num_rows(mysql_query("SELECT * FROM `guest_counter` where  time> '".strtotime(date("d-m-Y"))."'"));
# عدد الذين تواجدوا
$count_all = mysql_num_rows(mysql_query("SELECT * FROM `guest_counter`"));
$guest_counter="Guest online : $count <br />";
$guest_counter.="Number of visitors today : $count_day <br />";
$guest_counter.="All visitors : $count_all";
#نلاحظ أننا قمنا بوضع النتائج في متغير يجمل نفس إسم المجلد الذي قمنا بإنشاؤه 
?>

في هذا الدرس سنقوم بعمل عداد الزوار هذا كإضافة لهذه المجله لذلك سنقوم بإنشاء مجلد بإسم

plugin

داخل المجلد الرئيسي للموقع وسيتم وضع الإضافات كمجلدات داخل هذا المجلد , في البدايه سيكون الأمر معقد خصوصا أن هذا الأمر لم أقرأ عنه وهذه الأفكار مني يعني بدون رجوع لكيفيه عمل الإضافات , فإذا كان ما أشير إليه فيه خطأ فأفيدوني , ولكن ليس من الخطأ إبتكار امور ربما تكون بذلك أفضل من غيرها ..

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

في صفحة ال

index.php

للمجله نكتب هذه الشيفرة في الأعلى بعد إستدعاء ملف القوالب

/***************include plugin*****************/
$dir = "plugin/";
	if ($dh = opendir($dir)) {
		while (($file = readdir($dh)) !== false) {
		  if($file=='.' || $file=='..' || filetype($dir . $file)!='dir'){}else{
					 include($dir.$file."/index.php");
					 $plugin[]=$file;
			}
		}
		closedir($dh);
	}

ماذا فعلنا في الكود السابق ؟

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

الآن سنقوم بعرض المحتوى الخاص بالإضافه داخل الموقع .. كيف سيتم ذلك؟

سنقوم بتبسيط الأمور , إسم الإضافة نضع قبله وبعدة علامة بالمئة ونضعها في المكان الذي ستظهر به محتوى الإضافه وهو عدد الزوار في حالتنا هذه

سيصبح كود عرض أي إضافه كما يلي :

%name_plugin%

إذن إضافتنا سيكون كود عرضها كما يلي :

%guest_counter%

جميل جدا ... نقوم بفتح مجلد القوالب ووضع هذه الشيفره في المكان المخصص لعرض عدد الزوار فيه

بقي آخر شيء وهو كيفيه إستبدال الشيفره بالمتغير الحقيقي !!

نقوم بالرجوع إلى الصفحة الرئيسيه لمجلتنا

index.php

ونضع هذا الكود في آخر الصفحة في آخر الإعدادات

foreach($plugin as $temp_plugin){
   $my_simple_tmplt = str_replace('%'.$temp_plugin.'%', $$temp_plugin , $my_simple_tmplt);
}

هل فهمتم الكود السابق ؟

عمليه عرض للمصفوفه التي نتجت من مجلد الإضافات تقوم بوضع إسم الإضافة داخل عالامتي بالمئة ومن ثم تستبدل الشيفرة الناتجه بمتغير إسم الإضافه الذي قمنا بوضع نتائج الإضافة فيه

أرجو أن يكون الدرس مفيدا وأي أسئله نحن في الخدمة ويمكنك عمل إضافات ومشاركتنا بها

بالتوفيق وسيتم عمل ملف لآخر نسخة من هذه المجله قريبا بإذن الله

CMS Sfhati , Website Generator


نظام إدارة المحتوى صفحتي ... جربه الآن 


 


small-logo.png

#45

الدرس التاسع من القسم الثاني من الدورة

في هذا الدرس سنقوم بعمل نسخة من قاعدة البيانات وإسترجاعها

في البداية أود أن أشرح ماأعانيه في عمليات النسخ والإسترجاع

أول ماستواجهه من هذه العمليه هو ترميز اللغه العربيه وتلخبط الأحرف والصفحات بعد عمليه الإسترجاع

كما ستواجه مشكله في متى أخذت هذه النسخه وأي نسخة هي التي تحتوي على ما أريد

المشكله الثالثه كم حجم النسخة ولماذا أحتاج إلى أخذ نسخة من جدول الملفات الذي يبلغ حجمه واحد جيجا

لماذا لا أتمكن من أخذ نسخة من جدول الأعضاء فقط

هل يمكن أن أحمي النسخة بكلمة سر لكي لايتم استخدامها إلا من قبل حامل هذا الرقم السري ؟؟؟

هذا ما عانيته في كل مرة آخذ فيها نسخة إحتايطيه من قاعدة البيانات وبعد عدة دراسات وصلت إلى هذا الكود وهو خلاصة ما أعرفه حول النسخ والإسترجاع

*ربما بعض الأوامر تحتاج إلى نظام لينكس يعني لن تعمل على اللوكال إذا كان النظام الذي تعمل عليه هو الويندوز وأنا أنصح باستخدام نظام لينكس والتعلم على أوامرة فيمكنك استخدام أوامر اللينكس في البي أتش بي بكل سهوله

بسم الله نبدأ

أولا نقوم بإنشاء ملف داخل مجلد مدير الموقع

/administrator/backup.php

بعدها سنقوم بفتح الملف ونكتب فيه

<?
if (!defined('YOUCAN')) exit('No direct script access allowed');
#هذا السطر كما علمنا لتفادي المخربين 

$result = mysql_query("show tables");
#جمله سيكول لعرض أسماء الجداول من قاعدة البيانات 
while ($row = mysql_fetch_array($result, MYSQL_NUM)) {
	$Tables .= ' <input id="'.$row[0].'" type="checkbox" name="t['.$row[0].']" value="'.$row[0].'" /><label for="'.$row[0].'"> '.$row[0].'</label><br />';
#هنا نقوم بوضع إسم كل جدول داخل شيك بوكس وبإسم مصفوفه t 
}
# الآن نأتي لعملية عرض خيارات النسخ والإسترجاع وتفريغ قاعدة البيانات 
$admin_page_text .= '
<form method="post" action="?p='.$p.'">
 <div class="box" style="width: 700px;">
  Backup:
  <br />
  '.$Tables.'
  <br /> Encription passowrd  <input name=password type="password" />
  <button type="submit" name="backup" value="backup">Backup Now!</button>
 </div>
</form>';

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

عند إرسال قيم هذا النموذج سيتم إستقبالها من نفس الصفحة لذلك نكتب فوق هذا النموذج الشيفرة التاليه لمعالجة البيانات القادمة من النموذج السابق

if ($backup) { #إذا تم إرسال البيانات 
	$time = time(); #أخذ وقت هذه اللحظه ليتم تسمة الملف بهذا الوقت وبذلك نتمكن من معرفة متى تم أخذ هذه النسخة 
	if (is_array($_POST[t])) { #نتأكد من هذا المتغير إذا كان مصفوفه يعني تم إختيار جدول على الأقل 
		foreach ($_POST[t] as $tbl) #استعراض المصفوفه 
			$write_tabels .= " ".htmlspecialchars(strip_tags(addslashes($tbl)))." "; # تخزين أسماء الجداول  ليتم استخدامها في عملية النسخ الاحتياطي

		$restorfilesql = $root_link_site."backup/SQL_CODE.sql"; # المكان الذي سيتم وضع النسخه فيه وللعلم المتغير روت لينك سايت تم تعريفه في ملف الكونف 
		$restoreCommand = "mysqldump -u{$db_user} -p{$db_pass} {$db_name} $write_tabels > {$restorfilesql}";
		 # تجهيز أمر النسخ
		exec($restoreCommand);
# تنفيذ أمر النسخ 
		exec("zip -j -P {$password} {$restorfilesql}_".$time.".zip $restorfilesql"); # ضغط الملف الناتج ووضع كلمة السر الذي إخترتها لهذا الملف المضغوط 
		unlink($restorfilesql); # حذف ملف السيكول بعد ضغطه 
		$suc_msg = "Backup Done!"; # إظهار رساله تفيد بأن عمليه النسخ تمت بنجاح 

		$admin_page_text .= "<br/><a href='/backup/SQL_CODE.sql_".$time.".zip'>Download backup file now</a>"; # اظهار رابط للملف المظغوط 
	}
}

الآن نأتي لعمليه الإسترجاع

<form method="post" enctype="multipart/form-data" action="?p='.$p.'">
  <div class="box" style="width: 700px;">
   Restore:
   <br />
	Deincryption passowrd  <input name=password type="password" />
	<input name="F1" type="file" />
   <button type="submit" name="restore" value="restore">Restore Now!</button>
  </div>
 </form>

بنظره سريعه على النموذج السابق نرى أنه يحتوي على ملف استعراض لاختيار الملف المضغوط الذي حصلنا عليه في عمليه النسخ السابقه

كما أنه يحتوي على حقل للرقم السري لكي نضع فيه الرقم السري الذي إخترناه لهذا الملف

الآن عمليه استقبال البيانات تكون فوق شيفرة النموذج السابق لكي تظهر النتائج فوق النموذج

وشيفرة تنفيذ الإسترجاع هي

if ($restore) { # تم الضغط على استرجاع 
	$restorfile = "backup/SQL_CODE.sql"; # اسم الملف الذي سنستخدمه 
	if (is_uploaded_file($F1)) { # إذا تم رفع الملف بنجاح 
		move_uploaded_file($F1, $restorfile.".zip");  #نقل الملف المرفوع وتسميته 
	exec("unzip -P {$password} ".$root_link_site.$restorfile.".zip -d ".$root_link_site."backup/"); #فك ضغط الملف المرفوع باستخدام الرقم السري الذي قمت بارساله داخل مجلد النسخ الاحتياطي 
	$restorfilesql = $root_link_site.$restorfile; #اخذ امتداد الملف الناتج 
	$restoreCommand = "mysql -u{$db_user} -p{$db_pass} {$db_name}  < {$restorfilesql}"; # تجهيز أمر الإسترجاع 
	exec($restoreCommand); # تنفيذ أمر الاسترجاع 
	@unlink($restorfilesql); # حذف ملف السيكول 
	@unlink($restorfilesql.".zip"); # حذف الملف المضغوط الذي تم رفعه 
	$suc_msg = "Restore Done!"; # إظهار رساله تفيذ بأن العمليه تمت بنجاح 
	}
}

نأتي الآن لعميله تفريع محتويات جدول معين

النموذج شبيه بنموذج عملية أخذ نسخه من الجداول

   <form method="post" enctype="multipart/form-data" action="?p='.$p.'">
 <div class="box" style="width: 700px;">
  Erase Data:
  <br />
'.$Tables.'
  <button type="submit" name="Erase" value="Erase">Erase Now!</button>
 </div>

</form>

الأن الشيفره الخاصه بتنفيذ عمليه تفريغ محتويات الجداول

if ($Erase) {# إذا تم الضغط على تفريغ الجداول 
	if (is_array($_POST[t])) { # إذا كانت مصفوفه يعني تم إختيار جدول واحد على الأقل كما شرحنا سابقا 
		foreach ($_POST[t] as $tbl) 
			mysql_query("TRUNCATE TABLE ".htmlspecialchars(strip_tags(addslashes($tbl))));
		$suc_msg = "Erase Done!";
	}
}

هذا الأمر

TRUNCATE TABLE

معروف في السيكول لعمليه تفريغ الجدول

بهذا يكون الدرس إنتهى وأرجو أن تكونوا قد استفدتم منه

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

CMS Sfhati , Website Generator


نظام إدارة المحتوى صفحتي ... جربه الآن 


 


small-logo.png

#46

الدرس العاشر من القسم الثاني من الدورة

تعلما في درس سابق كيف نقوم بعمل إضافة واستخدامها في الموقع , في هذا الدرس سنتعلم بإذن الله كيف نتحكم بالإضافة من خلال لوحة التحكم

سنحاول جعل الإضافة في مجلد واحد كما إتفقنا لذلك سيكون بداخل المجلد ملفات بعضها لإظهار النتائج داخل الموقع مثل ملف الإنديكس والبعض الآخر للتحكم بالإضافة وتستخدم في لوحة التحكم

بسم الله نبدأ

سنبدأ بإنشاء ملف بإسم

control.php

داخل مجلد الإضافة وهو كما إتفقنا في هذا الطريق

path : /plugin/guest_counter/control.php

نقوم الآن بكتابة الشيفرة وكأنها لآي صفحة داخل لوحة التحكم

#هذا السطر تكلمنا عنه وهو لحمايه الصفحات الفرعيه من الإختراق 
if (!defined('YOUCAN'))
	exit('No direct script access allowed');

نريد عمل تحديد لوقت العداد يعني كل 30 دقيقه يتم إحتساب زائر أو كل 15 دقيقه أو غير ذلك

كما نريد تحديد من أي رقم سيتم البدء في عداد الزوار

مثل هذه الإعدادات يمكن تخزينها في جدول الإعدادات ونريد التحكم فيها من صفحة التحكم بإضافة الزوار

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

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

الصفحة :

/conf.php

#هذا السطر لتعريف صفحة جديده داخل لوحة التحكم وقد تكلمنا سابقا عنه
$file_include['plugin']='Plugin`s';

صفحة

/administrator/plugin.php

<?
if (!defined('YOUCAN')) exit('No direct script access allowed');

/***************include plugin*****************/
$admin_page_text.= '<div class="buttonwrapper">';
$dir = "../plugin/";
	if ($dh = opendir($dir)) {
		while (($file = readdir($dh)) !== false) {
		  if($file!='.' && $file!='..' && filetype($dir . $file)=='dir'){
			  $admin_page_text.= '
		  <a class="ovalbutton" href="?p='.$p.'&ctrl_plugin='.$file.'"><span>'.$file.'</span></a> ';
		  $plugin_include[]=$file;
			}
		}
		closedir($dh);
	}
$admin_page_text.= '</div>';

if($ctrl_plugin)
  foreach($plugin_include as $ctrl_plugin_inc) if($ctrl_plugin_inc==$ctrl_plugin) include($dir.$ctrl_plugin_inc."/control.php");
?>

مفهوم الكود في الصفحة السابقة فقط عرض روابط لجميع المجلدات داخل مجلد الإضافات وإذا تم الضغط على اي رابط سيتم عمل تضمين للصفحة الخاصه بالتحكم الخاصه بالإضافة التي تم الضغط على رابطها

الآن نعود إلى صفحة التحكم الخاصه بإضافتنا عداد الزوار

/plugin/guest_counter/control.php

 #هذا السطر تكلمنا عنه وهو لحمايه الصفحات الفرعيه من الإختراق 
 if (!defined('YOUCAN'))
	 exit('No direct script access allowed');

# هنا نكتب اوامر التحكم التي نريدها

وهكذا نكون قد إنتهينا من عمليه اضافة تحكم للإضافات ... أعتذر عن عمل أوامر التحكم لكي يتم تجربتها كامله من قبلكم ولكن النت عندي ميت ولم أستطع تجربة معظم الشيفرات التي أضفتها للأسف

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

بارك الله لي ولك وجزاكم الله خير

تم تعديل هذه المشاركة بواسطة bastr3 في 10 أكتوبر 2009 في 02:21

CMS Sfhati , Website Generator


نظام إدارة المحتوى صفحتي ... جربه الآن 


 


small-logo.png

#47

درس تقنية تغيير لون تصميم القالب على هذا الرابط

http://www.bloodspotsite.com/?id=63

إعلان

النسخة رقم 1.03 من هذه المجلة ستحتوي على جميع ماتم شرحة بالإضافة إلى بعض التعديلات التي لم يتم شرحها والخاصه بالثغرات والمشاكل كما تحتوي على آخر نسخة من المحرر الشهير

FCKeditor

كنت أود تظمينها مع نظام محتوى أقوم ببرمجته وقد قلت أنني سأشرحة بدرس استبدال صفحة الصفحات ولكن للأسف لم أتمكن ففكرته جميله ولكن عملها معقد

سأقوم بشرحها للفائدة ولمن لديه القدرة في المشاركه فلا بأس

الفكره هي عمل نظام يأخدذ محتوى لآي فكرة تخطر على بال المستخدم

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

مثل هذا النظام من المحتوى سيكون معقد ويحتاج إلى عمل

لنفرض أنك تريد عمل أيضا لنفس الموقع نظام المنتجات كل منتج يتفرع منه أقسام وكل قسم سيظهر في الموقع بشكل مختلف عن القسم الآخر

تخيل عدد معين من هذه الأنظمه للمحتوى تريد عمل بحث متقدم لكل محتوى وقصاصات سيكون الأمر مهلك ويأخذ وقت كبير

من خلال الفكرة التي أعمل عليها سيصبح هذا العمل أمر هين جدا وسيكون إيجابيه لهذه المجله بإذن الله

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

عند تنزيل النسخة 1.03 من هذه المجله سترى بانر مثبت في الموقع وسيتم إغلاق نظام تجربة لوحة التحكم إلى حين تجهيز موقع

www.urorbit.com

والذي سيمنح كل من يريد موقع تجريبي يحتوي على هذه المجله قابل لجعله موقع حر بنطاق حر

شكرا لكم

بعض الصور لدرس اليوم لتوضيح الفكرة

p1.png

p2.png

p3.png

p4.png

p5.png

تم تعديل هذه المشاركة بواسطة bastr3 في 9 نوفمبر 2009 في 07:37

CMS Sfhati , Website Generator


نظام إدارة المحتوى صفحتي ... جربه الآن 


 


small-logo.png

#48

تم بحمد الله رفع المجلة على موقع سورس فروج sourceforge.net

لكي لا أطيل عليكم في تجربة آخر الدروس, تم رفع النسخة رقم 1.03 بعد التعديل على بعض الأمور فيها مثل مدير الصفحات أصبح أكثر جمالا :)

القصاصات والبحث أصبحا إضافات .

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

CMS Sfhati , Website Generator


نظام إدارة المحتوى صفحتي ... جربه الآن 


 


small-logo.png

#49

النسخة القادمة من هذه المجله ستصدر قريبا جدا

مميزات النسخة القادمة ...

تم تطوير نظام الصفحات بحيث يمكن تحديد مكان إظهار الصفحة وماهو القالب الخاص بهذه الصفحة بالإضافة إلى وضع نبذه عن الصفحة وورابط إذا أردت أن تنقلك الصفحة إلى صفحة أخرى

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

post-21336-12597535035101_thumb.png

post-21336-12597535189847_thumb.png

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

وفي صفحة القوالب تقوم بتعبئة كل قالب ومايحتويه

سيكون هناك شرح مطول للنسخة القامه عن كيفيه الإستفادة من هذه المجله في مجال العمل بحيث تتمكن من تصميم مواقع وبيعها أو تصميم موقعك الخاص بأسرع وقت

ومازال التطوير جاري لنصل إلى مجله للمطورين تمكنهم من بيع مواقع كامله وكما يريد العميل

أنتظرونا ...

CMS Sfhati , Website Generator


نظام إدارة المحتوى صفحتي ... جربه الآن 


 


small-logo.png

#50

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

*ملاحظه : المجله التي أتحدث عنها هي النسخه القادمة وليست النسخة الحاليه (1.03), لذلك التصميم سيكون بناء على مابالنسخة القادمه وبعد إنتهاء الشرح سأقوم برفع النسخة 1.04 إن شاء الله

نبدأ أولا في تصميم الموقع بشكل out line يعني بدون صور وبدون أي جرافيكس

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

قمت بعمل قالب وهو عباره عن صفحة html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
  <title></title>
</head>

<body>
<style>
body{
  margin: 0;
  padding: 0;
  height: 100%;
}

#main{
width: 994px;
background: #FFF;
margin: 0 auto ;
border: 1px solid #333333;
font-family:arial;
font-size:small;
}

#header{
  background: #CCCCCC;
  height: 180px;
}
#up_button{
}
#up_button ul{
    list-style:none;

}
#up_button ul li{
    border-bottom:1px gray dotted;
    float:left;
    padding:5px;
    margin: 0px;
}
#up_button ul li a{
  color:#FF0000;
  text-decoration: none;
}
#content{
  background: #999999;
  height: 100%;
  padding:5px;
}
#footer{
  background: #666666;
  height: 200px;
  padding:15px;
}
#footer ul{
    list-style:none;
    width:100px;
}
#footer ul li{
    border-bottom:1px gray dotted;

}
#footer ul li a{
  color:#333333;
  text-decoration: none;
}
#logo{
  background: #CC3300;
  position: relative;
  left: 40px;
  top:15px;
    width:100px;
  height: 100px;
}

#search{
  width:300px;
  height: 50px;
  position:relative;
  left: 740px;
  top:15px;
}


.box{
    border:1px gray dashed;
    margin:10px;
    padding:10px;
}
.clear{
    clear:both;
}
#main_header_menu{
  background: red;
  height: 30px;
  padding-right: 15px;
}
#main_header_menu ul{
    list-style:none;
    width:100%;
}
#main_header_menu ul li{
    border-bottom:1px gray dotted;
    float:left;
    padding:5px;
}
#main_header_menu ul li a{
  color:#FFFFFF;
  text-decoration: none;
}
#right_col{
  width: auto;
  float: right;
}
#left_col{
  width: auto;
  float: left;
}


</style>

<div id="main">
<div id="header">
<div id="up_button">
<div id="right_col">
    <ul>
        <li><a href="#">button1</a></li>
        <li><a href="#">button1</a></li>
        <li><a href="#">button1</a></li>
    </ul>
</div>

<div id="left_col">
<div id="logo"></div>
</div>
</div>
    <div class="clear"></div>



<div id="search">
	<form name="searchForm" action="/">
			<input class="searchBox" value="Search entire site" name="Search">
			<input value="Search" type="submit">
	</form>
</div>
<div id="main_header_menu">
    <ul>
        <li><a href="#">button1</a></li>
        <li><a href="#">button1</a></li>
        <li><a href="#">button1</a></li>
    </ul>
</div>




</div>
    <div class="clear"></div>
<div id="content">
    <div class="box">box1</div>
    <div class="box left_side" style="width:200px;float:left;">box1 left</div>
    <div class="box right_side" style="width:700px;float:right;">box1 right</div>
    <div class="clear"></div>

</div>
<div id="footer">footer
    <ul>
        <li><a href="#">button1</a></li>
        <li><a href="#">button1</a></li>
        <li><a href="#">button1</a></li>
    </ul>
</div>
</div>

</body>
</html>

وضعت الشيفرة مع الستايل , صوره لعرض الصفحةpost-21336-12607595907857_thumb.jpg

هذا قالب لموقع افتراضي , سأقوم في المشاركة القادمة بتوضيح معالم الموقع أكثر وأختار فكرة لكيفيه ظهور كل قسم بإذن الله

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

أي أراء أو استفسارات أو إقتراحات ... نحن هنا أو راسلوني على

bassam@saprinna.com

CMS Sfhati , Website Generator


نظام إدارة المحتوى صفحتي ... جربه الآن 


 


small-logo.png

مواضيع مشابهة