Categoría: Como hacer – Ejemplos de códigos
Como hacer… Códigos de ejemplo ya escritos para hacer páginas web – Ejemplos HTML y CSS
En esta sección te ofrecemos un montón de ejemplos de código listos para usar.
Explicaciones detalladas sobre como hacer un montón de cosas en tus páginas web, desde ejemplos css, galerias de imagenes html, ejemplos de jquery, y muchos más temas.
Si tienes dudas sobre como se hace tal o cual cosa en una web, curiosea un poco por esta sección o usa el buscador que tienes arriba a la derecha.
Navega por las categorías para descubrir los ejemplos que más te interesen para tu web.
Vas a encontrar muchos codigos CSS para tu página web, listos para copiar y pegar. Son todos gratuitos.
En muchos casos te ofrecemos un archivo con el ejemplo para descargarlo.
No te cortes, visita el tema que te interese y usa el código en tu proyecto web, ¡para eso lo compartimos!.
Como añadir imágenes a una página web
Guía y códigos de ejemplo sobre como añadir imágenes a una página web y darles formato según tus necesidades.
Descubre cómo enviar un correo electrónico anónimo
¿Alguna vez has tenido que enviar un correo electrónico totalmente anónima?. Tal vez haya sido por querer declarar tu amor a alguien de forma confidencial, o tal vez eres un periodista o un agente, y necesitas advertir a alguien sin levantar sospechas.
Menú y galería de imágenes tipo slide con CSS y HTML
Como conseguir la simulación de un “efecto slide” en menús y galerías de imágenes, solo con CSS y HTML.
Sitemap: qué es, para qué sirve y cómo se construye
Este documento describe el esquema XML para el protocolo Sitemap.
Como conectarse a un FTP a través de Sublime Text 2
Guía en video donde se explica como conectar Sublime text 2 con un servidor FTP.
Cambiar el estilo CSS de una web dinámicamente. Parte I – JavaScript
Vemos una primera parte de este mini-manual que vamos a tener sobre cómo modificar dinamicamente los estilos CSS en nuestra página web. En esta primera parte vemos como hacerlo con JavaScript.
Cambiar el estilo CSS de una web dinámicamente. Parte II – PHP
Vemos la segunda parte de este mini-manual que vamos a tener sobre cómo modificar dinamicamente los estilos CSS en nuestra página web. En esta segunda parte vemos como hacerlo con PHP.
Cambiar el estilo CSS de una web dinámicamente. Parte III – Las horas del día
En esta tercera parte vamos a empezar a ver como cambiar el estilo CSS de una web dinámicamente en función de las horas del día.
Fondos con gradientes – degradados con CSS3
En este artículo explicamos las dos formas que hay de hacer fondos con gradientes en CSS3, con códigos de ejemplo para entender mejor el procedimiento.
Animar texto con CSS3 y WebKit para Chrome y Safari
Explicación del uso de las etiquetas pulse y bounce, integradas dentro del motor WebKit (Chrome y Safari) para animar textos con CSS· puro.
10 sencillos consejos para mejorar tus formularios
Crear un formulario puede ser tedios, sin embargo son una de las partes más importantes de una página web en la actualidad. Por ello estas sencillas pero buenas prácticas al momento de estructurarlos, para lograr una mejor experiencia de usuario.
La especificidad en Hojas de Estilo CSS
Un pequeño pero eficaz consejo que puedo dar para todos aquellos que empiezan a desarrollar sus primeras hojas de estilo CSS, es tener en cuenta el factor de la especificidad en CSS, su influencia y la manera de controlarlo.
Columnas múltiples con CSS3: column-count, column-gap, column-width y column-rule
Vemos como hacer con CSS3 columnas múltiples, un método muy sencillo de crear una estructura en columnas para tu web.
¿Cómo cambiar el estilo de nuestro sitio dinámicamente? Parte IV – Final
Vemos la última parte de este mini-manual sobre cómo modificar dinamicamente los estilos CSS en nuestra página web. En esta última entrega terminamos el ejemplo de las horas del día.
Soluciones a los problemas de visualización en Internet Explorer
Damos un repaso a las técnicas más usadas para lidiar con la tarea de conseguir que nuestra web se vea bien en todos los navegadores, poniendo especial atención a Internet Explorer, puesto que es el que más problemas causa.
Utilizar un loading o imagen de carga con CSS
Como usar una imagen animada de carga para amenizar la espera de tus usuarios.
Código CSS para cambiar el orden natural del contenido de una web
La forma en que se decida maquetar la página, no impide que podamos colocar los contenidos en el orden que creamos más conveniente, empleando adecuadamente las propiedades CSS.
Código HTML para añadir un número de teléfono a una web
Explicamos cuál es el código HTML para mostrar números de teléfono dentro del contenido de nuestros sitios web y que se pueda llamar pulsando en ellos.
Uso de jQuery para presentar y filtrar datos en tablas
Explicamos como mostrar y depurar datos de una tabla mediante jQuery, como dar un estilo adecuado para presentar los datos y como realizar el filtrado de los mismos.
Trabajando con elementos en jQuery: Generar HTML
Explicamos el método para generar elementos HTML y añadirlo a nuestro documento con jQuery
Crear tabs o pestañas con jQuery y CSS – Estructurando el contenido de una página web
En este artículo vamos a ver como se hacen tabs o pestañas con jQuery y CSS para agrupar la información de la página web de forma lógica y organizada.
Hacer un tooltip con jQuery y CSS3
Explicamos como utilizar jQuery en combinación con CSS3 para crear un pequeño tooltip que despliegue mensajes al colocar el mouse sobre un elemento.
Como hacer un tooltip con jQuery
Guía completa con código de ejemplo y descarga sobre cómo hacer un tooltip jQuery para usar en tu página web.
Opciones de software para colocar un buscador en una página web
Un buscador interno es esencial para conseguir una buena navegabilidad en el sitio. Para ello existen muchas opciones, en este artículo te hacemos una selección de las mejores.
Como migrar una página web en Joomla a otro servidor de hosting
Guía paso a paso para migrar una página web hecha en Joomla a otro servidor de hosting, incluída la base de datos, el archivo de configuración, etc.
Como crear encuestas en tu blog de WordPress
Si hace un tiempo comentaba algunas plataformas para añadir encuestas a tu blog, ahora os traigo un plugin de WordPress que permite integrar fácilmente las encuestas de PollDaddy.
Limitar el número de post en WordPress sin plugin
Código para limitar el número de post que se muestran en la home, categorías y archivos de un blog de WordPress sin usar plugins.
Cómo arreglar la página en blanco en WordPress
Es muy común encontrarse con una página en blanco tras una migración de WordPress. Vemos dónde puede estar el fallo.
HTML y CSS: Ejemplos de layouts
Maquetación de una página web a dos columnas con ancho fijo.
Código listo para hacer un menú desplegable con XHTML y CSS
Menú emergente desarrollado exclusivamente con XHTML (o HTML) y CSS.
Códigos útiles si creas formularios con Contact Form 7 de WordPress
Si gestionas tus formularios en WordPress con Contact Form 7 este post te va a ser realmente útil para dar un paso más en la personalización de sus funciones y conocer las posibilidades de este plugin.
Como abrir un pop up desde un enlace usando JavaScript
Generar pop ups cuando un usuario pincha un enlace, empleando JavaScript.
En este artículo explicamos el funcionamiento, uso e implementación de la aplicación geolocation mediante JavaScript.
Efecto cortina con CSS3, jQuery y MooTools
En este artículo explicamos como llevar a cabo la codificación del efecto cortina mediante el uso de CSS3 y dos de los frameworks más utilizados de JavaScript: jQuery y Mootools.
Uso de CSS para aplicar estilo a barras de desplazamiento
En este artículo explicaremos cómo mejorar la apariencia de las barras de desplazamiento, para así adaptarlas a la interfaz de usuario de nuestro sitio.
Explicamos como limitar los caracteres que se pueden introducir en un campo input de formulario, todo mediante jQuery
Ejemplo de utilización de propiedades CSS avanzadas
Allgunos ejemplos de utilización de las propiedades CSS avanzadas “content”, “counter-reset” y “counter-increment”.
Desplazamiento animado en anclas de enlaces con jQuery
Estaba buscando para un proyecto en el que estoy trabajando la manera de hacer desplazamientos dentro de la página de una forma menos brusca a la que brinda el html. Aquí la solución.
Sombras en el texto: la propiedad text-shadow de CSS3
Los efectos que se pueden conseguir sobre los textos aplicando “text-shadow” de CSS3 son simplemente impresionantes. Aquí les damos las bases para comenzar a trabajar con esta propiedad.
En este artículo explicamos algunos de los efectos que se pueden aplicar a imágenes gracias al uso de la propiedad filter.
Explicamos una técnica para poder rotar un texto con CSS, que sea visible en todos los navegadores
Enlace para mostrar y ocultar contenido con jQuery
Explicamos como llevar a cabo la creación de una función simple que nos ayude a mostrar y ocultar contenido de un elemento
Galerías de Imágenes con Scriptaculous: Lightbox para paginas web
Los lightbox son un recurso muy utilizado en la actualidad para crear galerías de imágenes. Es posible descargar e instalar en forma gratuita y sencilla algunos de estos scripts.
Maquetación de páginas web: crear un menu horizontal con CSS
Hay varias formas de presentar un menú de navegación en una página web. En este artículo, presentamos la forma de hacer un menú horizontal realizado con una lista flotante.
Ejemplo de maquetación de una página web (primera parte)
Maquetación de una página de ejemplo con elementos superpuestos, definición de la estructura y utilizando diferentes tipos de posicionamiento de capas y elementos flotantes.
Ejemplo de maquetación de una página web (segunda parte)
En la segunda parte, desarrollaremos y posicionaremos el menú horizontal de la página web.
Maquetación de un formulario en XHTML y CSS
Maquetación de un formulario utilizando XHMTL y CSS válidos.
Ejemplo de estructura de una página HTML
En este tutorial vamos a explicar las partes de una estructura básica de una página hecha en HTML.
Post aleatorios por categorías en WordPress
Si quieres mostrar los últimos post de una categoría concreta, o lo que es más, posts aleatorios de esa categoría aquí te traigo la solución.
Crear una galería de imágenes solo con CSS y HTML
Presentación de un código hecho de una galería de imágenes desarrollada completamente en CSS y HTML, explicada de forma que puedan realizarse las modificaciones que se deseen.
Enviar datos de un formulario con ctrl y enter
En este artículo explicamos cómo enviar información de un formulario y desplegarla en una página mediante las teclas ctrl y enter, haciendo uso de jQuery para el manejo de eventos.
Sombras y dimensiones con CSS3 – box-shadow
En este artículo practicamos con propiedades CSS3 para agregar sombras a las imágenes y efectos de profundidad al sitio.
Crear botones con propiedades CSS3
En este artículo prácticamos la estilización de botones con CSS3, utilizando gradientes, sombras y bordes
Formas de crear un texto vertical con CSS y HTML
Abordamos los distintos métodos que existen para colocar un texto de manera vertical en nuestra página.
Especificar un CSS Diferente por Post en Wordpress
En este artículo vemos como especificar diferentes CSS por post en WordPress gracias al archivo functions.php de nuestro tema.
CSS: Correcto uso de capas flotantes (float) con overflow
En este artículo explicamos como corregir el uso de flotantes dentro de un contenedor con la propiedad overflow
Expansión de una imagen de fondo con CSS
En este artículo explicamos dos métodos CSS distintos para expandir la imagen de fondo y tome el tamaño de la ventana del navegador.
Galería de imágenes en Wordpress: NextGen Gallery
Una atractiva galería de imágenes para Wordpress, para ser mostrada en páginas, entradas y widgets.
Menú multicolor con XHTML y CSS
Ejemplo de menú en el que cad ítem tiene un color diferente, empleando solo XHMTL y CSS.
Social Slider: un atractivo plugin social de Wordpress
Una atractiva opción para compartir los contenidos de la página en Wordpress en las redes sociales
Como hacer un foro en WordPress con Simple:Press Forum (tercera parte)
Como gestionar el foro Simple:Press Forum desde el panel de control.
Como hacer un foro en WordPress con Simple:Press Forum (segunda parte)
Segunda parte de la configuración de un foro de Worpress utilizando Simple:Press Forum.
Como hacer un foro en Wordpress con Simple:Press Forum (primera parte)
Como instalar, configurar y manejar un foro en Simple:Press Forum de Wordpress
Propiedades básicas para el manejo de CSS3: Fondos (parte 3)
Tercera parte de una serie que expondrá las propiedades más utilizadas de CSS3, en esta parte nos enfocamos a la estilización de fondos.
Propiedades básicas para el manejo de CSS3: Capas (parte 2)
Segunda parte de una serie que expondrá las propiedades más utilizadas de CSS3, en esta parte nos enfocamos a la estilización de capas (div).
Propiedades básicas para el manejo de CSS3: Textos (parte 1)
Primera parte de una serie que expondrá las propiedades más utilizadas de CSS3, en esta parte nos enfocamos a la estilización de textos.
Cómo recuperar los datos de acceso a WordPress (primera parte)
Perder los datos de acceso al administrador puede parecer complicado, aunque es posible que accedamos nuevamente al sitio siguiendo estos consejos.
Algunos trucos CSS simples para la maquetación de páginas web
Ejemplos CSS sencillos para maquetación de páginas web.
Manejo de imágenes con jQuery: Despliegue secuencial
Método sencillo y estético para desplegar nuestras imágenes de manera secuencial con efectos de jQuery
Simular frames (marcos) con HTML y CSS
Efecto muy sencillo donde se simula la utilización de marcos, y que solo se realiza con HTML y CSS.
Como hacer fondos “elásticos” para títulos y menús
Como hacer para que un fondo de imágenes se adapte a la longitud del texto, siguiendo dos métodos diferentes. Ejemplo en títulos y en menús.