Woocommerce homepage with multiple loop (noob inside)

Hello,

I'm new here and i'm trying to build a basic child theme for woocommerce, that i can extends for other theme.

I first created a homepage.php that I include in function.php but I'm not sure its the best way to do it.

I see this topic https://community.getbeans.io/discussion/custom-home-page-template-with-loop/ where Thierry Muller give a piece of code and say to create a file named home.php and set settings to Your latest posts.

But when I do it, it remove the header widget I added previously :/

So before I go deeper, can you oriented me a little ?

I want something like that (maybe more categories bloc, the idea is to register them in this theme to have the possibility to delete them in child theme with beans_remove_action if i have all understood ?) https://cloudup.com/cF8x4jEF0vl

Here's my tests (I already get it for the header ^^)

<?php

// Enqueue UIkit components.
add_action( 'beans_uikit_enqueue_scripts', 'homepage_enqueue_uikit_assets' );

function homepage_enqueue_uikit_assets() {
 // Enqueue cover and slidshow UIkit components used in the slideshow section.
 beans_uikit_enqueue_components( array( 'cover' ) );
 beans_uikit_enqueue_components( array( 'slideshow' ), 'add-ons' );
}

beans_remove_attribute( 'beans_primary_menu', 'class', 'uk-float-right' );
beans_add_attribute( 'beans_primary_menu', 'class', 'uk-float-left' );

add_action( 'widgets_init', 'header_widgets_init' );

function header_widgets_init() {

  beans_register_widget_area(array(
   'id' => 'homepage_header_widget', 
    'name' => 'Header Widget',
    'beans_type' => 'grid')
 );

}

add_action( 'beans_fixed_wrap[_header]_append_markup', 'homepage_header_woocommerce_widget_area' );

function homepage_header_woocommerce_widget_area() {

  echo beans_widget_area( 'homepage_header_widget');

}
beans_add_attribute( 'beans_widget_area_grid[_homepage_header_widget]', 'class', 'uk-float-right' );
beans_add_attribute( 'beans_widget_content[_homepage_header_widget][_woocommerce_widget_cart][_woocommerce_widget_cart-3]', 'class', 'fa fa-shopping-cart' );

// Add the subheader slider.
add_action( 'beans_header_after_markup', 'homepage_subheader_slider' );

function homepage_subheader_slider() {
 ?>
  <div class="uk-slidenav-position uk-container-center" data-uk-slideshow="{autoplay:false, height: 500}" >
   <ul class="uk-slideshow">
     <li><img src="http://localhost/wordpress/wp-content/themes/pita-woocommerce/assets/images/abbey-clancy-egerie-reebok-2015.jpg"></li>
      <li><img src="http://localhost/wordpress/wp-content/themes/pita-woocommerce/assets/images/disney-springs-melissa-shoes-carousel.jpg"></li>
    </ul>
   <a href="" class="uk-slidenav uk-slidenav-contrast uk-slidenav-previous" data-uk-slideshow-item="previous"></a>
   <a href="" class="uk-slidenav uk-slidenav-contrast uk-slidenav-next" data-uk-slideshow-item="next"></a>
   <ul class="uk-dotnav uk-dotnav-contrast uk-position-bottom uk-flex-center">
     <li data-uk-slideshow-item="0"><a href=""></a></li>
     <li data-uk-slideshow-item="1"><a href=""></a></li>
   </ul>
 </div>
  <?php 
}

// add_action( 'beans_before_load_document', 'homepage_setup' );
// function homepage_setup() {
  // beans_remove_action( 'beans_post_title' );
  // beans_remove_markup( 'beans_main_grid' );
  // beans_remove_markup( 'beans_primary' );
  // beans_remove_markup( 'beans_post_header' );
  // beans_remove_markup( 'beans_post_content' );
  // beans_remove_markup( 'beans_post_body' );
  // beans_remove_markup( 'beans_post' );
// }

beans_add_smart_action( 'beans_content', 'homepage_content');
function homepage_content() {
  beans_open_markup_e('highlight','div');
 beans_close_markup_e('highlight','div');
}

// Remove sidebar by setting the layout to content only.
beans_add_filter( 'beans_layout', 'c' );

// Load document which is always needed at the bottom of template files.
beans_load_document();

thank you

Hi Romain,

Without sounding like a douche myself, I feel that you need to take some time to understand the use of Beans, as well as have a fundemental understanding of the WordPress theme structure.

Beans does not (necessarily) change the way you create templates for various aspects of WordPress (page templates, pages, taxonomies, post types etc). It also does not pose limitations and does not enforce a "beans" approach, it merely gives you the tools to use shoudl you WANT the power of Beans.

Once you understand tha basic markup functions and actions / hooks (read the Beans docs) you will quickly see that using Beans becomes exceptionally easy and flexible.

I am all for helping you, but I feel you need to put more effort into reading and applying core Beans concepts.

What particular aspect of Beans do you feel that you need more guidance on?

Simon

Mmmh okay, currently I use the bones theme so I'm not really familiar with framework and child themes.

So the beans framework theme is like a "super theme" wich every themes should implements ? Should I extends it ? Or duplicate it and add my own template ? And after my child themes could implement it ?

Or all I have to do is develope like I did before but just using beans_open/close_markup instead of html tag, so I could use beans_*_action on it in child themes ?

I have read the 3 child themes code but they only modify beans theme, it's not really instructive for building a theme as there is not new templates.

I will continue to learn about it cause I like the way all markup can be hooked and not just some action defined by the framework (I hope I use the good terms^^)

Romain

Edit : ok I guess I get it 🙂

Edit 2 : I had just misunderstood this sentence in template doc : In Beans, overwriting page templates isn’t typically necessary since it can be done directly in the child theme functions.php. I thought we had not to create new template :/