۱۳۸۹ تیر ۲, چهارشنبه

شیوه ی نمایش کدهای جاوااسکریپت در بلاگر

با عرض سلام و خسته نباشید خدمت شما دوستان عزیزم 
امروز که من خیلی خسته شدم 
از دیروز که خواستم یک تکه از یک متن اچ تی ام ال یا جاوااسکریپت رو توی متن وبلاگم و بعبارتی توی پست های وبلاگ خودم قرار بدم ، واقعا کلی بدبختی کشیدم تا اینکه بفهمم که باید چی کار بکنم .
اینترنت ، یک منبع خوب برای یادگیریه ، ولی یه مشکلی داره که اطلاعاتش اکثرا پراکنده هستند . 
بهرحال قبلا براتون نوشته بودم که چطوری باید یه کاری کنیم که بشه کدهای جاوااسکریپت یا اچ تی ام ال رو توی وبلاگ نوشت .
اما خوب ، وقتی یک کد توی یه خط خیلی بلند نوشته شده ، کلا می زنه از پنجره می ره بیرون ، حتی ساید بار شما هم زیرش قرار می گیره و کلی مکافات . 
رفتم نیگاه کردم ، دیدم توی سایت گوگل یا سایتای دیگه ، یه پنجره ای هستش که همه ی این کدها توی اون پنجره قرار داره و همه چی خیلی مرتبه . 
حتی اون پنجره ، زیرش یه اهرمی داره که می تونی باهاش این ور و اون ور بری و کل مطلب رو بخونی . بهرحال کلی باهاش حال کردم دیگه . 
اما این که آخر ماجرا نبود . 
حالا چه جوری می شه این پنجره رو درست کرد ؟
چی کار باید بکنم ؟
خب ، 
یه تغییراتی لازمه تا بتونیم به این پنجره دست پیدا کنیم . 
اون پنجره ، همونیه که الان دارین اینجا می بینین .



<div id='main-wrapper'>
    <b:section class='main' id='main' showaddelement='no'>
        <b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
    </b:section>
</div>
<div id='sidebar-wrapper'>
    <b:section class='sidebar' id='sidebar' preferred='yes'>
        <b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/>
        <b:widget id='HTML1' locked='false' title='' type='HTML'/>
        <b:widget id='Label1' locked='false' title='Labels' type='Label'/>
    </b:section>
</div>


پنجره ای که این بالا می بیننین ، همینطوری آزمایشی براتون گذاشتم که بفهمین منظورم چیه . 
پس می خوایم یه همچین چیزی درست کنیم . 
حالا 
این کدهایی که این زیر می بینین ، برامون مهم هستن .

.postCode{
 background:lightyellow none repeat scroll 0 0;
 border:1px inset orange;
 height:150px;
 margin:10px;
 overflow:auto;
 padding:6px;
 text-align:left;
}

خب ، 
این کدها رو که می بینین ، باید از اینجا کپی کنین و ببرین توی قالب وبلاگ خودتون بچسبونین . 
متوجه که شدین . مگه نه ؟
نیگاه کنین .
اگه وبلاگتون ، مال بلاگر باشه ، تقریبا اینطوریه که می گم : 
اگه روی قسمت ناوبر ، یعنی قسمت بالای بالای وبلاگتون نیگاه کنین 
یه جایی نوشته طرح ، که البته این قسمت ، تازه به بلاگر اضاف شده و تا یه ماه پیش ، خبری ازش نبود . 
بهر حال روش کلیک می کنین 
یه صفحه میاد 
همون بالا روی قسمت « بازگشت به مجموعه اطلاعات » کلیک کنین 
بعدشم روی قسمت « ویرایش اچ تی ام ال » کلیک کنین . 
خوب 
حالا کار اصلیتون شروع می شه .
قسمت اول اون کدهایی که می بینین ، تعاریف قسمتهای مختلف وبلاگه که ما باهاش کاری نداریم . 
توی کد وبلاگ من قسمتهای زیر هستش .که زیر هر قسمت یه خط کشیده و کلی مطلب هم زیرش نوشته شده . 
content
body
header
tabs
columns
headings
posts
accents
خوب ، 
حالا این کدهایی رو که  توی پنجره ی دومی براتون گذاشته بودم ، کپی کنین .
 اما کجا باید بذارین ؟
یکی از قسمت های بالا چی بود ؟
posts
برین آخرین خط از قسمت پست 
جایی که دیگه مطالبش تموم می شه و قسمت بعدی می خواد شروع بشه . 
قسمت بعدی چی بود ؟
accent
خوب ، اونا رو می چسبونین توی آخرین قسمت پست . 
دیگه تقریبا کارتون تموم شده و می تونین یه خسته نباشید به خودتون بگید . 
از این به بعد ، هر وقت که دلتون خواست مطالبتون توی یه همچین پنجره هایی که توی این صفحه دیدین باز بشه باید مطالبتون رو بین این دو تا کد وارد کنین .


<pre class="postCode">
YOUR CODE
</pre>
یعنی چی ؟
یعنی به خط اول و سوم که کار ندارین . 
اما به جای خط وسطی ، اون چیزی رو می ذارین که دوست دارین باشه . 
مثلا کدهای جاوااسکریپت .
درسته ؟

اما یه چیز دیگه یادتون نره ها !
نباید کدهای جاوااسکریپت به طور مستقیم ، نوشته بشن توی وبلاگ . 
چون اونا اجرایی هستن و اجرا می شن و توی متن وبلاگ نمی رن . 
اگه نمی دونین چه طوری باید این کارو بکنین ، این قسمت رو هم بخونین

هیچ نظری موجود نیست:

ارسال یک نظر

بازدیدکننده ی گرامی ، از اینکه بنده رو مفتخر به دریافت نظرات ارزشمند خودتون می کنید ، متشکرم . حسین حقگو

Free counter and web stats