Blockquote cita estilo Numero por linea Blogger
Pasos:
Paso 1: Vamos a Blogger>> Plantilla>> Edicion HTML>>
Paso 2: Buscamos la siguiente linea (Ctrol + F) dentro de la plantilla
]]></b:skin>
Paso 3: Justo por encima de ]]></b:skin> pegamos la siguiente linea CSS
blockquote{background-color:#eee;font:normal normal 12px/14px "Consolas","Bitstream Vera Sans Mono","Courier New",Courier,monospace!important;color:#444;overflow:auto;margin:0 0 1em;padding:1em}blockquote,blockquote .line-number{font:normal normal 12px/14px "Consolas","Bitstream Vera Sans Mono","Courier New",Courier,monospace!important;display:block;white-space:pre}blockquote .line-number{float:left;margin:-1em 1em -1em -1em;text-align:right;background-color:#f1f1f1;color:#acacac;padding:1em .2em 1em .2em;border-right:1px solid #e0e0e0}blockquote br{display:none}blockquote .line-number span{display:block;padding:0 .7em 0 1em}blockquote .cl{display:block;clear:both}
Paso 4: Todavia en la plantilla buscamos la siguiente linea (Ctrol + F)
</body>
Paso 5: Justo por encima </body> de pegamos el siguiente código JavaScript
<script type='text/javascript'>/*<![CDATA[*/var pre=document.getElementsByTagName("blockquote"),pl=pre.length;for(var i=0;i<pl;i++){pre[i].innerHTML='<span class="line-number"></span>'+pre[i].innerHTML+'<span class="cl"></span>';var num=pre[i].innerHTML.split(/\n/).length;for(var j=0;j<num;j++){var line_num=pre[i].getElementsByTagName("span")[0];line_num.innerHTML+="<span>"+(j+1)+"</span>"}};/*]]>*/</script>
Paso 6: Guardamos los cambios realizados en nuestra plantilla
Recuerda la sintaxis para la cita(blockquote):
<blockquote>Aqui va el texto a citar en el blockquote</blockquote>
2 Comments