آموزش وردپرس: چگونه می توان پلاگین توصیفات را ایجاد کرد

بنابراین ، در اینجا ما برای دومین آموزش هفتگی خود در زمینه وردپرس هستیم. ما در گذشته یاد گرفتیم که چگونه یک سایت WP پیمایش نامحدود و افزونه page-flip ایجاد کنید. امروز ما کمی بیشتر در مورد انواع ارسال های سفارشی و نحوه بارگیری داده های آنها می آموزیم.


این ویژگی در سایت شما واقعاً مهم است ، زیرا به شما امکان می دهد افرادی را که به شما توصیه می کنند نشان دهید. شهادت یک اثبات اجتماعی عالی برای جذابیت شماست. و برای دستیابی به این هدف نیازی به افزونه های پیچیده یا کدهای زیادی ندارید ، زیرا با دو پرونده مشاهده خواهید کرد که می توانید یک توصیف سکسی را برای توصیفات خود ایجاد کنید.

بیایید پس از آن شروع کنیم!

زیپ & نصب

اگر عجله دارید این موضوع را بررسی کنید ، می توانید آن را بارگیری و نصب کنید.

لازم است برخی از داده ها را اضافه کنید ، با اضافه کردن چند توصیف با استفاده از توصیفات تجاری جدید ، می توانید در داشبورد خود مشاهده کنید:

لیست-توصیفات

سپس می توانید از کد کوتاه اصلی برای بارگذاری این موارد استفاده کنید:

[توصیفات رند = 0 حداکثر = 5]

وقتی آن کد را اضافه کردید ، چنین چیزی را در صفحه خود مشاهده خواهید کرد:

توصیفات اصلی

اکنون خواهیم دید که چگونه این مورد را ایجاد و کاوش کنیم (با اضافه کردن توابع بیشتر و تغییر ظاهر).

اصول اولیه

همانطور که قبلاً گفتیم ، شما نیاز به اضافه کردن فوق داده سرصفحه ، ایجاد پرونده افزونه و تماس با اسکریپت های خود دارید. داستان کوتاه طولانی ، شما یک پوشه جدید را با نام wp-content / plugin های خود با نام افزونه خود ایجاد می کنید ، سپس یک پرونده با همین نام را ایجاد می کنید تا پوشه اصلی پلاگین شما باشد.

پس از انجام آن کپی و چسباندن به شرح زیر:

<?پی اچ پی
/ *
نام پلاگین: توصیفات
توضیحات: نمایش توصیفات مشتری.
نسخه: 1.0
نویسنده: وبلاگ درآمد وب
مجوز: GPL2
* /

// رمزگذاری اسکریپت ها و سبک ها
عملکرد plugin_scriptts ()
wp_enqueue_script (‘jquery’)؛
wp_enqueue_script (‘flexslider’، plugins_url (‘js / jquery.flexslider-min.js’، __FILE__)، array (‘jquery’، ‘2.2’، false)؛
wp_enqueue_script (“توصیفات” ، plugins_url (“js / Testonials.js” ، __FILE__) ، آرایه (“jquery”) ، “1.0” ، false)؛
wp_enqueue_style (‘flexsliderCSS’، plugins_url (‘css / flexslider.css’، __FILE__)، false، ‘2.2’، ‘all’)؛
wp_enqueue_style (‘TestimonialsCSS’، plugins_url (‘css / proofonials.css’، __FILE__)، false، ‘1.0’، ‘all’)؛
}
add_action ("wp_enqueue_scriptts","plugin_scriptts")؛

اینجا کاری است که ما انجام می دهیم:

  • به WP بگویید که نام پلاگین ما ، نویسنده ، چه کاری است
  • ایجاد یک عملکرد ، در جایی که اسکریپت های منظم (مانند jQuery) و اسکریپت های سفارشی (مانند flexslider) و Stylesheets را وارد می کنیم.
  • به بارگیری WP برای بارگیری عملکرد اسکریپت ها در تماس اسکریپت های پیش فرض آن ، بنابراین در واقع در صفحات بارگیری می شوند

