MingoCommerce

In WooCommerce’s product details page, product title always comes after product image section.
But each website have their own design and many a cases we have seen that product title needs to be shown at the top.

So, how to achieve that without tinkering the template code much ?

Let’s have look at the ‘content-single-product.php’ page. The default code of this page looks like –
If you look at the code closely, you will notice that there are two action hooks –
`woocommerce_before_single_product_summary` and `woocommerce_single_product_summary`.

Now, `woocommerce_show_product_images` function is attached with first hook and `woocommerce_template_single_title` is attached with later.

That’s the reason that image is coming first.

But in template, simply swapping places of those two action hooks are not recommended at all, as other functions are attached with those hooks too. So, the best way to do that is, remove title hook from `woocommerce_single_product_summary` and add it to `woocommerce_before_single_product_summary`.

So here we go, open your theme’s functions.php and add following lines –

remove_action(‘woocommerce_single_product_summary’, ‘woocommerce_template_single_title’, 5);

add_action(‘woocommerce_before_single_product_summary’, ‘woocommerce_template_single_title’, 5);

As of now, both image and title is added to same action hook but still title will come first. Because image showing function was added with priority 10 (default) and we have added title with priority 5.

So, like price you can re arrange any of the item like price, rating, add to cart button etc.

Hope you have enjoyed the article 😉

If we write some functionality to our website which is not at all dependent on our theme, then it is always better to write those codes to a plugin page(creating new plugin) instead  of theme’s functions.php. So if we change the theme we don’t have to bother about losing our functionality.

So do take this advantage we write plugins. Now with some plugins sometimes we need a settings page for our plugins too. But if we create a plugin it gives us only few links activate/deactivate, Edit, Delete.

But you must be wondering how to add a settings page link in this one. That is very simple. WordPress provides a filter hook for that ‘plugin_action_links_YOURPLUGINNAME’. This hook gives you an array of default links. Now you can add new link there applying a new filter.  You can add settings page link or any other link also.

Below is an example of that hook.

Hope you guys figured this out very easy.