-
AuthorPosts
-
April 16, 2015 at 5:12 am #429337
Hi. Thanks for your help getting the widget into the header bar as per http://kriesi.at/documentation/enfold/adding-a-widget-area-to-the-header/
I’ve managed to get the widget into the header, but it’s not responsive. That is, it doesn’t reduce in size as the page size reduces. The site URL is given in the Private Content section below.
Thanks again for all your help.
RapheApril 17, 2015 at 4:20 am #430068Hey Raphep!
I can’t see a header widget on the page you linked, on what page can we see it?
Cheers!
RikardApril 20, 2015 at 2:46 am #431019Hi Rikard
The widget is at the end of the navigation bar – it is a circle with ‘Support Us’ inside. This has been created using the text/html widget.
Thanks RapheApril 21, 2015 at 4:31 am #431718April 21, 2015 at 8:37 am #431809Hi Rikard
You may need to view it on a bigger screen. Because it’s not responsive it disappears off the screen on any screen less than 1000px
Regards – RapheApril 21, 2015 at 6:07 pm #432218Hi!
I have checked your website as well on 1920x1200px screen and i cannot see widget area on the header as well. Can you please once again make sure that you are posting the correct link?
Regards,
YigitApril 22, 2015 at 3:39 am #432511Hi Yigit
Thanks for your patients. The link is definitely correct. I have changed the css and the widget now appears under the WANRI logo – you can just see the dotted lines of the circle. If you reduce the browser size to mobile phone size, the ‘Support Us’ logo moves under the WANR logo and you can see it.Regards – Raphe
April 23, 2015 at 5:49 am #433238Hey!
I can see it now, thanks. Where would you like it to be placed on desktop, tablet and phone?
Cheers!
RikardApril 23, 2015 at 5:54 am #433242Hi Rikard
I’d like it to be placed on the right between ‘contacts’ and the ‘search icon’ if possible on desktop, tablet and phone. If this is not possible on the phone then remove it.Regards – Raphe
April 24, 2015 at 6:29 am #433884Hi!
Ok, lets begin with adding this in Quick CSS for desktop:
#header .widget { right: -15% !important; }
And hide it for phone and tablets temporarily:
@media only screen and (max-width: 1024px) { #header .widget{ display:none !important; } }
Could you then go to Enfold–>Header–>Mobile Menu and select Activate for smartphones and tablets please? It won’t fit on screen otherwise.
Best regards,
RikardApril 25, 2015 at 4:25 am #434559Great – Worked a treat. Thanks fore all your help.
Regards – Raphe
April 26, 2015 at 11:36 am #434840 -
AuthorPosts
- You must be logged in to reply to this topic.