title: How Do I Add product descriptions (short) to hover box in woocommerce?
body: <p>I am using the following to add the product name and price to a hover box.</p>
  
  <p>In functions.php</p>
  
  <pre><code>// Alter produt loop individual products 
  
  add_action( 'woocommerce_before_shop_loop_item_title', 'new_product_defaults_wrap_open' , 20 ); //opener
  add_action( 'woocommerce_after_shop_loop_item_title', 'new_product_defaults_wrap_close', 40); //closer
  
  function new_product_defaults_wrap_open() {
    echo '&lt;div class="product-details"&gt;';    
  }
  function new_product_defaults_wrap_close() {
      echo '&lt;/div&gt;&lt;!--/.product-details--&gt;';
  }
  </code></pre>
  
  <p>In css:</p>
  
  <pre><code>/*The code below will simply setup the price-title area to be hidden and have a background. Please note that uou will have to change the background and height to match your website color scheme and product height  but first load it as and then adjust                                                                                      
  */
  
  .products .product .product-details {
          position: absolute;
          background: rgba(119, 203, 109, 0.95);
          top: 0;
          left: 0;
          right: 0;
          bottom: 0;
          color: #f7f7f7;
          padding: 1.618em;
          text-align: left;
      opacity: 0;
      height: 167px;
      filter: alpha(opacity=@opacity * 100);  
      -webkit-transition: all ease 0.4s;
      -moz-transition: all ease 0.4s;
      -ms-transition: all ease 0.4s;
          -o-transition: all ease 0.4s;
          transition: all ease 0.4s; 
    }
  
  /* Show the that was setup above when the user hovers*/
  
   ul.products li.product:hover .product-details {
      filter: alpha(opacity=@opacity * 100);
      opacity: 1;
    }
  
    ul.products li.product a img:hover {
      opacity: 0.9;
    }
  </code></pre>
  
  <p>I got this code from <a href="https://support.woothemes.com/hc/en-us/articles/203103707-Products-layout-show-price-on-hover-like-Peddlar-theme-?page=1#comment_203088363" rel="nofollow">https://support.woothemes.com/hc/en-us/articles/203103707-Products-layout-show-price-on-hover-like-Peddlar-theme-?page=1#comment_203088363</a>.</p>
  
  <p>I would like to add the product short description to the .product-details class, but I don't know how to do it.</p>
  
  <p>Thanks.</p>