Help

How to Use the Blog Manager

1. Creating Blog Entries

You can create a blog entry by going to the "Create Blog" section. Fill in the form with your avatar, title, description, image, and link. Once submitted, your blog entry will be stored in an XML format.

2. Using the XML File

The blog entries are saved in an XML file, which is used by the blog reader to display your content. Here's an example of how the XML file looks:

    <entry>
        <avatar>URL</avatar>
        <title>Blog Title</title>
        <description>This is the blog description.</description>
        <image>URL</image>
        <link>URL</link>
    </entry>

3. Applying CSS Templates

In the "Templates" section, you can apply different styles to your blog. Each template provides a unique visual style for how the blog entries are displayed. Simply choose the template you like and apply the CSS file to your HTML structure.

4. Viewing the Blog

Once you've created your blog entries and applied the template, the blog entries will be displayed on the main page using the chosen CSS template. The page automatically reads from the XML file to load and display the entries.

copia el siguente codigo html y crea una pagina añade tu xml en el script

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Tecnologia blogger Web Underground</title>
    
    <link href="https://webunderground.neocities.org/google/blogger/template1.css" rel="stylesheet" type="text/css" media="all">
  </head>
  <body>
    <h1>blogger Web Underground!</h1>

// Generar el HTML para cada entrada
                    output += `
                        <div class="entry">
                            <img class="avatar" src="${avatar}" alt="User Avatar">
                            <h2>${title}</h2>
                            <p>${description}</p>
                            <img class="blog-image" src="${image}" alt="Blog Image">
                            <a href="${link}" target="_blank">Read more</a>
                        </div>
                    `;
                }

// Insertar el HTML generado en el contenedor del blog
                document.getElementById("blog-container").innerHTML = output;
            }
        };
        
        // Enviar la solicitud
        xhttp.send();
    }

// Llamar a la función cuando se cargue la página
    window.onload = loadBlogs;
</script>
  </body>
</html>