Guía de aprendizaje: Cambio de la primera página del Portal del desarrollador

Puede crear y organizar el contenido en su Portal del Desarrollador para ofrecer una portada que se alinee con su marca y ayude a sus usuarios a descubrir sus API.

Antes de empezar

Debe tener un Portal del desarrollador habilitado y debe tener acceso de administrador para completar esta guía de aprendizaje. La guía de aprendizaje Creación del portal explica cómo habilitar el portal si todavía no lo ha hecho.

Acerca de esta guía de aprendizaje

En esta guía de aprendizaje, creará contenido para una página y, a continuación, cambiará la primera página para que sea la nueva.

Esta guía de aprendizaje le guiará por los pasos siguientes:

Creación de algunos bloques personalizados.
Crear y configurar una página.
Adición de bloques personalizados a la página.
Cambiar la primera página para que sea su nueva página.

Antes de realizar los cambios, la primera página se muestra como la siguiente captura de pantalla. Una captura de pantalla de la primera página original

Creación de algunos bloques personalizados

Inicie sesión en el Portal del desarrollador como administrador.
Vaya a Contenido > Bloques y haga clic en +Añadir bloque de contenido.
Introduzca " Block 1 en la descripción del bloque.

En el área de cuerpo, pulse Origeny, a continuación, especifique el siguiente HTML:

<div class="tutorial_block_1 tutorial_block_frontpage">
<h1><span>Create with our APIs</span></h1>

<p><span>Welcome to our Developer Portal where you will find APIs to create your awesome app.</span></p>
</div>

Añadir bloque de contenido - código fuente

Compruebe el aspecto del bloque pulsando Origen de nuevo.

Nota: Este bloque no utiliza ningún estilo en línea, sino que permite que el tema decida cómo se representa. La ventaja de esta configuración es que puede cambiar fácilmente la representación sin modificar el contenido existente en la base de datos. Cualquier estilo que sea necesario se puede añadir a un tema personalizado. Para más información, consulte Tutorial: Creación de un tema personalizado para el Portal del desarrollador.
Pulse Guardar.
Has creado ' Block 1.

Repita los pasos del 3 al 7 para crear ' Block 2' , ' Block 3, y ' Block 4.

Especifique Block 2 en la Descripción de bloque. En el área de cuerpo, pulse Origeny, a continuación, especifique el siguiente HTML:

<div class="tutorial_block_2 tutorial_block_frontpage">
<p class="text-align-center">Explore and subscribe to our APIs.<br />
See what you come up with!</p>

<p class="text-align-center">&nbsp;</p>

<div class="bannerButtonRow text-align-center"><a class="button cta-btns--white__btn" href="product">Explore API Documentation</a></div>
</div>

Especifique Block 3 en la Descripción de bloque. En el área de cuerpo, pulse Origeny, a continuación, especifique el siguiente HTML:

<div class="tutorial_block_3">
<p class="text-align-center"><a href="user/register">Create a new account</a> and get started with our APIs. It's free to join.</p>
</div>

Especifique Block 4 en la Descripción de bloque. En el área de cuerpo, pulse Origeny, a continuación, especifique el siguiente HTML:

<div class="block-get-help">
<div class="get_help">
<div class="column col1">
<h3>Getting Help</h3>

<div>Be sure to check out these extra help resources.</div>
</div>

<div class="column col2">
<h4>Get Started</h4>

<div>Get started with our APIs by creating an account and exploring the documentation to find what's right for you.</div>

<div><a href="user/register"><svg height="24" id="Layer_1" space="preserve" version="1.1" viewbox="0 0 32 32" width="24" x="0px" xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" y="0px"> <g> <polygon points="15.293,10.707 19.586,15 8,15 8,17 19.586,17 15.293,21.293 16.707,22.707 23.414,16 16.707,9.293"></polygon> <path d="M16,2C8.269,2,2,8.269,2,16s6.269,14,14,14c7.731,0,14-6.269,14-14S23.731,2,16,2z M16,28C9.383,28,4,22.617,4,16S9.383,4,16,4c6.617,0,12,5.383,12,12S22.617,28,16,28z"></path> </g> </svg>Create an Account</a></div>
</div>

<div class="column col3">
<h4>Forum</h4>

<div>Ask a question in the forums or search to forum history to see if it's been asked before.</div>

