Macros usadas comunmente

Esta página enumera muchas de las macros de propósito general creadas para usarlas en MDN. Para obtener información sobre cómo usar estas macros, consulta Uso de macros y Usar macros de enlaces. Consulta Otras macros para obtener información sobre las macros que se utilizan con poca frecuencia, que se utilizan solo en contextos especiales o, están en desuso. También hay una lista completa de todas las macros en MDN.

Consulta también la guía de estilo CSS para conocer los estilos disponibles para usarlos.

Enlaces

Creando un solo hipervínculo

En general, no es necesario utilizar macros para crear enlaces arbitrarios. Utiliza el botón Enlace en la interfaz del editor para crear enlaces.

  • La macro Glossary crea un vínculo a la entrada de un término específico en el glosario de MDN. Esta macro acepta un parámetro obligatorio y dos opcionales:

    Ejemplos:

    1. El nombre del término (tal como "HTML").
    2. El texto que se mostrará en el artículo en lugar del nombre del término (esto se debe usar con poca frecuencia).Optional
    3. Si se especifica este parámetro y no es cero, no se aplica el estilo personalizado que normalmente se aplica a los enlaces del glosario.Optional
  • anch — crea un enlace a una sección en la página:

Enlace a páginas en referencias

Hay varias macros para vincular páginas en áreas de referencia específicas de MDN.

  • cssxref links to a page in the CSS Reference.
    Ejemplo: {{CSSxRef("cursor")}}, da como resultado: cursor.
  • DOMxRef enlaces a páginas en la referencia DOM; si incluyes paréntesis al final, la plantilla sabe que debe mostrar el enlace para que aparezca el nombre de una función. Por ejemplo, {{DOMxRef("document.getElementsByName()")}} da como resultado: document.getElementsByName() mientras que {{DOMxRef("Node")}} da como resultado: Node.
  • event enlaces a páginas en la referencia de Evento del DOM, por ejemplo: {{Event("change")}} da como resultado change.
  • HTMLElement enlaza a un elemento HTML en la Referencia HTML.
  • htmlattrxref enlaza a un atributo HTML, ya sea una descripción de atributo global si solo especificas el nombre del atributo o un atributo asociado con un elemento específico si especificas un nombre de atributo y un nombre de elemento. Por ejemplo, {{HTMLAttrxRef("lang")}} creará este enlace: lang. {{HTMLAttrxRef("type", "input")}} creará este enlace: type.
  • jsxref enlaza a una página en la Referencia de JavaScript.
  • SVGAttr enlaza a un atributo SVG específico. Por ejemplo, {{SVGAttr("d")}} crea este enlace: d.
  • SVGElement enlaza a un elemento SVG en la Referencia SVG.
  • httpheader enlaza a un header de HTTP.
  • HTTPMethod enlaza a un método de solicitud HTTP.
  • HTTPStatus enlaces a un código de estado de respuesta HTTP.

Enlazar a errores

  • Bugs
    • bug te permite enlazar a un error en bugzilla.mozilla.org fácilmente usando esta sintaxis: {{Bug(123456)}}. Esto te da: error 123456.
    • WebkitBug inserta un enlace a un error en la base de datos de errores de WebKit. For example, {{WebkitBug(31277)}} inserta WebKit bug 31277.

Ayuda a la navegación para guías multipágina

Previous, Next y PreviousNext proporcionan controles de navegación para artículos que forman parte de secuencias. Para las plantillas unidireccionales, el único parámetro necesario es la ubicación wiki del artículo anterior o siguiente de la secuencia. Para PreviousNext, los dos parámetros necesarios son las ubicaciones wiki de los artículos correspondientes. El primer parámetro es para el artículo anterior y el segundo es para el artículo siguiente.

Ejemplos de código

Ejemplos en vivo

Generar la barra lateral

Hay plantillas para casi todas las grandes colecciones de páginas. Por lo general, enlazan a la página principal de reference/guide/tutorial (esto, a menudo es necesario porque nuestras rutas de navegación a veces no lo pueden hacer) y colocan el artículo en la categoría apropiada.

  • CSSRef genera la barra lateral para las páginas de referencia CSS.
  • HTMLRef genera la barra lateral para las páginas de referencia HTML.
  • APIRef genera la barra lateral para las páginas de referencia de la API web.

Formato de propósito general

Indicadores en línea para documentación de APIs

optional_inline y ReadOnlyInline se utilizan en la documentación de la API, normalmente cuando se describe la lista de propiedades de un objeto o parámetros de una función.

Uso: {{Optional_Inline}} o {{ReadOnlyInline}}. Ejemplo:

