Site icon Trickbd.com

ওয়ার্ডপ্রেস ডেভেলোপমেন্ট | পর্বঃ ৬ | wp_head এবং wp_footer গূরুত্বপুর্ন ফাংশ্নের ব্যাবহার!

Shakil Mahmud

WordPress theme নিয়ে কাজ করতে গেলে এমন কিছু function আছে, যেগুলো দেখতে খুব ছোট হলেও পুরো WordPress system-এর জন্য অনেক গুরুত্বপূর্ণ। wp_head() এবং wp_footer() ঠিক তেমনই দুটি function।

নতুন WordPress developer-রা অনেক সময় ভাবেন, এগুলো শুধু কিছু extra code। কিন্তু আসলে WordPress-এর plugin, theme এবং বিভিন্ন functionality ঠিকভাবে কাজ করার পেছনে এই দুইটি hook গুরুত্বপূর্ণ ভূমিকা রাখে।

আপনি যদি কখনো নিজের WordPress theme তৈরি করে থাকেন, তাহলে header.php এবং footer.php ফাইলে এই function দুটির দেখা পাওয়ার কথা।

wp_head() কী?

wp_head() হলো WordPress-এর একটি গুরুত্বপূর্ণ action hook function। সাধারণত এটি theme-এর <head> অংশের শেষের দিকে ব্যবহার করা হয়।

একটি সাধারণ header.php এমন হতে পারে:

<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>

    <meta charset="<?php bloginfo('charset'); ?>">

    <?php wp_head(); ?>

</head>
<body <?php body_class(); ?>>

এখানে:

<?php wp_head(); ?>

এর মাধ্যমে WordPress-কে <head> অংশে প্রয়োজনীয় output দেওয়ার সুযোগ দেওয়া হয়।

সহজভাবে বললে, আপনার theme-এর <head> অংশে WordPress বা কোনো plugin-এর কিছু যোগ করার প্রয়োজন হলে wp_head hook ব্যবহার করা যায়।

wp_head() কীভাবে কাজ করে?

wp_head()-কে বুঝতে হলে WordPress-এর action hook সম্পর্কে সামান্য ধারণা থাকা দরকার।

ধরুন কোনো plugin-এর মধ্যে এমন code আছে:

function my_custom_head_code() {

    echo '<meta name="my-plugin" content="active">';

}

add_action('wp_head', 'my_custom_head_code');

এখানে plugin বলছে—

যখন wp_head action চলবে, তখন my_custom_head_code() function-টি চালাও।

আর theme-এর মধ্যে যদি থাকে:

<?php wp_head(); ?>

তাহলে WordPress সেই hook execute করার সুযোগ পাবে।

ফলে plugin তার প্রয়োজনীয় code <head> অংশে যুক্ত করতে পারবে।

wp_head()-এর মাধ্যমে কী ধরনের code আসতে পারে?

এর মাধ্যমে বিভিন্ন ধরনের output আসতে পারে।

যেমন—

তবে এর মানে এই নয় যে সব CSS বা JavaScript সরাসরি wp_head() দিয়ে লিখতে হবে।

CSS এবং JavaScript-এর জন্য WordPress-এর enqueue system ব্যবহার করাই সাধারণত ভালো practice।

wp_head() না থাকলে কী হতে পারে?

ধরুন আপনি একটি custom WordPress theme তৈরি করলেন এবং header.php-তে লিখলেন:

<head>
    <title>My Website</title>
</head>

কিন্তু সেখানে:

<?php wp_head(); ?>

দিলেন না।

ওয়েবসাইট হয়তো প্রথমে ঠিকভাবেই দেখা যাবে।

কিন্তু সমস্যা শুরু হতে পারে যখন আপনি বিভিন্ন plugin ব্যবহার করবেন।

কারণ অনেক plugin wp_head hook-এর মাধ্যমে তাদের প্রয়োজনীয় code output করে।

ফলে wp_head() বাদ দিলে কোনো কোনো plugin-এর functionality ঠিকভাবে কাজ নাও করতে পারে।

এই কারণেই custom WordPress theme তৈরি করার সময় wp_head() রাখা অত্যন্ত গুরুত্বপূর্ণ।

এবার আসি wp_footer()-এ

wp_footer()-ও WordPress-এর একটি গুরুত্বপূর্ণ action hook।

নাম দেখেই বোঝা যায়, এটি website-এর footer অংশের সাথে সম্পর্কিত।

সাধারণত এটি </body> tag-এর ঠিক আগে রাখা হয়।

যেমন:

<body>

    <!-- Website Content -->

    <?php wp_footer(); ?>

</body>
</html>

এখানে:

<?php wp_footer(); ?>

থাকার কারণে WordPress এবং plugin-গুলো page-এর শেষের দিকে প্রয়োজনীয় output দেওয়ার সুযোগ পায়।

