Inicio/ Portfolio/ CSS y theming para OJS
Personalización · CSS · OJS

CSS y theming para OJS

Personalizamos visualmente tu OJS con hojas de estilo a medida: identidad de marca, accesibilidad y coherencia con el sitio institucional, sin alterar el flujo editorial de PKP.

Servicio
Theming OJS
Alcance
LATAM y España
Foco
Marca · Accesibilidad
Stack
CSS · SASS · OJS Theme
Personalización CSS de OJS
Etapa 1 · Diagnóstico Etapa 2 · Propuestas Etapa 3 · Implementación Etapa 4 · Producción Caso · Hospital Italiano

OJS es potente, pero su apariencia por defecto rara vez refleja la identidad de una revista o institución. El theming a medida resuelve esa distancia.

Trabajamos la personalización visual dentro de las posibilidades de PKP: hojas de estilo CSS/SASS, ajustes de plantilla y componentes accesibles, para que tu OJS se vea profesional y coherente con tu sitio institucional sin tocar el flujo editorial.

Etapa 1

Diagnóstico de identidad

Marca y accesibilidad

Relevamos la identidad visual de la revista o institución —colores, tipografías, logos— y la comparamos con el OJS actual. Definimos qué se puede personalizar dentro de las posibilidades de PKP y qué requiere ajustes de plantilla.

Relevamos

  • Paleta, tipografías y logos institucionales
  • Coherencia con el sitio principal
  • Puntos de accesibilidad y contraste

Definimos

  • Alcance del theming dentro de OJS
  • Componentes a personalizar
  • Prioridades de marca y usabilidad
Etapa 2

Propuestas de estilo

Prototipos en CSS3

Presentamos propuestas de estilo en un OJS de prueba: variaciones de banner, header, footer, tipografía y componentes. El cliente elige la dirección y afinamos el prototipo final que será la base del theme.

Etapa 3

Implementación del theme

CSS · SASS · componentes

Implementamos el estilo aprobado mediante hoja de estilo CSS/SASS y ajustes de plantilla: header, navegación, portadas, páginas de artículo, formularios de registro e inicio de sesión. Todo respetando la semántica y la accesibilidad.

Etapa 4

Pruebas y puesta en producción

Responsive y accesible

Validamos el theme en distintos dispositivos y navegadores, revisamos contraste y accesibilidad, y lo cargamos en el OJS en producción. Entregamos la hoja de estilo y orientamos al equipo para futuros ajustes.

Caso · Tema a medida

Revista del Hospital Italiano de Buenos Aires.

Un tema hijo del tema por defecto de OJS, con carrusel del último número cerrado, archivo de números plegable y botonera de compartir. Todo vive en el plugin del tema, así que una actualización de OJS ya no se lo lleva puesto.

Portada de la revista con la identidad institucional aplicada
Portada: header, menú y bloques con el azul institucional y Fira Sans
Carrusel del último número cerrado en la portada
Carrusel del último número cerrado, alimentado desde el plugin
El carrusel avanzado una página, con sus flechas y puntos
Flechas, puntos y avance automático que se frena al interactuar
Archivo de números agrupado por año
Archivo de números: los recientes a la vista, el resto agrupado
Un grupo del archivo de números desplegado
Un grupo desplegado: años sueltos primero, lustros más atrás
Vista de artículo con la botonera de compartir
Vista de artículo con botonera de compartir bajo las galeradas

    Componentes propios

    • Carrusel del último número cerrado en la portada, con sección, fecha y visitas de cada artículo
    • Archivo de números plegado en grupos: los seis últimos a la vista, después un grupo por año y lustros hacia atrás
    • Botonera de compartir en el artículo: Facebook, X, LinkedIn y WhatsApp
    • Textos del tema en castellano, inglés e italiano

    Cómo está hecho

    • Tema hijo del tema por defecto de OJS: hereda tipografía, color base y opciones, y agrega lo propio encima
    • Los datos del carrusel se resuelven en PHP con un hook, no con consultas dentro de la plantilla
    • El plegado del archivo es del lado del cliente: sin JavaScript queda el listado completo e indexable
    • Marca en tokens CSS: azul institucional 4,93:1 sobre blanco, dentro de WCAG AA
    Cliente
    Hospital Italiano de Buenos Aires
    Entrega
    Plugin de tema para OJS 3.5
    Idiomas
    ES · EN · IT
    Stack
    PHP · Smarty · CSS · JS
    Ejemplos reales

    Mirá cómo quedan nuestros themes.

    Casos de personalización en el portfolio
    Ver el portfolio
    Opiniones verificadas

    Clientes que recomiendan.

    “Recomiendo 100% a Patricio y a su equipo de Paideia Studio. Atención personalizada excelente resolviendo dudas y recomendando soluciones con OJS y Crossref.”

    Rosario Gámez Sánchez · España

    “Mostraron gran profesionalismo, puntualidad y dominio técnico en la configuración e implementación del sistema OJS para nuestra revista.”

    Dr. Carlos Raúl Zenteno · México
    ¿Tu proyecto?

    ¿Querés un OJS con tu identidad?

    Diseñamos e implementamos themes a medida para OJS: marca, accesibilidad y coherencia. Contanos tu caso y lo evaluamos.