Dear guys,
I have one question,
I want to ask, how I can make my ojs journal mobile friendly?
Thanks
Dear guys,
I have one question,
I want to ask, how I can make my ojs journal mobile friendly?
Thanks
Hi @ammardent,
Are you using OJS 2.x or 3.x? OJS 3.0 features a responsive design, which is much more mobile-friendly than OJS 2.x.
Regards,
Alec Smecher
Public Knowledge Project Team
Hi @ammardent,
Upgrade instructions are included in the OJS 3.0 package. Note that not all functionality that was available in OJS 2.4.x is available yet in OJS 3.0; see e.g. Getting Ready For OJS 3.0: When Should I Upgrade?
Regards,
Alec Smecher
Public Knowledge Project Team
Hi @asmecher
Would you please send me sample links from journals who are already use OJS 3.0?
Regards
Google Search Console has identified that my OJS v3 site is affected by two Mobile Usability issues:
Text too small to read
Viewport not set
Google recommend that I fix these issues when possible to enable the best experience and coverage in Google Search.
Here are details on the Mobile Usability report:
https://support.google.com/webmasters/answer/9063469
Please let me know if you have any tips.
Maybe this is something that should be fixed in OJS default installation?
Thanks,
-FGN.
Hi @fgnievinski
Youāve mentioned that youāre using OJS 3. Did you set the Default theme, other than Default or a customized one as the theme of your journal?
Also, could you share your Journal URL or is it under development and not public yet?
And is this issue related to your journalās home or a specific section of it?
Best,
Israel
Hi @israel.cefrin.
The journal is live.
I believe weāre using the default skin.
Thanks for looking into this!
-FGN.
Hi @fgnievinski
Iāve ran a test using the Mobile Friendly tool (https://search.google.com/test/mobile-friendly) and the resulting report has no issues regarding to small text neither to a missing viewport setting. For the second issue youāve reported, on your journal website source code, line 6 has it declared:
6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
Could you please double check whether your Google Console isnāt reporting a cached version of your journal?
Also, Iāve noticed your journal is using OJS 3.1.2.0 and it is enabled the Default Theme which has been passed on automatic test for the initial page using Google Mobile Friendly testing tool: https://search.google.com/test/mobile-friendly?id=AJdgZKpg6dB2K6Yxt_I68A
Let me know if these issues are still showing up to you after you re-run the Mobile test.
Regards,
Israel Cefrin
Public Knowledge Project Team
Did you enable the Citation Style Language Plugin? This plugin provides links to pages that exhibit the aforementioned issue.
You can avoid by excluding those pages for web bot harvesting by adding a
Disallow: /citationstylelanguage/
to your robots.txt .
In the Webmaster console, then mark these errors as fixed - Googlebot will try to recrawl the pages and remove the error.
Hi @mpbraendle
Could you please tell us an example page from Citation Style Language Plugin which causes these issue warnings? I canāt find it on the Testdrive installation to check it. If it can be fixed we would file an issue on Github repo then.
Thanks,
Israel
Hi @israel.cefrin,
you can take any article details page and look into the HTML source.
Example:
https://www.psychoanalyse-journal.ch/article/view/jfp.59.4
The problem starts at this code:
<ul class="citation_formats_styles">
<li>
<a
aria-controls="citationOutput"
href="https://www.psychoanalyse-journal.ch/citationstylelanguage/get/acm-sig-proceedings?submissionId=1933"
data-load-citation
data-json-href="https://www.psychoanalyse-journal.ch/citationstylelanguage/get/acm-sig-proceedings?submissionId=1933&return=json"
>
ACM
</a>
</li>
<li>
<a
aria-controls="citationOutput"
href="https://www.psychoanalyse-journal.ch/citationstylelanguage/get/acs-nano?submissionId=1933"
data-load-citation
data-json-href="https://www.psychoanalyse-journal.ch/citationstylelanguage/get/acs-nano?submissionId=1933&return=json"
>
ACS
</a>
</li>
<li>
<a
aria-controls="citationOutput"
href="https://www.psychoanalyse-journal.ch/citationstylelanguage/get/apa?submissionId=1933"
data-load-citation
data-json-href="https://www.psychoanalyse-journal.ch/citationstylelanguage/get/apa?submissionId=1933&return=json"
>
APA
</a>
</li>
<li>
<a
aria-controls="citationOutput"
href="https://www.psychoanalyse-journal.ch/citationstylelanguage/get/associacao-brasileira-de-normas-tecnicas?submissionId=1933"
data-load-citation
data-json-href="https://www.psychoanalyse-journal.ch/citationstylelanguage/get/associacao-brasileira-de-normas-tecnicas?submissionId=1933&return=json"
>
ABNT
</a>
</li>
<li>
<a
aria-controls="citationOutput"
href="https://www.psychoanalyse-journal.ch/citationstylelanguage/get/chicago-author-date?submissionId=1933"
data-load-citation
data-json-href="https://www.psychoanalyse-journal.ch/citationstylelanguage/get/chicago-author-date?submissionId=1933&return=json"
>
Chicago
</a>
</li>
<li>
<a
aria-controls="citationOutput"
href="https://www.psychoanalyse-journal.ch/citationstylelanguage/get/harvard-cite-them-right?submissionId=1933"
data-load-citation
data-json-href="https://www.psychoanalyse-journal.ch/citationstylelanguage/get/harvard-cite-them-right?submissionId=1933&return=json"
>
Harvard
</a>
</li>
<li>
<a
aria-controls="citationOutput"
href="https://www.psychoanalyse-journal.ch/citationstylelanguage/get/ieee?submissionId=1933"
data-load-citation
data-json-href="https://www.psychoanalyse-journal.ch/citationstylelanguage/get/ieee?submissionId=1933&return=json"
>
IEEE
</a>
</li>
<li>
<a
aria-controls="citationOutput"
href="https://www.psychoanalyse-journal.ch/citationstylelanguage/get/modern-language-association?submissionId=1933"
data-load-citation
data-json-href="https://www.psychoanalyse-journal.ch/citationstylelanguage/get/modern-language-association?submissionId=1933&return=json"
>
MLA
</a>
</li>
<li>
<a
aria-controls="citationOutput"
href="https://www.psychoanalyse-journal.ch/citationstylelanguage/get/turabian-fullnote-bibliography?submissionId=1933"
data-load-citation
data-json-href="https://www.psychoanalyse-journal.ch/citationstylelanguage/get/turabian-fullnote-bibliography?submissionId=1933&return=json"
>
Turabian
</a>
</li>
<li>
<a
aria-controls="citationOutput"
href="https://www.psychoanalyse-journal.ch/citationstylelanguage/get/vancouver?submissionId=1933"
data-load-citation
data-json-href="https://www.psychoanalyse-journal.ch/citationstylelanguage/get/vancouver?submissionId=1933&return=json"
>
Vancouver
</a>
</li>
</ul>
The web bot parses the href URLs and then harvests the pages (e.g. https://www.psychoanalyse-journal.ch/citationstylelanguage/get/turabian-fullnote-bibliography?submissionId=1933) - of course, these have no style information, and therefore, Google Search Console issues a mobile friendly error.
Hi @mpbraendle,
Iāve attempt to check this page youāve sent, however it is blocked by robots.txt as you mentioned:
https://search.google.com/test/mobile-friendly?id=sJEy_HU2gl2USO6nwXoWEQ
Hence, I took the source code to test with Google Mobile Friendly tool and I didnāt get any issue, see here:
https://search.google.com/test/mobile-friendly?id=U33ysAElmPqUBNx3gCbHQg
Have you tweaked your local plugin to prevent it from issues?
Best,
Israel
Exactly - as I described before
Google Search Console has raised two additional issues (four in total).
Here are some examples:
Text too small to read
Mapeamento da Vulnerabilidade de EvacuaĆ§Ć£o em Caso de Desastres Naturais Empregando a Sintaxe Espacial | Revista Brasileira de Cartografia
Viewport not set
http://www.seer.ufu.br/index.php/revistabrasileiracartografia/citationstylelanguage/get/apa?submissionId=49222
Clickable elements too close together
Mapeamento da Vulnerabilidade de EvacuaĆ§Ć£o em Caso de Desastres Naturais Empregando a Sintaxe Espacial | Revista Brasileira de Cartografia
Content wider than screen
DesambiguaĆ§Ć£o dos Termos Mapeamento TopogrĆ”fico em Grandes Escalas e Mapeamento Cadastral no Brasil | Revista Brasileira de Cartografia
As @mpbraendle has indicated, some issues seem related to citations, though not all.
@israel.cefrin, we could grant you viewing rights in Google Website Administrator Tools ā if that could help, just send me your gmail, please.
Thanks,
-FGN.
Hi @fgnievinski
I think I know the reason for this Google Mobile issues. As far I can see they are all related, excluding the second issue which is a Citation issue that should be blocked though.
The reason for small screen issues is the characters lenght of some links in your reference section. It enforces the view-port to either cut-off a portion of your content viewing, making it closer than it should be and/or to fit all content by miniaturization of viewing.
It can be fixed adding a custom Stylesheet to your theme via: Dashboard > Settings > Website > Appearance (tab) , scroll down to Custom CSS and upload a CSS file with following code:
.item.references a {
word-break: break-all;
}
It will ensure that long words (like links) wonāt go over margin limits.
Please, after of clearing your site and browser cache, test it and let us know whether it has worked for you.
Best,
Israel
Dear @israel.cefrin,
I can confirm that your fix has improved the visuals:
http://www.seer.ufu.br/index.php/revistabrasileiracartografia/article/view/45150
Iām getting mixed results when trying to validate the fix in Google Webmaster; it seems I have to wait for the validation to finish.
Thanks for your help, Iāll keep you posted.
BTW, maybe this css should be include as a patch for the default installation?
-FGN.
Thanks for your suggestion @mpbraendle.
Can I edit the robots.txt file from within the OJS web interface?
Otherwise Iāll have to ask for our IT staff to do it.
Should they modify the proposed line:
Disallow: /citationstylelanguage/
to something that resembles more closely our journal URL, e.g.?
Thanks,
-FGN.
Hi @fgnievinski
It has been created a PR in Github Repo, I think it can be available shortly for default installation. See here:
Best,
Israel