Soluciones para Webmasters

Entradas

¿Recibes muchos mensajes de Clever Advertising Partner?

¿Recibes muchos mensajes de Clever Advertising Partner? 4youads.com ads-supplier.com ampliffy.com directadx.com g13advertising.com improvingads.com jlscleverads.com justclickads.com m5ads.com onrunads.com popmytraffic.com primads.com prymeskill.com supernovacy.com upperising.com

Leer Completo »

Crea un buscador de imágenes (json) con Fuse.js - para principiantes

Este buscador está basado en Fuse.js el cual es un poco complicado de entender si eres principiante, así que vamos a agregar el ejemplo completo para que funcione si o si a la primera. Así que solo deberás copiar este código en un archivo html, puedes llamarlo como desees. Ver demo <!doctype html> <html lang="es"> <head> <title>Buscar imágenes</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous"> </head> <body> <body class="bg-light"> <nav class="navbar navbar-dark bg-success"> <div class="container-fluid"> <a class="navbar...

Leer Completo »

Copiar el valor de un INPUT con Javascript

En nuestras páginas o paneles muchas veces mostramos datos en algún INPUT y es necesario copiarlo con el clic de un botón. Este código funciona solo con JavaScript, debido a que ahora todos los navegadores trabajan con la última versión de JS que es bastante potente. Cómo funciona A el INPUT se le asigna un ID para poder identificarlo, luego el botón llama a la función copiar. Al final la función usa el ID del INPUT y selecciona su valor para finalmente copiarlo. <input id="123" type="text" value="https://wwww.guiaplaza.com" /><button onclick="copiar(1)" type="button">Copiar</button> <script> function copiar() { let copyInput = document.querySelector('#123'); copyInput.select(); document.execCommand("copy"); } </script> Para hacerlo con varios INPUT mira el siguiente ejemplo: https://webmasters.guiaplaza.com/2022/05/copiar-el-valor-de-un-input-de-una.html

Leer Completo »

Copiar el valor de un input de una lista de varios input

En nuestras páginas o paneles muchas veces mostramos datos en los INPUT y es necesario copiarlos solo con el clic de un botón. Este código funciona solo con JavaScript, debido a que ahora todos los navegadores trabajan con la última versión de JS que es bastante potente. Cómo funciona A cada INPUT se le asigna un ID para poder identificarlo y luego cada botón llama a la función copiar enviando como parámetro el mismo ID del INPUT. Al final la función se ejecuta recogiendo el parámetro, pero muy importante haciendo un escape del ID, seleccionando el valor del INPUT y finalmente copiándolo. <input id="1" type="text" value="url1" /><button onclick="copiar(1)" type="button">Copiar</button> <input id="12" type="text" value="url2" /><button onclick="copiar(12)" type="button">Copiar</button> <input id="123" type="text" value=...

Leer Completo »

JavaScript: Cambiar imagen, si cambia el valor del input

Si tienes un panel (dashboard) con varios input y uno de ellos contiene la URL de una imagen, a lo mejor deseas mostrar la imagen en la parte superior y que al cambiar la URL dentro del input muestre la nueva imagen. Voilà! aquí lo que buscabas: document.getElementById("id_del_input").addEventListener('input', cambiaImagen); function cambiaImagen(){ var dato = document.getElementById("id_del_input").value; document.getElementById('id_del_img_src').src = dato; } Otra versión, hace lo mismo. var elemento = document.getElementById('id_del_input'); elemento.addEventListener('input', function (cambiaImagen) { var dato = document.getElementById("id_del_input").value document.getElementById('id_del_img_src').src = dato; }); En realidad hay muchas formas de hacerlo, pero hay que adaptar la que se adapte más a tus necesidades.

Leer Completo »

Instalar PHP en MacOS Monterrey

La nueva versión de MacOS, llamada Monterrey viene sin PHP, lo único que trae es el servidor web Apache y con algunas limitaciones. Así que para disfrutar nuevamente de PHP en resumen hay que desinstalar Apache e instarlo junto con PHP a través de Homebrew, este es un gestor de paquetes propio para MacOS. Toda la instalación se realiza desde la terminal y se requieren al menos algunos conocimientos avanzados del uso del equipo. Para la edición del archivo httpd.conf usa SUDO, así no te aparecerá el mensaje que no se puede escribir en el archivo. Paso 1: Instalar HomeBrew Tienes la opción de ir a su página web: https://brew.sh/ y copiar el código o hacerlo desde acá: /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)" Te pedirá la contraseña del equipo. Esta línea se autoinstala además unos componentes del Xcode , si no lo tienes deberías antes instalarlo. Al finalizar podrás comprobar que ya está instalado con este c...

