🔥Como crear una pagina de juegos

¿Quieres crear tu propio sitio web de juegos gratis y sin complicaciones? Estás en el lugar correcto. En esta guía verás, paso a paso, cómo lanzar tu blog de videojuegos en Blogger e instalar una plantilla profesional con aspecto moderno, rápido y atractivo.

🧩 Requisitos previos

Una cuenta de Google (Gmail)
Acceso a Blogger.com
Una plantilla para Blogger (al final encontrarás una recomendación)

🛠️ Paso 1: Crear tu blog en Blogger

Ve a Blogger e inicia sesión.
Haz clic en Crear blog.
Ponle un nombre (ej.: “Zona Gamer”).
Elige una dirección (ej.: zonagamer.blogspot.com).
Selecciona cualquier plantilla básica (luego la cambias).
Confirma en Crear blog.

✅ ¡Listo! Tu blog ya existe.

🎨 Paso 2: Descargar tu plantilla

Descarga una plantilla profesional de juegos (versión premium recomendada):

📂 Paso 3: Instalar la plantilla en Blogger

Entra a tu Blogger.
Ve a Tema.
Haz clic en la flecha junto a Personalizar y elige Restaurar.
Selecciona Subir archivo y carga el .xml de la plantilla.
Espera a que finalice la carga.

✅ Tu blog tendrá el nuevo diseño aplicado.

⚙️ Paso 4: Configurar la plantilla

Ve a Diseño.
Personaliza logo, menú, footer y widgets.
Si sabes código, ajusta en Tema > Editar HTML.

🕹️ Paso 5: Publicar tus juegos

Puedes publicar juegos de varias formas:

Como enlaces de descarga (Mediafire, Mega, etc.)
Usando iframes de juegos online (HTML5, emuladores web)
Agregando tráileres o gameplays de YouTube

🕹️ Páginas para subir juegos online

GameMonetize – Registro
SoftGames – Registro (con Gmail)
GamePix – Registro
Famobi – Registro
GameDistribution – Registro

HTML<!-- ==== 1. IMAGEN DE PORTADA ==== -->
<div class="separator" style="clear: both;">
  <a id="cover_link" href="#" style="display:block; padding: 1em 0; text-align:center;">
    <!-- PON AQUÍ EL URL DE LA IMAGEN DE PORTADA -->
    <img id="cover_img" alt="Portada del juego" height="108" src="PON_AQUI_URL_IMAGEN_PORTADA" style="border:0; height:auto; max-width:100%;" width="640" />
  </a>
</div>