این خیلی جالب است ، اما فراموش نکنید که در واقع پرونده ها را در زیر / js و / css ایجاد کنید. شما فقط می توانید آنها را در محتوای نسخه ی نمایشی ما بارگیری کنید ، بنابراین نیازی به حفاری زیادی برای پیدا کردن پرونده های flexslider ندارید.

اکنون همه موارد اساسی را در خود داریم که می توانیم قسمت خنده دار را شروع کنیم.

نوع ارسال سفارشی

به طور پیش فرض ، وردپرس دارای 2 نوع پست ، صفحه و پست مشترک است. اما همچنین دارای انواع پستی داخلی زیادی است (مانند پیوست ها) ، بنابراین تعریف “نوع ارسال” این است: هر نوع داده ای که برای ذخیره نیاز دارید..

از آنجا که افزونه ما عملکرد جدید WP ایجاد می کند ، محلی برای ذخیره آن وجود ندارد ، بنابراین باید آن را ایجاد کنیم. از ملکه کوچک نترسید ، خیلی ساده است ، می توانید از این کد استفاده کنید:

// جادوی سیاه برای ایجاد نوع پست
تابع create_post_type ()
Register_post_type (
“توصیفات” ، // نوع ارسال جدید
آرایه(
‘labels’ => آرایه(
‘name’ => __ (“توصیفات”),
‘singular_name’ => __ (“تست”)
),
‘عمومی’ => true، / * نوع ارسال برای مصارف عمومی در نظر گرفته شده است. این شامل در قسمت جلویی و در wp-admin است. * /
‘پشتیبانی’ => array (“عنوان” ، “ویرایشگر” ، “تصویر بند” ، “custom_fields”),
‘سلسله مراتبی’ => نادرست
)

}

در اینجا ما فقط از تابع Register_post_type () استفاده می کنیم تا به WP بگوییم “سلام بادی ، ما باید این نوع داده ها را ذخیره کنیم ، لطفاً آماده دریافت آن باشیم”.

ما همچنین به او می گوییم که به این نوع داده ها “توصیفات” گفته می شود ، باید برای دسترسی عمومی در دسترس باشد (بنابراین در واقع یک مورد جدید را در داشبورد شما برای آن ایجاد می کند) ، زمینه هایی که ما به آن نیاز داریم و اگر سلسله مراتبی باشد. یا نه (مانند صفحاتی که صفحات پدر و مادر و فرزند داریم).

سپس هر بار که وردپرس را بارگذاری می کنیم باید آنرا صدا کنیم. این قلاب این کار را انجام می دهد:

add_action (‘init’، ‘create_post_type’)؛

زمینه های سفارشی

اکنون نوع پست سفارشی ما دارای عنوان (نام شخص) ، محتوا (توصیف شخص) ، تصویر (تصویر برجسته) است اما پیوندی را از دست نمی دهد ، زیرا اگر شخص به اندازه کافی خوب باشد که در مورد شما صحبت کند ، شما باید حداقل به این لینک پیوند دهید. سایت آنها ، درست است?

ما می توانیم این کار را با زمینه های معمول معمول انجام دهیم ، اما بهتر است یک فیلد “بسته” داشته باشیم ، جایی که کاربر نیازی به نامگذاری نام فیلد را نداشته باشد ، و همچنین جایی که می توانید برخی از قوانین اعتبار سنجی را اضافه کنید.

اول از همه ما باید متابوكس جدیدی ایجاد كنیم ، آن پانل های خوبی است كه در قسمت ویرایش پست خود دارید ، هر پنل كوچك متابوكس است. این عملکرد باعث ایجاد و فراخوانی آن می شود:

