Friday, April 24, 2015

Customizing product search with meta key in wordpress woocommerce

Suppose we have a custom fields like price, color etc in woocommerce product. How we will include these fields in wordpress search? Below is the step to include these keywords in wordpress search.

Make an array like below for meta search.

$args = array(
'post_type'=>'product',
'posts_per_page' => -1,
'order' => 'ASC',
'meta_query' => array(
'relation' => 'OR',
array(
'key' => 'price',               //your meta key
'value' => $_GET['price'],  //your search post value
'compare' => '='
)
)
);

Instead of =, we can use LIKE ,> or < etc.

$the_query = new WP_Query( $args ); // make query in wordpress
$q1 = $the_query->get_posts(); get all product with search.

Make an array like below to include normal search in wordpress:

$args2 = array(
'post_type'=>'product',
's' => $_GET['s'],

);


$the_query2 = new WP_Query( $args2 );
$q2 = $the_query2->get_posts(); // get all product whose title are related to the fields value.

Now merge both the result :
$merged = array_merge( $q1, $q2 );

and get the post id of all product in a array, like below :

$post_ids = array();
foreach( $merged as $item ) {
$post_ids[] = $item->ID;
}

Now get the unique id from above array.
$unique = array_unique($post_ids);

Now again make a query with these ids

$args3 = array(
'post_type'=>'product',
'post__in' => $unique,
'post_status' => 'publish',

);
$the_query3 = new WP_Query( $args3 );

Now we can use normal wordpress function to get product detail:

<?php
if ( $the_query3->have_posts() ) {
while ( $the_query3->have_posts() ) : $the_query3->the_post();
// product detail goes here.
endwhile; // end of the loop.
} // end of if
?>

Friday, April 17, 2015

How to manage and improve Top Links in Magento



Top Links is one of the basic blocks in Magento that allows to create a personal area for the customer within our online store. Top Links includes: Login/Logout, My Account, My Wishlist, My Cart and Checkout links. By default Top links are located in the header, but they can be moved wherever we want if it’s needed.
One of the most important differences between top links and regular static links is that when we add products to the cart or to our wishlist, top links automatically records products which were added.
Example of Top links in the default  Magento theme in the header.
Usage of Top links in Magento
At first we have to call the block.
<?php echo this->getChildHtml(‘topLinks’) ?>
in template template/page/html/header.phtml, but creates in page.xml
<block type=”page/html_header” name=”header” as=”header”>
<block type=”page/template_links” name=”top.links” as=”topLinks”/>
<block type=”core/text_list” name=”top.menu” as=”topMenu”/>
</ block>
Now we need to add links to this block by using the command:
<action method=”addLink” translate=”label title” >…</action>
We gotta make it in the following XML files:
  • Login/Logout, My Account – customer.xml
  • My Cart and Checkout – checkout.xml
  • My Wishlist – wishlist.xml
It should be noted that link to  My Cart calls by the command:
<action method=”addCartLink”></action>
and <action method=”addCheckoutLink”></action> for Checkout link.

How to edit «Top Links» in Magento.

All top links are based on a template which is located here: page/template/links.phtml. Here we can add additional classes or commit needed changes.
Often people want to use separate links. For example Login/Logout and My Account should be on the left side and My Wishlist, My Cart and Checkout on the right side.
Something like on the example below
It is very easy to do:
Open page.xml and create another block there, almost identical to “topLinks” but with name  “topLinksLeft”;
<block type=”page/html_header” name=”header” as=”header”>
<block type=”page/switch” name=”store_language” as=”store_language” template=”page/switch/languages.phtml”/>
<block type=”core/text_list” name=”top.menu” as=”topMenu”/>
<block type=”page/template_links” name=”top.links” as=”topLinks”/>
topLinksLeft”/>
</ block>
In template template/page/html/header.phtml with help of the command:
php echo this->getChildHtml(‘topLinksLeft’) ?>
we can call our block in the proper place
 <div>
<h1 id=”logo” title=”<?php echo $this->getLogoAlt() ?>” style=”background-image:url(<?php echo $this->getLogoSrc() ?>);”><a href=”<?php echo $this->getUrl(”) ?>”><?php echo $this->getLogoAlt() ?></a></h1>
<div><?php echo $this->getChildHtml(‘topLinksLeft’) ?></div>
<?php echo $this->getChildHtml(‘topLinks’) ?>
<?php echo $this->getChildHtml(‘topMenu’) ?>
</div>
  • When we have done this, open customer.xml  where we have to change the name of the block which is responsible for Login/Logout, My Account. We are changing its name from “top.links” on “top.links.left” as in example:
<customer_logged_in>
<reference name=”top.links.left”>
<action method=”addLink” translate=”label title” module=”customer”><label>My Account</label><url helper=”customer/getAccountUrl”/><title>My Account</title><prepare/><urlParams/><position>10</position></action>
</reference>
<reference name=”top.links.left”>
<action method=”addLink” translate=”label title” module=”customer”><label>Log Out</label><url helper=”customer/getLogoutUrl”/><title>Log Out</title><prepare/><urlParams/><position>100</position></action>
</reference>
</customer_logged_in>
We also can assign other template to the links on the left ( rather useful in some cases) For that we just have to duplicate  template “page/template/links.phtml” and call it links_left.phtml. So now we have 2 templates “links.phtml” for the right side and “links_left.phtml” for the left side. Now all we need to do is just connect it. For connection we use block «topLinksLeft» page.xml and change it to links_left.phtml.
<block type=”page/html_header” name=”header” as=”header”>
<block type=”page/template_links” name=”top.links” as=”topLinks”/>
<block type=”page/template_links” name=”top.links.left” as=”topLinksLeft” template=”page/template/links_left.phtml” />
</ block>
Now you can apply different styles and HTML for the left and the right side.
 Wow, almost forgot about “Register” button which is usually located near the “Login/Logout” button. No worries about that as well. As you can already guess we start from customer. xml file where we do next, if we want to add “Register” button to the top links:
<customer_logged_out>
<reference name=”top.links”>
<action method=”addLink” translate=”label title” module=”customer”> <label> Log In </ label> <url helper=”customer/getLoginUrl”/> <title> Log In </ title> <prepare /> <urlParams/> <position> 100 </ position> </ action>
<action method=”addLink” translate=”label title” module=”customer”> <label> register </ label> <url helper=”customer/getRegisterUrl”/><title>register</title><prepare/><urlParams/><position>10</position></action>
</ reference>
</ customer_logged_out>