Customize Native Child Theme in Ojs 3

Hi @NateWr,
Is it possible to remove that line and to make the announcement become full in the main bar?

Thanks in advance,

Hi @eddhie,

Can you provide a link to the site so I can take a look?

Thank you @NateWr for prompt reply, this is the link and finally I just solved the issue.

Thank you very much


Hi @eddhie,
would you like to share how to omit that line in the announcement display?
I am also interested to know how do you make additional heading like this

Thanks in advance for sharing

Hi @kawahyu, sorry for late reply
Previously, I tried by adding CSS, but did not successfully, lastly, I edit the “default” theme (We should not edit this default theme, but so far I dont have any option). If anyone find the way how to remove that line, please let me know
To do that sidebar menu, you need to activate Custom block manager and Static page plugins, First, create few static pages (this menu will appear under menu Settings->website->static pages). After that, put all those static page links in the Custome block manager plugin

Thank you

Thanks @eddhie for ur sharing,
About the sidebar, I mean how to make underlined heading with orange color, ABOUT JOURNAL.

Hi @eddhie,

It looks like you resolved it. I’d encourage you to seek out a CSS-only solution so that you don’t have to edit the files themselves. I can’t provide the full solution, but the key is to remove the styles attached to the :before. The following code should remove the line between the left and right announcements:

.pkp_page_index .cmp_announcements > .obj_announcement_summary:before, 
.pkp_page_index .cmp_announcements > .more:before {
    border: none;

But it looks you may only want to display a single announcement. When you get more announcements, you will probably need to adjust the floated values of the .more div as well.

@kawahyu, if you’re using the Manuscript child theme, you can get a block element to use that style by formatting the block like this:

<div class="pkp_block">
  <div class="content">
    <div class="title">My title</div>

The theme should automatically apply that style to the .title element.


Hi @NateWr,

Thank you for your help, It works perfectly

@kawahyu, Sorry for misunderstanding, already explained perfectly by NateWr

Many thanks

How to get the user color to black? I have uploaded a .css file making the entire background as white. But the user font color was also white and hence it is not showing up. Could you please tell me the code for it.

This looks resolve to me:

Is that the case for you?

I deleted the .css file since i was not able to get the user colored to black. Could you tell me where should i change the code? I treid doing it in the header.less file, but then the color of the fonts in buttons also changed.

I’m not clear on what you mean by getting “the user color to black”. Perhaps you want to add a custom CSS with a declaration like:

.pkp_structure_head { background-color: #000000; }


What changes have you tried?

Yes. I had changed the color of the head to white. Now the user button has a font which is white in color. So when i set the background color to white, the user couldnt been seen only(both white in color). After a while, i think the ojs must have realised that the color is now white, so it did change the font color to blue. But the button background is also blue, so now i cant see the button font.

So i need 2 things. How to change the color of the buttons and font color of the header. Or else can i change the font color of the button of the header only?

You’ll want to target your CSS changes with specific classes and ids.

If you describe what specific changes you have tried, we can help to guide you.

If you mean changing the backend view for users, this is managed differently than changing the frontend view. See this post on the other thread:

1 Like

Is there any way by which we can hide the right sidebar /blocks while viewing the abstract page specifically?

Hi @varshilmehta,

I think this is the same question you posted on another thread. Please post each question just once – otherwise the forum will get cluttered.

Alec Smecher
Public Knowledge Project Team

i tried. How ever I am not able to decompress/unzip the OJS file on the server. The limitation is 9 mb. Is there any other way to decompress the files?

Hi @varshilmehta,

I’m not sure I’m following – what did you try, and for what purpose?

Alec Smecher
Public Knowledge Project Team

How to remove this space above the header? Thanks