Grav-plugin-admin: Opciones personalizadas para agregar páginas

Creado en 13 abr. 2017  ·  16Comentarios  ·  Fuente: getgrav/grav-plugin-admin

Como expliqué en getgrav / grav # 421, sería genial tener la posibilidad de agregar tipos de página personalizados basados ​​en planos en el menú Agregar página.

Por ejemplo, el menú por defecto tiene estas opciones:

  • Añadir página
  • Agregar carpeta
  • Agregar modular
    Me gustaría poder agregar cosas como:
    Agregar publicación de blog
    Agregar galería
    Agregar otro tipo de página especial.

Estas opciones configurarían automáticamente las cosas para que, por ejemplo, se creara una página dentro del blog / directorio con una plantilla de página de "Elemento" para crear una publicación de blog, etc.

Esta sería una característica muy útil, especialmente al entregar el sitio a clientes que no tendrían que preocuparse por las plantillas de página y la estructura de carpetas.

enhancement

Comentario más útil

Creo que podríamos hacer una configuración para esto.
Tengo esto en mi versión local, si podemos acordar la estructura de configuración, puedo refactorizarlo en un PR.

De forma predeterminada, utiliza la plantilla utilizada por Agregar página.

admin.yaml

add_modals:
  post:
    label: Add Post
    blueprint: admin/pages/new_post
    template: custom_template
    link_classes: some_class
    modal_classes: some_modal_class
    with:
      some_data: for the template
    show_in: dropdown
  image:
    label: Add Image
    blueprint: admin/pages/new_image
    show_in: bar

Un plano de ejemplo. En mi blog tengo más de 1 autores así que con getNewPostRoute puedo generar una ruta para el usuario, por ejemplo para mi cuenta genera: "/ dave / posts"

new_post.yaml

form:
  validation: loose
  fields:
    section:
        type: section
        title: Add Post

    title:
      type: text
      label: Post Title
      validate:
        required: true

    folder:
      type: hidden

    route:
      type: hidden
      data-default@: '\Grav\Plugin\MyPlugin::getNewPostRoute'

    name:
      type: hidden
      default: 'post'

    visible:
      type: hidden
      default: ''

    blueprint:
      type: blueprint

Algunas imagenes

screenshot from 2017-04-26 11-45-05
screenshot from 2017-04-26 11-45-26

Todos 16 comentarios

Necesitaría esto pronto para un cliente.
¿Tiene alguna indicación sobre cómo podría implementar esto yo mismo?

Bueno, cuando le dices a un cliente que agregue una página, todo lo que tienen que hacer es seleccionar una Plantilla para lo correcto. Si configura el blog, la galería, etc., será igual de fácil. Sin embargo, si realmente desea agregar botones, simplemente duplique el botón Agregar página pero coloque la plantilla de campo preseleccionada y oculta (si así lo desea)

@ ricardo118 Desearía poder simplemente decirles que seleccionen la plantilla correcta y la carpeta correcta, desafortunadamente debido a la forma en que el modal está diseñado actualmente, el cuadro de selección de la carpeta enumera todas las páginas del sitio, lo cual es problemático porque está en orden para encontrar la carpeta correcta, necesitan desplazarse por cientos de páginas. De ahí los modales predefinidos.

Esperaba una solución más elegante para implementar esto que simplemente copiar y pegar los modales y editar directamente los archivos del complemento. (Debido a las actualizaciones)
Sin embargo, intenté hacerlo, pero me encontré con problemas al intentar especificar el valor predeterminado de las casillas de selección: Curiosamente, nunca obtengo la opción correcta de forma predeterminada.

¿Hay alguna forma de extender el complemento de administración sin cambiar su código para hacer lo que quiero?

Creo que podríamos hacer una configuración para esto.
Tengo esto en mi versión local, si podemos acordar la estructura de configuración, puedo refactorizarlo en un PR.

De forma predeterminada, utiliza la plantilla utilizada por Agregar página.

admin.yaml

add_modals:
  post:
    label: Add Post
    blueprint: admin/pages/new_post
    template: custom_template
    link_classes: some_class
    modal_classes: some_modal_class
    with:
      some_data: for the template
    show_in: dropdown
  image:
    label: Add Image
    blueprint: admin/pages/new_image
    show_in: bar

Un plano de ejemplo. En mi blog tengo más de 1 autores así que con getNewPostRoute puedo generar una ruta para el usuario, por ejemplo para mi cuenta genera: "/ dave / posts"

new_post.yaml

form:
  validation: loose
  fields:
    section:
        type: section
        title: Add Post

    title:
      type: text
      label: Post Title
      validate:
        required: true

    folder:
      type: hidden

    route:
      type: hidden
      data-default@: '\Grav\Plugin\MyPlugin::getNewPostRoute'

    name:
      type: hidden
      default: 'post'

    visible:
      type: hidden
      default: ''

    blueprint:
      type: blueprint

