Change the style of header logo in OJS 3

Dear PKP OJS master

Now I use OJS 3 Platform in my journal system and I have implemented bootstrap theme in it. In this case, I have some question about the theme editing.

  1. How to reduce the size of the sidebar, because we think that the sidebar size of the bootstrap theme was too large.

  2. How to change the logo position in the header from the left to the upper of the navigation menu in the header.

tobe

Thanks.

The bootstrap theme requires a working knowledge of HTML, CSS, and Javascript to customize. The introduction to the theme itself is here:

It looks like the changes you want are CSS based, so I would start with this CSS tutorial:
https://www.w3schools.com/css/

The changes you describe sounds like it may be easier to modify the template files. The sidebar size can be addressed by adjusting the grid column classes here:

And here:

Learn more about the Bootstrap grid system.

You’ll probably need to take the logo out of the navbar component in the header here:

Learn more about the Bootstrap navbar.

could you please explain more how to set the background image in header? what to change in header.tpl?

1 Like

@mhktub can you describe in more detail what you would like to accomplish and let us know what theme you are using?