isCustomObjectRead only
Indica, si es true, que el objeto es personalizado.
parameterXOptional
Blah blah blah...

Indicadores de estado y compatibilidad

Indicadores en línea sin parámetros adicionales

Non-standard

Non-standard_Inline inserta una marca en línea que indica que la API no se ha estandarizado y no está en un seguimiento de estándares.

Sintaxis

{{Non-standard_Inline}}

Ejemplos
  • Icono:

Experimental

experimental_inline inserta una marca en línea que indica que la API no está ampliamente implementada y puede cambiar en el futuro.

Sintaxis

{{Experimental_Inline}}

Ejemplos
  • Icon:

Indicadores en línea que apoyan la especificación de la tecnología

En estas macros, el parámetro (cuando se especifica) debe ser una de las cadenas "html", "js", "css" o "gecko", seguida del número de versión.

Desaprobado

Deprecated_Inline inserta una marca desaprobado en línea (Deprecated_Inline) para desalentar el uso de una API que oficialmente está en desuso. Nota: "Desaprobado" significa que el elemento ya no se debe utilizar, pero sigue funcionando. Si quieres decir que ya no funciona, utiliza el término "obsoleto".

No utilices el parámetro en ningún área independiente del navegador (HTML, API, JS, CSS, …).

Sintaxis

{{Deprecated_Inline}} o {{Deprecated_Inline("gecko5")}}

Ejemplos
  • Icon:
  • Insignia: Desaprobado Gecko 5

Obsoleto

Obsolete_Inline inserta una marca de obsoleto en línea (Deprecated_Inline) para evitar el uso de, por ejemplo, una función, método o propiedad que oficialmente es obsoleto.

No utilices el parámetro en ningún área independiente del navegador (HTML, API, JS, CSS, …).

Sintaxis

{{Obsolete_Inline}} u {{Obsolete_Inline("js1.8.5")}}

Ejemplos

Plantilla de insignias

Estas macros se utilizan principalmente en la página WebAPI. Consulta Creación de nuevas insignias para obtener información sobre cómo crear una nueva insignia (Badge).

Indicadores de encabezado de página o sección

Estas plantillas tienen la misma semántica que sus contrapartes en línea descritas anteriormente. Las plantillas se deben colocar directamente debajo del título de la página principal (o la ruta de navegación si está disponible) en la página de referencia. También se pueden utilizar para marcar una sección en una página.

  • Non-standard_Header: {{Non-standard_Header}}

    No estándar
    This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.

  • SeeCompatTable se debe usar en páginas que documentan características experimentales. Ejemplo: {{SeeCompatTable}}

    Esta es una tecnología experimental
    Comprueba la Tabla de compabilidad de navegadores cuidadosamente antes de usarla en producción.

  • Deprecated_Header: {{Deprecated_Header}}

    Desaprobado
    This feature has been removed from the Web standards. Though some browsers may still support it, it is in the process of being dropped. Do not use it in old or new projects. Pages or Web apps using it may break at any time.

  • Deprecated_Header con parámetro: {{Deprecated_Header("gecko5")}}

    Desaprobado Gecko 5 (Firefox 5 / Thunderbird 5 / SeaMonkey 2.2)
    This feature has been removed from the Web standards. Though some browsers may still support it, it is in the process of being dropped. Do not use it in old or new projects. Pages or Web apps using it may break at any time.

    No utilices el parámetro en ninguna área de diagnóstico del navegador (HTML, APIs, JS, CSS, …).
  • Obsolete_Header: {{Obsolete_Header}}

    Obsoleto
    Esta funcionalidad es obsoleta. Aunque puede aún funcionar en algunos navegadores, se desalienta su uso ya que puede ser removida en cualquier momento. Evite usarla.

  • Obsolete_Header con parámetro: {{Obsolete_Header("gecko30")}}

    Obsoleto Gecko 30 (Firefox 30 / Thunderbird 30 / SeaMonkey 2.27 / Firefox OS 1.4)
    Esta funcionalidad es obsoleta. Aunque puede aún funcionar en algunos navegadores, se desalienta su uso ya que puede ser removida en cualquier momento. Evite usarla.

    No utilice el parámetro en ninguna área de diagnóstico del navegador (HTML, APIs, JS, CSS, …).
  • secureContext_header: {{SecureContext_Header}}

    Secure context
    This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

Indica que una función está disponible en workers web

La macro AvailableInWorkers inserta un cuadro de nota localizado que indica que una función está disponible en el contexto de workers web.

Nota: Esta característica está disponible en Web Workers.