Put up money to beautify openEMR and make it more EHR like

Anyone want to join me in putting up some money to beautify OpenEMR by hiring a CSS designer? The functionality of OpenEMR looks great, but for mental health, it needs to be more EHR-like. It occurred to me that CSS display:none could turn off some of the medically-focused links, thus making OpenEMR immediately more EHR-like without any recoding.

Roger

You can also do this by editing the json files that control the menus. No need to hire a CSS developer. Just edit the menus in your sites/default/custom_menus/ folders. You can remove the menu entries you don’t need. Keep a copy to go back to in case you mess anything up.

Might be cheaper than trying to hire someone if all you want to do is a ‘display:none’.

Okay, really good to know. Thank you.

But how are broader CSS changes made? For example, what if I want to connect a Bootstraps 4 or 5 dashboard or template to OpenEMR, can it be done?

Roger

We can provide funding as this is was something we try todo nearly 10 years ago!
Please contact me @:
sena@visolve.com
+1 408 850 2243

Let’s see what Stephen says about BS4 or BS5 templates. I think it would be toally worth it.

Roger

So broader CSS colors and theming changes can be done with a bootstrap 4 template (we have people who have worked on upgrading to bootstrap 5 but that work is not complete right now). That’s how the 40+ themes in OpenEMR are currently handled. They are all a compilation of a bootstrap 4 theme.

However, trying to make broad, consistent structural changes are going to require the work of a developer, and most likely a good one at that due to OpenEMR’s sprawling codebase with many different design patterns used. It wouldn’t make sense to hire a designer w/o also coupling that with a developer who knows the codebase well.

Its much easier to design and build a single page, such as a dashboard (and I say that with some caveats as it depends on how complicated the dashboard is), then it is to try and apply a large structural change to all the pages in the site due to how fragmented the OpenEMR page architecture is. It can definitely be done, but will require a lot of work. I imagine @visolveemr knows a whole lot about the pain points involved in this as they’ve been around for a long time in the community (great to hear from you again BTW).

1 Like

I am not a developer, but I assume you’re saying that each menu navigation item calls its own module, which then produces its own output, and the styling of that output is inconsistent across modules. Really too bad.

Roger

We currently use Bootstrap 4 and have made an initial foray into porting to Bootstrap 5.
However, application styling is very subjective depending on the apps audience.

Bootstrap came to be to provide a responsive framework for small devices. Since OpenEMR is over 20 years old it has been difficult to restructure in a cohesive way using volunteers as they become available.

It would be nice if we had the funding to gather a team of engineers and coders that are expert in the various areas required to do such a project. The first step to achieve this would be to assign a project manager to consult with a UI expert to do the engineering and put together a scope of work. From this engineering guidance the project manager can implement over time as resources and money becomes available.

The key to success will be to implement and follow the engineering recommendations throughout the development lifecycle pulling in the necessary developer resources as needed.

It is nice to hear from @visolveemr. Been awhile.

Can you elaborate on “EHR-like”? If it is just random font sizes, colors used by several contributors in past (and present), it can be managed to some extent by styles with some custom javascripts. You can also move/hide information on specific screens but …

If you are planning to make changes that do not get incorporated into standard code, you assume responsibility to retrofit them during every version/upgrade cycle.

Hi,
I am trying to customize menu items, I have found this file

sites/default/documents/custom_menus/Custom.json

Could somebody please tell me how to add a “display:none” ? Thanks!

Not sure about d-none in json but custom menu is just that. In general you could

  • copy standard menu as say local1.json
  • Using a decent json editor delete/move the nodes you want
  • Save to the local file
  • Assign the menu in user settings

Only downside is some effort after every upgrade if you see menu file was changed…

Best.

This looks great!

How can I assign the menu in user settings? I have found that for each user I can set main menu role and patient menu role, I can select between standard and custom.

In which path I have to save my main menu customized menu and my patient customized menu?

I have tried to copy standard.json

interface/main/tabs/menu/menus/patient_menus/standard.json

as custom.json and customize it, but it didn´t work. If I customize standard.json it worked (but it was not a “custom”).

Thanks!

Marco create un menu personalizado en base al menu standard.json (por ejemplo enfermeros.json). luego copia ese menu en openemr/sites/default/documents/custom_menus . Luego ve al administrador de usuario y asignale ese menu al usuario (te va a aparecer enfermeros.json).

Marco creates a custom menu based on the standard.json menu (for example nurses.json). then copy that menu to openemr/sites/default/documents/custom_menus . Then go to the user administrator and assign that menu to the user (nurses.json will appear).
Saludos
Luis.

1 Like

This solves my question!
I did copy interface/main/tabs/menu/menus/standard.json to /sites/default/documents/custom_menus/custom.json.

For patient_menu, copy interface/main/tabs/menu/menus/patient_menus/standard.json to /sites/default/documents/custom_menus/patient_menus/custom.json.

Regards!

Can you provide us with pix of the result you are trying to achieve Marco or others who have been successful in creating this custom menu?

Hello, I am new to the openEMR Forum. Is it possible to use JS Frameworks with openEMR backend to build user inferface?

Kristof

@kristof, Yes its possible to implement, but you have to develop required api into OpenEMR.

Modules are the correct path forward for modifying OpenEMR through events for future lifecycle of project.

yes we can go with module as well

That’s a fantastic initiative! Improving the user interface and design of OpenEMR to cater to the specific needs of mental health practitioners is indeed a valuable endeavor. Your suggestion about using CSS to enhance the EHR-like appearance without altering the underlying functionality is a clever approach.

Count me in for contributing to the fund to hire a CSS designer. A more user-friendly and visually appealing interface could significantly enhance the overall experience for mental health professionals using OpenEMR. Let’s collaborate to make this improvement a reality!