Apuntes varios de diseño web
Cómo incrementar las reservas en un hotel
7 abril, 2019
Redes sociales para empresas turísticas
21 julio, 2019
Son cosas más que todo técnicas que seguramente le ayudarán a algún diseñador a salir de un aprieto, lo voy a usar de ahora en adelante
Mi web se mueve en celulares cómo solucionarlo
Busca en el head de tu tema y entre las etiquetas head añade este código:
<meta name=”viewport” content=”width=device-width, initial-scale=1″>
Esto hará que la web se adapte a la pantalla y no se le pueda hacer zoom.
Cerrar acordión en Elementor por defecto
Agrega este html al final de la sección de elementor donde tengas los acordiones
<script> jQuery(document).ready(function($) { var delay = 100; setTimeout(function() { $(‘.elementor-tab-title’).removeClass(‘elementor-active’); $(‘.elementor-tab-content’).css(‘display’, ‘none’); }, delay); }); </script>
Medidas para hacer una web responsive – BREAKS
Mobile : Under 768
Tablet pequeña : 769 – 991
Tablet larga : 992 – 1199
Desktop : 1200 +
Las etiquetas básicas en media queries son:
– Ejemplo uno : @media (max-width: 600px)
– Ejemplo dos : @media only screen and (max-width: 600px)
– Ejemplo tres de intervalos: @media only screen and (max-width: 340px) and (min-width: 5px)
@media all and (max-width: 800px)
Colocar código en html y que se muestre en forma de texto
O en palabras más técnicas “cómo convertir texto html en texto plano” usa esta herramienta:
Robots no rastreen este enlace
Esta es muy sencilla pero se olvida con facilidad: Para que los enlaces no sean seguidos por los buscadores usa rel=”nofollow”
Tener información del php de tu sitio
La mejor forma es crear un archivo con el nombre info.php e incluir esta información: Luego ubicarlo en la raíz de la página web acceder a https://dominio.tl/phpinfo.php y listo tendrás esta valiosa información (recuerda borrar el archivo) que servirá para pedirle a tu hosting que haga mejoras como pueden ser :
upload_max_filesize = 1000M
post_max_size = 2000M
memory_limit = 3000M
file_uploads = On
Hacer que un video de Youtube sea responsive
Crea un contenedor div que encierre el iframe y dale estas clases, con esto funcionará:
.videoresponsive { position: relative; padding-bottom: 56.25%; padding-top: 25px; height: 0; }
.videoresponsive iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
Comentarios en CSS
Comentarios en CSS: /* y termina con */
Plugin para sitemap de imágenes
-Advanced Image Sitemap.
Calendario gratuito para wordpress
-https://webnus.net/modern-events-calendar/
Botón flotante para comunicarse gratis y sin plugins
-https://whatshelp.io/widget
Links útiles diseño SEO y demás
Seo Google Rankig factors : https://backlinko.com/google-ranking-factors
Protocolo para crear bien SITEMAPS https://www.sitemaps.org/protocol.html
Creador de sitemap aparentemente limpio https://www.web-site-map.com/
Desactivar las actualizaciones automáticas de WordPress:
Utiliza estos códigos dentro de tu archivo wp-config.php, para:
- Desactivar las actualizaciones automáticas de WordPress:
define( 'WP_AUTO_UPDATE_CORE', false ); - Desactivar únicamente las versiones «medianas» (4.X), pero sí incluir las menores (4.9.X), el siguiente:
define( 'WP_AUTO_UPDATE_CORE', 'minor' ); - Desactivar TODAS las actualizaciones automáticas (temas, plugins, traducciones o WordPress), el siguiente:
define( 'AUTOMATIC_UPDATER_DISABLED', true );
Transferir una web creada en WordPress a otro hosting
- Hacer una copia de todos los archivos de public-html
- Exportar la base de datos desde phpmyadmin
- Subir los archivos de tu web al otro hosting.
- Crear una base de datos en tu nuevo hosting.
- Importar la base de datos
- Configurar el archivo wp-config.php
- Cambiar DNS
Referencias de otras páginas
Selectores CSS: https://uniwebsidad.com/libros/css/capitulo-2/selectores-basicos
Plugins para recordar
Chat con aplicación : https://www.tidio.com/ Plugin que permite crear un sistema de reservas basado en citas, días y horas específicas, ideal para profesionales médicos y quizás restaurantes. https://preview.codecanyon.net/item/booked-appointments-appointment-booking-for-wordpress/full_screen_preview/9466968?_ga=2.212842388.1432167823.1583981370-798710076.1583288988
Code Snippets:Una forma fácil, limpia y sencilla para añadir fragmentos de código a tu sitio. ¡No tendrás que volver a editar el archivo «functions.php»!
Cómo invertir el orden de las columnas en responsive design y WpBakery Builder
Con estas clases:
.invertir {flex-wrap: wrap-reverse !important;}
Fragmento de código Javascript para ocultar precio de categorías seleccionadas en Woocommerce
add_filter( ‘woocommerce_get_price_html’, function( $price, $product ) {
if ( is_admin() ) return $price;
// Hide for these category slugs / IDs
$hide_for_categories = array( ‘general’ );
// Don’t show price when its in one of the categories
if ( has_term( $hide_for_categories, ‘product_cat’, $product->get_id() ) ) {
return ”;
}
return $price; // Return original price
}, 10, 2 );
add_filter( ‘woocommerce_cart_item_price’, ‘__return_false’ );
add_filter( ‘woocommerce_cart_item_subtotal’, ‘__return_false’ );
Cosas originales con Elementor
Crear columnas responsive que se superpongan: https://www.youtube.com/watch?v=9hKnT_ahR