wp_footer() কীভাবে কাজ করে?

wp_footer()-এর কাজও মূলত hook-এর মাধ্যমে।

ধরুন কোনো plugin এমন code ব্যবহার করছে:

function my_footer_code() {

    echo '<script>
        console.log("Hello WordPress");
    </script>';

}

add_action('wp_footer', 'my_footer_code');

Theme-এর footer.php বা template-এর মধ্যে যদি থাকে:

<?php wp_footer(); ?>

তাহলে plugin তার JavaScript বা অন্য output footer-এর জায়গায় যোগ করতে পারবে।

এভাবেই WordPress-এর hook system theme এবং plugin-কে একসাথে কাজ করার সুযোগ দেয়।

wp_footer() কেন গুরুত্বপূর্ণ?

অনেক JavaScript বা tracking-related code page-এর একদম শেষের দিকে load করা সুবিধাজনক হতে পারে।

কিছু plugin তাদের script বা প্রয়োজনীয় markup wp_footer hook-এর মাধ্যমে যুক্ত করে।

তাই theme-এ wp_footer() না থাকলে কিছু plugin-এর functionality নষ্ট হতে পারে।

উদাহরণ হিসেবে—

ইত্যাদি footer-এর মাধ্যমে যুক্ত হতে পারে।

wp_head() বনাম wp_footer()

দুটো function-এর মধ্যে মূল পার্থক্য খুব সহজ।

Function সাধারণত কোথায় থাকে মূল উদ্দেশ্য wp_head() <head>-এর মধ্যে Head অংশে hook output দেওয়া wp_footer() </body>-এর আগে Footer/end অংশে hook output দেওয়া

অর্থাৎ—

wp_head() → page-এর শুরুতে <head> অংশ

wp_footer() → page-এর শেষে </body>-এর আগে

একটি Complete Theme Structure

দুটো একসাথে দেখলে বিষয়টি আরও সহজ হবে।

header.php

<!DOCTYPE html>
<html <?php language_attributes(); ?>>

<head>

    <meta charset="<?php bloginfo('charset'); ?>">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <?php wp_head(); ?>

</head>

<body <?php body_class(); ?>>

এরপর আপনার website-এর মূল content থাকবে।

শেষে:

footer.php

<footer>

    <p>My Website</p>

</footer>

<?php wp_footer(); ?>

</body>
</html>

এটাই WordPress theme-এর একটি basic structure।

wp_head() ও wp_footer() আসলে Theme এবং Plugin-এর মধ্যে Bridge

আমার কাছে এই দুইটি function বোঝার সবচেয়ে সহজ উপায় হলো—এগুলোকে theme এবং plugin-এর মধ্যে একটি bridge হিসেবে ভাবা।

Theme developer শুধু theme-এর structure তৈরি করবে।

Plugin developer চাইলে theme-এর code পরিবর্তন না করেই নিজের functionality যোগ করতে পারবে।

যেমন plugin:

add_action('wp_head', 'my_head_function');

অথবা:

add_action('wp_footer', 'my_footer_function');

এই hook ব্যবহার করতে পারে।

ফলে plugin-কে সরাসরি header.php বা footer.php পরিবর্তন করতে হয় না।

এটাই WordPress-এর hook-based architecture-এর বড় সুবিধা।

add_action() এখানে কেন গুরুত্বপূর্ণ?

wp_head() এবং wp_footer() বুঝতে গেলে add_action()-এর ধারণাটাও পরিষ্কার হওয়া দরকার।

উদাহরণ:

add_action('wp_head', 'my_head_function');

এর অর্থ:

wp_head action চালু হলে my_head_function() চালাও।

আবার:

add_action('wp_footer', 'my_footer_function');

এর অর্থ:

wp_footer action চালু হলে my_footer_function() চালাও।

অর্থাৎ wp_head() এবং wp_footer() হলো hook execute হওয়ার জায়গা, আর add_action() ব্যবহার করে আমরা সেই hook-এর সাথে নিজেদের function যুক্ত করতে পারি।

Priority-ও ব্যবহার করা যায়

WordPress action hook-এ priority ব্যবহার করা সম্ভব।

যেমন:

add_action('wp_head', 'function_one', 10);

add_action('wp_head', 'function_two', 20);

এখানে সাধারণভাবে function_one() আগে এবং function_two() পরে execute হবে।

একইভাবে wp_footer-এর ক্ষেত্রেও priority ব্যবহার করা যায়।

add_action('wp_footer', 'my_footer_code', 20);

এটি তখন নির্দিষ্ট priority অনুযায়ী execute হবে।

CSS ও JavaScript কি wp_head() বা wp_footer() দিয়ে লিখব?

এখানে একটা বিষয় মনে রাখা খুব জরুরি।

আপনি চাইলে wp_head() দিয়ে সরাসরি CSS print করতে পারেন:

