کدی برای قرار دادن لوگوی متحرک

کدی برای قرار دادن لوگودونی متحرک در وبلاگ شما

با قرار دادن این کد در وبلاگتان شما می توانید یک لوگودونی متحرک داشته باشید که بوسیله آن با سایر وبلاگها به تبادل لوگو بپردازید .

 

نمونه كد :







چگونگی استفاده :  خوب اول شما كد اين لوگودوني رو يه جاي مناسب از قالبتون ميزاريد . ما در كد جاهايي رو به صورت <--- Logo Code ---!> مشخص كردیم . شما هر وقت كه خواستيد لوگويي رو وارد لوگودوني كنيد كد لوگو رو به جاي <--- Logo Code ---!> قرار ميديد . به همين راحتي شما يك لوگودوني متحرك خواهيد داشت .

تنه ي اصلي يك فايل HTML ( آموزش طراحي ( html ) )

تگ هاي Html : اين تگ با <html> شروع ميشه و با تگ پاياني <html/> تموم ميشه .

تمام كدها و تگهاي Html و ... بين اين دو تگ قرار مي گيرن . كاربرد تگ <html> اينه كه به مرورگر ميفهمونه كه اين يك فايل Html هست و اينكه مروگر اونو چطور نمايش بده .

 

 تگ هاي Head : اين تگ هم با <head> شروع ميشه و با تگ پاياني <head/> تموم ميشه .

در واقع مشخصات ، خصوصيات و تنظيمات يك فايل Html در بين تگ هاي <head> و<head/> قرار مي گيره . مواردي كه در بين اين دو تگ قرار ميگيره در صفحه نمايش داده نميشه .  از جمله تگ هايي كه بين اين دو  قرار ميگيرن تگهاي meta و  Style هستن كه بعدا به موقش در مورد اونا هم بحث مي كنم .

 

 تگ هاي Title : كلمه يا متني كه بين تگ <title> و <title/> قرار ميگيره عنوان صفحه رو مشخص ميكنه . همون عنواني كه در بالاي پنجره ي اينترنت اكسپلورر نمايش داده ميشه . پس اگه خواستيد عنوان صفحه ي خود رو عوض كنيد بايد متن بين اين تگ رو تغير بديد و عنوان مورد نظر رو بين اين دو تگ بزاريد  .  منظورم از عنوان مثل زيره :

 

 تگ هاي Body : شايد بشه گفت اساسي ترين تگ Html همين تگ هاي بادي هستن كه با <body> شروع و با تگ <body/> به پايان ميرسه .

اهميت تگهاي بادي در اينه كه تنها اطلاعات بين اين دو تگ در صفحه ي وب نمايش داده ميشن .  يعني تمام قسمت هايي كه در يك صفحه ي وب نمايش داده ميشن و ما اونا رو ميبينيم كدشن بين اين دو تگ قرار داره . مثل جدول ها ، متن ها و پستهايي كه ميديد ، تمام نوشته ها و عكس ها و خلاصه هر چي كه توي صفحه نمايش داده ميشه .

 

اميدوارم با تنه ي اصلي يك فايل Html آشنا شده باشد . در هر صورت من سعي كردم كه هر چقدر مي تونم ساده تر و خودموني تر  توضيح بدم . ضمنا من سعي ميكنم چيزايي رو كه بدردتون ميخوره آموزش بدم و از تعريف و توضيح اصطلاحات و ... بپرهيزم .

 

معرفي تگهاي Meta و كاربرد آن ( آموزش طراحي ( html ) )

 در ادامه ي بحث آموزش Html امروز تگ هاي Meta رو براتون آموزش ميدم .

تگ هاي Meta بسيار فراوانند كه ما در اينجا فقط به معرفي چند تا از اون ها كه پركاربرد هستند و شما به اون ها نياز داريد مي پردازيم :

جايگاه تگ Meta :  تو درس قبلي يه اشاره به جايگاه تگ هاي Meta كردم . اگه درس ها رو دنبال كرده باشيد من گفتم كه تگ هاي Meta در بين تگهاي Head قرار ميگيرند. به شكل زير :

<head>

<Meta ....>

<Meta ....>

