چگونه شکل های مختلف در پاورپوینت را با هم ادغام کنیم؟

پاورپوینت کتابخانه‌ای غنی از اشکال مختلف دارد که می‌توانید با استفاده از آن‌ها گرافیک‌های کاربردی مانند فلوچارت‌ها را ایجاد کنید. همچنین قادر هستید به ادغام شکل ها در پاورپوینت بپردازید. در این مطلب قصد داریم چگونگی ادغام شکل ها در …

نوشته چگونه شکل های مختلف در پاورپوینت را با هم ادغام کنیم؟ اولین بار در دیجیاتو پدیدار شد.

گردآوری توسط ایده طلایی

استفاده از Vue در WordPress

سلام به همه‌‌ی دوستان ٬ تو این نوشته قصد دارم نحوه‌ی استفاده از فریم ورک محبوب Vue.js در وردپرس آموزش بدم.

این نوشته آموزشی برای کسانی است که در WordPress و vue قبلاً کد زدن و یا علاقه‌مند هستند.

سطح این نوشته متوسط هستش و جاهایی که نیاز به توضیح هست رو توضیح دادم ٬ امیدوارم نهایت استفاده رو ببرید.

شاید کسانی که تو زمینه طراحی تم و پلاگین وردپرس هستن براشون سؤال پیش بیاد چرا باید از ‌Vue.js استفاده کنیم؟

پاسخ کوتاه اینه که vue به خاطر سادگی و استحکامش شناخته میشه و اونو به یک انتخاب محکم برای توسعه تبدیل میکنه.

وردپرس از React استفاده میکنه ٬ آیا میتونیم از Vue.js استفاده کنیم؟

درسته بعضی ویژگی‌های WordPress با React نوشته شده اما ما رو محدود نمیکنه.

خوب ما میخوایم یک پلاگین shortcode بسازیم که چیزی که توسط Vue تولید میشه رو نمایش بده

مراحلی که قراره طی این آموزش طی کنیم:

۱−ساخت پلاگین وردپرس

۲−ایجاد یک shortcode در پلاگین

۳−ایجاد فایل Vue

مرحله اول:ایجاد پلاگین وردپرس

۱: به مسیر وردپرس خودتون برین ٬ سپس پوشه wp-content رو باز کنید و بعد پوشه plugins رو باز کنید

۲:یک فولد به نام wp-vue-tutorial ایجاد کنید ٬ مسیرتون باید تا الان به این صورت باشه:

/wp-content/plugins/wp-vue-tutorial

۳:فایلی به نام wp-vue-tutorial.php که همنام فولدر ایجاد شده است بسازید.(توجه داشته باشید که فایلی که ساختید حتماً هم نام فولدر پلاگین باشه تا وردپرس بتونه پلاگین رو تشخیص بده)

مسیر فایلی که ساختید:

/wp-content/plugins/wp-vue-tutorial/wp-vue-tutorial.php

۴:فایلی که ساختید رو باز کنید و کد زیر رو وارد کنید:


نکته: اگر به پلاگین نویسی وردپرس علاقه دارید حتماً به :https://developer.wordpress.org/plugins سر بزنید.

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

خوب تا اینجا هنوز کدی نزدیم ولی قراره یه پلاگین shortcode بسازیم ٬ خوب shortcode اصلاً چی هست؟

جواب:یک shortcode به WordPress میگه که محتوای تولید شده توسط کد PHP شما را در محتوای صفحه یا پست وارد کن و نمایش بده.مثال:مثلاً کاربر میزنه [‘mycode’] و وقتی صفحه بارگذاری شد محتویات shortcode رو نشون میده.

۶:کد زیر رو به فایل wp-vue-tutorial.php اضافه کنید:

//Add shortscode
 function func_wp_vue(){
   return "Hello Shortcode";
}
add_shortcode( 'wpvue', 'func_wp_vue' );

توضیحات کد:

تابع () func_wp_vue به ما “Hello Shortcode” رو بر میگردونه

‌تابع add_shortcode ٬ shortcode رو به وردپرس اضافه میکنه پارامتر اول که میگیره اسم کد کوتاه هست (همون [‘mycode’] که قبل تر توضیح دادم) و پارامتر بعدی تابعی هست که یک رشته رو برای نمایش shortcode برمیگردونه.

فایلتون تا الان باید اینجوری باشه:

الان برید یه صفحه یا پست جدید بسازید و shortcode یا کدکوتاه رو به این صورت وارد کنید:[‘wpvue‘]

وقتی برید صفحه یا پست رو ببنید باید نوشته باشه:Hello ShortCode

خوب حالا کد رو به صورت زیر تغییر بدید:

"
    ."Message from Vue: "
    ."
"; return $str; } add_shortcode( 'wpvue', 'func_wp_vue' ); ?>‌// end function

مرحله دوم:راه‌اندازی Vue

۱−فایل Vue باید تو صفحه بارگذاری شه تا پلاگین کار کنه

۲−ما به یک المنت html نیاز داریم تا Vue کار کنه (معمولاً از المنت Div استفاده میشه و اینجا هم قراره استفاده شه)

۳− برای نوشتن کدهای Vue ما به یه فایل جاوااسکریپت احتیاج داریم

۱:برای بارگذاری فایل از CDN خوده Vue استفاده میکنیم:

https://cdn.jsdelivr.net/npm/vue/dist/vue.js

برای بارگذاری فایل Vue نیاز داریم که اول به وردپرس معرفیش کنیم (رجیستر)

کد زیر رو به اول فایل(قبل از کامنت add shortcode // اضافه کنید:

function func_load_vuescripts() {
 wp_register_script( 'wpvue_vuejs', 'https://cdn.jsdelivr.net/npm/vue/dist/vue.js');
}
add_action('wp_enqueue_scripts', 'func_load_vuescripts');

توضیحات کد:

تابع wp_register_script به وردپرس میگه که این اسکریپت وجود داره ولی بارگذاریش نمیکنه ٬ پارامتر اول که میگیره اسمه اسکریپتمون هست که وردپرس با این اسم میشناستش و پارامتر دوم آدرس یا محل اسکریپتمون هست.

تابع add_action به وردپرس میگه این کارو انجام بده ٬ پارامتر اول تابع قلاب(hook) هست و پارامتر دوم اسمه تابعی هست که قراره hook شه.(شاید یکم گیج شید میتونید برید توی این لینک برای مطالعه بیشتر)

فایلتون تا اینجا باید این شکلی باشه:

"
  ."Vue code here: "
  ."
"; //Return return $str; } // end function //Add shortcode to WordPress add_shortcode( 'wpvue', 'func_wp_vue' ); ?>

تا اینجا ما Vue.js رو به وردپرس معرفی کردیم ولی هنوز بارگذاریش نکردیم ٬ دلیلش هم اینه که میخوایم وقتی shortcode صدا زده شد بارگذاریش کنیم.

کد زیر رو به تابع func_wp_vue اضافه کنید:

//Add Vue.js
  wp_enqueue_script('wpvue_vuejs');
  

توضیحات کد:

تابع wp_enqueue_script به وردپرس میگه این فایل رو برام بارگذاری کن ٬ پارامتری هم که گرفته همون اسمه اسکرپیتمونه که بهش دادیم.

الان هنوز هیچ اتفاقی نیوفتاده اما اگر برید تو پست یا صفحه‌ایی که shortcode رو اضافه کردید و سورس رو نگاه کنید میبنید که