Sukebe premium

Plantilla blogger para tematica Hentai

Guía de instalación premium

Guía paso a paso de cómo configurar e instalar de forma correcta la plantilla.

Leer guía de instalación

General

Habilitar vínculos de difusión

En nuestro panel » configuración buscamos Feed del sitio y presionamos en el checkbox del título Vínculos de redifusión y título. Si bien los vínculos de difusión, no han sido programados para esto, estos nos permitirán agregar datos adicionales a la entrada de una manera más comoda y sin tocar tanto código html.

Agregar Nuevo vínculo de difusión.

Para agregar un nuevo vínculo de difusión basta con ir a la pestaña Vínculos y buscar el texto Agregar otro vínculo de redifusión y agregar los datos que se mencionan en más abajo.

Variables

Las variables para el uso general las encuentras buscando <!-- General config --> en el Editor HTML de tu panel.

Nombre variableTipo de dato admitido
config.cmtblogger disqus facebook
config.shortnameString

config.cmt

Nos permite cambiar el sistema de comentarios. Por defecto es blogger

config.shortname

Nos permite agregar el shortname de nuestro disqus. En caso de que el valor de config.cmt sea disqus


Redes sociales

Para configurar las redes sociales en nuestro blog, debemos ir a nuestro panel » diseño y buscar el gadget de nombre "Social links". Lo abriremos dando clic sobre el ícono de lapiz, este nos mostrará un modal. En el único campo disponible que lleva el nombre de "Contenido" debemos de agregar el siguiente código:

[Object]

En el código anterior debemos de reemplazar el texto Object por el siguiente:

{url: URL, name: String}

Para agregar más enlaces, debes simplemente agregar una coma justo después del último corchete "}" y pegar el mismo código de nuevo.

En la siguiente tabla se detallan el uso de cada uno de los valores mencionados arriba.

Nombre atributousotipo de dato
urlEs la url a nuestro red socialURL
nameEs el nombre de una clase css del set de íconos de Fontawesome. Mira la lista de ícono disponible para marcas aquíURL

Información del footer

Al igual que hemos hecho con las redes sociales, debemos ir a nuestro panel » diseño y buscar el gadget de nombre "Logo" el cuál al dar clic sobre el ícono de lapiz se nos abrirá un modal con el campo "Contenido". Este campo debemos de agregar el siguiente código:

{ title: String, description: String }

En la siguiente tabla se detallan el uso de cada uno de los valores mencionados arriba.

Nombre atributousotipo de dato
titleEs el título de nuestro blogString
descriptionEs la descripción de nuestro blogString

Créditos

El desarrollo y creación de sukebe.xml ha sido posible gracias a la ayuda de las siguientes librerías y plataformas. Sin estas, esta plantilla no podría haber sido posible.

Librería/plataformaversiónauthor
Blogger Code-Soraya Lambrechts
Zkreations-Daniel
Karasu-basev1.3.7Karasu themes (MarceloTLD)
Google Fonts-Google LLC
Fontawesomev6.1.1FortAwesome
Swiperjsv8.3.1nolimits4web

Tarjetas

Las variables para las tarjetas las encuentras buscando <!-- Card config (Home page) --> en el Editor HTML de tu panel.

<!-- Layout config --> <Variable name="card.columns" {{...}} default="dft: 2, md: 4" value="dft: 2, md: 4"/> <Variable name="card.qualityImage" {{...}} default="300" value="300"/>
Nombre variableTipo de dato admitido
card.columnsbreakpoints
card.qualityImageNumber

card.columns

La variable card.columns nos permitirá manejar el número de tarjetas que visualizamos por fila. Esta funciona en base a un pseudo objeto de llave: valor separados por coma para los diferentes breakpoints. En la siguiente tabla se detallan los breakpoints, llaves y valores disponibles:

breakpointllaveDimensionesValor
defaultdft=number
extra-smallxs< 480pxnumber
smallsm≥ 576pxnumber
mediummd≥ 768pxnumber
largelg≥ 992pxnumber
extra-largexlg≥ 1280pxnumber

NOTA: La variable card.columns usa un sistema de 12 rejillas basado en CSS grid layout para su uso. Si bien es diferente, su idea es muy similar al sistem de rejillas que se implementa en frameworks/librerías populares como lo son bootstrap.

Si por algún motivo queremos mostrar 4 tarjetas por fila en escritorio, 2 en pantallas medianas y 1 para pantallas pequeñas (o superiores), podríamos usar el siguiente ejemplo para ello:

<!-- {{...}} --> <Variable name="card.columns" {{...}} default="dft: 1, sm: 2, lg: 4" value="dft: 1, sm: 2, lg: 4"/> <!-- {{...}} -->

card.qualityImage

Resolución de la imagen.

Este valor sólo se aplica si la imagen ha sido subida directamente desde blogger


Entradas

Las variables para las entradas las encuentras buscando <!-- Post config --> en el Editor HTML de tu panel.

<!-- Layout config --> <Variable name="post.metaHeader" {{...}} default="true" value="true"/> <Variable name="post.timestamp" {{...}} default="true" value="true"/> <Variable name="post.author" {{...}} default="true" value="true"/> <Variable name="post.numbCmt" {{...}} default="true" value="true"/>
Nombre variableTipo de dato admitido
post.metaHeaderboolean
post.timestampboolean
post.authorboolean
post.numbCmtboolean

Variables

post.metaHeader

Muestra contenedor que contiene los datos del autor, fecha de publicación y cantidad de comentarios

post.timestamp

Muestra la fecha de publicación de la entrada actual

post.author

Muestra el autor de la entrada actual

post.numbCmt

Muestra la cantidad de comentarios de la entrada actual. Valor solo disponible si el sistema de comentario es blogger

Slider

En nuestro panel » Diseño debemos buscar el gadget de nombre ""Configura tu slider de episodios""

en el cuál debemos dar clic sobre el ícono de lapiz, lo cual mostrará un modal similar al que se muestra en la imagen a continuación.

En el campo "Contenido" debemos agregar el siguiente código

{home: String/URL, label: String, column: Object, results: number}

propiedades

En la siguiente tabla se detallan el uso de cada uno de los valores mencionados arriba.

Nombre atributotipo de dato
homeString/URL
labelString
columnobject
resultsnumber

home

Se debe agregar la url de un blog alojado en blogger.

label

Es una etiqueta existente en por lo menos una entrada en nuestro blog o en el blog que hemos asignado en home

column

Su funcionamiento es igual al valor de card.columns.

results

Es la cantidad máxima de entradas a visualizar