Move social icons in the same line like "search" icon and add "like" button

Hi,

Yesterday i wanted the same. this is what i did (working on child theme):

. Choose the “Fixed Header with Social Icons and Additional Navigation”, the social config panel expands. Later you will use it to set up your own links, etc.
. Get a copy of header.php and place it in your child folder, get rid of the extra header (starts on Line 87)
. C&P this after Line 135: if(strpos($headerS,'bottom_nav_header') === false) avia_social_media_icons($social_args);
. Modify <nav> and social styles, so it fits correctly (position, padding… nothing fancy). But make sure to target some id that will allow you to keep the correct styles on “Header with Bottom Navigation” I used this: .container_wrap_logo .main_menu { right:120px }. Also u will need to modify the top padding of #main. I used this: .fixed_header.social_header #main { padding-top:117px; }

upload and check.

Probably not the best or code friendly solution, but it worked. : )
GL

Hi,

I’ll add some modifications, the proposed solution fails when viewing the page on mobile devices.
Then I remembered that CSS often makes our lives easier, so the final solution, in my case, is this:

1. Make a copy of header.php and paste it in your child theme
2. Copy line 100: “”
3. Paste it on line 181
4. Upload header.php
5. In your child custom style sheet, paste this together with the styles necessaries to make it look good:
6. Double check tablets resolutions, mobile, etc… and add more responsiveness if necessary

/* Hide Header Meta from both screenreaders and browsers */
.responsive #header_meta {
    display: none !important;
    visibility: hidden;
}
	
/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
#header_main .container ul.social_bookmarks {
	display: none !important;
   	visibility: hidden;
	}	

.responsive #header_meta {
	display:block !important;
	visibility:visible;
	}
	 }

Upload & done.