2. Una vez descargada y descomprimida la plantilla, entraremos en nuestro blog con la cuenta que tenemos de google a través de blogger.
3. Aparecera el Escritorio. Pondremos "Diseño" y luego a "Edición de HTML"
4. Subiremos el diseño que descargamos, presionando en Examinar y luego subir. Deben buscar, dentro de la carpeta descomprimida, el archivo con el nombre de la plantilla. Es del tipo XML.
5. Ahora debemos eliminar los widgets que vienen con la plantilla ya que muchos de ellos sólo funcionan en Blogger. Para ello iremos a "Elementos de la página".
En el caso de este diseño eliminare los 3 widgets del menu horizontal y debemos agregar una o más listas de links que serían los menús verticales de nuestra plantilla. Quedaría asi:
6. Ahora vamos a nuestro blog. Nos fijamos conque palabras comienza el contenido y con cuales finaliza. Luego buscamos el código de fuente.
Para acceder al código de fuente sigan esto: Ver/Código de fuente la página
Se encuentra en la barra de menús.
7. Separaremos los códigos necesarios empesando con el "CSS-Code sin Style Tags". Este siempre comienza con la siguiente línea:
Código:
<style id='page-skin-1' type='text/css'><!--
Comienzo del "Css-Code sin Style Tags":
Lo destacado con celeste se puede eliminar.
Terminación del "Css-Code":
El "CSS-Code" siempre termina con esta línea:
Código:
--></style>
En la imgen esta en color amarillo la terminación del CSS-Code y en rojo el comiendo del "Texto por encima de la página" <---- Como todavía no llegamos a este código sólo ignoren lo que dije.
Hay que eliminar lo que esta entre medio de lo resaltado en amarillo y lo resaltado en rojo, osea esto:
Código:
--></style>
Después agregamos el siguiente código al CSS-code:
8. Pasemos al "Texto por encima de la página". Este esta compuesto de la siguiente forma.
El "Texto por encima de la página" comienza donde finaliza el Css-Code:
Lo rojo sería el comienzo del "Texto por encima de la página". Lo amarillo sería el Css-Code.
El "Texto por encima de la página" termina donde empieza el contenido de la página.
Lo amarillo sería la terminación del "Texto por encima de la página", lo que esta sin resaltar sería el contenido el cuan NO debe ir en el diseño y lo rojo sería el principio del "Texto por debajo de la página" <---- No deben prestarle importancia todavía a esto porque no llegamos.
Luego eliminamos el siguiente iframe:
Lo muestro completamente:
9. El último código, el "Texto por debajo de la página" esta compuesto de la siguiente forma.
Comienza donde finaliza el contenido:
Lo amarillo sería la terminación del "Texto por encima de la página", lo que esta sin resaltar sería el contenido el cual NO debe ir en el diseño y lo rojo sería el principio del "Texto por debajo de la página"
El "Texto por debajo de la página" termina al finalizar el código de la plantilla:
Lo destacado con azul se puede eliminar.
10. Ahora tenemos que eliminar las imágenes de adminsitración del diseño. ¿Qué son estas imágenes? Estas imágenes son las utilizadas por los admins de los Blogs para editar sus entradas y widgets.
El fomato de las imágenes de administración siempre es así:
Y para que la imagen de administración desaparezca deben eliminar lo destacado con color.
Espero que les sirva.
Saludos! ______________
Ultima edición por kilometro6 el Mar Sep 14, 2010 8:19 pm; editado 14 veces
no te fue nada mal que bueno que regresaste al foro fuiste unos de mis modelos a seguir en 2008 pero creo que ya te supere o te iguale ______________ Su firma exede el tamaño permitido de 450x100px.
por eso fue removida. CP
Ya había visto este tutorial tuyo en el foro de Tokarg jeje, muy bueno un aplauso para ti, saludos. ______________ Estoy al borde de la gloria, y estoy colgando de un momento de verdad,
estoy al borde la gloria Y estoy suspendida de un momento junto a tí
Gracias por sus comentarios, me agrada saber que sirve de algo mi tutorial.
makewebpage nunca pense que yo podía ser un modelo a seguir, me sorprendio mucho. Si, volvi después de un tiempo. Lo que paso es que me fui a jugar al mu pero ya se me paso el vicio y regrese.
Gracias. Me parecio extraño que lo halla ni 1 sólo tutorial sobre esto en el foro así que puse manos a la obra y lo hice. Me alegro de que me halla quedado bien. ______________
nunca he entendido bien esto pero esto no es li mismo en ningun lado, si hay un diseño con div's diferentes que?? lo novaTOS SE VAN A QUEDAR BUSCADO EL NOMBRE DE UN DIV?????, la verdad esto no es un bueno tutorial, la verdad n7unca he visto uno que explique perfectamente como van los divs el nombre, por que empieza ahi el contenido, etc :S
lña verdad estoy confundido de si es ayuda o es confusion ______________ PWG me vio nacer en desarrollo web, ahora estoy estudiando programacion en la universidad gracias a ti, GRACIAS PWG!
En la mayoría de los diseños el contenido empiesa así. Además, con la experiencia uno va aprendiendo y se da cuenta que los diseños son diferentes y logra encontrar en donde separar los códigos. Este es un tutorial digamos base, es para tener una idea de como adaptar diseños. ______________
hola soy soupertelly o recursoswm o super css o como sea jejej solo te quiero decir q este fue el tutorial q me enseno a adpatr solo quiero decir gracias!
Las cookies son pequeños fragmentos de información de texto que nosotros o nuestros socios, almacenamos sobre usted de forma local por medio de su navegador.
Puede evitar el uso de cookies en cualquier momento a través de la configuración de su navegador.
Usamos las siguientes cookies que cumplen con el GDPR:
- Cookies esenciales: son absolutamente necesarias para que el sitio web sea completamente funcional.
- Cookies opcionales: son opcionales y nos ayudan a mejorar el sitio web, por ej. analizando el comportamiento de uso del sitio web sin identificarle personalmente.
Puede encontrar más información en nuestra sección de protección de datos/privacidad.