Algunas imagenes

screenshot from 2017-04-26 11-45-05
screenshot from 2017-04-26 11-45-26

@ david-szabo97 Esto es precisamente lo que tenía en mente. ¡Gran trabajo! Esta configuración me parece bastante sensata. Me gusta especialmente ese show_in: bar | dropdown, neat. ¿Cómo maneja la parte del nombre de la carpeta?

Mientras espera que el equipo ofrezca su impresión para un PR, ¿tiene una versión de su código en algún lugar en línea?

@fireraccoon He editado la parte de javascript de la página de agregar para auto-slugificar el título. Tal como lo haría al crear una página. Aunque en este caso no puede ver la carpeta porque está oculta. Pero haría lo mismo cuando crea una página normal, simplemente copie el título slugificado en el cuadro de texto de la carpeta.

Debido a que coloca la nueva página (carpeta) en la ruta, puede especificar una ruta personalizada, tal como hice data-default@: '\Grav\Plugin\MyPlugin::getNewPostRoute y al final tendrá el mismo efecto. ($ ruta. $ carpeta)

Todavía no lo tengo disponible en ningún lugar, pero puedo subirlo si lo desea.

@ david-szabo97 ¡Ok, ya veo! Me preguntaba si lo hizo a la manera JS o con algún tipo de gancho de procesamiento posterior al formulario. Si me encantaría verlo si tenéis tiempo gracias!

@fireraccoon Se podría hacer con un gancho de evento, pero la forma JS parece mejor.
Adjunté un archivo zip, simplemente reemplace sus complementos / administrador con esta carpeta de administración.
Puede buscar los cambios que hice buscando * MessedCode (es mi próximo blog basado en Grav)
Tuve algunos otros cambios en él, así que espero haber eliminado todo lo demás y funciona bien.

El código que encontrará en admin.min.js se copia de add.js. Es solo una forma en que puedo evitar volver a empaquetar todo el proyecto JS.

Tenemos un par de usuarios en mi blog, así que tuve que hacer muchos cambios para que la publicación fuera cómoda para todos. Este es uno de los cambios que necesitamos con urgencia.
admin.zip

@ david-szabo97 ¡Muchas gracias! Salvaste mi día. Me las arreglé para que funcionara con la última versión con bastante facilidad. Funciona de maravilla. Creo que este es un caso de uso bastante importante, y realmente espero verlo integrado en el complemento pronto. Además, los cambios son muy simples.

Un PR estaría bien. Sin embargo, preferiría no depender de JS para hacerlo.

@rhukster , me gustaría pasar datos de frontmatter arbitrarios del modal. Esto parece no funcionar en este momento. ¿Podría sugerir dónde debería buscar en el código base para abordar eso? ¿Estoy equivocado en cuanto al propósito de estos modales?

form:
  validation: loose
  fields:
    section:
      type: section
      title: Add Fancy Page

    title:
      type: text
      label: Title

    a_custom_attribute:
      type: text
      default: dummy
      label: Won't pre-populate the corresponding field

    header.another_custom_attr:
      type: text
      label: Neither will this
      validate:
        required: true

@ k8n
Puedo confirmar que no funciona como cabría esperar. En este momento, solo funcionan los campos de directorio y plantilla, pero no se completarán todos los atributos personalizados de la parte frontal.

No estoy seguro de cómo el campo with pasa datos a la página real que genera. He hecho un modal personalizado; como se muestra a continuación: ¿está intentando establecer campos en el encabezado, pero no aparece nada en el encabezado ni se presentan errores?

`` forma:
validación: suelto
campos:
sección:
tipo: sección
title: Agregar elemento multimedia

title:
  type: text
  label: Media Item Title
  validate:
    required: true

header.article_hyperlink:
  type: text
  label: Article Hyperlink (URL)
  validate:
    required: true
    type: url
header.article_date:
  type: date
  label: Article Date
  validate:
    required: true
header.article_blurb:
  type: textarea
  label: Article Blurb

folder:
  type: hidden
  default: '@slugify-title'

route:
  type: hidden
  default: /media

name:
  type: hidden
  default: 'media-item'

blueprint:
  type: blueprint

''

¿Aparece el modal y crea el contenido, pero no se transmite ninguno de los datos de los campos?

@sjclark , como dije en mi comentario sobre el tuyo, actualmente la transferencia de datos del modal no está implementada, lo verifiqué con el equipo de desarrollo de Grav.

¡Con suerte, alguien hará pronto un PR por esto!

+1 en esto.

¿Fue útil esta página
0 / 5 - 0 calificaciones