WordPress သင်ခန်းစာ(For Advanced Learner) အခန်း(၂)
Zaw Htut Win

Zaw Htut Win @zawhtutwin

About: Developer, Code Poet

Location:
Yangon
Joined:
Jun 4, 2021

WordPress သင်ခန်းစာ(For Advanced Learner) အခန်း(၂)

Publish Date: Feb 13 '24
1 0

functions.php အကြောင်း

functions.php က Wordpress Dashboard ရဲ့ Appearence-> Editor ထဲမှာ ရှိပါတယ်။ ပုံမှာ ပြထားတဲ့အတိုင်းပါပဲ။

Image description

WordPress Hook တွေအကြောင်း

ဒီနေရာမှာ WordPress မှာ Event တွေရှိကြောင်း ပြောပြချင်ပါတယ်။ Javascript သုံးဖူးကြမယ်ထင်ပါတယ်။ JavaScript မှာ onload တို့ onclick တို့ အစရှိတဲ့ event တွေ ရှိသလိုပဲ WordPress မှာလည်း event ပေါင်းများစွာရှိပါတယ်။ ဒါပေမယ့် WordPress မှာ ဒါတွေကို Event လို့ မခေါ်ပဲ Hook လို့ ခေါ်ကြပါတယ်။

Hook ဆိုတာက WordPress run နေတဲ့ အချိန်မှာ execute လုပ်သွားတဲ့ point(နေရာတွေ)ပါ။ အဲဒီ Hook မှာ ကိုယ့် custom code ကို သွားထည့်လိုက်လို့ရပါတယ်။ JavaScript နဲ့ ယှဉ်ရင်တော့ event handler နဲ့ ဆင်ပါတယ်။
Hook ဆိုတာ မြန်မာလို ပြန်ရင် "ချိတ်"လို့ အဓိပ္ပါယ်ရပါတယ်။ ဟုတ်ပါတယ်။ ကျွန်တော်တို့ code ကို သူ့ ချိတ်လေးတွေမှာ လိုက်ချိတ်ပေးသလိုမျိုးပါ။

အခု functions.php ထဲ ရောက်နေပြီဆိုတော့ ကျွန်တော်တို့ Hook နဲ့ ပါတ်သတ်တဲ့ exercise လေးတစ်ခုလုပ်ကြည့်ရအောင်။

// Define a function to add custom CSS to the wp_head hook
function my_custom_css() {
    ?>
    <style type="text/css">
        /* Add your custom CSS styles here */
        body {
            background-color: #f0f0f0;
        }
        .site-title a {
            color: #333;
        }
        /* Add more styles as needed */
    </style>
    <?php
}

// Hook the custom CSS function into the wp_head action
add_action('wp_head', 'my_custom_css');
Enter fullscreen mode Exit fullscreen mode

အပေါ်က code မှာ wp_head က hook ရဲ့နာမည်ပါ။ head tag ကို render လုပ်တဲ့ အချိန်မှာ run တာပါ။ add_action ဆိုတဲ့ method ကို သုံးပြီး wp_head ထဲကို ကျွန်တော်တို့ရဲ့ customized function "my_custom_css" ဆိုတာကို ဒီနေရာမှာ ထည့်ပြထားတာပါ။ ဒီ code ကို functions.php မှာထည့်ကြည့်ပါ။ ပြီးရင် ကိုယ့် website ရဲ့ page တစ်ခုခုမှာ view source နဲ့ html soure ကို ကြည့်မယ်ဆိုရင် ကျွန်တော်တို့ insert လုပ်ထားတဲ့ css ကို head tag ထဲမှာတွေ့ရမှာပါ။

Image description

ဒီနေရာမှာ wp_head hook က ဝင်လာတဲ့ parameter နဲ့ priority မရှိပါဘူး။ ကျွန်တော် ပြောတာ သဘောပေါက်ဦးမှာ မဟုတ်သေးပါဘူး။ အောက်က example ကို ကြည့်ပါ။

function my_custom_product_title($title, $product_id) {
    // Get the product object
    $product = wc_get_product($product_id);
     $title .= $product->get_sku();
    // Return the modified title
    return $title;
}

// Hook the custom function into the woocommerce_single_product_summary action with priority 10 and 2 accepted arguments
add_action('woocommerce_single_product_summary', 'my_custom_product_title', 10, 2);
Enter fullscreen mode Exit fullscreen mode

ဒီဥပမာမှာ 'woocommerce_single_product_summary' ဆိုတဲ့ hook က parameter နှစ်ခုဝင်လာပါတယ်။ ဒါကြောင့်မို့ add_action ရဲ့နောက်ဆုံးမှာ 2 လို့ထည့်ရေးပေးရတာပါ။ 10 ကတော့ priority ပါ။ 10 ဆိုတော့ plugin တော်တော်များများထက်စောပြီး ဒီ code ကို execute လုပ်မှာပါ။ အဲဒီတော့ product page တိုင်းရဲ့ summary section title မှာ product SKU ပါ ပါလာမှာ ဖြစ်ပါတယ်။ ဒီ code ကို functions.php ထဲမှာထည့်ထားရင်ပေါ့။

Comments 0 total

    Add comment