(-_-)لینک کینگ(-

ايجاد Loading براي وبلاگ ها و صفحات وب ... آموزشی

لودينگي كه امروز به شما آموزش می دهم به اين شيوه كار ميكند كه هنگامي آدرس صفحه رو ميزنيد يه مستطيل مثل زير در بالاي صفحه مياد . مثل شکل زیر البته شکل زیر پیش فرض است و چندین شکل دیگر هم در ادامه مطلب می باشد.

صفحه در حال بارگذاري است!
لطفا کمي صبر کنيد...

Www.Dlisland.Com

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

خوب حالا بريم سر اصل مطلب و چگونگي قرار دادن لودينگ در وبلاگ يا صفحات وب :

خوب ابتدا كد زير رو برداريد و در قالب وبلاگ ( يا كدهاي Html صفحه ي مورد نظرتون ) بعد از تگ <html> كه در اول قالب هست بزاريد .

<SCRIPT> var DHTML = (document.getElementById || document.all || document.layers); function ap_getObj(name) { if (document.getElementById) { return document.getElementById(name).style; } else if (document.all) { return document.all[name].style; } else if (document.layers) { return document.layers[name]; } } function ap_showWaitMessage(div,flag) { if (!DHTML) return; var x = ap_getObj(div); x.visibility = (flag) ? 'visible':'hidden' if(! document.getElementById) if(document.layers) x.left=280/2; return true; } </SCRIPT> <body> <div id="waitDiv" style="border: 1px dotted silver ; POSITION:absolute;TOP: 90;RIGHT:400;TEXT-ALIGN:center; visibility:hidden; width:211; background-color:#eaeaea" padding-left:4px; padding-right:4px; padding-top:1px; padding-bottom:1px> <tr> <td align="middle"> </td> <p dir="rtl" style="margin-top: 5"> <font color="#808080" face="Tahoma" size="2"><span lang="fa">صفحه در حال بارگذاري است!<br> لطفا کمي صبر کنيد...</span></font></p> <table cellpadding="6" border="0"> <tr> <td align="middle"> <img alt="Please wait ..." src="http://www.dlisland-music.persiangig.com/image/Loading3.gif"> <p> <span lang="en-us"><a target="_blank" href="http://www.dlisland.com">Loading by : dlisland.com</a> </span></p> </td> </tr> </table> </div> <SCRIPT> ap_showWaitMessage('waitDiv', 1); </SCRIPT>

همونطور كه گفتم بعد از تگ <html> يه اينتر بزنيد تا يه سطر باز بشه و بعد كد رو در اون سطر بزاريد . مثل زير :

<html>
كد اول رو اينجا بزاريد
.......

بعد از اينكه كد بالا رو در جايي كه گفتم قرار داديد نوبت به كد دوم ميرسه . كد دوم كاربردش اينه كه وقتي صفحه كامل لود شد لودينگ بسته بشه پس اين كد بايد در انتهاي قالب و قبل از تگ <html/> قرار بگيره .

<SCRIPT> ap_showWaitMessage('waitDiv', 0); </SCRIPT>

كد دوم رو بايد بزاريد آخره آخره قالبتون ( اگه بزاريد قبل از تگ <html/> بهتره ) . مثل زير :

.....
كد دوم رو اينجا بزاريد
</html>

لازمه اينو بگم: اينكه كد اول رو بعد از تگ <html> بزاريد ضروري نيست و ميتونيد كد اول رو در اوله اوله قالب بزاريد .

همچنين اينو : كه كد دوم رو قبل از تگ <html/> بزاريد ضروري نيست و ميتونيد كد دوم رو در آخره آخره قالب بزاريد.

عکس آدرس فايل

Www.Dlisland.Com

http://www.dlisland-music.persiangig.com/image/Loading2.gif

http://www.dlisland-music.persiangig.com/image/Loading4.gif

http://www.dlisland-music.persiangig.com/image/Loading5.gif

http://www.dlisland-music.persiangig.com/image/Loding-1.gif

http://www.dlisland.com منبع خبر

داخل قسمت اول کد تقریبا آخرش آدرس عکسی است که نمایش داده می شود شما می توانید هر کدام از عکس های بالا را که دوست دارید آدرس آن را بگذارید.

شکل اول که در اول ( بالای نوشته ) مقاله است . به فرضی در کد قرار داده شده است . شما می توانید آن را با یکی از شکل های بالا عوض کنید.

امید وارم لذت ببرید.

+ نوشته شده در سه شنبه ششم تیر 1385ساعت 10:34 توسط بهروز |

ساخت چت باكس

بــــه نــــــــام خـــــــــــدا

سلام
يكي از دوستان در خواست ساخت چت باكس (يا همون تابلوي گفتمان) در سيستم ميهن بلاگ رو خواسته بود كه براتون توضيح خواهم داد.
البته تا قبل از اينكه سيستم تاييد نظرات راه اندازي بشه اين قسمت كاملا درست كار مي كرد و مثل يك چت باكس واقعي!!! ولي حالا تنها تفاوتي كه كرده اينه كه يك صفحه يا لينك جديد بعنوان "بازگشت به صفحه قبلي" رو به منظور تاييد يا رد نظر هاي ارسال شده قرار داده كه باعث ميشه اين چت باكس مثل ساير چت باكس ها عمل نكنه .
ادامه آموزش در ادامه مطلب
---»
اما مي ريم سر آموزش :
1) اول از هر چيز شما بايد يك وبلاگ جديد ايجاد كنيد .كه احتمالا اين كار رو همه بلديد!! اين وبلاگ بايد فاقد هرگونه قالب اصلي و نظر سنجي باشه.
2) بعد از اينكه وبلاگ رو ساختيد وارد كنترل پنل وبلاگتون بشيد و به قسمت ارسال مطلب بريد .هر چيزي رو كه خواستيد تايپ كنيد(حتي يك حرف هم باشد كافيست).و باكس مربوط به "اضافه به ليست بروز شده ها " رو غير فعال كنيد و دكمه ارسال مطلب رو بزنيد.
3) حال به قسمت ويرايش قالب وبلاگ بريد و در قسمت مربوط به قالب اصلي (نه قسمت نظر سنجي) هر آنچه هست و نيست رو پاك كرده و آدرس زير رو تايپ كنيد.....(البته قبل از اينكه آدرس زير رو تايپ كنيد بند 4 رو فراموش نكنيد)
http://www.commenting.mihanblog.com/?Ui=[user]&Ai=1
4) به جاي عبارت [user] نام وبلاگ اصلي(توجه داشته باشيد فقط نام وبلاگ ،نه آدرس.مثلا اگر آدرس وبلاگ من name.mihanblog.com هست ،بنابراين نام وبلاگ من name خواهد بود. )رو تايپ كنيد(يعني نام وبلاگي رو كه مي خواهيد چت باكس در آن قرار بگيره) بنابر اين عبارت به شكل زير در خواهد آمد :
http://www.commenting.mihanblog.com/?Ui=name&Ai=1
5) خوب حالا وقت دريافت قالب تابلوي گفتمانتون رسيده كه ميتونيد از توي اين باكس كپي كنيد