<Meta ....>
<title>عنوان صفحه</title>
</head>

همونطور كه در بالا مي بينيد تگهاي Meta بعد از تگ <head> و قبل از تگ <head/> اومدن .اگر چند تا تگ Meta به كار ببريد همشون در سطرهاي زير هم و در بين تگ هاي Head قرار ميگيرن ...

انواع تگ هاي Meta : در اينجا من به سه نوع از تگ هاي Meta كه بيشترين كاربرد رو دارن اشاره ميكنم :

تگ متاي توصيفي (Description meta Tags) :

در اين گونه تگ هاي Meta شما در مورد صفحه ي وب ، وبلاگ و يا سايتتون توصيفي رو قرار ميدين . شايد بپرسيد كه اين به چه دردي مي خوره ؟ خوب بايد بگم كه موتور هاي جستجوگر نظير Google و Yahoo به اين تگ اهميت ميدن . يعني هنگام جستجو كردن ، توصيف درون اين تگ رو دريافت مي كنن و در صورت مربوط بودن به كلمه ي جستجو شده اون صفحه رو در نتايج جستجو قرار ميدن . اين تگ و توصيفي كه در اون مي نويسيد مي تونه در افزايش آمار بازديدتون خيلي مؤثر باشه . فقط بايد توجه داشته باشيد كه توصيف بيش از حد در اين تگ هيچ تاثيري در بالاتر بردن كارايي اون نداره . سعي كنيد يه توصيف كوتاه و دقيق راجع به صفحه رو در اون بگذاريد . اين تگ به شكل زيره :

 

 

تگ متاي كلمات كليدي (Keywords meta Tags) :

اين تگ كه كاربردي شبيه به تگ قبلي داره براي اينه كه شما در اون كلمات كليدي مربوط به صفحه ي وب خودتون رو وارد كنيد . اين تگ هم به شناسايي موضوع صفحه توسط موتورهاي جستجوگر كمك مي كنه . در اين تگ بايد از كليدي ترين واژه هاي مرتبط با موضوع صفحه استفاده بشه . مثلا اگر وبلاگ يا سايت شما در مورد دانلود برنامه هست مي تونيد از واژه هايي مثل " دانلود ، دانلود برنامه هاي روز  ، دانلود برنامه به همراه كرك و ..." استفاده كنيد . يا اگه در مورد موزيك مطلب مي نويسيد مي تونيد از كلمات " دانلود موزيك ، آهنگ و موسيقي ، جديدترين آلبوم ها و ..." استفاده كنيد . اين تگ هم به صورت زيره :

 

 

تگ هاي متاي HTTP-EQUIV :

اين تگ ها از پركاربرد ترين تگ هاي Meta هستند . اهميت اين تگ ها براي سايت هاي فارسي و كلا جاهايي كه متن فارسي درون صفحه وجود داره  خيلي زياده . چون اين تگ هاي متا به مرورگر مي فهمونن كه اين يك صفحه به زبان فارسي هست و مرورگر اونو درست نمايش ميده . شايد بعضي جاها ديده باشيد كه متن هاي فارسي به صورت خرچنگ قورباغه نمايش داده ميشن . دليلش اينه كه از اين تگهاي متا در صفحه استفاده نشده . دو تا از اين تگ هاي مهم به شكل زيرن :


 

اولي براي اينه كه مرور گر زبان صفحه رو فارسي تشخيص بده . البته اين تگ براي زبانهاي مختلف كاربرد داره و من اينجا فقط فارسيشو گذاشتم . دومي هم نوع نمايش متون رو تعيين مي كنه كه اينجا به صورت UTF-8  هست كه براي زبان فارسي مناسب ترينه .

اين تگهاي متا كه من معرفي كردم مهمترين و پركاربردترين اونها بودن . تعداد تگ هاي متا خيلي زيادن كه من فعلا به معرفي همين ها بسنده كردم .

 

حالا در آخر يه شكل از كد يه صفحه ي Html رو كه اين تگ هاي متا توش به كار رفته در زير ميارم تا با جايگاه و نحوه ي قرار گرفتن تگهاي متا در كدهاي يك صفحه بيشتر آشنا بشيد . تگ هاي متا در يك صفحه ي Html فارسي به شكل زير قرار ميگيرن :