add_action('wp_head', function() {

    echo '<style>
        body {
            background: #fff;
        }
    </style>';

});

আবার footer-এ JavaScript দিতে পারেন:

add_action('wp_footer', function() {

    echo '<script>
        console.log("Hello");
    </script>';

});

এগুলো কাজ করতে পারে।

কিন্তু WordPress development-এর ক্ষেত্রে stylesheet ও JavaScript-এর জন্য সাধারণত wp_enqueue_style() এবং wp_enqueue_script() ব্যবহার করা ভালো।

অর্থাৎ wp_head() এবং wp_footer()-কে সবকিছুর জন্য ব্যবহার করার দরকার নেই।

Custom Theme বানালে এই দুইটি function অবশ্যই রাখবেন

আপনি যদি scratch থেকে WordPress theme তৈরি করেন, তাহলে অন্তত এই দুটি জায়গা মনে রাখুন।

Header:

<?php wp_head(); ?>

Footer:

<?php wp_footer(); ?>

এগুলো বাদ দিলে আপনার theme দেখতে ঠিক থাকলেও ভবিষ্যতে plugin compatibility-এর সমস্যা হতে পারে।

বিশেষ করে WordPress-এর বিশাল plugin ecosystem-এর কথা চিন্তা করলে এই দুইটি hook রাখা খুবই গুরুত্বপূর্ণ।

wp_head() এবং wp_footer() কি HTML tag?

না।

এগুলো HTML tag নয়।

এগুলো WordPress-এর PHP function।

যেমন:

<?php wp_head(); ?>

এবং:

<?php wp_footer(); ?>

দুটোই WordPress-এর hook system-এর সাথে কাজ করে।

WordPress Theme Development-এ এগুলোর গুরুত্ব কোথায়?

আপনি যদি শুধু একটি static HTML website তৈরি করেন, তাহলে wp_head() বা wp_footer() লাগবে না।

কিন্তু WordPress theme তৈরি করার সময় বিষয়টা আলাদা।

কারণ WordPress theme একা কাজ করে না। এর সাথে plugin, WordPress core functionality এবং বিভিন্ন third-party functionality যুক্ত হতে পারে।

একটি ভালো WordPress theme-এর দায়িত্ব হলো অন্য functionality-গুলোকেও কাজ করার প্রয়োজনীয় জায়গা দেওয়া।

wp_head() এবং wp_footer() সেই কাজের গুরুত্বপূর্ণ অংশ।

সহজ একটি বাস্তব উদাহরণ

ধরুন আপনি একটি WordPress website বানালেন।

আজ website-এ কোনো plugin নেই।

আপনার theme সুন্দরভাবে কাজ করছে।

কয়েকদিন পর আপনি একটি SEO plugin install করলেন।

Plugin <head> অংশে কিছু metadata যোগ করতে চায়।

যদি theme-এ থাকে:

<?php wp_head(); ?>

তাহলে plugin তার hook ব্যবহার করে প্রয়োজনীয় output দিতে পারবে।

আবার আপনি এমন একটি plugin install করলেন যার JavaScript footer-এর দিকে load করতে হবে।

যদি theme-এ থাকে:

<?php wp_footer(); ?>

তাহলে plugin তার output সেখানে যুক্ত করতে পারবে।

এই কারণেই শুরুতে ছোট মনে হলেও এই দুইটি function আসলে WordPress theme-এর জন্য অনেক গুরুত্বপূর্ণ।

শেষ কথা

wp_head() এবং wp_footer()—দুটোই WordPress-এর খুব basic কিন্তু অত্যন্ত গুরুত্বপূর্ণ অংশ।

wp_head() সাধারণত <head> অংশে WordPress, theme এবং plugin-এর প্রয়োজনীয় output দেওয়ার সুযোগ তৈরি করে।

আর wp_footer() সাধারণত page-এর শেষের দিকে, </body>-এর আগে একই ধরনের hook-based output দেওয়ার সুযোগ তৈরি করে।

আপনি যদি WordPress theme development শিখতে চান, তাহলে শুধু index.php, header.php, footer.php বানানো জানলেই হবে না। WordPress-এর Action Hook এবং Filter Hook কীভাবে কাজ করে সেটাও বুঝতে হবে।

আর সেই hook system বোঝার ক্ষেত্রে wp_head() ও wp_footer() হলো সবচেয়ে সহজ এবং গুরুত্বপূর্ণ উদাহরণগুলোর মধ্যে দুটি।

তাই নিজের custom theme তৈরি করার সময় এই দুইটি function ভুলে যাওয়া উচিত নয়:

<?php wp_head(); ?>

এবং

<?php wp_footer(); ?>

ছোট দুইটি function হলেও WordPress-এর পুরো ecosystem-এর সাথে theme-কে compatible রাখার ক্ষেত্রে এদের ভূমিকা অনেক বড়।

Exit mobile version