<div><a href="forum"><svg height="24" id="Layer_1" space="preserve" version="1.1" viewbox="0 0 32 32" width="24" x="0px" xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" y="0px"> <g> <polygon points="15.293,10.707 19.586,15 8,15 8,17 19.586,17 15.293,21.293 16.707,22.707 23.414,16 16.707,9.293"></polygon> <path d="M16,2C8.269,2,2,8.269,2,16s6.269,14,14,14c7.731,0,14-6.269,14-14S23.731,2,16,2z M16,28C9.383,28,4,22.617,4,16S9.383,4,16,4c6.617,0,12,5.383,12,12S22.617,28,16,28z"></path> </g> </svg>Join the discussion</a></div>
</div>

<div class="column col4">
<h4>Contact Us</h4>

<div>Can't find the answer to your question? Need more help? Have some feedback? Let us know!</div>

<div><a href="contact"><svg height="24" id="Layer_1" space="preserve" version="1.1" viewbox="0 0 32 32" width="24" x="0px" xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" y="0px"> <g> <polygon points="15.293,10.707 19.586,15 8,15 8,17 19.586,17 15.293,21.293 16.707,22.707 23.414,16 16.707,9.293"></polygon> <path d="M16,2C8.269,2,2,8.269,2,16s6.269,14,14,14c7.731,0,14-6.269,14-14S23.731,2,16,2z M16,28C9.383,28,4,22.617,4,16S9.383,4,16,4c6.617,0,12,5.383,12,12S22.617,28,16,28z"></path> </g> </svg>Email us</a></div>
</div>
</div>
</div>

Puede ver los nuevos bloques en la página Bloques de contenido. Si no se encuentra en la página Bloques de contenido, vaya a Contenido > Bloques para ver los nuevos bloques.

Crear y configurar una página

Vaya a Estructura > Páginas, haga clic en Añadir página.
En el campo Título administrativo, introduzca " Portal home.
En el campo Ruta, introduzca " newhome.
En Tipo de variante, seleccione ' Panels.
Asegúrese de que las demás casillas de verificación no están marcadas.
Pulse Siguiente.
Acepte los valores predeterminados de ' Panels ' para Etiquetas, y Estándar para Constructor, haga clic en Siguiente.
En Diseño, seleccione Ladrillos de dos columnas y haga clic en Siguiente.
Mantenga todos los valores excepto los siguientes:
- Arriba a la izquierda, establezca Clases en Small:9
- Arriba a la derecha, establezca Clases en Small:3
- Parte inferior izquierda, establezca Clases en Small:4
- Parte inferior derecha, establezca Clases en Small:8
Pulse Siguiente.

Adición de bloques personalizados a la página

Dejando el Título de página en blanco, pulse Añadir nuevo bloque.
En la sección Bloque de contenido, seleccione Bloque 1.
Desactive la casilla Mostrar título, seleccione Superior izquierda en la lista Región y haga clic en Añadir bloque.

Si ha añadido el bloque 1, repita los pasos del 1 al 3 para añadir los bloques 2, 3 y 4:
1. Para el bloque 2, seleccione Arriba a la derecha en la lista de regiones.
2. Para el bloque 3, seleccione Abajo a la izquierda en la lista de regiones.
3. Para el bloque 4, seleccione Abajo a la derecha en la lista de regiones.
Pulse Finalizar.
Pulse Actualizar y guardar.

Cambio de la primera página para que sea su nueva página

Nota: En esta guía de aprendizaje, creará una página nueva y la intercambiará con el valor predeterminado. Si se cometen errores, la página predeterminada sigue estando disponible como copia de seguridad.

Vaya a Estructura > Páginas.
Haga clic en el enlace newhome URL para su nueva página de inicio del Portal, compruebe que su página tiene el aspecto diseñado.
Vaya a Configuración > Sistema > Configuración básica del sitio.
En la región Página de inicio, establezca el campo Página de inicio predeterminada como nueva página de inicio.
Pulse Guardar configuración.

Qué ha hecho en esta guía de aprendizaje

La primera página del Portal del desarrollador ahora ha cambiado y se ha dispuesto con los bloques de contenido que ha especificado.

Qué hacer a continuación

Puede añadir más personalización de marca añadiendo contenido a los bloques personalizados como, por ejemplo, imágenes, o intentar utilizar uno de los bloques personalizados proporcionados como, por ejemplo, el bloque de contenido destacado. Por defecto, este bloque está en inglés, pero podría considerar añadir versiones en otros idiomas.