Cómo añadir un plugin en el panel derecho de ONLYOFFICE Docs

1 octubre 2024By Sergey

La personalización mejora tu productividad al permitirte adaptar las herramientas a tus necesidades. Con la última actualización, los plugins de ONLYOFFICE ofrecen aún más flexibilidad. En el artículo anterior demostramos cómo mostrar un plugin como una pestaña separada. Otra valiosa opción de personalización te permite colocar el panel de plugins a la izquierda o a la derecha del editor. En esta entrada del blog vamos a explorar esta característica y explicar paso a paso cómo implementarla.

Cómo añadir un plugin en el panel derecho de ONLYOFFICE Docs

¿Qué ha cambiado?

Anteriormente, el archivo config.json utilizaba varios parámetros para gestionar la funcionalidad del plugin y determinar su visualización dentro del editor como: isInsideMode, isModal, isSystem, isVisual y menu.

Ahora los antiguos parámetros utilizados en el archivo config.json se han sustituido por un único parámetro: type. Este nuevo parámetro simplifica la configuración del plugin ofreciendo las siguientes opciones:

  • system: Un plugin a nivel de sistema que siempre está activo y no se puede desactivar.
  • background: Un plugin en segundo plano que se ejecuta continuamente una vez iniciado. Su estado (activado/desactivado) persiste entre sesiones.
  • window: Un plugin que funciona como una ventana independiente al iniciarse.
  • panel: Un plugin que se abre en el panel izquierdo.
  • panelRight: Un plugin que se abre en el panel derecho.
  • unvisible: Un plugin que es invisible al iniciarse.

En esta entrada del blog vamos a echar un vistazo más de cerca a la opción panelRight, que nos permite colocar el panel en el lado derecho del editor.

Cómo implementar

Como ejemplo, utilizaremos el plugin de Zotero, que permite la creación de bibliografías utilizando el servicio Zotero. Después de instalar correctamente el plugin, navegamos a la carpeta del plugin de Zotero dentro del directorio sdkjs-plugins y modificamos el archivo config.json. Encontramos los parámetros obsoletos:

 "isVisual": true,
 "isModal": false,
 "isInsideMode": true,

Y los sustituimos por:

 "type": "panelRight",

El archivo config.json editado podría tener el siguiente aspecto:

{
    "name": "Zotero",
    "nameLocale": {
        "ru": "Zotero",
        "fr": "Zotero",
        "es": "Zotero",
        "pt-BR": "Zotero",
        "de": "Zotero"
    },
    "guid": "asc.{BFC5D5C6-89DE-4168-9565-ABD8D1E48711}",
    "version": "1.0.3",
    "minVersion": "7.3.3",
    "variations": [
        {
            "description": "Create bibliographies in the required style using Zotero service.",
            "descriptionLocale": {
                "ru": "Оформляйте библиографические списки в нужном стиле с помощью Zotero.",
                "fr": "Créez des bibliographies dans le style nécessaire avec Zotero.",
                "es": "Cree bibliografías en el estilo requerido utilizando el servicio Zotero.",
                "pt-BR": "Crie bibliografias no estilo desejado usando o serviço Zotero.",
                "de": "Erstellen Sie Literaturverzeichnisse im gewünschten Stil mittels Zotero."
            },
            "url": "index.html",
            "icons": [
                "resources/light/icon.png",
                "resources/light/icon@2x.png"
            ],
            "icons2": [
                {
                    "style": "light",
                    "100%": {
                        "normal": "resources/light/icon.png"
                    },
                    "125%": {
                        "normal": "resources/light/icon@1.25x.png"
                    },
                    "150%": {
                        "normal": "resources/light/icon@1.5x.png"
                    },
                    "175%": {
                        "normal": "resources/light/icon@1.75x.png"
                    },
                    "200%": {
                        "normal": "resources/light/icon@2x.png"
                    }
                },
                {
                    "style": "dark",
                    "100%": {
                        "normal": "resources/dark/icon.png"
                    },
                    "125%": {
                        "normal": "resources/dark/icon@1.25x.png"
                    },
                    "150%": {
                        "normal": "resources/dark/icon@1.5x.png"
                    },
                    "175%": {
                        "normal": "resources/dark/icon@1.75x.png"
                    },
                    "200%": {
                        "normal": "resources/dark/icon@2x.png"
                    }
                }
            ],
            "isViewer": false,
            "EditorsSupport": [
                "word"
            ],
            "initDataType": "text",
            "initData": "",
            "type": "panelRight",
            "isUpdateOleOnResize": false,
            "initOnSelectionChanged": false,
            "store": {
                "background": {
                    "light": "#2D3037",
                    "dark": "#2D3037"
                },
                "screenshots": [
                    "resources/store/screenshots/screen_1.png",
                    "resources/store/screenshots/screen_2.png"
                ],
                "icons": {
                    "light": "resources/store/icons",
                    "dark": "resources/store/icons"
                },
                "categories": [
                    "specAbilities"
                ]
            }
        }
    ]
}

Después de realizar todas las modificaciones, tu plugin podría tener este aspecto:

Cómo añadir un plugin en el panel derecho de ONLYOFFICE Docs

¡Ojo! Para posicionar el panel en el lado izquierdo, actualiza la opción panelRight a panel.

Esperamos que esta entrada del blog haya sido útil para entender cómo personalizar tus plugins dentro de ONLYOFFICE. En ONLYOFFICE, nos esforzamos por hacer nuestros productos más fáciles de usar y personalizables para que satisfagan todas tus necesidades. Esto incluye la flexibilidad de personalizar los plugins según tu flujo de trabajo.

Te animamos a explorar el desarrollo de tus propios plugins, y siempre estamos abiertos a cualquier pregunta o sugerencia que puedas tener. La colaboración y el debate son muy apreciados para seguir mejorando juntos la experiencia de ONLYOFFICE. ¡Mucha suerte en tus esfuerzos exploratorios!

Crea tu cuenta gratuita de ONLYOFFICE

Visualiza, edita y colabora en documentos, hojas, diapositivas, formularios y archivos PDF en línea.