How can I customize admin dashboard in ojs 3.3.0-8

Hi, I’m trying to customize the admin view for make more responsive, I already try to make a child theme but is not working fine.

Captura de Pantalla 2022-06-02 a la(s) 10.34.42 a.m.

This is the view that I must customize but I don’t know how, I want to make an stylesheet to modify some styles that ojs already has.

Inspect the element that you want to modify to find the class or id name by right-clicking on the element and clicking inspect. As you find the class/id name of the element(s), you can add some CSS and upload the CSS through Custom CSS. Do not forget to add !important in each directive so that it can override the default CSS.

This will work but:

  • The solution is not easy to mantain (you need to patch your OJS after each new upgrade).
  • Using !important is not a good practice because “when everything becomes important, nothing is” (is better call css by order o extend the specificity of your styles).

Backend is not designed to be themed and I think this is a good idea, because keeping backend common for every OJS will let users can feel comfortable when they jump from your OJS to others…

If you still need to do this, you will like to take a look to this guide:
https://docs.pkp.sfu.ca/pkp-theming-guide/en/theme-backend

Cheers,
m.

1 Like

I have to create a stylesheet in the route /style, then I modified the file PKPTemplateManager.inc.php in the route /lib/pkp/classes/template/ adding a call to the stylesheet and finally I have to change the backend.tpl in the route /lib/pkp/templates/layouts/ for the requeriements of responsives pages.