<div class="wrap">
  <div class="card">
    <!-- Botones -->
    <div class="topbar">
      <div class="controls">
        <button class="btn btn-primary" id="btnPlay" title="Cargar / Reproducir">
          <svg viewBox="0 0 24 24"><path d="M8 5v14l11-7z"/></svg>Jugar
        </button>
        <button class="btn btn-outline" id="btnFullscreen" title="Pantalla completa">
          <svg viewBox="0 0 24 24"><path d="M7 14H5v5h5v-2H7v-3zm12 0h-2v3h-3v2h5v-5zM7 5h3V3H5v5h2V5zm10 0v3h2V3h-5v2h3z"/></svg>Fullscreen
        </button>
        <button class="btn btn-outline" id="btnReload" title="Recargar iframe">
          <svg viewBox="0 0 24 24"><path d="M12 6V3L8 7l4 4V8c2.76 0 5 2.24 5 5a5 5 0 11-5-5z"/></svg>Recargar
        </button>
      </div>
    </div>

    <!-- ==== 2. JUEGO EN IFRAME ==== -->
    <div class="frame" id="wrapFrame">
      <div class="frame-bar">
        <div style="display:flex; align-items:center; gap:10px;">
          <span class="dot"></span>
          <span class="mini">TIP: si el juego no trae su propio fullscreen, usa el botón.</span>
        </div>
      </div>
      <div class="ratio">
        <div class="loader" id="loader"><div class="spinner"></div>Cargando…</div>
        <!-- PON AQUÍ EL URL DEL JUEGO HTML5 -->
        <iframe id="game"
          src="PON_AQUI_URL_DEL_JUEGO"
          allow="autoplay; fullscreen; microphone; clipboard-read; clipboard-write; gamepad"
          allowfullscreen
          referrerpolicy="no-referrer"
          sandbox="allow-forms allow-scripts allow-same-origin allow-pointer-lock allow-popups allow-popups-to-escape-sandbox">
        </iframe>
      </div>
    </div>

    <!-- ==== 3. DESCRIPCIÓN DEL JUEGO ==== -->
    <div class="game-desc">
      <!-- PON AQUÍ LA DESCRIPCIÓN DEL JUEGO -->
      <p><strong>DESCRIPCIÓN:</strong> Escribe aquí la descripción del juego.</p>
    </div>

    <!-- ==== 4. IMAGEN DE INSTRUCCIONES ==== -->
    <div style="margin-top: 12px; text-align: center;">
      <!-- PON AQUÍ EL URL DE LA IMAGEN DE INSTRUCCIONES -->
      <img alt="Instrucciones del juego" src="PON_AQUI_URL_IMAGEN_INSTRUCCIONES" style="border:0; height:auto; max-width:100%;" />
    </div>

    <!-- Footer con marca -->
    <div class="foot" id="foot">
      <div class="mini">Crea tu página web en:</div>
      <div class="mini" id="brand"></div>
    </div>
  </div>
</div>

<!-- ==== ESTILOS ==== -->
<style>
  :root{
    --bg:#0a0d14; --ink:#ffffff; --muted:#ffffff;
    --primary:#00e0ff; --primary-2:#7c4dff; --accent:#14f195;
  }
  html,body{margin:0;background:radial-gradient(1200px 700px at 10% -10%,#0c1430 0%,#06090f 60%,var(--bg) 100%);color:white;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial}
  .wrap{max-width:1080px;margin:24px auto;padding:0 16px}
  .card{background:linear-gradient(135deg,#0b1222,#0a0f1d 40%,#0c162b);border:1px solid #1b2a45;border-radius:22px;box-shadow:0 12px 40px #0009, inset 0 1px 0 #ffffff0a;overflow:hidden}
  .topbar{display:flex;gap:10px;align-items:center;justify-content:flex-end;padding:14px 16px;border-bottom:1px solid #1b2a45;background:linear-gradient(135deg,#0c1426,#0a1120)}
  .controls{display:flex;gap:8px;flex-wrap:wrap}
  .btn{appearance:none;border:0;border-radius:12px;padding:10px 14px;font-weight:800;letter-spacing:.2px;cursor:pointer;display:inline-flex;align-items:center;gap:8px;color:white;box-shadow:0 8px 20px #0007, inset 0 1px 0 #ffffff22}
  .btn svg{width:18px;height:18px;fill:currentColor}
  .btn-primary{background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff;}
  .btn-outline{background:linear-gradient(135deg,#0d1a30,#0b1426);color:#fff;border:1px solid #2a3f6b}
  .frame{position:relative;margin:16px;isolation:isolate;border-radius:18px;overflow:hidden;background:radial-gradient(800px 500px at 20% 0%,#0d1a30 0%,#07101f 40%,#040a14 100%);border:1px solid #21355d;box-shadow:0 20px 60px #000c}
  .ratio{position:relative;width:100%;aspect-ratio:16/9;background:#000}
  .ratio iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
  .frame-bar{position:absolute;inset:10px 10px auto 10px;height:44px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(135deg,#0c1426,#0a1120);border:1px solid #21355d;border-radius:12px;padding:6px 8px;box-shadow:0 12px 40px #0009;z-index:3;color:white}
  .dot{width:10px;height:10px;border-radius:50%;background:var(--accent);box-shadow:0 0 14px var(--accent)}
  .mini{font-size:12px;color:#fff}
  .foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;border-top:1px solid #1b2a45;background:linear-gradient(180deg,#0c1426,#0a1020);color:white}
  .loader{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#020911cc;color:#fff;font-weight:700;letter-spacing:.3px}
  .spinner{width:28px;height:28px;border:3px solid #214163;border-top-color:#00e0ff;border-radius:50%;animation:spin 1s linear infinite;margin-right:10px}
  .game-desc{color:white;font-family: Arial, sans-serif; padding: 12px;}
  p,strong{color:white}
  @keyframes spin{to{transform:rotate(360deg)}}
</style>

<!-- ==== SCRIPT ==== -->
<script>
(function(){
  const $ = (s)=>document.querySelector(s);
  const iframe  = $('#game');
  const loader  = $('#loader');
  const wrap    = $('#wrapFrame');

  // Botones
  $('#btnPlay').onclick = ()=>{ loader.style.display = 'flex'; iframe.src = iframe.src; iframe.focus(); };
  $('#btnReload').onclick = ()=>{
    const u = iframe.src;
    loader.style.display = 'flex';
    iframe.src = 'about:blank';
    setTimeout(()=>{ iframe.src = u; }, 90);
  };
  $('#btnFullscreen').onclick = async ()=>{
    try{
      if (iframe.requestFullscreen) { await iframe.requestFullscreen(); }
      else if (wrap.requestFullscreen) { await wrap.requestFullscreen(); }
      else { alert('Pantalla completa no soportada.'); }
    }catch(e){
      alert('El navegador bloqueó pantalla completa.');
    }
  };

  // Marca kirawuan.com
  const foot = document.getElementById('foot');
  const brand = document.getElementById('brand');
  const kTxt = 'www.kirawuan.com';
  const kHref = 'https://' + 'www.' + 'kirawuan' + '.com';

  function setBrand(){
    brand.innerHTML = ''+kTxt+'';
  }
  setBrand();
  const obs = new MutationObserver(()=>{
    if(!foot.innerHTML.toLowerCase().includes('kirawuan.com')){
      setBrand();
    }
  });
  obs.observe(foot, {childList:true, subtree:true});
})();
</script>

📽️ ¿Tienes problemas? Puedes ver el siguiente video

💣 Páginas necesarias para monetización

Sobre Nosotros – Ejemplo
Formulario de Contacto – Cómo crear
Descargo de Responsabilidad – Disclaimer

EJEMPLO DE PÁGINA CREADA Y MONETIZADA:

👉 JUEGOS KIRAWUAN

🔥Como crear una pagina de juegos

🧩 Requisitos previos

🛠️ Paso 1: Crear tu blog en Blogger

🎨 Paso 2: Descargar tu plantilla

📂 Paso 3: Instalar la plantilla en Blogger

⚙️ Paso 4: Configurar la plantilla

🕹️ Paso 5: Publicar tus juegos

🕹️ Páginas para subir juegos online

📽️ ¿Tienes problemas? Puedes ver el siguiente video

💣 Páginas necesarias para monetización

EJEMPLO DE PÁGINA CREADA Y MONETIZADA:

Publicar un comentario

0 Comentarios

Plantilla de películas Cuevana 4 para blogger

Nosotros

Servicios

Enlaces rápidos

¿Te gustó el contenido?

🔥Como crear una pagina de juegos

🧩 Requisitos previos

🛠️ Paso 1: Crear tu blog en Blogger

🎨 Paso 2: Descargar tu plantilla

📂 Paso 3: Instalar la plantilla en Blogger

⚙️ Paso 4: Configurar la plantilla

🕹️ Paso 5: Publicar tus juegos

🕹️ Páginas para subir juegos online

📽️ ¿Tienes problemas? Puedes ver el siguiente video

💣 Páginas necesarias para monetización

EJEMPLO DE PÁGINA CREADA Y MONETIZADA:

Publicar un comentario

0 Comentarios

Related Posts

Related Posts