السلام عليكم ورحمة الله وبركاته
محرك القوالب يستخدم غالبا في فصل الكود البرمجي عن أكواد التصميم .
وبما أن محركات القوالب التي تعتمد على قوالب html او اي امتداد آخر كثيره جدا ومن اشهرها :
محرك القوالب تبع ضيف العتيبي وهو القالب السهل .
محرك القوالب سمارتي .
ولكن لم اشاهد محرك قوالب عن طريق قواعد البيانات !!
يعني محرك قوالب شبيه باللي مستخدم في منتديات vb .
وقد فكرت قليلا بفضل الله تعالى تم تطبيق فكره بسيطه واصبحت محرك قوالب بسيط يعتمد على قواعد البيانات .
إليكم الشرح :
أولا ننشي جدول في قاعدة البيانات بإسم style مثلا ونضيف فيها حقول كالتالي :
كود:
`idstyle` int(10) NOT NULL auto_increment,
رقم تسلسل خاص بكل استايل .
كود:
`name` varchar(100) NOT NULL default '',
إسم الاستايل .
رأس الصفحة .
اكواد استايل css .
كود الجسم .
تصميم الهيدر .
تصميم الفوتر .
تصميم إطار المحتويات .
تصميم المينو أو القائمه .
طبعا كل حقل يحمل الخاصيه تبعه .
==========
واليكم بكود جدول قاعدة البيانات كاملا :
كود:
CREATE TABLE `style` (
`idstyle` int(10) NOT NULL auto_increment,
`name` varchar(100) NOT NULL default '',
`htmldir` text,
`css` text,
`body` text,
`header` text,
`footer` text,
`frame` text,
`menu` text,
PRIMARY KEY (`idstyle`)
);
=========
والآن كيف نقوم بتصميم استايل في قاعدة البيانات :
أولا يجب ان تعمل قورم لإدخال البيانات في الحقول الخاصه بها جدول القاعدة :
الحقل name نضع فيه مثلا :
استايل تجريبي .
الحقل htmldir وهو خاص برأس الصفحة ونضع به الكود التالي :
كود:
<html dir="rtl">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1256">
<title>{title}</title>
</head>
الحقل css وهو خاص بالأنماط ونضع به الكود التالي :
كود:
<style>
<!--
body {
scrollbar-base-color: #CC3300;
scrollbar-arrow-color: #FFEFDF;
scrollbar-track-color: #FFEFDF;
font-family: Tahoma; color: #CC6600;
font-size: 12px }
p {
font-family: Tahoma;
font-size: 12px;
color: #CC3300 }
button { border: 1px solid #CC6600 }
input {
font-family: Tahoma;
font-size: 12px;
color: #CC3300;
border: 1px solid #CC6600;
background-color: #FFEFDF }
textarea {
font-family: Tahoma;
font-size: 12px;
color: #CC3300;
border: 1px solid #CC6600;
background-color: #FFEFDF }
A:link {
FONT-WEIGHT: normal;
FONT-SIZE: 12px;
BACKGROUND: ;
COLOR: #CC6600;
TEXT-DECORATION: none ;
FONT-FAMILY: tahoma
}
A:active {
FONT-WEIGHT: normal;
FONT-SIZE: 12px;
BACKGROUND: none transparent scroll repeat 0% 0%;
COLOR: #CC6600;
FONT-FAMILY: tahoma;
TEXT-DECORATION: underline
}
A:visited {
FONT-WEIGHT: normal;
FONT-SIZE: 12px;
BACKGROUND: none transparent scroll repeat 0% 0%;
COLOR: #CC6600;
FONT-FAMILY: tahoma;
TEXT-DECORATION: none
}
A:hover {
FONT-WEIGHT: normal;
FONT-SIZE: 12px;
BACKGROUND: none transparent scroll repeat 0% 0%;
COLOR: #CC3300;
FONT-FAMILY: tahoma;
TEXT-DECORATION: underline
}
-->
</style>
والحقل body وهو خاص بكود الجسم من هوامش ولون الخلفيه وخلافه ونضع به الكود التالي :
كود:
<body topmargin="10" leftmargin="10" bgcolor="#ffffff">
وأما الحقل header والحقل footer فيجب عليك أولا تركيب التصميم الخاص بك من صور وجداول وترتيبات أخرى ثم تقسّم التصميم إلى جزئين بحيث الجزء العلوي يوضع بالـ header والجزء السفلي يوضع بالـ footer وسنعطي مثال كامل :
هذا الكود فلنفرض انه تصميمنا الذي قمنا بعمله :
كود:
<div align="center">
<center>
<table border="1" cellpadding="2" style="border-collapse: collapse; border-style: double; border-width: 3" bordercolor="#000000" width="90%" id="AutoNumber1" dir="rtl">
<tr>
<td width="100%">xxxxxxxxxxxxx</td>
</tr>
</table>
</center>
</div>
سنقوم بتجزئة الكود الى جزئين فقط !!
ما قبل الحروف xxxxxxxxxxxxx فهو يعتبر الجزء العلوي أي الـ header ومابعد الحروف xxxxxxxxxxxxx يعتبر الجزء السفلي أي الـ footer ... والآن هيا نقسم الكود ونضعه بمكانه الصحيح :
الحقل header نضع به الكود التالي وهو الجزء العلوي :
كود:
<div align="center">
<center>
<table border="1" cellpadding="2" style="border-collapse: collapse; border-style: double; border-width: 3" bordercolor="#000000" width="90%" id="AutoNumber1" dir="rtl">
<tr>
<td width="100%">
والحقل footer نضع به الكود التالي وهو الجزء السفلي :
كود:
</td>
</tr>
</table>
</center>
</div>
والحقل frame خاص بتصميم إطار خاص بالمحتويات ونضع به الكود التالي :
كود:
<table border="1" style="border-collapse: collapse" bordercolor="#111111" width="100%" id="AutoNumber3" cellspacing="3">
<tr>
<td width="100%">
<p align="center">{frame_title}</p></td>
</tr>
<tr>
<td width="100%">{frame_rows}</td>
</tr>
</table>
لاحظ وجود المتغيرات {frame_title} وسوف يتم استبداله بعنوان الموضوع .. والمتغير {frame_rows} سوف يتم استبداله بالمحتوى .
والحقل menu خاص بتصميم القائمه ونضع به الكود التالي :
كود:
<div align="center">
<center>
<table border="1" cellpadding="2" style="border-collapse: collapse" bordercolor="#111111" width="150" id="AutoNumber2" dir="rtl">
<tr>
<td width="100%"><p align="center">{menu_title}</td>
</tr>
<tr>
<td width="100%">{menu_rows}</td>
</tr>
</table>
</center>
</div>
لاحظ المتغير {menu_title} والمتغير {menu_rows} فسيتم استبدالها بنصوص تلقائيا ... سيتم التحدث أكثر في ما يلي ان شاء الله .
=========
والآن نأتي لطريقة عرض القوالب وطريقة عرض المحتويات بداخلها :
أولا نكتب متغير خاص برقم id الاستايل الذي سوف نستخدمه في تصميمنا .
كود PHP:
//### id number for defult style ###//
$defultstyle = 1;
ثم نقوم بتجميع أكواد رأس الصفحة مع بعضها .. وهذه الداله قمت بعملها لهذا الغرض :
كود PHP:
//### function header ###//
function tpl_header($name_title)
{
global $defultstyle;
$sql = @mysql_query("SELECT idstyle,name,htmldir,css,body,header FROM style where idstyle=$defultstyle") or die ("Query failed");
$tpl= @mysql_fetch_array($sql);
$tpl[name] = stripslashes($tpl[name]);
$tpl[htmldir] = stripslashes($tpl[htmldir]);
$tpl[htmldir] = eregi_replace("{title}","$name_title",$tpl[htmldir]);
$tpl[css] = stripslashes($tpl[css]);
$tpl[body] = stripslashes($tpl[body]);
$tpl[header] = stripslashes($tpl[header]);
$print_templates = $tpl[htmldir].$tpl[css].$tpl[body].$tpl[header];
echo $print_templates;
echo "<br>";
@mysql_free_result($sql);
}
لاحظ أنه يوجد بارمتر واحد في الداله وهو $name_title وهو متغير خاص بإسم الصفحه بحيث يتغير بتغير الصفحه التي انت بداخلها .
ثم نقوم بعرض كود الهيدر وهو كالتالي :
كود PHP:
//### function footer ###//
function tpl_footer()
{
global $defultstyle;
$sql = @mysql_query("SELECT idstyle,footer FROM style where idstyle=$defultstyle") or die ("Query failed");
$tpl = @mysql_fetch_array($sql);
$tpl[footer] = stripslashes($tpl[footer]);
echo "<br>";
echo $tpl[footer];
@mysql_free_result($sql);
}
ثم نأتي كود عرض المحتوى أو الاطارات :
كود PHP:
//### function frame ###//
function tpl_frame($frame_title,$frame_rows)
{
global $defultstyle;
$sql = @mysql_query("SELECT idstyle,frame FROM style where idstyle=$defultstyle") or die ("Query failed");
$tpl= @mysql_fetch_array($sql);
$tpl[frame] = stripslashes($tpl[frame]);
$tpl[frame] = eregi_replace("{frame_title}","$frame_title",$tpl[frame]);
$tpl[frame] = eregi_replace("{frame_rows}","$frame_rows",$tpl[frame]);
echo $tpl[frame];
@mysql_free_result($sql);
}
يوجد بالداله 2 بارمتر وهما $frame_title لعنوان المحتوى و $frame_rows لموضوع المحتوى .
وأيضا كود عرض المينو أو القائمه كالتالي :
كود PHP:
//### function menu ###//
function tpl_menu($menu_title,$menu_rows)
{
global $defultstyle;
$sql = @mysql_query("SELECT idstyle,menu FROM style where idstyle=$defultstyle") or die ("Query failed");
$tpl= @mysql_fetch_array($sql);
$tpl[menu] = stripslashes($tpl[menu]);
$tpl[menu] = eregi_replace("{menu_title}","$menu_title",$tpl[menu]);
$tpl[menu] = eregi_replace("{menu_rows}","$menu_rows",$tpl[menu]);
echo $tpl[menu];
@mysql_free_result($sql);
}
ايضا يوجد 2 بارمتر وهما $menu_title لعنوان القائمه و $menu_rows لمحتويات القائمه .
ولاحظوا ان هناك متغير مشترك في جميع الدوال وهو $defultstyle تم التصريح له في جميع الدوال وهو خاص برقم id الاستايل الذي سيتم عرضه في الصفحات .
وهكذا انتيهينا من تضبيط جميع قوالب الاستايل .
وإليكم كود الدوال كاملا :
كود PHP:
//### id number for defult style ###//
$defultstyle = 1;
//### function header ###//
function tpl_header($name_title)
{
global $defultstyle;
$sql = @mysql_query("SELECT idstyle,name,htmldir,css,body,header FROM style where idstyle=$defultstyle") or die ("Query failed");
$tpl= @mysql_fetch_array($sql);
$tpl[name] = stripslashes($tpl[name]);
$tpl[htmldir] = stripslashes($tpl[htmldir]);
$tpl[htmldir] = eregi_replace("{title}","$name_title",$tpl[htmldir]);
$tpl[css] = stripslashes($tpl[css]);
$tpl[body] = stripslashes($tpl[body]);
$tpl[header] = stripslashes($tpl[header]);
$print_templates = $tpl[htmldir].$tpl[css].$tpl[body].$tpl[header];
echo $print_templates;
echo "<br>";
@mysql_free_result($sql);
}
//### function footer ###//
function tpl_footer()
{
global $defultstyle;
$sql = @mysql_query("SELECT idstyle,footer FROM style where idstyle=$defultstyle") or die ("Query failed");
$tpl = @mysql_fetch_array($sql);
$tpl[footer] = stripslashes($tpl[footer]);
echo "<br>";
echo $tpl[footer];
@mysql_free_result($sql);
}
//### function frame ###//
function tpl_frame($frame_title,$frame_rows)
{
global $defultstyle;
$sql = @mysql_query("SELECT idstyle,frame FROM style where idstyle=$defultstyle") or die ("Query failed");
$tpl= @mysql_fetch_array($sql);
$tpl[frame] = stripslashes($tpl[frame]);
$tpl[frame] = eregi_replace("{frame_title}","$frame_title",$tpl[frame]);
$tpl[frame] = eregi_replace("{frame_rows}","$frame_rows",$tpl[frame]);
echo $tpl[frame];
@mysql_free_result($sql);
}
//### function menu ###//
function tpl_menu($menu_title,$menu_rows)
{
global $defultstyle;
$sql = @mysql_query("SELECT idstyle,menu FROM style where idstyle=$defultstyle") or die ("Query failed");
$tpl= @mysql_fetch_array($sql);
$tpl[menu] = stripslashes($tpl[menu]);
$tpl[menu] = eregi_replace("{menu_title}","$menu_title",$tpl[menu]);
$tpl[menu] = eregi_replace("{menu_rows}","$menu_rows",$tpl[menu]);
echo $tpl[menu];
@mysql_free_result($sql);
}
=============
والآن كيفية استخدام الدوال وعرضها للمشاهده :
هذا مثال بسيط للاستخدام :
كود PHP:
include ("include/config.php");
include ("include/function.php");
tpl_header("bwady.com home");
$frame_title = "what is name";
$frame_rows = "my name is AHMED ALENZI";
tpl_frame($frame_title,$frame_rows);
tpl_footer();
السطر الأول : قمنا بتضمين ملف الاتصال بالقاعدة .
السطر الثاني : قمنا بتضمين ملف دوال القالب .
السطر الثالث : قمنا بعرض دالة الهيدر وقمنا بكتابة عنوان الصفحه bwady.com home
السطر الرابع : متغير يحمل عنوان الحتوى .
السطر الخامس : متغير يحمل موضوع المحتوى .
السطر السادس : دالة عرض تصميم الاطار وبداله المتغيرات عنوان المحتوى وموضوع المحتوى .
السطر السابع : دالة عرض الفوتر .
وهذا مثال آخر أكثر تقدما :
وهو كيفية استخدام دالة عرض الاقسام والمينو مع دوال التكرار .
اليكم المثال :
كود PHP:
include ("include/config.php");
include ("include/function.php");
function selectdata1()
{
$rows = "<div align='center'>
<center>
<table border='1' cellpadding='2' style='border-collapse: collapse' bordercolor='#111111' width='100%' id='AutoNumber1' dir='rtl'>";
$sql = @mysql_query("SELECT * FROM test") or die ("Query failed");
while ($xxx = @mysql_fetch_array($sql))
{
$rows .= "<tr>
<td width='50%'><p align='center'>$xxx[name]</td>
<td width='50%'><p align='center'>$xxx[url]</td>
</tr>";
}
$rows .= "</table>
</center>
</div>";
@mysql_free_result($sql);
return $rows;
}
function selectdata2()
{
$sql = @mysql_query("SELECT * FROM test") or die ("Query failed");
while ($xxx = @mysql_fetch_array($sql))
{
$rows .= "<a href='$xxx[url]'>$xxx[name]</a><br>";
}
@mysql_free_result($sql);
return $rows;
}
tpl_header("موقع بوادي");
echo "<div align='center'>
<center>
<table border='0' cellpadding='1' style='border-collapse: collapse' bordercolor='#111111' width='100%' id='AutoNumber2' dir='rtl'>
<tr>
<td width='10%' valign='top'>";
tpl_menu("مثال للمينو",selectdata2());
echo "</td>
<td width='90%' valign='top'>";
tpl_frame("مثال لإطار المحتويات",selectdata1());
echo "</td>
</tr>
</table>
</center>
</div>";
tpl_footer();
السطر الأول : قمنا بتضمين ملف الاتصال بالقاعدة .
السطر الثاني : قمنا بتضمين ملف دوال القالب .
السطر الثالث : الداله selectdata1() وهي للاستعلام من جدول في قاعدة البيانات واستخدمنا بها دالة التكرار ... وهي خاصه لإطار المحتويات .
ثم تليها الدالة selectdata2() وهي ايضا استعلام من قاعدة البيانات واستخدمنا حلقة التكرار ... وهي خاصه بالمينو .
ثم تليها دالة عرض الهيدر tpl_header("موقع بوادي"); وقمنا بكتابة اسم الموقع فيها .
ثم انشأنا جدول عن طريق الفرونت بيج ذو حقلين اثنين والحقل الذي على اليمين وضعنا به دالة عرض المينو والحقل اللي على اليسار وضعنا به دالة عرض اطار المحتويات .
ثم اخيرا أغلقنا الصفحة بكود عرض الفوتر tpl_footer() .
=========
ستجدون رابط لتحميل ملفات القالب كامله ومن ضمنا ملف خاص بإضافة وتعديل وحذف الاستايلات التي ستضاف لقاعدة البيانات وايضا يوجد ملف إسمه addtest.php وهذا خاص للتجربه فقط لإظافة سجلات في جدول اسمه test حتى نرى مثال حي للقالب ...
الملفات هي كالتالي :
style.php : خاص بإضافة وتعديل وحذف الاستايل .
addtest.php : خاص بإضافة سجلات للتجربه فقط .
example.php : مثال بسيط للعرض القالب من قاعدة البيانات .
example2.php : مثال لعرض القالب من قاعدة البيانات وبداخله عرض حلقات التكرار بداخل المينو والاطار .
sql&data.txt : خاص بأكواد قاعدة البيانات جاهزه فقط ازرعها .
include/config.php : ملف الاتصال بقاعدة البيانات .
include/function.php : ملف الدوال الخاص بالقالب .
رابط تحميل القالب
http://www.tlbat.com/downloadfile-100.html
رابط الموضوع الأصلي
محرك قوالب عن طريق قواعد البيانات mysql
محرك قوالب عن طريق قواعد البيانات mysql
هذا والحمدلله رب العالمين وما توفيقي إلا بالله العلي العظيم .
ابوليالي
رد مع اقتباس
