Vertical and horizontal alignment


Hey J.C.

Have you looked at the UIkit Flex component? What I would advise when you have such questions is to post the design of what you want to achieve, it is much simpler to visualize and give you an accurate answer of what approach to take πŸ˜‰

Thanks,


I've drawn up a quick sketch. I can work markup for breakpoints, visibility et alii, but somehow even when using a flex as container it's not going as intended :/ To avoid schema related issues, I think I will have to rework the beans_header, but it's resisting.

https://cldup.com/A_wX3oSu_N.png


Hey J.C.

I think that an acceptable approach if a lot of changes are required on the core header is to replace beans_header_partial_template action with your own callback function in which would have your own HTML and call various Beans fragments in it. From there, all the UI related stuff is UIkit specific.

Cheers,


Do you mean opening the markup for that partial? Or adding a custom partial and making use of that instead? I've seen some things on the first option in the documentation, but completely replacing the file itself?


Quick question in between - I don't suppose you could switch development mode on for the www.getbeans.io frontpage? πŸ™‚


No, I mean completely replacing your header with your own HTML and call the fragment functions you need straight in your custom HTML (see this reply which is also related). So the starting point would be as follow:

beans_modify_action_callback( 'beans_header_partial_template', 'example_header' );

function example_header() {

 ?>
  <header>
    <!-- Your custom header in which you can call fragment function such as beans_site_title_tag().  -->
  </header>
 <?php

}

Note that this requires quite a bit of rebuilding but if you really want to completely modify the default header HTML, it is one approach you could take. As I explained in this reply, it is all about finding the balance πŸ™‚

Regarding turning dev mode on the official Beans website, unfortunately we stricly can't do that and won't open our staging website to public (even for your project websites, you should never do anything on your live website but rather on a staging development version).

Have fun,

Write a reply

Login or register to write a reply, it's free!