<html>
<head>

<Meta http-equiv="Content-Language" content="fa">

<Meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<Meta name="Description" content="توصيفي در مورد صفحه ">

<Meta name="Keywords" content="واژه ها و كلمات كليدي ">
<title>عنوان صفحه</title>
</head>
<body>
قسمتي كه نمايش داده مي شود
</body>
</html>

:: ترتيب قرار گرفتنشون زياد مهم نيست

نمایش مدت حضور در سایت یا وبلاگ

<!---Code by www.behedu.blogfa.com--->
<center>
<INPUT onclick=time_here() type=button value="مدت حضور شما-
با تشکر  بهنام پیروی  " name=timehere style="height:43; border:1px solid silver; color: #0000ff#; font-size:11px; font-family:Tahoma;">
<script language="Javascript" src="http://www.behedu.blogfa.com/js/p_time/p_time.js"></script>
</center>
<BODY onload=time_arrived()>
<!--Best javascrip Codes in > www.behedu.blogfa.com-->
نمایش کد

معرفي تگ P : ايجاد و ويرايش پاراگراف ( آموزش طراحي ( html ) )

 معرفي تگ <P> :

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

خوب كد يه پاراگراف ساده به شكل زيره كه نمايشش رو در زير ميبينيد :

<p>متن پاراگراف</p>                                                       ======>                                                   متن پاراگراف

 براي تغير نحوه ي قرار گيري پاراگراف در صفحه از ميانكد align استفاده ميكنيم . در زير به مقدار هايي كه بايد براي ميانكد align قرار بديد اشاره كردم و نمايش هر كدوم رو در زيرش گذاشتم :

اگر خواستيد پاراگرافتون راست چين باشه ( ) بايد به ميانكد align مقدار right رو بديد . مثل زير :

<p align="right">متن پاراگراف</p>

متن پاراگراف

اگر خواستيد پاراگرافتون چپ چين باشه ( ) بايد به ميانكد align مقدار left رو بديد . مثل زير :

<p align="left">متن پاراگراف</p>

متن پاراگراف

اگر خواستيد پاراگرافتون وسط باشه ( ) بايد به ميانكد align مقدار center رو بديد . مثل زير :

<p align="center">متن پاراگراف</p>

متن پاراگراف

حالا اگه خواستيد پاراگرافتون از دو طرف ميزون باشه ( ) بايد به ميانكد align مقدار justify رو بديد . مثل زير :

<p align="justify">متن پاراگراف</p>

متن پاراگراف متن پاراگراف متن پاراگراف متن پاراگراف متن پاراگراف متن پاراگراف متن پاراگراف متن پاراگراف متن پاراگراف متن پاراگراف متن پاراگراف متن پاراگراف متن پاراگراف

چون طولاني شد براي خوندن بقيه به ادامه ي مطلب مراجعه كنيد ...

براي متن هاي فارسي كه از راست به چپ نوشته ميشن از ميانكد dir استفاده كنيد و مقدار اون رو rtl بزاريد كه مخفف  right to left هست يعني راست به چپ .

<p dir="rtl">متن پاراگراف</p>               <===            براي متون فارسي

براي متن هاي انگليسي كه از چپ به راست نوشته ميشن بازم از ميانكد dir استفاده مي كنيد و حتما حدس ميزنيد كه مقدارش رو چي بايد گذاشت . آره ، مقدار اون رو ltr بزاريد كه مخفف  left to right هست يعني چپ به راست .

<p dir="ltr">متن پاراگراف</p>               <===         براي متون انگليسي

 

حالا بريم سراغ فاصله ي بين سطر ها :

براي تنظيم فاصله ي بين سطرها از ميان كد Style استفاده ميكنيم . اين ميانكد تقريبا در همه ي تگ ها كاربرد داره و خيلي مهمه . اين ميانكد مقدارهاي زيادي رو ميتونه در خودش جا بده كه اين مقادير با يك علامت ; (نقطه كاما) از همديگه جدا ميشن . يادم باشه يه پست رو فقط به اين ميانكد اختصاص بدم . اينجا براي تنظيم فاصله ي بين سطر هاي يك پاراگراف به ميانكد style يك مقدار به شكل زير ميديم و فاصله ي بين سطرها رو به صورت درصدي مشخص ميكنيم :

