Embeded Layout?

20 views
Skip to first unread message

Mark Shelby

unread,
Feb 2, 2025, 3:59:48 PMFeb 2
to Bibledit-General
Please point me to the place in the software code to drop the header menu down several lines. I'm trying to embed the application into a Nextcloud instance (as an external link, embedded).

Here's a screenshot of the problem I'm running into. As you can see, due to the "absolute" menu header positioning, the menu is always covered.

I realize that Teus may not want the code altered like crazy... would someone mind either posting a fix here, or emailing me a message? Thanks.Screenshot_20250202_144815.png

Teus Benschop

unread,
Feb 3, 2025, 11:56:10 AMFeb 3
to bibledit...@googlegroups.com
Hello Mark,

The place where possible tweaks can be made is the file assets/header.html.

Adding a <br> right at the top of that file shifts the menu one line down. The code would look like this:

<br>

<!-- #BEGINZONE display_topbar -->

<div id="topbar" class="menu-##basicadvanced##">

<!-- #BEGINZONE bare_browser -->

<span id="backbutton"><a href="back" title="translate ("Go back")"></a></span>

<!-- #ENDZONE bare_browser -->


The topmost <br> was added. More of those <br> elements will shift the menu down even more.

Teus

Mark Shelby

unread,
Feb 3, 2025, 1:56:27 PMFeb 3
to bibledit...@googlegroups.com
Thank you!
Exactly what I needed to drop that menu.

Now, how to drop the initial menu header "login  feedback"?
Mark Shelby
601.909.0002

Mark Shelby

unread,
May 26, 2025, 9:00:55 AMMay 26
to Bibledit-General
Teus, 

1. Your solution (dropping the topbar with <br>) worked perfectly for the main menu once logged into the platform. Thanks!
2. Now I need to also drop the initial menu seen on the login screen (Feedback, Login)

without dropping the initial menu, it is useless to embed the application because the login option is covered up and so cannot be selected.
I'm familiar with web-design, css, bootstrap, etc... I'm curious if perhaps the login menu is in an 'absolute position' restriction?

Teus Benschop

unread,
May 27, 2025, 9:03:16 AMMay 27
to bibledit...@googlegroups.com
Hello Mark,

The same trick that positions the main menu lower also positions the "Feedback Login" menus lower. At least that is what I've seen when testing here on Safari and on Brave browsers.

Weird enough on Firefox inserting the <br> didn't position the menus any lower, but inserting 

<div><br></div>

instead does the trick so Firefox then behaves the same as Safari and Brave.

But you are seeing different behaviour with regard to the positioning of the Feedback and Login menus, what browser are you testing on?

With kind regards,

Teus Benschop

Mark Shelby

unread,
Jun 9, 2025, 8:21:46 AMJun 9
to Bibledit-General
Thank you. When you get time, could you kindly list the name of the html file I need to edit? Specifically, I'm looking for the html file providing the "Feedback / Login" page. I found it once, and once found it's location made perfect sense. Maybe it's too early or too late in the day, but I cannot find that file! :-)

Teus Benschop

unread,
Jun 13, 2025, 7:59:26 AMJun 13
to bibledit...@googlegroups.com
Hello Mark,

Yes, the file is easily forgotten in view of the many other files there.

The file to tweak is assets/header.html.

Mark Shelby

unread,
Jun 13, 2025, 6:39:55 PMJun 13
to Bibledit-General
Edited the file. I could see that it dropped the menu options down, but the menu was displayed as a blip or a quick flash, then disappeared, reverting to the regular menu still hidden under the parent site menu bar. I have tried it on several browsers with same results. Odd behavior. I thought it might be the parent site, Nextcloud, but I have another site embedded in the nextcloud menu and it displays properly. I'm including a few pics so you can visualize what is happening. I understand that the function I am trying to achieve is beyond the scope of the original bibledit program. I appreciate any help you can provide if and when you get time and would like to look at it. 
It may not be possible to embed it, given Bibledit's layout mandates. But it is a challenging mystery!

The first picture (screenshot_1) Simply shows the Nextcloud window with top menu, including two external (embedded sites.) the first Icon, a cross, links to my bibledit-cloud instance. The last icon, a chat icon, links to my discussion forum instance.
Screenshot_1.png

The next screenshot (screenshot_2) shows the way that bibledit-cloud is rendering the embedded site. If you aren't already logged in, there is no way to access the menu because it is hidden by the top bar. Moving the menu down does not solve the issue. The screen continually reverts to placing the menus at the topmost line of the screen. I've tried to render it on various browsers, same result.
Screenshot_2.png

The final picture (screenshot_3) shows the discussion forum, also embedded, displaying correctly.
Screenshot_3.png 

Teus Benschop

unread,
Jun 14, 2025, 8:04:46 AMJun 14
to bibledit...@googlegroups.com
Hello Mark,

It is hard to say what is causing the menu not to go one line lower in your situation. Also it's hard to say what causes the menu to get displayed very shortly then disappear. 

Could I receive a login to your Bibledit Cloud system as embedded? Then I can experiment with Bibledit Cloud to see how to get it displayed correctly.

Teus Benschop


Mark Shelby

unread,
Jun 14, 2025, 10:17:49 AMJun 14
to bibledit...@googlegroups.com
Sure! I figured it might be a challenge you'd be interested in. Email me directly,

mshe...@gmail.com.

I'll set you up with your preferred username & password. I can also give you access to the code so you can use SSH to play around with it.
Mark Shelby
601.909.0002
Reply all
Reply to author
Forward
0 new messages