اینا رو گفتم که به این برسم که مدتی قبل در بخش Snippetهای سایت CSS-Tricks به این قطعه کد فوق مفید برخوردم که کاملاً valid هست در همه‌های مرورگرها هم به خوبی کار می‌کنه. داشته باشیدش یه جایی دم دست که خیلی به کار می‌خوره.

<object type="application/x-shockwave-flash"
data="your-flash-file.swf"
width="0" height="0">
<param name="movie" value="your-flash-file.swf" />
<param name="quality" value="high"/>
</object>

آیا راه بهتری برای چپاندن فیلم فلش در صفحه وجود داره؟

ساخت کروم قابل حمل

ابتدا کروم را از این‌جا دریافت کنید: http://build.chromium.org/buildbot/snapshots/chromium-rel-xp/
فایل را از حالت فشرده خارج کرده و از فایل chrome.exe یک کپی بگیرید تا از آن یک میانبر بسازید.
روی میانبر کلیک راست کرده و گزینه Properties را انتخاب کنید. در کادر مقابل Target عبارت زیر را وارد کنید:
–user-data-dir=Profile
میانبر خود را اجرا کنید. TADA!
همین!

دوست عزیزم مسلم هم هفته آینده مسابقات المپیاد طراحی وب داره. خواهش می‌کنم براش دعا کنید. امیدوارم مسابقه رو ضربه فنی کنی مسلم خان!

توابع پوسته به اون توابعی گفته می‌شه که به تهیه‌کننده پوسته امکان استفاده از اون‌ها رو با فراخوانی‌شون می‌ده. مثلاً the_title یه تابع هست که عنوان نوشته رو برمی‌گردونه؛ افزونه نظرسنجی وردپرس توابعی رو برای نمایش نظرسنجی در مکان دلخواه در پوسته فراهم کرده. برای معرفی توابع کافیه اون‌ها رو در فایل افزونه‌تون تعریف کنید و بعد اون توابع در دسترس پوسته‌ها هستند.
یه مثال کاربردی: می‌دونید که برای افزودن فرم جستجو به پوسته، یه فایل با محتویات زیر با نام مثلاً searchform.php ساخته می‌شه و بعد در سایر فایل‌های پوسته، include می‌شه.

فایل searchform.php

[php]
<form method="get" id="searchform" action="<?php echo $_SERVER['PHP_SELF'];

?>">
<div>
<input type="text" value="<?php echo wp_specialchars($s, 1); ?>" name="s" id="s"

/>
<input type="submit" id="searchsubmit" value="جستجو" />
</div>
</form>
[/php]

نحوه چپاندن فرم جستجو در فایل‌های پوسته:

[php]
<?php include (TEMPLATEPATH . "/searchform.php"); ?>
[/php]

حالا، بیاید یه تابع بسازیم تا بتونیم فرم جستجو رو با فراخوانی search یا search_form نمایش بدیم. فایل افزونه رو باز کنید و کدهای زیر رو توش قرار بدید:

[php]
<?php

function search_form() { ?>
<form method="get" id="searchform" action="<?php echo $_SERVER['PHP_SELF'];

?>">
<div>
<input type="text" value="<?php echo wp_specialchars($s, 1); ?>" name="s" id="s"

/>
<input type="submit" id="searchsubmit" value="جستجو" />
</div>
</form>
<?php } ?>

[/php]

این تابع فرم جستجو رو اکو می‌کنه. حالا در پوسته برای نمایش فرم جستجو کافیه تابع search_form رو فراخوانی کنید:

[php]
<?php search_form(); ?>
[/php]

این از این. حالا، وردپرس امکان گذاشتن کد برای اجرا لابه‌لای نوشته‌ها رو نمی‌ده (هرچند افزونه برای این موجوده). راه حل ارائه شده استفاده از shortcodeهاست. این‌ها ساختاری شبیه این دارند:

[shortcode param1="value" param2="value"]

مثلاً برای گذاشتن یه فرم نظرسنجی در نوشته از shortcodeها استفاده می‌شه. نیز shortcodeهای فراهم شده توسط خود وردپرس: (فوق‌العاده مفید)

[audio]: converts a link to an mp3 fle into an audio player
[digg]: embeds a voting button for your link on Digg
[fickr]: embeds a Flickr video
[googlemaps]: embeds Google Maps
[googlevideo]: embeds a Google Video
[livevideo]: embeds a video from LiveVideo
[odeo]: embeds an Odeo audio fle
[podtech]: embeds audio or video from the PodTech Network
[polldaddy]: embeds a PollDaddy poll(use without the space)
[redlasso]: embeds a video from Redlasso
[rockyou]: embeds a slideshow from RockYou
[slideshare]: embeds a slideshow from Slideshare.net
[sourcecode][/sourcecode]: preserves the formatting of source code
[splashcast]: embeds Splashcast media
[vimeo]: embeds a Vimeo video
[youtube]: embeds a YouTube video
(منبع: کتاب Wordpress 2.7 Cookbook)