<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>[blogtitle]</title> <style> body { Background-color: #ffffff; font-family:"tahoma","verdana","arial",serif; font-size: 10px; color: #000000; } A:link { text-decoration: none; COLOR: #2263a6 } A:visited { text-decoration: none; COLOR: #2263a6 } A:hover { text-decoration: none; COLOR: #ff4400 } A:active { text-decoration: none; COLOR: #ff4400 } .menu { background-color: #5C7099; background-image: url('http://www.topakfile.persiangig.com/date-and-time.gif'); font-family: tahoma; font-size: 12px; font-weight:500; color: #000000; padding-right: 0px; padding-top:0px; text-align:center; direction: rtl; } .right-logo { background-color: #E1E4F2; font-family: tahoma; font-size: 11px; font-weight:500; color: #000000; padding-right: 7px; padding-top: 2px; padding-left: 7px; padding-bottom: 2px; text-align: center; direction: rtl; } .right-logo1 { background-color: #E1E4F2; font-family: tahoma; font-size: 11px; font-weight:500; color: #000000; padding-right: 7px; padding-top: 2px; padding-left: 7px; padding-bottom: 2px; text-align: right; direction: ltr; } .right-logo2 { background-color: #E1E4F2; font-family: tahoma; font-size: 11px; font-weight:500; color: #000000; padding-right: 7px; padding-top: 2px; padding-left: 7px; padding-bottom: 2px; text-align: right; direction: rtl; } .post { background-color: #F5F5FF; font-family: tahoma; font-size: 11px; font-weight:500; color: #000000; padding-right: 3px; padding-top: 0px; padding-left: 0px; padding-bottom: 0px; text-align: right; direction: rtl; } .namebox { background-color: #ffffff; border: 1px solid #F0F0F0; font-family: tahoma; font-size: 9px; font-weight: 500; color: #000000; text-align: right; } .webbox { background-color: #ffffff; border: 1px solid #F0F0F0; font-family: tahoma; font-size: 9px; font-weight: 500; color: #000000; text-align: left; } .mailbox { background-color: #ffffff; border: 1px solid #F0F0F0; font-family: tahoma; font-size: 10px; font-weight: 500; color: #000000; text-align:left; } .CommentBOX { background-color: #ffffff; border: 1px solid #F0F0F0; font-family: tahoma; font-size: 9px; font-weight: 500; color: #000000; text-align: right; } TD { FONT: 11px Tahoma;TEXT-DECORATION: none; MARGIN: 0px; LINE-HEIGHT: 150%; } html, table, a, html, body { FONT: 11px Tahoma;TEXT-DECORATION: none; MARGIN: 0px; LINE-HEIGHT: 150%; } p { MARGIN: 0px; LINE-HEIGHT: 150%;padding-right:2px; } .collapsed { DISPLAY: none } </style> </head> <body> <div align="center"> <br> <table width="95%" cellspacing="0" cellpadding="0"> <tr> <td colspan="3" class="menu" width="100%" style="border:1px solid #666666"> تابلوی گفتمان <table width="100%" cellpadding="0" cellspacing="0" dir="ltr"> <tr> <td class="right-logo" width="120%" > شما در اين مكان مي توانيد نظرات خود را ارسال نماييد<br> © <a href="http://www.2pak.ir" alt="Creative Design Center" title="Creative Design Center" target="_blank">طراح : توپك</a> </td> </tr> </table> </td> </tr> </table> </div> <div align="center"> <table width="95%" style="margin:0px; border-collapse: collapse; border-width: 1px; font-style:normal; font-variant:normal; font-weight:normal; font-size:11px; font-family:Tahoma; color:#000066; text-decoration:none; line-height:150%" cellspacing="0" cellpadding="0"> <tr> <td colspan="3" > <table width="100%" cellpadding="2" style="margin:0px; border-collapse: collapse; font-style:normal; font-variant:normal; font-weight:normal; font-size:11px; font-family:Tahoma; color:#000066; text-decoration:none; line-height:150%; border-left-width:0px;border-bottom-width:0px; border-right-width:0px; border-top-width:0px" dir="ltr"> <BlogComments> <tr> <td class="right-logo2" colspan="2" style="border:1px solid #666666"> <a href="[web]"><span style="font-weight:600;color:#FEA203"> [author]</span></a> : [comment] <br> </td> </tr> </BlogComments> </table> </td> </tr> </table> </div> <div align="center"> <table width="95%" style="margin:0px; border-collapse: collapse; border-width: 1px;border:1px solid #666666;border-top:none; font-style:normal; font-variant:normal; font-weight:normal; font-size:11px; font-family:Tahoma; color:#000066; text-decoration:none; line-height:150%" cellspacing="0" cellpadding="0" > <tr> <td width="100%" class="menu"> <p dir="rtl" align="center"><font color="#303030">ارسال نظرات</font></td> </tr> <tr> <td colspan="3" style="background-position: left top; border-bottom:1px solid #666666;"> <newcomment> <table width="100%" cellpadding="2" class="right-logo1" dir="ltr"> <tr> <td style="border-style: none; border-width: medium" width="39%" valign="top"> <p dir="rtl" > [namebox value=(33)]</td> <td style="border-style: none; border-width: medium" width="15%" valign="top"> <p dir="rtl" >نام: </td> </tr> <tr> <td style="border-style: none; border-width: medium" width="39%" valign="top"> <p dir="rtl" > [webbox value=(33)]</td> <td style="border-style: none; border-width: medium" width="15%" valign="top"> <p dir="rtl" ><span lang="fa">وبسايت</span>:</td> </tr> <tr> <td style="border-style: none; border-width: medium" width="39%" valign="top"> <p dir="rtl" > [commentbox]</td> <td style="border-style: none; border-width: medium" width="15%" valign="top"> <p dir="rtl"> [submitbtn value=(ارسال)]</td> </tr> </table> </tr> </table> </newcomment> </div> <br> </body>

.قالبي رو كه براي شما ساختم يه قالب آزمايشيه و اگه دوست داشتيد مي تونيد توش هر تغييري رو بديد. بنابراين خيلي سخت نگيريد.(اين قالب فقط براي آشنايي شما طراحي شده)
7)   در همان قسمت ويرايش قالب ،به قسمت مربوط به قالب نظر سنجي بريد و هر آنچه در آن نوشته شده رو پاك كنيد و محتويات فايل رو كه كپي كرده بوديد paste كنيد .
8)   دكمه مربوط به ويرايش قالب وبلاگ رو كليك كنيد و از كنترل پنل وبلاگ خارج بشيد.(به شما پيشنهاد مي كنم كه بعد از هر تغيير دكمه مربوط به ويرايش قالب وبلاگ رو كليك كنيد تا سرور شما رو از كنترل پنل بيرون نندازه )هنوز تموم نشده !!!!
9)   حالا به قسمت كنترل پنل وبلاگ اصليتون يعني وبلاگي كه مي خواهيد چت باكس در اون قرار بگيره بريد و كد زير رو در هر جايي كه مناسب دونستيد قرار بديد ....

10) توجه داشته باشيد كه بجاي عبارت هاي [user] جايگزين هاي مناسب رو بدين ترتيب قرار بديد.بجاي [user] نام وبلاگي رو كه جديدا ساختيد (و نه نام وبلاگ اصلي تون رو) جايگزين كنيد .
11) و حالا دكمه مربوط به ويرايش قالب وبلاگ رو فشار بديد و حالا شما يك چت باكس مبتني بر سيستم ميهن بلاگ خواهيد داشت .
موفق باشيد

+ نوشته شده در سه شنبه ششم تیر 1385ساعت 10:33 توسط بهروز |

(-_-)لینک کینگ(-_-)

سیس

ايجاد Loading براي وبلاگ ها و صفحات وب ... آموزشی

ساخت چت باكس

پیوندهای روزانه

نوشته های پیشین