גולשים רבים בקשו לדעת כיצד ניתן להכין מערכת שכזו וכעת, לאחר שיקראו את ההסבר ויראו את הדוגמא, אני מקווה שיבינו שבעצם הם ידעו כל הזמן איך לעשות מערכת שכזו, כי בסך הכל, הדבר המסובך ביותר במערכת, והוא לא מסובך בכלל בפני עצמו, הוא החלק של בחירת הבאנר שזה בעצם בחירת רשומה באופן רנדומלי מתוך מסד הנתונים.
אז אני מקווה שכל מי שפתאום "הבין" עד כמה דברים יכולים להיות פשוטים וסתם להראות מסובכים, ינסה בפעמים הבאות לחשוב לבד איך לעשות מה שהוא רוצה ואם הוא לא מצליח אז לפחות לבקש הכוונה בפורום, ולא לבוא ישר בבקשה (ואף לעיתים דרישה! חוצפה!) ממישהו שיבנה לו מערכת שכזו.
טוב, לאחר הטפת המוסר אפר לגשת לעבודה!
המערכת
המערכת בנויה מ-4 חלקים עקריים:
- הקוד שמשובץ בדפים בהם נרצה להציג באנר
- דף אשר אליו יופנו הבאנרים וידע להוסיף מספר לחיצה לבאנר ולהפנות לקישור המתאים
- מערכת ניהול של הבאנרים
- מסד הנתונים עצמו:
banners.mdb (access 97)
מסד הנתונים
נתחיל בהצגת מסד הנתונים והסבר על שדותיו:
במסד הנתונים נצטרך רק טבלה אחת שתקרא banners ובה השדות הבאים:
id - מספור אוטומטי, שדה מפתח
alt - הטקסט שיופיע כאשר נעמוד עם הסמן על הבאנר
link - הקישור שאליו יפנה הבאנר
hits - מספר הלחיצות על הבאנר
image - מיקום התמונה של הבאנר
הקוד
הקוד שנשבץ בדפים בהם נרצה שיופיע באנר.
הקוד יידע לבחור באנר באקראיות ולהציגו. מי שלא יודע איך לבחור רשומה מתוך מסד נתונים באופן אקראי, ניתן לראות דוגמא לכך כאן
הנה הקוד אשר אותו נכליל בדפים (code.asp):
<![CDATA[<!--#include file="db_connect.asp"-->
<%
dim rs_ban,sql_ban
set rs_ban = server.createobject("adodb.recordset")
sql_ban = "select id,alt,link,image from banners"
rs_ban.open sql_ban,thedsn,3,1
randomize()
rs_ban.move(int(rs_ban.recordcount * rnd()))
response.write "<a href=redir.asp?id=" & rs_ban("id")
response.write "&url=" & server.urlencode(rs_ban("link")) & ">"
response.write "<img src=" & rs_ban("image") & " border=0 "
response.write "alt=" & rs_ban("alt") & "></a>"
rs_ban.close
set rs_ban = nothing
%>]]>את הקובץ נוכל להשתיל בדפים ע"י העתק והדבק (copy & paste) או בעזרת הכללה (include) - עליה ניתן למצוא הסבר כאן
דף הספירה וההפניה
הדף אשר אליו ישלח ה-id של הבאנר ע"י לחיצה עליו.
הקוד יידע להוסיף 1 למספר הלחיצות הכולל על אותו באנר בטבלה שבמסד הנתונים ולהפנות את הגולש אל הקישור המתאים.
למידע נוסף על ספירת לחיצות והפניה, ניתן לראות את הדוגמא מערכת ספירת לחיצות
ההוספה של 1 לשדה תתבצע בדוגמא זו בעזרת ado.
הנה הקוד של דף הספירה וההפניה (redir.asp):
<![CDATA[<%@language = vbscript%>
<%option explicit%>
<!--#include file="db_connect.asp"-->
<%
dim sql,cn
set cn = server.createobject("adodb.connection")
sql = "update banners set hits=hits+1 where id=" & request("id")
cn.open thedsn
cn.execute sql
cn.close
set cn = nothing
response.redirect request("url")
%>]]>
מערכת הניהול
רצוי לאבטח את המערכת ע"י מערכת אבטחת כניסה אשר תדרוש שם וסיסמא אותם ניתן לשנות בקוד ע"י בעל האתר. לאחר אישור שם וסיסמא, נעבור לדף הניהול עצמו, בו נראה את כל המידע על כל הבאנרים שבמערכת וניתן יהיה להוסיף, לעדכן ולהסיר באנרים.
לשם הפשוט והצמצום, בדוגמא זו הכנסתי את כל האפשרויות בדף אחד אשר יודע לשלוח אל עצמו את המשתנים ואת סוג הפעולה שעל הקוד לבצע (הוספה, עדכון או הסרה).
הנה הקוד של דף הניהול (admin.asp):
<![CDATA[<%@language = vbscript%>
<%option explicit%>
<!--#include file="db_connect.asp"-->
<%
dim id,sql,rs
id = request("id")
select case request("the_action")
case "add": dim item,values,cn
sql = "insert into banners ("
values = "("
for each item in request.querystring
if item <> "the_action" and item <> "id" then
sql = sql & "[" & item & "],"
values = values & "" & request(item) & ","
end if
next
sql = left(sql,len(sql)-1) & ") values"
sql = sql & left(values,len(values)-1) & ")"
set cn = server.createobject("adodb.connection")
cn.open thedsn
cn.execute sql
cn.close
set cn = nothing
response.redirect "admin.asp?" & rnd()
case "edit":sql = "update banners set "
for each item in request.querystring
if (item <> "id") and (item <> "the_action") then
sql = sql & item & "=" & request(item) & ", "
end if
next
sql = left(sql,len(sql)-2) & " where id=" & id
set cn = server.createobject("adodb.connection")
cn.open thedsn
cn.execute sql
cn.close
set cn = nothing
response.redirect "admin.asp?" & rnd()
case "del": sql = "delete * from banners where id=" & id
set cn = server.createobject("adodb.connection")
cn.open thedsn
cn.execute sql
cn.close
set cn = nothing
response.redirect "admin.asp?" & rnd()
case "zero": sql = "update banners set hits=0 where id=" & id
set cn = server.createobject("adodb.connection")
cn.open thedsn
cn.execute sql
cn.close
set cn = nothing
response.redirect "admin.asp?" & rnd()
end select
sql = "select * from banners" remove the * and put all the fields
set rs = server.createobject("adodb.recordset")
rs.open sql, thedsn
%>
<html>
<head>
<title>banners administration</title>
<style>
a{text-decoration:none}
a:hover{color:red}
.3d{
border: darkorange 3px outset;
background-color:orange
}
</style>
<script language=javascript>
<!--
function show_hide(msg_id){
msg_id.style.visibility=msg_id.style.visibility=="hidden" ? "visible" : "hidden"
}
function preview(url){
window.open(url,pic)
}
function del_conf(id){
if (confirm(?להסיר באנר)){
action_form.id.value = id;
action_form.the_action.value=del;
action_form.submit()
}
}
function zero(id){
if (confirm(?לאפס מונה)){
action_form.id.value = id;
action_form.the_action.value=zero;
action_form.submit()
}
}
function edit_banner(id,alt,link,image){
form_title.innerhtml=עריכת באנר;
action_form.add_or_edit.value=עדכן;
show_hide(the_form);
action_form.id.value = id;
action_form.alt.value = alt;
action_form.link.value = link;
action_form.image.value = image;
action_form.the_action.value=edit;
}
function add_banner(){
form_title.innerhtml=הוספת באנר;
action_form.add_or_edit.value=הוסף;
show_hide(the_form);
action_form.alt.value = ;
action_form.link.value = ;
action_form.image.value = ;
action_form.the_action.value=add;
}
//-->
</script>
</head>
<body bgcolor=darkorange>
<basefont face=arial>
<center><font size=6>מערכת ניהול באנרים</font></center><hr><br><br>
<form name="action_form" id="action_form">
<%
while not rs.eof
response.write "[<b><a href=javascript:del_conf(" & rs("id") & ") title=הסרת באנר>x</a></b>] "
response.write "[<b><a href=javascript:edit_banner(" & rs("id")
response.write "," & replace(rs("alt")," ","%20") & "," & rs("link") & "," & rs("image") & ")"
response.write " title=עריכת באנר>e</a></b>] "
response.write "<a href=" & rs("link") & "><img src=" & rs("image") & ""
response.write " border=0 align=top alt=" & rs("alt") & "></a>"
response.write " <font size=1>(" & rs("hits") & ")"
response.write " - <a href=javascript:zero(" & rs("id") & ")>אפס מונה</a></font><br><br>"
rs.movenext
wend
%>
<br>[<b><a href=javascript:add_banner() title=הוספת באנר>add</a></b>]
<table border=0 class="3d" dir="rtl" style=visibility:hidden; position:absolute; id=the_form>
<tr><th colspan=2><b id=form_title>הוספת באנר</b></th></tr>
<tr><td height=7></td></tr>
<tr><td align=left>שם הבאנר:</td><td><input type=text name="alt" size=50></td></tr>
<tr><td align=left>קישור:</td><td><input dir=ltr type=text name="link" size=50></td></tr>
<tr><td align=left valign=top>מיקום התמונה:</td>
<td><input dir=ltr type=text name="image" size=50></td><td>
</td></tr>
<tr><td colspan=2 align=left>
<a href=javascript:preview(action_form.image.value)>לחץ כאן לבדיקת התמונה</a>
</td></tr>
<tr><td height=10></td></tr>
<tr><th colspan=2><input type=submit value=הוסף class="3d" id=add_or_edit>
<input type=button value= בטל onclick=javascript:show_hide(the_form) class="3d">
</th></tr>
</table>
<input type=hidden name=the_action id=the_action value=>
<input type=hidden name=id id=id value=<%=id%>>
</form>
<hr>
<table width=100% align=center border=0 cellspacing=0 cellpadding=0>
<tr bgcolor=tan><th height=3></th></tr>
<tr bgcolor=#c6a280><th>
<font color=black size=1>(<a href=http://www.asp.org.il>www.asp.org.il</a>)
כל הזכויות שמורות ל<a href=mailto:adamli@hotmail.com>אדם ליבסקי</a> ©</font>
</th></tr><tr bgcolor=sienna ><th height=3></th></tr>
</table>
</body>
</html>
<%
rs.close
set rs = nothing
%>
<script language=javascript>
<!--
the_form.style.left=document.body.offsetwidth/2-(the_form.offsetwidth/2)
the_form.style.top=document.body.offsetheight/2-(the_form.offsetheight/2)
//-->
</script>]]>
לסיכום
כמובן שיש עוד הרבה מאוד מקום לשיפור של המערכת, כגון ספירת חשיפות (מספר הפעמים שכל באנר נראה לגולש), הצגת באנרים לפי אחוזים (לאיזה באנר יש איזה אחוז סיכוי להבחר באקראיות), התאמת המערכת לבאנרים בפלאש, באנרים שיתחלפו לא רק ברענון הדף ועוד הרבה שיפורים שלא חשבתי עליהם כרגע.
בכל מקרה, את הכייף של השיפורים אני אשאיר לכם ואשמח מאוד לקבל ממכם דוגמאות שאתם הכנתם של המערכת בתוספת שיפורים.
בהצלחה...
|
.png)