نحوه ساخت این shortcodeها بدین صورت هست که باید یه تابع بسازید و به وردپرس بگید می‌خواید این تابع با چه shortcodeی اجرا بشه. برای این‌کار از تابع add_shortcode استفاده می‌کنیم. این تابع دو پارامتر می‌گیره، پارامتر اول نام shortcode و پارامتر دوم نام تابع هست:

[php]
add_shortcode(’search’, ’search_form’);
[/php]

الان تابع search_form ما با [search] فراخوانی می‌شه.
برای گرفتن پارامتر از shortcodeها ابتدا باید تو بخش تعریف آرگومان‌های تابع (بین پرانتزها) یه متغیر رو برای دسترسی به پارامترهای ارسالی مشخص کرد. یعنی:

[php]
function search($atts) {
[/php]

حالا باید دریافت‌شون کنیم:

[php]
extract(shortcode_atts(array(
‘dir’ => ”,
), $atts));
[/php]

اینو بذارید خط اول تابع. پارامترها رو تو اون آرایه تعریف می‌کنیم. مثلاً این‌جا یه پارامتر dir داریم که مقدار پیش‌فرضش رو هم خالی تعیین کردیم. بعد از اجرای این کد، به تک‌تک پارامترها به عنوان یه متغیر دسترسی داریم:

[php]
echo $dir."Hello!";
[/php]

dead easy!

در قسمت بعد راجع به تعریف ابزارک بحث می‌کنیم.

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

[js]
function toMorse(text) {

var text = text.toLowerCase(text),
len = text.length,
morse = [];

for (var i=1; i<=len; i++) {

switch (text.charAt(i-1)) {
case ‘a’ :
morse[i] = ‘.-’;
break;
case ‘b’ :
morse[i] = ‘-…’;
break;
case ‘c’ :
morse[i] = ‘-.-.’;
break;
….
}

}

return morse.join(’ ‘);

}

function deMorse(morse) {

var letters = morse.split(’ ‘),
text = ”;

for (var i=1; i<letters.length; i++) {

switch (letters[i].toString()) {

case ‘.-’:
text += ‘a’;
break;
case ‘-…’:
text += ‘b’;
break;
case ‘-.-.’:
text += ‘c’;
break;
….
}

}

return text;

}

[/js]

در تابع toMorse ما رشته رو دریافت می‌کنیم و به ازای هر کاراکتر با دستور switch کد مورس اون حرف رو برمی‌گردونیم. در deMorse هم ما رشته‌ی کد مورس رو می‌گیریم و با متد split رشته رو به آرایه‌ای تبدیل می‌کنیم که هر عضوش برابر با یک کاراکتره. باز هم دستور switch برای هر عضو آرایه و بازگردوندن کاراکتر متناظر اون.

مشاهده دمو

مدخل کد مورس در ویکی‌پدیا فارسی

قبل از ورود به طراحی وب، مشغول کاوش «شبکه»های رایانه‌ای، مباحث امنیت و مدیریت سیستم‌ها بودم. فکر می‌کردم شبکه مبحث‌ایه که هرچی در موردش مطالعه می‌کنی باز هم کمه. باید اقرار کنم وب هم مثل همون و شاید بدتره. “روزانه” در حال تغییره.

ضرب‌المثلی داریم که به زبون بومی می‌گه: «چَش اَتِرسِه، دس کار اَکُد» یعنی فرد با دیدن حجم کاری که باید انجام بده می‌ترسه ولی بعد که انجامش می‌ده می‌بینه چیز سختی هم نبوده. تا ببینیم چه شود.

قلاب‌های افزونه
وردپرس موقعی که می‌خواد کاری انجام بده ابتدا بررسی می‌کنه که آیا تابعی خودشو به این تابعی که الان می‌خواد اجرا بشه متصل کرده یا نه. در این صورت اون تابع رو اجرا می‌کنه. یک مثال. حتماً تا به حال موقع ساخت پوسته متوجه فراخوانی توابع wp_head و wp_footer در لابه‌لای تگ‌های HTML قالب شدید. دلیل فراخوانی این توابع اینه که اگر افزونه‌ای نیاز داشت اطلاعاتی در هدر یا فوتر بنویسه (مثلاً چسبوندن شیوه‌نامه خودش و یا نمایش اطلاعات) خودش رو بچسبونه به این توابع تا در زمانی که وردپرس مشغول رندر صفحه برای نمایش به کاربر هست اون توابع رو اجرا کنه.
تقریبا برای هر عملیاتی که وردپرس که انجام می‌ده قلاب‌های مناسب وجود داره. مثلاً وقتی که یه کاربر در سایت ثبت نام می‌کنه، وقتی یک مطلب جدید نوشته یا حذف می‌شه، وقتی دیدگاهی ارسال می‌شه، و… این قلاب‌ها این انعطاف‌پذیری رو به نویسنده‌ی افزونه می‌دن تا بتونه کدهای خودش رو در زمان مناسب اجرا کنه و تغییرات دلخواه رو در هسته وردپرس بدون دستکاری مستقیم فایل‌ها انجام بده.
لیستی از قلاب‌ها رو در این‌جا ببینید: http://codex.wordpress.org/Plugin_API

حالا، ما دو نوع قلاب داریم: Action و Filter. با استفاده از فیلترها وردپرس از توابع ما انتظار داره بعد از اجرای کدهاشون مقداری رو برگردونند (دستور return) ولی در اکشن‌ها نیازی به برگرداندن مقدار نیست. مثلا، می‌دونید که تابع the_content که درون حلقه وردپرس استفاده می‌شه محتوای نوشته‌ها رو برمی‌گردونه. ما می‌تونیم یه تابع بنویسیم و متصلش کنیم به این تابع the_content، کدهای مورد نظر رو روی محتوا اجرا کنیم (مثلاً ویرایش، تبدیل کاراکترها، اضافه کردن متنی به نوشته و…) و بعد باید خود محتوا رو دوباره به وردپرس برگردونیم.

تئوری کافیه! فایل افزونه‌ای که در آموزش قبلی ایجاد کردید رو باز کنید و کدهای زیر رو توش کپی کنید:

[php]
&lt;?php

add_filter(’the_content’, ‘bigbang’);

function bigbang($content) {

}
?&gt;
[/php]

اتصال تابع مورد نظر به یکی از توابع وردپرس با دستور add_filter انجام می‌شه. پارامتر اول تابعی هست که می‌خوایم بهش متصل شیم و پارامتر دوم تابع ما هست که عملیات پردازش رو انجام می‌ده. خیلی ساده، یه تابع با نام بیگ‌بنگ! معرفی کردیم تا زمان اجرای تابع the_content (که مسئول فرستادن محتوای نوشته به مرورگر هست) اجرا بشه.
الان با مرورگر خود به مسیر وردپرس‌تون برید. چی می‌بینید؟ بوم! محتوای پست‌ها نمایش داده نمی‌شه! این به این دلیل هست که همان‌طور که گفتیم فیلترها از توابع ما انتظار دارند مقداری رو برگردونیم. در واقع، با معرفی متغیر $content به عنوان پارامتر تابع سفارشی ما، می‌تونیم به محتوای ارسال شده از طرف وردپرس به تابع‌مون دسترسی داشته باشیم، روش عملیات انجام بدیم و در نهایت مقدار پردازش شده رو برگردونیم. با برنگردوندن مقدار وردپرس هیچی رو نمایش نمی‌ده.
وسط براکت‌های تابع دستور return $content; رو اضافه کنید. دوباره سایت رو ببینید: محتوا بدون تغییر نمایش داده می‌شه.
ایده رو گرفتید؟ کافیه متغیر $content رو ویرایش کنید و دوباره برش گردونید.
علاوه بر تابع add_filter، تابع add_action رو هم داریم که می‌تونیم به یه اکشن متصل بشیم. مثلا، گفتیم که تابع wp_head رو در بخش head فایل header.php فراخوانی می‌کنیم. می‌تونیم با add_action به اون تابع متصل بشیم و اطلاعات مورد نیازمون رو در بخش هدر سند تولید شده توسط وردپرس بنویسیم:

[php]
function dolly_css() {
echo &quot;
&lt;style type=’text/css’&gt;
#dolly {
position: absolute;
top: 4.5em;
margin: 0;
padding: 0;
}
&lt;/style&gt;&quot;;

}

