Cómo crear un HTML personalizado para Tumblr

Tumblr usa variables para ayudarte a crear tu propio tema usando HTML personalizado.
Por cristina puno

Paso 1

Abre un archivo nuevo en Bloc de Notas.


Paso 2

Escribe la estructura básica del HTML de tu blog:

<head> </head> <body> </body>


Paso 3

Agrega contenido a la sección <head> usando las variables de Tumblr: Title, Favicon, RSS y Description:

<head> <title>{Title}</title> <link rel="shortcut icon" href="{Favicon}"> <link rel="alternate" type="application/rss+xml" href="{RSS}"> {block:Description} <meta name="description" content="{MetaDescription}" /> {/block:Description} </head>


Paso 4

Escribe el texto para visualizar el título y la descripción de tu blog dentro de las etiquetas <body>:

<h1>{Title}</h1> {block:Description} <p id="description">{Description}</p> {/block:Description}


Paso 5

Agrega el código para mostrar el contenido de tu blog. Usa las diferentes variables disponibles en la página del tutorial de temas. Por ejemplo, el siguiente permite visualizar una publicación de texto:

{block:Posts} {block:Text} <div class="mypost"> {block:Title}<h3>{Title}</h3>{/block:Title} {Body} </div> {/block:Text} {/block:Posts}


Paso 6

Agrega navegación al pie de tu blog usando las variables "Previous Page" y "Next Page":

<div class="footer"> {block:PreviousPage} <a href="{PreviousPage}">« Go Back</a> {/block:PreviousPage} {block:NextPage} <a href="{NextPage}">Go Forward</a> {/block:NextPage} </div>


Paso 7

Inicia sesión en Tumblr.


Paso 8

Ve a la página de tu blog y haz clic en "Personalizar".


Paso 9

Elige "Tema" y haz clic en "Usar HTML personalizado".


Paso 10

Copia el código que creaste en el Bloc de Notas y pégalo en la sección de tu blog de HTML personalizado.


Paso 11

Haz clic en "Guardar".