Page 1 of 1

Info line above site

Posted: 02 Aug 2018, 07:55
by GeoPal
Hello,
I want to add black info/header line around 25-30 pixels high above the whole site with white centered simple text. When I add code in the custom css header section it breaks the loading of the site, that is why I am looking for some help. The line should appear on all pages and stay there even if there is scrolling.
Thanks in advance for any input.
Best, G

Re: Info line above site

Posted: 02 Aug 2018, 09:31
by mjau-mjau
This is something we have planned as an X3 plugin. A separate topbar above the menu, which can display static information, for example email, phone number, address and perhaps social media. Here is an example, background could be black or white of course:
Image
When I add code in the custom css header section it breaks the loading of the site
CSS is only for styling (for example styling anything that exists in your X3 website). CSS can NOT be used to include actual HTML elements, for example a new top bar.

I think you are under-estimating the complexity of adding such a feature, which you also ask to be fixed on page.
  • It cannot interfere with the already FIXED X3 top bar menu. You can't have multiple fixed elements in the same location. It is already complicated enough to create a fixed element that works nicely.
  • Did you plan how it will work on mobile devices?
  • It would require some well-planned CSS styles to create appropriate styles, size, width and spacing for everything that will go inside the top.
This would take some time to create properly. Even if we can hack it by injecting a top bar element with javascript, I wouldn't be able to create something like that on short notice without lots of testing and planning.

Re: Info line above site

Posted: 02 Aug 2018, 09:49
by GeoPal
I see Karl, didn't know the info about the fixed parts. A workaround? HTML page with top line and then the whole site embedded inside under it? Or this is not a good idea?

Re: Info line above site

Posted: 02 Aug 2018, 09:52
by GeoPal
On mobile, again, the line will be there on top. This is how I imagine it. The plug-in you are talking about is the thing I was looking for.
Best, G

Re: Info line above site

Posted: 03 Aug 2018, 01:54
by mjau-mjau
GeoPal wrote: I see Karl, didn't know the info about the fixed parts. A workaround? HTML page with top line and then the whole site embedded inside under it? Or this is not a good idea?
You mean to COMBINE your fixed menu AND your fixed combined topbar? There is no "fix", but it would have to be done and planned properly, else you will have those two items on top of each other no matter how it is done. Setting an element to "fixed", means it will be fixed relative to the window, regardless of where the element is embedded.
GeoPal wrote:On mobile, again, the line will be there on top. This is how I imagine it.  The plug-in you are talking about is the thing I was looking for.
Best, G
Yep, but if you have several items, it will often need to wrap into TWO lines on small mobile screen. You can't use a "height" setting, but instead use appropriate padding with the contents "natural" space. Also, it might not look nice if it takes double height on mobile, so you might want to optimize it so that some items are hidden on mobile, to make sure it remains a single line.

Anyway, even considering all the above, this is not something I can offer a custom solution for without spending a few hours.

Re: Info line above site

Posted: 03 Aug 2018, 03:27
by GeoPal
After all those considerations there is no need to lose time and energy for a custom solution. Someday, if you come with a plugin, everyone can enjoy it.
Thanks for the imput!
Best, G

Re: Info line above site

Posted: 03 Aug 2018, 15:52
by zuro
I will be waiting impatiently for this plugin.

Re: Info line above site

Posted: 04 Aug 2018, 00:35
by mjau-mjau
:thumbsup: :thumbsup: