Spoilers en Blogger

Después de mucho tiempo de estar buscando la manera de poner spoilers en blogger he encontrado un blog donde teda los códigos y las instrucciones y después de mucho pensarlo me gustaría darles los códigos modificados y mejorados por que los que me daba el sitio web estaban un poco sucios y tenían error.

Edición de Html.

-Copia y pega este código Javascript entre las etiquetas
]]> y :


-Copia y pega este código CSS justo encima de la etiqueta ]]>:


.commenthidden {display:none;}

.commentshown {display:inline;}

-Guarda la Plantilla

Debería quedarte algo así:


.commenthidden {display:none;}

.commentshown {display:inline;}

]]>


Ahora ya deberías poder añadir spoilers en cualquier entrada de tu blog.

A continuación están los pasos a seguir para añadir spoilers en una entrada:

-Añade el siguiente código:


SPOILER
CONTENIDOOCULTO

-Donde pone NOMBREUNICO pon un identificador de spoiler único. Es importante que no pongas el mismo identificador a spoilers diferentes ya que en caso de poner el mismo identificador, cuando intentes abrir un spoiler es posible que abras el otro. Utiliza identificadores largos como por ejemplo blogmaniaenespañol.
-Donde pone SPOILER pon el texto del enlace.
-Donde pone CONTENIDOOCULTO pon el contenido que quieras ocultar(texto, imágenes…).

NOTA IMPORTANTE:
Ten en cuenta que si reestableces la plantilla o pones una plantilla nueva, el código Javascript y CSS que has introducido se eliminará y se verán todos los spoilers que hayas puesto en las entradas.

NOTA OPCIONAL 1:
En el código de añadir spoilers en una entrada nueva puedes substituir la etiqueta div por span. Por lo que tengo entendido, estas dos etiquetas actuan de la misma forma, con la diferencia de que div te formatea el texto como si fuera un párrafo y span no.

NOTA OPCIONAL 2:

Puedes guardar el código para añadir spoilers en Configuración > Formato > Plantilla de entrada, para que este código te salga cada vez que vayas a crear una entrada nueva.

3 pensamientos en “Spoilers en Blogger

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos necesarios están marcados *

*

Puedes usar las siguientes etiquetas y atributos HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>