// اضافه کردن زمینه جعبه متا URL
عملکرد add_custom_metabox () {
add_meta_box (‘custom-metabolox’، __ (‘پیوند’) ، ‘url_custom_metabox’ ، ‘توصیفات’ ، ‘سمت’ ، ‘کم’)؛
}
add_action (‘admin_init’، ‘add_custom_metabox’)؛

تابع add_meta_box () به این پارامترها نیاز دارد:

  1. شناسه – شناسه منحصر به فرد برای آن. شما می توانید از هر چیز منحصر به فرد در اینجا مانند “تکشاخ-خوردن-رنگین کمان” یا “لینک-توصیفی” استفاده کنید. هر چیزی که قابل استفاده در داخل باشد
  2. عنوان – چه چیزی برای کاربر نشان داده می شود؟ در اینجا استفاده از تابع __ () مهم است ، این عملکردی است که به کاربران زبانهای خارجی امکان می دهد افزونه شما را با پرونده های .po (بدون ویرایش فایل های افزونه) ترجمه کنند.
  3. پاسخ به تماس – تابعی که محتوای واقعی متابوکس را در آن دارید
  4. نوع ارسال – در مورد ما می خواهیم این فقط برای توصیفات قابل رویت باشد
  5. متن – جایی که در صفحه می خواهید آن را نشان دهید
  6. اولویت – اگر باید قبل از سایر موارد در همان موقعیت یا بعد از آنها باشد

اکنون باید عملکرد url_custom_metabox () را ایجاد کنیم ، زیرا ما آنرا صدا کرده ایم.

// HTML برای ناحیه مدیر
عملکرد url_custom_metabox ()
پست جهانی $؛
$ urllink = get_post_meta ($ ارسال)->شناسه ، “urllink” ، درست)؛

// اعتبارسنجی!
اگر (! preg_match ( "/ http (ها؟): ///", $ urlink) && $ urllink! = "") {
خطای $ = "این URL معتبر نیست"؛
$ urllink = "http: //"؛
}

// input invlid پیام url را اضافه کنید و http: // را به قسمت ورودی اضافه کنید
if (صادر (خطای $)) errors خطاهای echo $؛ }
?>

URL:

<?پی اچ پی
}

خوب ، اکنون این را به انگلیسی ساده ترجمه می کنید:

  • متغیر جهانی $ post نامیده می شود ، بنابراین می توانیم بدانیم POSTID مورد فعلی کدام است
  • مقدار فعلی را برای URL بارگذاری می کنیم
  • اگر مقداری که کاربر درج کرده باشد معتبر است ، معتبر می شویم. اگر حداقل یک مورد “http” یا “https” وجود داشته باشد ، مقدار مناسب است ، در غیر این صورت معتبر است و ما باید از مقدار پیش فرض استفاده کنیم
  • در صورت وجود خطاها ، خطاها را نشان می دهیم
  • اکنون HTML واقعی را شروع می کنیم و همانطور که در پی اچ پی دریافت کرده ایم مقدار پیش فرض را در قسمت ورودی اضافه می کنیم

پس از این نکته ، باید آنچه را که توسط کاربر ارسال می شود ، ذخیره کنیم. ما از قلاب “save_post” استفاده خواهیم کرد ، بنابراین هر بار که وردپرس پستی را ذخیره می کند ، این عملکرد را فراخوانی می کند:

// موجب ذخیره داده های زمینه سفارشی می شود
تابع save_custom_url ($ post_id) {
پست جهانی $؛

if (صادر ($ _ POST [‘siteurl’])) {
update_post_meta (پست $)->شناسه ، ‘urllink’ ، $ _POST [‘siteurl’])؛
}
}
add_action (‘save_post’، ‘save_custom_url’)؛

در اینجا ما فقط بررسی می کنیم که آیا اطلاعات ارسالی به نام “sitelink” وجود دارد که نام زمینه ماست یا خیر. اگر یک پیوند سایت وجود دارد ، بگذارید آن را ذخیره کنیم.

پس از اتمام همه چیز ، در اینجا چگونه صفحه توصیف جدید شما ظاهر می شود:

