Adding a header widget to the logo container

Hi Basilis, thanks for your reply. I am presently working with a local test install. I have made a screenshot to demonstrate where the widget area shoud be located

https://www.dropbox.com/s/nvai2pofd30u350/widget.png

Using the codesnippet of the documentation the widget flows outside of the container.

• This reply was modified 9 years, 1 month ago by bluecafe.

Thanks for your reply. Absolute position such as 50% may work if you want to have the widget in the middle.
However, I want the flags being aligned at the right side of the header container. Absolute pixel values won’t be useful for responsive behaviour. I would like to have it where the social icons menu is meant to be. Is there any hook I could use? Or do you have a hook reference by any chance so that I could look if there is a hook I could use? A hook reference would be very helpful.

What I mean is that the suggested code snippet in the documentation

add_action( 'ava_main_header', 'enfold_customization_header_widget_area' );
function enfold_customization_header_widget_area() {
	dynamic_sidebar( 'header' );
}

is using the hook ava_main_header

This hook is placing in the header region ava_main_header but not inside the container which defines the max-width of the site.
main-header is full width from the left side of the monitor to the right side of the monitor. However I want my widget aligning at the right side of the inner width of the site which is defined by the max-width of the container element (not the full widht of the monitor).
The max-width of the container is defined in the theme settings.
I cannot define a max-width using absolute positioning. This is why I want to add the widget to a hook inside of the container element and not within main_header (which is outside of the container)

I have looked in the source file header.php but the header container is most likele created by a function and not located in header.php.

• This reply was modified 9 years, 1 month ago by bluecafe.

Hi Rikard, if you know a css rule that would achieve this I would gladly use this. What CSS rule do you recommend?

I have uploaded my test environment for you:
http://test.design-meets-code.de/en/

What I want to achieve is that the language flags appear in the header area where the social icons (Twitter and Dribble) are placed.
I don’t want to use the social icons … just to demonstrate where I want to place the flags.

I assume the social icons are using any hook in the header region? Then I could use this hook to add the polylang widget with the flags to this hook. This is why I asked if there is a hook reference to see the hooks that are available.

Since the flags are outside of the container where the logo and the social icons are placed … how would you use CSS to place them at the place where the social icons are and let them stay there even if the browser window is resized?

Hi Rikard, thanks for your reply. However, this won’t help much because the absolute positioning is relative to the parent container which is #header (you can see it in the above link where I have applied your css)

The #header element goes from the left side of the monitor to the right side. A position right would position the flags at the right side of the monitor but not within the container which defines the width of the site. This is why I am asking for a hook within the container that contains the logo and defines the max-width of the site. I am quite familiar with css.
The position right: 90px is way outside of the main content region if looking at the site with a larger monitor. Is there a hook reference somewhere? What hooks are available WITHIN THE CONTAINER of the header region?

• This reply was modified 9 years, 1 month ago by bluecafe.

I have already used these hooks and the are NOT whithin the inner container. Can please anybody answer my question if there are any hooks within the inner header container who knows about theme hooks? Thanks

Hi Rikard, thanks so much for pointing me to helper-main-menu.php.
ava_before_bottom_main_menu is the perfect hook for placing the icons within the inner container and above the main menu. Thanks again. Sorry if I have been a bit grumpy … I just have been stucked on this … very happy now, have a nice day! :-)

Thanks, Rikard. Yes you can mark the thread fully satisfactory resolved :-)
Thanks again …

• This reply was modified 9 years ago by bluecafe.