Leer Completo »

Transformaciones para fotos en blogger(blogspot)

Los efectos en fotos en las CMS normalmente son agregados con otros servicios externos de procesamiento de imágenes como Cloudinary entre otros. Sin embargo Blogger.com está agregando algunos efectos de recorte al hosting propio de imágenes: Veamos algunos ejemplos: Tamaño original de 4032 × 3024 <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmZNsfYcrxis_mvYRzJDUT5oI-Sc1A06nh_Vm_d_3_xFewu4AuLM8KjsUxUIr4vLls0vpJ66ZvEkTHc4lhIUW3ApJrtZqHgJ3YaG8wPb_enKlNeO2YIiJJiiQRkJc3aQujsOJi5KXHbk4C/s16000/deperu-com-dclGBWd-2nU-unsplash.jpg" /> Ahora vamos a recortar a FullHD <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmZNsfYcrxis_mvYRzJDUT5oI-Sc1A06nh_Vm_d_3_xFewu4AuLM8KjsUxUIr4vLls0vpJ66ZvEkTHc4lhIUW3ApJrtZqHgJ3YaG8wPb_enKlNeO2YIiJJiiQRkJc3aQujsOJi5KXHbk4C/w1920-h1080-p-k-no-nu/deperu-com-dclGBWd-2nU-unsplash.jpg" /> Ahora vamos a r...

Leer Completo »

PHP - Eliminar las tildes (acentos) ortográficos