<p style="line-height: 100%;">متن پاراگراف</p>

با بيشتر كردن مقدار 100% فاصله ي بين سطرها بيشتر ميشه و با كمتر كردن اون فاصله ي بين سطر ها كمتر ميشه .

فاصله ي پاراگراف از راست و چپ :

اگه بخوايد كه پاراگرافتون از راست و چپ فاصله داشته باشه و نچسبه به چپ و راست صفحه ، بايد دو مقدار ديگه در ميانكد style قرار بديد كه به صورت زيره :

<p style="line-height: 100%; margin-left:3; margin-right:3" >متن پاراگراف</p>

مقدار margin-right فاصله از راست و مقدار margin-left فاصله از چپ رو مشخص ميكنه كه بر حسب پيكسل هست . كه در كد بالا براي فاصله از چپ و راست مقدار 3 پيكسل رو گذاشتم .

نكته : جا به جايي ميانكدها تاثيري در نمايش كد نداره .

در آخر من يك سوال مي كنم . شما سوال رو پاسخ بديد و پاسخ خود رو با جواب صحيح مطابقت بديد و ببينيد كه تا چه اندازه ياد گرفتيد . من لينك جواب صحيح رو در زير سوال گذاشتم . فقط بچه ي خوبي باش و تقلبي نكن . اول خودت جواب بده و بعد جواب صحيح رو ببين و با هم مقايسه كن .  در آخر هم تو قسمت نظرات بگو كه چيكار كردي .

سوال شما كد پاراگرافي كه ميگم ايجاد كنيد : يك پاراگراف با متن فارسي ، وسط چين ، فاصله ي بين سطرها 120% ، فاصله از چپ 3 پيكسل و فاصله از راست 5 پيكسل باشه .

 جواب صحيح 

آموزش کامل قرار دادن لينك ( تگ a ) ( آموزش طراحي ( html ) )

.

لينك چيست ؟

معني لغوي لينك " زنجير ، اتصال و متصل كردن " هست . و همونطور كه از معنيش پيداست كارش هم همينه . يعني در اينترنت بين صفحات و فايل ها ي مختلف يك ارتباط ايجاد مي كنه و اونا رو به هم وصل ميكنه . لينك همونه كه شما با كليك بر روي اون به يه صفحه ي ديگه منتقل ميشيد يا يك فايل رو دانلود مي كنيد .

ساختار لينك

همه ي لينك هايي كه در اينترنت وجود دارن از يك تگ ساده ساخته مي شن . تگ لينك دادن به صورت زير معرفي ميشه .

<a href="Link Adress">Link Name</a>



كه  شما در قسمتhref بايد آدرس لينك رو وارد كنيد و نام لينك رو پس از بسته شدن تك اوليه ي لينك وارد كنيد و در آخر تگ پاياني <a/> رو بكار ببريد . مثلا به نحوه ي نمايش اين لينك زير توجه كنيد :

<a href="http://www.irlearning.com">irLearn سايت</a>        == نمايش كد ==>      irLearning سايت


خوب ، شايد بپرسيد چكار بايد كنيم كه وقتي روي يك لينك كليك مي كنيم توي يه صفحه ي جديد باز بشه ؟

شما مي تونيد با اضافه كردن يه ميان كد به صورت "target="_blank  در تگ اوليه ي لينك دادن اين امكان رو به اون لينك بديد كه در صفحه ي جديد باز بشه . به نحوه ي قرار گرفتن اين ميان كد در كد لينك دادن توجه كنيد :

<a target="_blank" href="Link Adress">Link Name</a>



توجه كنيد كه بايد قبل و بعد از اين ميان كد و هر ميان كد ديگه اي يك اسپيس بزنيد كه به كدهاي بغلي خودش چسبيده نباشه .

به طور مثال با كليك بر روي لينك زير مي بينيد كه در يك صفحه ي جديد باز ميشه :

<a  target="_blank" href="http://www.irlearning.com">irLearn سايت</a>    = نمايش كد =>   irLearning سايت


