Agrega tu propio CSS

Con SitioSimple puedes escribir tu propio CSS y modificar el estilo visual de tu sitio. Ésto te permitirá cambiar tipografías, colores, tamaños, insertar imágenes de fondo ¡y mucho mas!

Si aún no tienes conocimiento de CSS, puedes utilizar el método fácil de personalización de plantilla.

 

Pasos para incorporar tu CSS:

 

  1. Ingresa en el editor de tu SitioSimple, y ve a Mi Sitio – Diseño. Haz click en la solapa Edición Avanzada:
     
    css
     
  2. Dentro de la edición avanzada podrás ingresar tu propio código CSS.
  3. Haz click en “Habilitar Edición” para habilitar el cuadro de texto donde escribirás tu CSS.
    Esta casilla de verificación te permitirá habilitar o deshabilitar tu propio CSS cuando lo desees, y así visualizar el antes/después de tu sitio con y sin tu edición.
  4. Una vez habilitada la edición de CSS podrás ingresar tu propia personalización en el editor.
    A medida que vayas ingresando tu código, el sistema refrescará automáticamente la vista previa, de esta manera podrás visualizar como se están aplicando tus cambios en tiempo real.

 

IMPORANTE: Si seleccionas “Borrar Personalización”, el sistema, además de restablecer los valores por defecto de la plantilla, borrará el código CSS ingresado.

 

TIP: ¿Cómo cambiar la tipografía con CSS?

 

  1. Para cambiarla debes elegir una fuente desde Google Fonts: http://www.google.com/fonts
  2. Una vez seleccionada la fuente para utilizar en el sitio debes copiar el código de la página, por ejemplo
    • “@import url(http://fonts.googleapis.com/css?family=Bubbler+One);” y pegarlo en el editor de hojas de estilo.
  3. Luego agrega la familia tipográfica a la sección del sitio que quieras modificar, por ejemplo:
    • body *{ font-family: ‘Bubbler One’, sans-serif;}

 
estilos

 

Esto es sólo un tip, recuerda que puedes ingresar lo que desees en tu hoja de estilo CSS personalizada.

 

Comentarios

  1. Hola tengo una cuenta reseller de sitio simple y quiero poder cambiar el fondo del recuadro de los titulos de mis productos en mi pagina que aparecen inherentemente en blanco y la pagina es de fondo negro, por favor como puedo modificar dicho fondo con la edicion avanzada?

    • Ramiro, te comento que puedes modificar este fondo que mencionas desde la edición avanzada en tu editor. Aprovecho para comentarte que hemos realizado una serie de mejoras en lo que es carro de compras por lo que deberías chequear si ya se ha solucionado. Cualquier otra consulta estamos a tu disposición.

  2. Hola, necesito agregar espacio en blanco arriba de mi LOGO y MENU, pero no logro hacerlo con ningún codico css.
    Cual es el codigo que debo colocar por ejemplo para agregar 50 pixeles de margen arriba de todo de mi página?

    Mi web en construcción:
    http://sitiosimple.com/1173919

    Alguien puede ayudarme?
    Gracias!

    • Hola Francisco, antes que nada quería comentarte que dentro del administrador de tu SitioSimple tienes la opción de ayuda, en la esquina inferior derecha. Allí podrás consultar todo lo que necesites. Para hacer lo que requieres en el menú tienes que ingresar el siguiente código CSS en la edición avanzada:

      .navbar {
      margin: 10px 0 10px 0;
      }

      Puedes ir probando con distintos valores para obtener el resultado que deseas. Saludos cordiales!

      • Buenas tardes, hay forma de editar mediante los css la foto de la presentación del producto cuando es en forma vertical (o sea la foto no esta apaisada.) Me gustaría que queden más grandes.
        Gracias

        • Romina, te comento que la forma de visualizar las fotos del catálogo puedes modificarla ingresando a la opción “Editar” del listado de páginas. Además, en la edición avanzada puedes realizar los retoques que desees por CSS.

    • Hola Romeo, el código que usaste es incorrecto, le están faltando un par de caracteres. Prueba con:

      @import url(https://fonts.googleapis.com/css?family=Lato);

      body *{
      font-family: ‘Lato’;
      font-weight: 400;
      }

      Para controlar el tema de las mayúsculas puedes usar el siguiente CSS:

      text-transform: none|capitalize|uppercase|lowercase

      Donde uppercase pasa todo a mayúsculas, lowercase hace lo contrario y capitalize pone sólo la primer letra en mayúscula.

      Cualquier duda que tengas no dudes en consultarnos. Un saludo.

  3. Hola realicé una página en Sitio Simple, quisiera saber si tengo posibilidad de agrandar el logo que el sitio pone automáticamente en la esquina superior izquierda de la página, ya que la veo muy pequeña, muchas gracias

    • Hola Liliana, efectivamente, puedes agrandar el logo desde la edición básica, si la plantilla que seleccionaste lo permite o por CSS. En el transcurso del día nos estaremos comunicando para darte una mano. Saludos!

  4. Quiero cambiar el color del subtitulo del MENU y de los botones de face y twitter del pie de pagina, pero aunque cargue los códigos en CSS no lo modifica, o bien modifica toda la pagina por completo. Pueden ayudarme???

  5. Como puedo a mi sitio simple cambiarle un boton, por ejemplo el de PRODUCTOS que traen todas las plantillas, en mi sitio no vendo nada, es institucional y necesito agregar botones que contengan solo texto.
    Si alguien puede responder muchísimas gracias.

    • Buen día Gastón, te comento que desde el árbol de páginas, en “Sitio” -> “Páginas”, puedes des-publicar la página de productos. De esta manera no se verá en tu sitio, lo mismo puedes hacer con cualquier página, incluso podrás crear nuevas y agregar el contenido que desees. Quedamos a tu disposición, saludos.

  6. Hola! ¿Alguien sabe como editar con CSS el alto de la sección “Menú”? Desde la edición básica, para la vista en móviles no logro que responda a los cambios y el menú me ocupa 1/4 de la pantalla del celular.

    Les agradezco 🙂

    • Hola Eliana, te comento que el alto de tu menú corresponde al establecido por la plantilla, en tu caso antes que tocar el CSS te recomiendo que utilices nombres más cortos para cada sección, si te fijás, al poner 2 o 3 palabras menos ya se te ubica todo en una sola línea y queda mucho mejor. En este momento, debido a la cantidad de texto, se te fue de 1 a 3 líneas. Cualquier otra consulta que tengas no dudes en comunicarte, por acá o por el sistema de feedbacks (pestaña inferior derecha de la administración de tu SitioSimple). Saludos.

  7. Una pregunta: ¿para modificar atributos de la página, tengo que usar los tags de HTML como Body, P, H1,H2, etc.? ¿Es así? Me gustaría saber un poco más, porque en los sitios que yo diseño siempre tengo a manos los tags que utilizo. Pero en este caso no conozco los nombres o si hay algún tag especial que utilicen ustedes.
    Igual la plataforma es excelente.
    Gracias

  8. Buen día,como puedo hacer para agregar unmotor de busqueda personalizado a mi sitio web,tengo el codigo que se genera solo desde la pagina de google pero no puedo hacerlo funcionar en mi sitio simple.

    Gracias!

Escribe un comentario

¿Todavía no tienes tu página?

Créala en 2 minutos