جدید-توصیفی

بارگیری داده های سفارشی ما

اکنون باید موارد خود را بارگیری کنیم و از تابع get_posts () استفاده کنیم ، بیشتر به این دلیل که ما فقط داده های ساده ای داریم بنابراین نیازی به حلقه مناسب WP نداریم (این امر بسیاری از تماسهای DB را اضافه می کند و ما واقعاً نمی خواهیم) بهش احتیاج دارم).

بنابراین ، ابتدا اجازه دهید یک تابع ایجاد کنیم تا پیوند سایت ما را در صورت وجود داشته باشد.

// بازگشت URL برای یک پست
تابع get_url ($ ارسال) {
$ urllink = get_post_meta ($ ارسال)->شناسه ، “urllink” ، درست)؛

urlink $ بازگشت؛
}

اکنون می توانیم عملکرد کد کوتاه را شروع کنیم. یک روش ساده برای پیش فرض و اعتبارسنجی داده های کد کوتاه ، ایجاد ویژگی های حلقه به عنوان یک آرایه است ، بنابراین می توانیم موارد جدید را در صورت نیاز به آنها اضافه کنیم ، مانند این:

// ثبت کد کوتاه برای نمایش توصیفات
تابع load_testimonials ($ a)

$ args = آرایه (
"post_type" => "توصیفات"

if (صادر ($ a [‘رند’])) && $ a [‘rand’] == واقعی) {
$ args [‘orderby’] = ‘rand’؛
}
if (صادر ($ a [‘حداکثر]]))
$ args [‘posts_per_page’] = (int) $ a [‘max’]؛
}
// گرفتن کلیه توصیفات
$ posts = get_posts ($ args)؛

// خروجی HTML
}
add_shortcode ("توصیفات","load_testimonials")؛

همانطور که مشاهده می کنید ویژگی های کد کوتاه را هنگام اعتبارسنجی بارگذاری کرده و به آرایه $ args منتقل کرده ایم ، در فرمی که WordPress به آن احتیاج دارد ، بنابراین می توانیم پست ها را با استفاده از آنها بارگذاری کنیم.

اکنون به دنبال ساختار پیش فرض flexslider ، باید کد HTML را به آن اضافه کنیم. در اینجا چگونه به نظر می رسد:

اکو ”؛
پژواک

    ‘؛

    foreach ($ ارسال به عنوان $ پست) {
    // گرفتن تصویر انگشت شست
    $ url_thumb = wp_get_attachment_thumb_url (get_post_thumbnail_id (پست ارسال شده->شناسه))؛
    $ link = get_url ($ post)؛
    پژواک

  • ‘؛
    اگر (! خالی ($ url_thumb)) {echo ‘‘؛ }
    پژواک

    $. پست->post_title. ‘

    ‘؛
    اگر (! خالی (پست $->post_content)) {echo ‘

    $. پست->post_content. ‘
    ‘؛ }
    اگر (! خالص (پیوند $)) {echo ‘به سایت بازدید کنید

    ‘؛ }
    پژواک

  • ‘؛
    }

    پژواک

‘؛
اکو ”؛

صبر کنید ، اما چرا می خواهیم کد HTML را درون عملکرد PHP ایجاد کنیم؟ به این دلیل است که ما می توانیم به طور مشروط محتوا را بارگذاری کنیم فقط اگر کاربر محتوای اضافه کرده باشد ، بنابراین شما برچسب های HTML خالی ندارید ، فقط منتظر می مانید تا طرح خود را خراب کنید.

چه در مورد نوار کناری?

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

add_filter (‘widget_text’، ‘do_shortcode’)؛

بعدش?

بنابراین ، از این آموزش لذت بردید؟ چه چیزی را به عنوان گزینه ای برای کد کوتاه توصیفی خود اضافه می کنید؟ آیا برای پست های آینده ایده ای دارید؟ با استفاده از بخش نظرات با ما در میان بگذارید!

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map