چكار كنيم كه وقتي موس رو رو لينك مي بريم يه توضيحي در مورد اون لينك ظاهر بشه ؟

برا اينكار هم بايد از يك ميان به صورت "title="tozih استفاده كنيد . كه بايد به جاي tozih ، توضيحي از لينك رو قرار بديد. اين ميان كد هم به صورت زير در كد لينك دادن قرار ميگيره :

<a title="tozih" href="Link Adress">Link Name</a>



مثلا شما نشانگر موس رو روي لينك زير نگه داريد تا كاربرد اين ميان كد رو ببينيد:

<a  title="بهترين سايت آموزشي" href="http://www.irlearning.com">irLearn سايت</a>

= نمايش كد =>  irLearning سايت


فكر كنم فعلا همين كافي باشه . بعدا ميان كدهاي بيشتري رو معرفي مي كنم .

حالا اون كساني كه مي خوان تو فرونت پيج يا تو پست هاي وبلاگشون لينك قرار بدن به شكل زير عمل كنن :

در بالاي اديتوري كه مي خوايد پست بديد يا در بالاي فرونت پيج يه دكمه به شكل زنجير يا به شكل وجود داره كه با كليك بر روي اون ،  يه پنجره باز ميشه كه شما بايد در اون نام لينك و آدرس لينك رو وارد كنيد و Ok بزنيد . آدرس لينك مي تونه آدرس يه صفحه يا يه فايل برا دانلود باشه .

معرفي Html و Frontpage

 خوب دوستان عزيز امروز اولين پست رو در مورد آموزش طراحي ميدم . اول يه كم در مورد Html و بعد در مورد برنامه اي كه بهش نياز داريد و بهتره كه از اون استفاده كنيد.

HTML چيست ؟

همونطور كه مي دونيد Html يك زبان برنامه نويسي صفحات وب هست كه از عبارت Hyper Text Markup Language گرفته شده .

يك فايل Html يك فايل متني است كه شامل تگ هاي اين زبان مي باشد و از كنار هم قرار گرفتن اين تگ ها و كدها يك صفحه ي وب ايجاد ميشه . مرورگرها هم با خوندن اين تگ ها و كدهاي Html مي فهمند كه صفحه رو چجور بايد نمايش بدن .

فايل هاي Html با دو فرمت htm. و html. وجود دارند .

از مزيت هاي Html اينه كه فايل هاي اون با هر اديتور ساده اي قابل ساختن هستند . مثلا اگر از ويندوز استفاده مي كنيد مي تونيد با Notepad كه برنامه ي خيلي ساده اي هست يك فايل Html ايجاد كنيد . فقط لازمه در هنگامه ذخيره ي فايل در Notepad به آخر اسم اون html. يا htm. اضافه كنيد و اونو Save كنيد . به همين راحتي مي تونيد يك فايل Html ايجاد كنيد .

اما براي راحتي كار و صرفه جويي در زمان بهتره كه از برنامه ي پيشرفته تري كه براي اين كار ساخته شده استفاده كنيد . برنامه هاي زيادي براي ايجاد صفحات وب وجود دارن كه من به شما پيشنهاد مي كنم كه از برنامه ي Microsof Front Page استفاده كنيد .

اين برنامه كه از كاراي خود مايكروسافت هست يك برنامه ي بسيار كاربردي و كامل براي ايجاد صفحات وب و Html هست . در هر صورت اگه دوست داريد كه يك طراح بشيد يا در اين مورد ياد بگيريد اين برنامه خيلي مي تونه به شما كمك بكنه .

در اين پست فقط به صورت كلي يه چيزايي براي شروع گفتم . ان شاءالله در پستاي بعدي شروع به آموزش تگها و كدهاي Html مي كنم .

پست بعدي ما در مورد طراحي و Html اختصاص پيدا مي كنه به معرفي تنه ي اصلي يك فايل Html و اينكه تگهاي اصلي كدوم تگ ها هستن و كارشون چيه .

در دو پست قبل گفته بودم كه آموزش متحرك سازي متن رو براتون بزارم .منم اين پست رو به اين مطلب اختصاص دادم .

كد متحرك سازي متن در حالت كلي به شكل زيره :


