How change OJS footer image?

henriquejsfj · August 9, 2024, 1:24pm

You can add stuff to the footer by going to the:
website configuration => appearance => footer
path: management/settings/website#appearance/appearance-setup

And then you can paste a custom HTML by clicking in the “<>”. For example, mine is:

<div class="custom_footer_content">
<div style="display: flex; align-items: center;"><img style="width: 100%;" src="https://domain.domain/public/journals/1/pageHeaderLogoImage_pt_BR.png" alt="Logo" /></div>
</div>

The src image I took from the journal logo.

But this will not remove the standard OJS logo (in my case I choose to put side by side).

The custom CSS, like what @cager proposed you may upload in the Advanced part from Appearence.
Path: /management/settings/website#appearance/advanced

My related custom CSS is:

.custom_footer_content {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.pkp_structure_footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.pkp_structure_footer_wrapper {
    background-color: #081434;
}
  
.pkp_footer_content {
    display: flex;
    align-items: center;
}

.pkp_brand_footer img {
    filter: invert(1);
}

The result: