Icono ayuda

¿Necesitas ayuda?

Contactar con asesor por WhatsApp

Saltar al contenido

Ariapsa - Diseño de páginas web México

Preload de frases para tu sitio web, puedes editarlos

Copia y pega en Code Snippets

Código
<div style="text-align: center; margin: 20px 0;">
                        <a href="https://ariapsa.com/mb" target="_blank">
                            <img src="https://ariapsa.com/wp-content/uploads/2024/08/Marca-blanca-Diseno-de-paginas-web-mexico-ariapsa.jpg" alt="Banner" style="max-width: 100%; height: auto;">
                        </a>
                       </div>
// Insertar Preload de Frases Inspiradoras en WordPress
function preload_inspirational_quotes() {
?>
<div id="preload-quotes">
<p id="quote"></p>
<p id="author"></p>
</div>
<style>
/* Estilo general para el preload */
#preload-quotes {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
font-size: 2rem;
text-align: center;
font-family: 'Arial', sans-serif;
color: #fff;
background: linear-gradient(135deg, #7a1571, #c90771);
padding: 20px;
z-index: 9999;
opacity: 1;
box-sizing: border-box;
overflow: hidden;
pointer-events: all; /* Permite la interacción cuando es visible */
}
/* Estilo para el autor */
#author {
font-size: 1.2rem;
margin-top: 10px;
font-style: italic;
}
/* Estilos responsivos */
@media (max-width: 600px) {
#preload-quotes {
font-size: 1.5rem;
padding: 15px;
}
}
</style>
<script>
// Lista de frases inspiradoras relacionadas con diseño web, marketing y diseño gráfico
const quotes = [
{ text: "El diseño no es solo lo que ves, es cómo funciona.", author: "Steve Jobs" },
{ text: "El marketing digital es el arte de conectar con tu audiencia.", author: "Anónimo" },
{ text: "Un buen diseño es el mejor vendedor.", author: "Anónimo" },
{ text: "Innovar es liderar el futuro.", author: "Anónimo" },
{ text: "No eres Google, pero tienes todo lo que busco.", author: "Anónimo" }
];
// Función para elegir una cita aleatoria
function getRandomQuote() {
const randomIndex = Math.floor(Math.random() * quotes.length); // Elige una cita aleatoria
return quotes[randomIndex];
}
// Función para cambiar la cita y el autor
function changeQuote() {
const quoteElement = document.getElementById('quote');
const authorElement = document.getElementById('author');
const randomQuote = getRandomQuote();
quoteElement.innerText = `"${randomQuote.text}"`; // Muestra la cita
authorElement.innerText = `- ${randomQuote.author}`; // Muestra el autor
}
// Cambia la cita inmediatamente después de cargar el sitio
document.addEventListener('DOMContentLoaded', function() {
changeQuote(); // Cambiar la cita inmediatamente al cargar el contenido
setTimeout(() => {
const preloadElement = document.getElementById('preload-quotes');
preloadElement.style.opacity = 0;
preloadElement.style.pointerEvents = 'none'; // Permite hacer clic en el contenido después de desaparecer
}, 1000); // Desaparece el preload después de 1 segundo
});
</script>
<?php
}
// Agregar el preload a todas las páginas
add_action('wp_head', 'preload_inspirational_quotes');
×

Iniciar Sesión

El registro de usuarios no está permitido.