direction="جهت"
width="150" height="180"
scrolldelay="1"
scrollamount="1">
متن شما

حالا توضيح در مورد كد :

 قسمتي از كد كه به رنگ سبز هست براي تايين عرض و ارتفاع باكسي كه متن توش حركت مي كنه هست . در قسمت Width عرض ( پهناي) باكس و در قسمت Height ارتفاع باكس رو قرار بديد . در كد بالا به طور پيشفرض اندازه ي باكس 150 در 180 پيكسل هست . يعني پهناي باكس 150 پيكسل و ارتفاعش 180 پيكسل هست . شما خودتون با تغير اين دو عدد مي تونيد اندازه ي مورد نظر باكس رو تعيين كنيد .

 قسمتي رو كه با رنگ آبي مشخص كردم جهت حركت متن درون باكس رو مشخص مي كنه . كه بايد به دلخواه خودتون يكي از مقادير زير رو بهش بدين . اين مقادير رو به جاي كلمه ي "جهت" در كد بايد بزاريد :

جهت حركت

مقدار ريز كد direction

حركت از چپ به راست ( مخصوص متون فارسي)

Right

حركت از راست به چپ ( مخصوص متون انگليسي)

Left

حركت از پايين به بالا

Up

حركت از بالا به پايين

Down

براي خوندن و ياد گرفتن بقيه ي جزئيات ( قرار دادن لينك به جاي متن متحرك ، رنگ پس زمينه ي باكس ، ايستادن حركت متن با رفتن موس روي آن و ... ) ادامه ي مطلب رو ببينيد :

 اگر  بخوايد كه با رفتن موس روي باكس متن متحرك بايسته و حركت نكنه بايد دو ريز كد به كد بالا اضافه كنيد . كه ريز كدها در زير مشخصند :

direction="جهت"
width="150" height="180"
onmouseover="this.stop()"
onmouseout="this.start()"
 
scrolldelay="1"
scrollamount="1">

متن شما

  براي  تغيير سرعت حركت متن مي تونيد مقادير دو ريز كد  scrolldelay و  scrollamount رو تغير بديد . مقدار هر دو ريز كد در بالا "1" هست كه به نظر من استاندارده براي سرعت حركت متن و نيازي نيست كه تغيرش بدين . مگر اينكه جايي لازم باشه كه سرعت حركت متن رو بيشتر كنيد .

اگر بخوايد كه براي پس زمينه ي باكس يك رنگ قرار بدين بايد از ريز كد Style استفاده كنيد . در زير اين ريز كد مشخصه . شما بايد در جاهاي مشخص شده در زير ، كد رنگ يا نام رنگ به انگليسي رو وارد كنيد .

direction="جهت"
width="150" height="180"

Style="color:رنگ متن ; background-color:رنگ پس زمينه ;"
scrolldelay="1"
scrollamount="1">
متن شما

در زير كد چند تا از رنگ ها رو براتون گذاشتم كه مي تونيد در كد بالا بزاريد:

www.irLearning.com

 

www.irLearning.com

 

www.irLearning.com

قرمز

#FF0000

 

زرد

#FFFF00

 

بنفش

#800080

آبي

#0000FF

 

نقره اي

#C0C0C0

 

صورتي

#FF00FF

سياه

#000000

 

قهوه اي

#804000

 

نارنجي

#FF9900

سفيد

#FFFFFF

 

خاكستري

#EEEEEE

 

-

#DFDFDF

سبز

#008000

 

نيلي

#46B5FF

 

-

#8080C0

 با قرار دادن متن در بين دو تگ

و
مي توانيد متن را به وسط باكس بياوريد . يعني متن وسط چين باشد.

  اگر خواستيد كه لينك يا عكسي رو در باكس قرار بديد تا حركت كنه ، فقط لازمه به جاي متن كد لينك يا كد قرار دادن عكس رو بزاريد . كه كد لينك دادن و قرار دادن عكس به شكل زيره . اگر خواستيد چند لينك يا چند عكس بزاريد اونها رو با يه تگ
جدا كنيد تا توي چند سطر زير هم بيان . يعني بعد از هر كد لينك يا عكس يك تگ
بزاريد .