add_action(’wp_head’, ‘dolly_css’);
[/php]

از اکشن استفاده کردیم، چون در این‌جا ما مقداری رو برگشت ندادیم (return) بلکه خیلی ساده با دستور echo اطلاعات رو به خروجی فرستادیم.

این‌ها رو داشته باشید تا در قسمت بعدی چندین افزونه مفید بنویسیم!

[js]
//I handle copying the db from local to storage dir
var installTo = air.File.applicationStorageDirectory
var installToFile = installTo.resolvePath("words.db")
if(!installToFile.exists) {
air.trace("Copying db file to "+installToFile.nativePath)
var installFromLoc = air.File.applicationDirectory
var installFromFile = installFromLoc.resolvePath("database/words.db")
air.trace("from "+installFromFile.nativePath)
try {
installFromFile.copyTo(installToFile,true)
} catch(error) {
//Total Failure…
alert(error.message+’\n’+error.details)
air.NativeApplication.nativeApplication.exit()
return
}
}

//connect to db
try {
dbcon = new air.SQLConnection()
var dbFile = air.File.applicationStorageDirectory.resolvePath("words.db")
dbcon.open(dbFile)
} catch(error) {
//Total Failure…
alert(error.message+’\n’+error.details)
air.NativeApplication.nativeApplication.exit()
return
}
[/js]
قطعه کد از همون مقاله بالا آورده شده.