Existen varias funciones para eliminar los acentos de las palabras, cada una de ellas se puede usar en escenarios diferentes. El uso más conocido es la generación de las direcciones a través de títulos, ahora requisito de los buscadores, configurado en la cabecera de las páginas. Ejemplo: <link href="https://www.guiaplaza.com/esta-direccion-mo-existe.html" rel="canonical"></link> Funciones PHP function quitaTildes($letra) { $letra = ereg_replace("[áàäâ]", "a", $letra); $letra = ereg_replace("[éèëê]", "e", $letra); $letra = ereg_replace("[íìïî]", "i", $letra); $letra = ereg_replace("[óòöô]", "o", $letra); $letra = ereg_replace("[úùüû]", "u", $letra); $letra = ereg_replace("[Ññ]", "n", $letra); $letra = str_replace("Ç", "c", $letra); $letra = str_replace("ç", "c", $letra); ...

Leer Completo »

Encontrar la primera imagen con PHP

Cuando trabajamos con bases de datos o archivos json, éstos vienen con código html y a veces es necesario obtener solamente la primera imagen. Esta función retornaImagen() me ha servido en muchas ocasiones para extraer la imagen de un texto enriquecido con html. La función recibe dos datos: La variable con todo el código html. Una URL de una imagen alternativa La función devolverá la URL de la primera imagen encontrada (jpg, png, gif o jpeg), caso contrario devolverá la url de la imagen alternativa. Si falla la búsqueda de la imagen, por ejemplo debido a que el scr contiene una imagen de tipo base64, el cual es un código muy largo, la función también devolverá la imagen alternativa. function retornaImagen($texto, $foto) { $texto = html_entity_decode($texto); $inicio = strpos($texto, 'src="'); $fin = 0; if ((int) strpos($texto, '.jpg') != 0) { $finImagen['jpg'] = (int) strpos($texto, '.jpg'); } if ((int) strpos...

Leer Completo »

SEO para Youtubers y no depender de las recomendaciones

Muchos Youtubers dependen de las recomendaciones de Youtube, pero estas pueden ser muy buenas hasta que la misma plataforma cambia las reglas. Ya son incontables influenciadores que han caído estrepitosamente sus reproducciones porque Google cambió las variables que toma en cuenta para recomendar vídeos. Hasta ahora la mejor estrategia es lograr que los sitios web pongan tus vídeos en sus páginas, también llamado como «incrustar» o «embeber» un vídeo dentro de una página web. Para ello como Youtuber debes crear Alianzas con sitios web para lograr este objetivo, que pongan tus vídeos en sus páginas. Adicionalmente debes lograr que debajo del vídeo inscrustado el webmaster agregue un link directo a tu vídeo o canal. Este link puede ir opcionalmente dentro del texto del artículo o al pie como fuente, lo necesario es conseguir el enlace y no solamente que pongan el vídeo. La publicidad en estos videos sigue siendo ingresos únicamente para el Youtuber, no se comparte con el si...

Leer Completo »

Cuántos buscadores aún quedan en la web

Según el mismo google, estos quedan: Lista de motores de búsqueda predeterminados Motor Nombres de dominio Parámetro 360.cn https://360.cn/ q Alicia https://www.alice.com/ https://aliceadsl.fr qs Alltheweb https://www.alltheweb.com/ q Altavista https://www.altavista.com/ q AOL https://www.aol.com/ encquery, q, query Ask https://www.ask.com/ https://search.aol.fr alicesuche.aol.de etc. q Auone https://search.auone.jp/ q Avg https://isearch.avg.com q Babylon https://search.babylon.com q Baidu https://www.baidu.com/ wd, word Biglobe https://biglobe.ne.jp q Bing https://www.bing.com/ q Centrum.cz https://search.centrum.cz/ q Comcast https://search.comcast.net q Conduit https://search.conduit.com q CNN https://www.cnn.com/SEARCH/ query Daum https://www.daum.net/ q DuckDuckGo https://duckduckgo.com q Ecosia https://www.ecosia.org q Ekolay https://www.ek...

Leer Completo »

Input para crear y direccionar una URL con JavaScript

Muchas veces tenemos un sitio web con una casilla de búsqueda (INPUT) y deseamos agregar esta palabra a la creación de una URL, lo usual es hacerlo enviando la palabra como un parámetro de URL y recoger la variable con $_GET de php, pero si ya sabemos cómo va la dirección en su estructura, es mejor crearla en el mismo buscador y redireccionar la página a la nueva dirección de destino. Pero, veamos qué objetivos buscamos: Ingresar un texto. Bajar el texto a minúsculas. Retirar los acentos o tildes. Crear una nueva URL. Redireccionar automáticamente. Usaremos Javascript: <form> <input id="text" type="search" placeholder="ingrese texto" /> <button onclick = "ir()" type="submit">Buscar</button> </form> <script> function ir() { var url= "https://www.deperu.com/productos/categoria-" + document.getElementById("text").value.toLowerCase().normalize("NFD...

Leer Completo »

PHP - Cortar cadena de texto hasta un determinado carácter

Tenemos la cadena: $cadena = "Título de receta 1: en GuiaPlaza.com"; $cadena2 = "Título de receta 2: en GuiaPlaza.com"; $cadena3 = "Título de receta 3: en GuiaPlaza.com"; // ... y así sucesivamente. Normalmente puede ser un array. $cadena = preg_match("/(.*)\:/", $cadena, $matches); echo $matches[1]; // Resultado: Título de receta 1

Leer Completo »

PHP - Eliminar texto entre paréntesis dentro de una cadena

Se tiene la cadena: $cadena = "GuiaPlaza.com es un sitio con buenas recetas (actualizado a 2018)"; Y lo que deseamos hacer es eliminar el texto entre paréntesis. $cadena = preg_replace("/\((.*?)\)/",".", $cadena); echo $cadena; // devuelve: GuiaPlaza.com es un sitio con buenas recetas En el ejemplo de arriba lo hemos reemplazado con un punto ".", pero podría ser un espacio en blanco o nada. No hay que olvidar que nos entregará un espacio en blanco al final, así que hay que retirarlo con la función trim: $cadena = trim($cadena); Este útil ejemplo puede servir para eliminar otro texto entre llaves o corchetes, etc. $cadena = preg_replace("/\{(.*?)\}/",".", $cadena); $cadena = preg_replace("/\[(.*?)\]/",".", $cadena); $cadena = preg_replace("/\<(.*?)\>/",".", $cadena); ¡Suerte!

Leer Completo »

PHP - Los arrays

Los arrays en PHP son fáciles de usar cuando se comprende su estructura: $variable = array(datos); Datos de Texto Este tipo de array es el más simple y no usa clave. $variable = array("rojo","azul","amarillo"); Datos Numéricos Fijarse que este tipo de array no lleva comillas. $variable = array(1,2,3,4,5); Datos combinados Notar que los datos numéricos no llevan comillas y los datos de texto si lo hacen $variable = array("rojo",2,"verde",4,"azul"); Arrays Asociativos Este tipo de array son más completos y sirven para ser más específicos con los datos, se recomienda su uso cuando tenemos más información para crearlos, como ya diferenciamos los tipos de datos, ahora vamos a usar un array asociativo combinado. $variable = array("color" => "rojo", "cantidad" => 20, "lugar" => "arriba", "puntaje" => 12); La clave (key) es una descripción del...

Leer Completo »

Resaltar texto en página con jquery

Es muy común en algunas páginas web que haya un texto resaltado debido a una búsqueda o palabra clave destacada, esto se puede hacer directamente en la página del lado del usuario/navegador con jquery, evitando resaltar desde el lenguaje de programación usado en el servidor de hosting. Primero hay que crear un estilo para resaltar el texto <style type="text/css"> .highlight { background-color: yellow } </style> Luego debemos enlazar un plugin de jquery, porsupuesto luego invocar a jquery. <script language="javascript" type="text/javascript" src="/js/jquery.highlight-3.yui.js"></script> Seguido vamos a crear el script que buscará un párrafo <p> con la palabra a destacar, en este caso del ejemplo será laptops. <script language="javascript" type="text/javascript"> $(document).ready(function() { $('p').highlight('laptops'...

Leer Completo »

Agregar ID aleatorios a archivo CSS para actualizarlo y evitar el caché

Este sencillo código te permitirá evitar el caché del navegador del usuario o evitar el caché del hosting. Por ejemplo si tienes un archivo CSS en tu página: <link href="https://www.guiaplaza.com/css/estilos.css" rel="stylesheet"> Lo más probable es que éste se almacene en el caché y cuando quieras hacer una actualización y subas el archivo no verás los cambios. Si la extensión de tu página es .php podrás agregar este sencillo código. <?php echo '?'.rand(1000, 9999); ?> Cuando ya no necesites la actualización automática simplemente puedes comentar la línea: <?php //echo '?'.rand(1000, 9999); ?> ¿Cómo Funciona? <link href="https://www.guiaplaza.com/css/estilos.css<?php echo '?'.rand(1000, 9999); ?>" rel="stylesheet"> Es sencillo, echo es la sentencia que imprime en la página y rand() es un generador aleatorio, en este caso generará un número aleatorio entre 1000 y 9999 ...

Leer Completo »

Poner en negritas parte de un texto en una página

Este efecto lo he visto en un sitio llamado DePeru.com en sus noticias hay un texto que no está en negrita con la etiqueta <strong> o <b> sino que se convierte en negrita gracias a Jquery (en el código fuente). El uso de este efecto se puede trasladar a muchos otros escenarios donde podríamos necesitar cambiar los estilos para nuestras páginas. Para este caso el webmaster ha detectado que todos sus textos tienen un <p> que empieza con una raya (o guión) ... visto desde el código fuente por supuesto. <p>- Multiplicar el impacto -</p> Para cualquier otra aplicación podría ser un <h1>, <a>... etc El truco es simple, debajo de la llamada al archivo Jquery externo y antes de finalizar el body agregar el script : <script> $( ".contenido p:contains('- ')" ).css( "font-weight","bold" ); </script> </body> </html> Dónde : .contenido es el class que contiene al texto, lu...

Leer Completo »

Protege tus fotos propias con imágenes sobrepuestas

En internet hay 03 tipos de usuarios, los novatos, los intermedios y los expertos, para estos últimos que tienen altos conocimientos, será imposible intentar bloquear una imagen, sin embargo para los otros dos primeros y que son la mayoría si es viable. Un truco poco difundido es usar imágenes transparentes, normalmente gif o png que se colocan encima (sobreponer) de la imagen que se desea proteger. El usuario al dar clic derecho no podrá grabar la imagen protegida, sólo tendrá acceso a grabar la imagen transparente que se encuentra encima. Las imágenes transparentes la podemos crear en cualquier tamaño, se pueden estirar sin problema porque no tienen información visual y con cualquier programa gratuito se pueden realizar. Veamos el ejemplo, protegeremos la imagen que se ve: Aún poniendo la foto en una plataforma gratuita como blogger es posible proteger las fotos, ahora veamos el código: <img alt="foto escondida" height="384" src=...

Leer Completo »

Lista de Anunciantes para ads.txt

El último acuerdo del IAB ahora incluye agregar una lista de las cuentas de anunciantes que los editores tienen en las redes publicitarias, las famosas networks. Cabe destacar que a veces los publishers tienen más de una cuenta, por ejemplo una cuenta de adsense para el diseño de pc de escritorio y otra cuenta de Adsense para móviles, en este caso hay que agregar ambas cuentas. LISTA de ejemplo para ads.txt google.com, pub-xxxxxxxxxxxxxxxx, DIRECT c.amazon-adsystem.com, xxxx, DIRECT teads.tv, xxxxx, DIRECT, 15a9c44f6d26cbe1 facebook.com, xxxxxxxxxxxxxxx, DIRECT appnexus.com, xxxx, DIRECT indexexchange.com, xxxxxx, DIRECT liveintent.com, xxx, DIRECT openx.com, xxxxxxxxx, DIRECT rubiconproject.com, xxxxx, DIRECT yieldmo.com, xxxxxxxxxxxxxxxxxxx, DIRECT --- PRONTO --- taboola.com, vidweb.com, disqus.com Aún falta completar, pero iremos agregando según vaya llegando más información. (*) Las equis (x) representan el número de dígitos hasta ahora conocidos. Demo: ver...

Leer Completo »