مستندات سی‌شارپ

 آموزش و مستندات زیر برگرفته از چندین سایت مختلف معتبر از جمله StackOverflow و مستندات مایکروسافت است. این آموزش ها توسط من ترجمه شده و تغییرات و یادداشت هایی نیز به آن اضافه شده است.

توجه برای نمایش مطلب روی دکمه «ادامه مطلب» و یا عنوان کلیک کنید

ادامه مطلب

Windows Presentation Foundation

یا به اختصار WPF؛ تکنولوژی مایکروسافت برای طراحی نرم افزار های مدرن با تجربه کاربری بسیار قوی است که از ترکیب یکی از زبان های برنامه نویسی پشتیبانی شده توسط فریم ورک دات‌نت (معمولا C#) و زبان مارک‌آپ XAML بهره میبرد.

این زیرساخت بخشی از چهارچوب معروف مایکروسافت به نام  NET Framework. بوده و از مشهور ترین نرم افزار های ساخته شده توسط آن، محیط توسعه Visual Studio است. در این مطلب نگاهی اجمالی به ویژگی های این زیرساخت می‌اندازیم.

Microsoft Visual Studio, Written in C++ and C# with WPF Microsoft Visual Studio » and «Blend for Visual Studio», Written in C++ and C# with WPF»

امکانات WPF

  • Hardware Accelrated and Direct 3D: نرم‌افزار های توسعه داده شده با WPF به طور پیش‌فرض از امکانات مربوط به شتاب دهنده های گرافیکی، سخت افزاری و DirectX بهره میبرند. 
  • رابط کاربری XAML: رابط کاربری نرم افزار های WPF با مارک‌آپ XAML و Layout های بسیار کارا و قوی تعریف میشوند. به همین دلیل واکنش‌گرا کردن آن بسیار آسان و تغییرات رابط کاربری برای تغییرات احتمالی در آینده نیاز به تغییر بزرگی در بخش های متفاوت برنامه ندارد.
  • پشتیبانی از فرمت های چند رسانه ای: WPF انواع مختلفی از فرمت های چند رسانه ای و پخش کننده های آن ها را به طور پیش‌فرض در خود جای داده و پشتیبانی میکند.
  • تغییر آسان قالب ها و استایل ها: در WPF تغییر ظاهر کنترل ها و تعریف Template های جدید برای نمایش دیتا بسیار آسان است. به عنوان مثال میتوانید به محتوای یک لیست‌باکس کنترل های مختلف مثل عکس یا چک‌باکس اضافه کنید و تغییرات ظاهری متفاوتی را در آن اعمال کنید.
  • جهانی‌سازی: توسعه نرم افزار های چند زبانه و چند‌چینشی به وسیله امکاناتی که WPF در اختیار شما قرار میدهد بسیار آسان است.
  • پشتیبانی از اسناد XPS و PDF و ...: WPF از از امکانات مربوط به گزارش گیری و همچنین پردازش و ایجاد اسناد و کتاب های الکترونیکی بهره میبرد.
  • کتاب خانه ها: برای این زیر ساخت کتاب خانه ها و ابزار های متفاوت بسیاری توسعه داده شده است.
  • برنامه نویسی سه بعدی: در WPF، دقیقا همانند یک موتور بازی سازی امکانات مربوط به ایجاد اشیا گرافیکی و اعمال دوربین و انیمیشن بر روی آن ها تعبیه شده است. اگرچه طراحی سه بعدی در WPF سخت تر از موتور های بازی سازی ست.
  • انیمیشن: WPF از کتاب خانه ها و ابزار بسیار قدرتمندی در زمینه ساخت و توسعه انیمیشن روی کنترل ها و اشکال هندسی، تایم‌لاین ها و استوری‌برد ها بهره میبرد.
  • انقیاد داده: از آنجا که معماری ساخت نرم افزار در WPF مبتنی بر Model-View-ViewModel یا به اختصار MVVM است، انقیاد داده (Data Binding) به اشکال مختلف و بسیار کارآمد در آن پیاده سازی شده است.
  • گرافیک: رندر کننده گرافیکی WPF وابسته به وکتور ها و بردار های گرافیکی‌ست. لذا کیفیت تصاویر و همچنین ظاهر و ساختار برنامه در مانیتور ها با ریزولوشن های متفاوت حفظ می شود. همچنین در این زیرساخت تنظیمات متفاوتی مربوط به hdpi وجود دارد.

در مقایسه با Windows Forms

اگرچه که تکنولوژی فرم های ویندوزی (Windows Forms) تکنولوژی مرده ای نیست و همچنان پشتیبانی و استفاده می‌شود، اما کسانی که با هر دو تکنولوژی WPF و WinForms کار کرده اند و با جادوی WPF آشنایی دارند، برای طراحی نرم افزار های خود هرگز به سمت Windows Forms نمی روند. یکی از دلایلی که هنوز از Windows Forms استفاده می شود این است که امکانات کمتر ولی طراحی راحت تری دارد و برخلاف WPF؛ برای ساخت و توسعه نرم افزار ها شما نیاز به دانش عمیق در مورد اصول طراحی یک نرم افزار مهندسی شده ندارید. نقطه مشترک WPF و WinForms استفاده از رابط های برنامه نویسی Win32 یا همان Classic Desktop است.

در مقایسه با WinRT

نرم افزار های UWP نیز مانند WPF دارای رابط XAML هستند و به طور کلی، شباهت های بسیار زیادی از نظر کنترل ها و Layout با WPF دارند. برخلاف WPF که روی تمامی نسخه های ویندوز که دات نت فریم ورک روی آن نصب شده باشد قابل اجرا هستند، نرم افزار های UWP تنها روی ویندوز های 8 و بالاتر قابل اجرا هستند و بسته به نوع API میتوانند به سیستم عامل نسخه بالاتری نیاز داشته باشند.

نرم افزار های WPF نیز میتوانند به وسیله Desktop Bridge روی Windows Store قرار بگیرند و یا از امکانات ویژه سیستم عامل های به روز تر مانند Widnows 10 استفاده کنند. اما برای توسعه نرم افزار های ویژه این سیستم عامل ها، نرم افزار های Universal و WinRT انتخاب بهتری‌ست.

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

 راهنمای قدم به قدم


 ۱- نرم افزار کد ساز وبلاگ رو باز کرده و به بخش ساخت دکمه های گرافیکی برین.

۲- با اعمال تنظیمات مورد نظرتون روی ابزار روی دکمه «کد بساز» کلیک کنید و سپس روی دکمه «کپی کردن کد» کلیک کنید.

توجه کنید که اگه در بخش ساخت کد، تیک گزینه «شیوه نامه را نیز در کد درج کن» رو برداشتین حتما باید قبلش کد های CSS دکمه رو داخل بخش «ویرایش CSS قالب فعلی» سایتتون کپی کرده باشید. در غیر این صورت تیک این گزینه رو برندارید. کد های CSS در انتهای مطلب درج شدن.

در آموزش زیر تیک گزینه مورد نظر برداشته شده.

۳- با استفاده از راهنمای تصویری زیر ، وارد بخش ویرایشگر مطالب بلاگ HTML Code Editor بشین. بلاگ بیان دارای سه نوع ویرایش گر مختلفه که ورود به بخش Code Editor برای هر کدوم متفاوته. (در صورتی که از سیستم وبلاگدهی غیر از Blog.ir استفاده میکنید با مراجعه به راهنمای وبلاگ بخش ویرایشگر خودتون رو پیدا کنید)

  • ۳- الف: ویرایشگر ساده بلاگ بیان (پیش فرض)
    در صورتی که از ویرایشگر پیش فرض بلاگ بیان استفاده میکنین با استفاده از دکمه <> ، بخش ویرایش کد را فعال کنید و بعدش کد دکمه رو اونجا بچسبونین. 
  • ۳- ب: ویرایشگر CK-Editor
    در صورتی که از قسمت تنظیمات مرکز مدیریت بلاگ ویرایشگر خودتونو به ویرایشگر CKEditor تغییر دادین از دکمه «منبع» برای ورود به بخش ویرایش سورس استفاده کنید.
  • ۳- پ: ویرایشگر پیشرفته TinyMCE
    در صورتی که از قسمت تنظیمات مرکز مدیریت بلاگ ویرایشگر خودتونو به ویرایشگر TinyMCE کامل تغییر دادین از دکمه «HTML» برای ورود به بخش ویرایش سورس استفاده کنید. بعد از اون یه پاپ آپ باز میشه که کد ها باید اونجا نوشته بشه.

کد CSS دکمه ها

.button{text-decoration:none;color: #fff;font-weight:bold;padding:12px 20px;font-size:18px;border-radius:10px;background-color:#666666;box-shadow:0 5px 5px #313131,0 9px 0 #393939, 0px 9px 10px rgba(0,0,0,0.4),inset 0px 2px 9px rgba(255,255,255,0.2),inset 0 -2px 9px rgba(0,0,0,0.2);position:relative;border-bottom:1px solid rgba(255,255,255,0.2);display:inline-block;font-family:b nazanin,b koodak,Arial,Helvetica,sans-serif !important;text-shadow:0px -1px 0px rgba(0,0,0,0.2);}.button:hover{box-shadow: 0 5px 5px #313131, 0 9px 0 #393939, 0px 9px 10px rgba(0,0,0,0.4),inset 0px 2px 15px rgba(255,255,255,0.4), inset 0 -2px 9px rgba(0,0,0,0.2);color:#fff!important;}.button:active{top:7px;box-shadow:0 2px 0 #393939,0px 4px 4px rgba(0,0,0,0.4),inset 0px 2px 5px rgba(0,0,0,0.2);color: #fff !important;}.shield {border-radius:5px 5px 35px 35px;padding-left:25px;padding-right: 25px;}.criss-cross{border-radius:35px 5px;}.rectangular{border-radius:10px / 35px;}.one-corner{border-radius:5px 5px 35px 5px;padding-right:25px;}.red{background-color:#c34747;box-shadow:0 5px 5px #853232,0 9px 0 #5e2525,0px 9px 10px rgba(0,0,0,0.4),inset 0px 2px 9px rgba(255,255,255,0.2),inset 0 -2px 9px rgba(0,0,0,0.2);}.red:hover{box-shadow:0 5px 5px #853232,0 9px 0 #5e2525,0px 9px 10px rgba(0,0,0,0.4),inset 0px 2px 15px rgba(255,255,255,0.4),inset 0 -2px 9px rgba(0,0,0,0.2);}.red:active{box-shadow: 0 2px 0 #5e2525,0px 4px 4px rgba(0,0,0,0.4),inset 0px 2px 5px rgba(0,0,0,0.2);}.orange {background-color:#c37846;    box-shadow:0 5px 5px #855031,0 9px 0 #5e3a25,0px 9px 10px rgba(0,0,0,0.4),inset 0px 2px 9px rgba(255,255,255,0.2),inset 0 -2px 9px rgba(0,0,0,0.2);}.orange:hover{box-shadow:0 5px 5px #855031,0 9px 0 #5e3a25,0px 9px 10px rgba(0,0,0,0.4),inset 0px 2px 15px rgba(255,255,255,0.4),inset 0 -2px 9px rgba(0,0,0,0.2);}.orange:active {box-shadow:0 2px 0 #5e3a25,0px 4px 4px rgba(0,0,0,0.4),inset 0px 2px 5px rgba(0,0,0,0.2);}.green {background-color: #7fc345;box-shadow:0 5px 5px #508530,0 9px 0 #385e25,0px 9px 10px rgba(0,0,0,0.4),inset 0px 2px 9px rgba(255,255,255,0.2),inset 0 -2px 9px rgba(0,0,0,0.2);}.green:hover {box-shadow:0 5px 5px #508530,0 9px 0 #385e25,0px 9px 10px rgba(0,0,0,0.4),inset 0px 2px 15px rgba(255,255,255,0.4),inset 0 -2px 9px rgba(0,0,0,0.2);}.green:active {box-shadow: 0 2px 0 #385e25,0px 4px 4px rgba(0,0,0,0.4),inset 0px 2px 5px rgba(0,0,0,0.2);}.pink {box-shadow:0 5px 5px #782d54,0 9px 0 #5e254c,0px 9px 10px rgba(0,0,0,0.4),inset 0px 2px 9px rgba(255,255,255,0.2),inset 0 -2px 9px rgba(0,0,0,0.2);background-color: #d7298b;}.pink:hover {box-shadow:0 5px 5px #782d54,0 9px 0 #5e254c,0px 9px 10px rgba(0,0,0,0.4),inset 0px 2px 15px rgba(255,255,255,0.4),inset 0 -2px 9px rgba(0,0,0,0.2);}.pink:active {box-shadow:0 2px 0 #5e254c,0px 4px 4px rgba(0,0,0,0.3),inset 0px 2px 5px rgba(0,0,0,0.2);}.blue {background: #2a8ad8;box-shadow:0 5px 5px #364a8e,0 9px 0 #25325e,0px 9px 10px rgba(0,0,0,0.4),inset 0px 2px 9px rgba(255,255,255,0.2),inset 0 -2px 9px rgba(0,0,0,0.2);}.blue:hover {box-shadow:0 5px 5px #364a8e,0 9px 0 #25325e,0px 9px 10px rgba(0,0,0,0.4), inset 0px 2px 15px rgba(255,255,255,0.4),inset 0 -2px 9px rgba(0,0,0,0.2);}.blue:active{box-shadow:0 2px 0 #25325e,0px 4px 4px rgba(0,0,0,0.3),inset 0px 2px 5px rgba(0,0,0,0.2);}.purple{background-color:#8a26d3;box-shadow:0 5px 5px #54307b,0 9px 0 #3f255e, 0px 9px 10px rgba(0,0,0,0.4),inset 0px 2px 9px rgba(255,255,255,0.2),inset 0 -2px 9px rgba(0,0,0,0.2);}.purple:hover {box-shadow: 0 5px 5px #54307b, 0 9px 0 #3f255e, 0px 9px 10px rgba(0,0,0,0.4), inset 0px 2px 15px rgba(255,255,255,0.4), inset 0 -2px 9px rgba(0,0,0,0.2);}.purple:active{box-shadow:0 2px 0 #42255e,0px 4px 4px rgba(0,0,0,0.3),inset 0px 2px 5px rgba(0,0,0,0.2);}

 ایجاد متن تایپ شونده (TypeWriter) در بلاگ های بیان


شاید در وب گردی هاتون سایت هایی رو دیده باشید که دارای اخباری هستند که ماشین تایپشون میکنه و کاربر میتونه روی خبر مورد نظر کلیک کنه. در این مطلب میخوام ساخت این ابزار رو در وبلاگ های بیان آموزش بدم. اول از همه نیازه که کد jQuery رو داخل قالبتون قرار بدید:

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>

پس از قرار دادن کد jQuery باید کد TypeWriter رو در قالب قرار بدید:

<script> /*! * jquery.typer.js 0.0.4 - https://github.com/yckart/jquery.typer.js * The typewriter effect * * Copyright (c) 2013 Yannick Albert (http://yckart.com) * Licensed under the MIT license (http://www.opensource.org/licenses/mit-license.php). * 2013/03/24 */ (function($){ $.fn.typer = function(text, options){ options = $.extend({}, { char: '', delay: 2000, duration: 600, endless: true, onType: $.noop, afterAll: $.noop, afterPhrase: $.noop }, options || text); text = $.isPlainObject(text) ? options.text : text; text = $.isArray(text) ? text : text.split(" "); return this.each(function(){ var elem = $(this), isVal = {input:1, textarea:1}[this.tagName.toLowerCase()], isTag = false, timer, c = 0; (function typetext(i) { var e = ({string:1, number:1}[typeof text] ? text : text[i]) + '', char = e.substr(c++, 1); if( char === '<' ){ isTag = true; } if( char === '>' ){ isTag = false; } elem[isVal ? "val" : "html"](e.substr(0, c) + ($.isFunction(options.char) ? options.char() : options.char || ' ')); if(c <= e.length){ if( isTag ){ typetext(i); } else { timer = setTimeout(function() { typetext(i); }, options.duration/10); /* timer = setTimeout(typetext, options.duration/10, i); */ } options.onType(timer); } else { c = 0; i++; if (i === text.length && !options.endless) { return; } else if (i === text.length) { i = 0; } timer = setTimeout(function() { typetext(i); }, options.delay); /*timer = setTimeout(typetext, options.delay, i); */ if(i === text.length - 1) options.afterAll(timer); options.afterPhrase(timer); } })(0); }); }; }(jQuery)); </script>

حالاپس از قرار دادن اسکریپت های بالا کد زیر رو در یه قسمت دلخواه از بخش <body> کد های قالبتون قرار بدید:

<box:daily_links>
    <script>
     $(document).ready(function() {
     $('#typer').typer( [  
              <view:daily_links>
                     '<a alt="(*link_alt*)" href="(*link_url*)" target="_blank"><span>(*link_name*)</span></a>',
              </view:daily_links>                                                                                                                                        
]); });</script>
</box:daily_links>

و در آخر هم کد زیر رو در هر جای قالب قرار بدید تبدیل به متن تایپ شونده میشه:

<div id="typer"></div>

توجه کنید که این ابزار لیست "پیوند های روزانه" شما را به عنوان اخبار نشان میدهد

 خاموش روشن شدن عناصر وب (Fade)

 برای استفاده این کد نیاز به افزودن کد jQuery به وبلاگتون هست. اگه قبلا برای

ابزار های دیگه این کد داخل وبلاگتون اضافه کردید دوباره نیازی نیست این کد پایین

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

نکردید کد زیر رو بعد از تگ <body> اضافه کنید

کد jQuery:

<script src="http://code.jquery.com/jquery-latest.js"></script>

پس از کد jQuery این کد رو هم اضافه کنید. افزودن این کد الزامیه:

<script>$(document).ready(function(){function sfade(){$('.fade').fadeTo(500,0).fadeTo(500,1);}setInterval(function(){sfade();},0)}); </script>

حالا هر عنصری رو که میخواید خاموش روشن بشه بهش کلاس fade بدید.به عنوان مثال:

<div class="fade">یک دایو</div>
<p calss="fade">یک پاراگراف</p>
<img class="fade" src="آدرس تصویر">

  برخی سوالات بسیار رایج در رابطه با نرم افزار ارسال پیامک اینترنتی که پرسیده میشود

 1- آیا برای استفاده نرم افزار باید پولی پرداخت کنم؟

  • این نرم افزار به صورت کاملا رایگان توسط آرین نرم افزار ساخته شده است و نیاز به خرید ندارد. ارسال پیامک نیز توسط شرکت کاوه نگار پشتیبانی میشود و برای تست نرم افزار و همچنین به ازای هر شماره همراه شما ۵۰۰۰ ریال شارژ رایگان دریافت میکنید

 2- چگونه باید پیامک بدهم؟

  • برای ارسال پیامک ابتدا از سایت آرین نرم افزار , نرم افزار ارسال پیام را دانلود کنید. سپس با استفاده از راهنمای موجود در نرم افزار یا سایت اقدام به ارسال پیامک کنید. ارسال پیام نیاز به یک کد رایگان API دارد که از طرف شرکت کاوه نگار پس از ثبت نام در اختیار شما قرار میگیرد. برای ارسال پیام ابتدا این کد را در بخش تنظیمات برنامه وارد کنید

 3- حریم خصوصی من چگونه خواهد بود؟ آیا پس از ارسال پیامک دیگران شماره من را میبینند؟

  • حریم خصوصی شما اعم از نام و نام خانوادگی نزد کاوه نگار کاملا محفوظ است ؛ به گونه ای که پس از ثبت نام در کاوه نگار ۲ الی ۳ خط اختصاصی در اختیار شما قرار میگیرد که هر بار میتوانید با یکی از آنها پیام دهید. اما در صورتی که از خطوط عمومی استفاده میکنید، شماره همراه ثبت نام شده به منظور جلوگیری از سو استفاده به پیامک ضمیمه خواهد شد

 4- آیا دریافت کننده و یا ارسال کننده باید اینترنت داشته باشد؟

  • هیچ نیازی نیست که دریافت کننده پیام شما دارای خدمات اینترنت باشد و ارسال پیام از طریق دکل های اپراتور های تلفن صورت میگیرد اما ضروریست که فرستنده به اینترنت مجهز باشد

 5- من نرم افزار را نصب کرده ام اما با خطای Framework مواجه میشوم

  • نرم افزار ارسال پیامک برای اجرا شدن نیاز به نرم افزار Dot Net Framework 4 دارد. این نرم افزار به طور خودکار روی اکثر سیستم های خانگی سیستم عامل ویندوز نصب است اما در صورتی که این نرم افزار روی سیستم شما نصب نیست میتوانید از طریق این لینک اقدام به نصب آن کنید

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

  • ممکن است که هیچ کد API را وارد نکرده باشید و یا کد API را اشتباه وارد کرده باشید
  • ممکن است پراکسی در کامپیوتر شما فعال باشد و نرم افزار قادر به برقراری با سرور نباشد
  • ممکن است سرور کاوه نگار به مدت معدودی مشغول باشد (چنین چیزی تا کنون رخ نداده است)
  • شماره ارسال اینترنتی و شماره دریافتی را چک کنید. همچنین متن پیام نباید خالی باشد

 7- شارژ حسابم تمام شد! چگونه پیامک بدهم؟

  • شما میتوانید با مراجعه به سایت کاوه نگار و در حساب کاربری خود اقدام به شارژ بیشتر حساب خود کنید. توجه داشته باشید که برای شارژ نیاز به خط اختصاصی دارید

 8- خط اختصاصی چیست؟ تفاوت آن با خطوط عمومی در چیست؟

  • خطوط اختصاصی خطوطی با شماره دلخواه شما هستند که از طریق سایت کاوه نگار خریداری میشوند. اما خطوط عمومی پس از ثبت نام در کاوه نگار  به طور رایگان به شما داده میشود که دیگران نیز از همین خطوط استفاده خواهند کرد. توجه کنید که خطوط عمومی قابلیت دریافت پیام را ندارند و فقط میتوانند پیام ارسال کنند

  •  این هم یک کد خوش آمد گویی زیبا به درخواست دوست عزیز:
پیشنهاد میکنیم این ابزار را با نرم افزار کد ساز وبلاگ بسازید

<!-- Welcome Message by aryan-pc.blog.ir -->
<style>.cookie-notification-jc > div {background: none repeat scroll 0 0 #FFFFFF;border: 0 solid #FF0000;bottom: 10px;box-shadow: 0 0 15px #000000;float: right;padding: 30px 15px 15px;position: absolute;right: 10px;width: 260px !important;}.bottom {bottom: 0;left: 0;position: fixed;right: 0;}.cookie-notification-jc {color: #FFFFFF;display: block;height: 100%;left: 0;line-height: 1.4em;padding: 0;position: fixed;top: 0;z-index: 1000000;}.cookie-notification-jc-accept {background: url("http://www.bitc.ie/wp-content/themes/bitc2013/images/closebox.png") no-repeat scroll left top rgba(0, 0, 0, 0);float: left;font-size: 0;height: 30px;left: -33px;margin-right: -30px;overflow: hidden;padding: 0;position: relative;text-indent: -50em;top: -43px;width: 30px;}.cookie-notification-jc-details {color: #EC068D;font-size: 0.9em;padding: 0;transition-duration:1s;}.cookie-notification-jc-details a {color: #BBBBBB;text-decoration: none;color: #ED2025;}.cookie-notification-jc-details a:hover {color: #FFA900;}</style>
<script>function closeBox(toClose) {document.getElementById(toClose).style.display = "none";}</script>
<div id="cookie-notification-jc" class="cookie-notification-jc bottom" style="background-color: rgba(30, 30, 30, 0.2);">
    <div style="width:95%; margin: 0 auto;">
    <span style="cursor: pointer;" onclick="closeBox('cookie-notification-jc'); return false;" class="cookie-notification-jc-accept">Continue</span>
        <h2 style="margin: -5px 0px 0px ! important; font-weight: bold; color: black; float: right; direction: rtl;">آرین نرم افزار</h2><br>
           <p style="color: rgb(112, 112, 112); float: right; direction: rtl;">این بخش مربوط به توضیحات و اطلاعات اضافه است ؛ آن را مطابق میل خود ویرایش کنید<br><br>
        <span class="cookie-notification-jc-details"><a href="http://aryan-pc.blog.ir">ورود به وبلاگ</a></span>
        <span class="cookie-notification-jc-details"> - </span>
        <span class="cookie-notification-jc-details"><a href="http://aryan-pc.blog.ir/page/Friends">تبادل لینک</a></span>
        </p>
    </div>
</div>
<!-- end of Welcome Message by aryan-pc.blog.ir -->

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

برای استفاده از این کد نیازی به امکانات جاوا اسکریپت نیست

 با استفاده از کد زیر میتوانید یک منو کشویی زیبا در کنار سایت خود ایجاد کنید. کد زیر را در بخش ساختار قالب خود

و در بین دو تگ <body></body> در محل مناسب کپی کنید

متن پیشفرض منو عبارت "گزینــه های سایت" است. در صورتی که مایلید متن انتخابی مخصوص خودتان بر کنار منو نوشته شود از طریق بخش نظرات اعلام کنید تا منو ویژه شما را بسازیم - نمونه ای از این منو در کنار سایت ما قرار دارد

این ابزار قدیمی شده است ؛ پیشنهاد میکنیم این منو را با ویرایش های بهتر اعم از فیت کردن زیرمنو ها و همچنین بازگشت انیمیشنی با نرم افزار کد ساز وبلاگ بسازید
<style>#support{position:fixed;top:110px;right:0;width:200px; height:126px;}#supporting {background: url("http://bayanbox.ir/id/5496439216747475432?view") no-repeat scroll left center rgba(0, 0, 0, 0);float: right;height: 126px;width: 35px;transition-duration:1s;}#supp {float:right;margin-right:-165px; background:#eaeaea;border:1px solid #bfbfbf;border-left:none;width:165px; height:124px;}#supporting:hover #supp {display:block;margin-right:-166px;}#supporting:hover {padding-right:165px;transition-duration:1s;}#supp a{display:block; width:140px;direction:rtl;text-align:right;background:#e3e3e3;font:bold 11px tahoma;padding:4px 8px 8px 8px;text-shadow:1px 1px 0px rgba(256,256,256,0.3); margin:1px 5px 5px;color:#666;}#supp a:hover {background:#2ea1c0;text-shadow:1px 1px 0px rgba(0,0,0,0.2);color:#fff;}#supp a img {float:left;}</style>
<!-- Side Menu From aryan-pc.blog.ir -->
<div id="support">
 <div id="supporting">
  <div id="supp">
    <a href="http://" target="_blank">صفحه اصلی</a>
   <a href="http://">تبادل لینک با ما</a>
   <a href="http://" target="_blank">پروفایل مدیر</a>
   <a href="ymsgr:sendim?your_id">گفت و گو در یاهو</a>
  </div>
 </div>
</div>
<!-- end of Side Menu from aryan-pc.blog.ir -->

 برای افراد بازدید کننده میهمان خود که در سایت بلاگ عضو نیستند , هنگام رای دادن به مطالب شما متن زیر نمایش داده میشود:

جهت جلوگیری از آراء غیر واقعی، رای دادن تنها برای اعضای بیان ممکن است. اگر قبلا ثبت نام کرده اید لطفا ابتدا وارد شوید، در غیر این صورت می توانید هم اکنون ثبت نام کنید

مزیت: برای استفاده از این کد نیازی به فعال کردن جاوا اسکریپت نیست

<style>.jqimessage:before{display: inline-block;content: 'متن دلخواه شما';}.jqimessage:hover:before{display: inline-block;content: 'متن دلخواه شما وقتی که موس بر روی جعبه پیام برده میشود';}</style>

 توجه کنید که در کد بالا دو عبارت "متن دلخواه شما" و "متن دلخواه شما وقتی که موس بر روی جعبه پیام برده میشود" را ویرایش کرده و متن خود را جایگزین کنید

تمامی آموزش ها و پروژه های آرین نرم افزار مخصوص این سایت است و رونوشت شده از هیچ سایت دیگری نمیباشد لذا برای استفاده از مطالب لطفا منبع را نیز ذکر کنید

ایجاد تولتیپ های گرافیکی


دوستانی که از سایت بلاگ استفاده میکنند ابتدا باید از طریق امکانات اختیاری جاوا اسکریپت خود را فعال کنند

برای نمایش دموی این Tooltip موس خود را روی تصویر رو به رو ببرید:




چگونه از این کد در سایت خودم استفاده کنم؟

  • ابتدا کد زیر را بین دو قسمت <head> و </head> در ساختار قالب خود کپی کنید
<script src="http://rozup.ir/up/gdl/gdl1/js/qTip.js" type="text/javascript"></script>
<link href="http://rozup.ir/up/gdl/css/form.css" rel="stylesheet" type="text/css">

  • سپس برای افزودن این تولتیپ به لینک ها, تصاویر, متون و ... خود کافیست عبارت title="متنی که میخواهید نمایش داده شود" را به کد های آن ها اضافه کنید. به مثال های زیر توجه کنید:

برای تگ های پاراگراف و متنی:

<p title="Your Tooltip"> Your Text </p>

برای تگ های تصویری:

<img title="Your Tooltip" src="Image Address">

برای تگ های هدایت کننده (لینک ها):

<a title="Your Tooltip" href="Link Address"> Link Text </a>

توجه داشته باشید که تکه کد ""=title برای هر تگی قابل استفاده است