مشکل اتصال حل شد، ولی من دیگه قصد تکمیل برنامه رو ندارم!
می‌تونید پیش‌نمایش اولیه اینترفیس رو ببینید:

مشاهده دمو :: توجه کنید که در دمو فقط سه گزینه اولی شامل محتوا هستند.

بخش اول: مقدمات

افزونه چیست؟
Codex وردپرس، افزونه را این‌گونه تعریف می‌کند:
افزونه وردپرس برنامه یا مجموعه‌ای از یک یا چندین تابع است که با زبان PHP نوشته شده باشند و به امکانات و یا سرویس‌هایی را به وردپرس می‌افزایند. این‌کار به کمک واسط برنامه‌نویسی افزونه وردپرس (Plugin Application Program Interface) صورت می‌گیرد. +

مشخصا، برای دنبال کردن مطالب شما باید آشنایی اولیه با PHP و نیز خود سیستم وردپرس داشته باشید (کتابچه راهنمای کامل وردپرس فارسی را ببینید).

ابتدا باید یک ایده‌ی کلی از آن‌چه افزونه شما می‌خواهد انجام دهد داشته باشید و سپس باید یک نام (که ترجیحاً منحصر به‌فرد باشد) برای آن انتخاب کنید. برای اطمینان از یکتایی نام، مخازن (Repository) افزونه‌ها را بررسی کنید و یا از گوگل کمک بگیرید.
به شاخه wp-content/plugins بروید و یک فایل php با نام دلخواه ایجاد کنید. کدهای افزونه می‌توانند در یک یا چندین فایل قرار بگیرند و خود افزونه نیز ممکن است تعدادی فایل‌های جانبی (تصاویر، کدهای جاوااسکریپت، شیوه‌نامه‌ها، فایل‌های زبان و…) داشته باشد. در چنین شرایطی برای ممانعت از شلوغ‌بازی در /plugins یک دایرکتوری مجزا برای افزونه درست کرده و فایل‌های افزونه را در آن‌جا قرار می‌دهیم.
می‌دانید که برای شناسایی پوسته‌ها توسط وردپرس باید اطلاعاتی را به ابتدای فایل style.css خود اضافه کنیم تا وردپرس آن را به عنوان یک پوسته شناسایی کند. برای افزونه‌ها نیز این مطلب صدق می‌کند. فایل php اصلی افزونه خود را باز کرده و اطلاعات زیر را در آن قرار دهید:

[php]
<?php
/*
Plugin Name: Name Of The Plugin
Plugin URI: http://URI_Of_Page_Describing_Plugin_and_Updates
Description: A brief description of the Plugin.
Version: The Plugin’s Version Number, e.g.: 1.0
Author: Name Of The Plugin Author
Author URI: http://URI_Of_The_Plugin_Author
*/
?>
[/php]

عناوین واضح‌اند. تنها تعریف لازم همان Plugin Name است و بقیه اطلاعات تنها برای نمایش در جدول صفحه مدیریت افزونه‌ها استفاده می‌شوند.
به صفحه مدیریت افزونه‌ها در محیط مدیریت بروید، می‌بینید که وردپرس افزونه را شناسایی کرده و آن را در لیست افزونه‌های غیرفعال قرار می‌دهد. روی دکمه «فعال کردن» کلیک کنید و افزونه را فعال کنید.
چه تغییراتی رخ داد؟ هیچ! هنوز به وردپرس نگفته‌ایم چه‌کار کند.
تبریک می‌گویم. اولین افزونه خود را نوشتید!

پی‌نوشت. لحن نوشته رسمی بود. فکر نکنم اصلاً از این جور نوشتن خوشم بیاد! در آموزش‌های بعدی لحن رو عوض می‌کنم. |)