TuHacker

en este foro encontrarás, Informática, Hacker, Descargas gratis, Messenger, Seguridad, Antivirus, Hacking y Trucos
 
ÍndiceÍndice  CalendarioCalendario  FAQFAQ  BuscarBuscar  MiembrosMiembros  Grupos de UsuariosGrupos de Usuarios  RegistrarseRegistrarse  ConectarseConectarse  

Comparte | 
 

 Mostrar una lista de entradas recientes de un blog

Ver el tema anterior Ver el tema siguiente Ir abajo 
AutorMensaje
Admin
Admin


Mensajes : 36
Fecha de inscripción : 17/09/2011

MensajeTema: Mostrar una lista de entradas recientes de un blog   Miér Oct 12, 2011 11:19 am

Para leer las últimas entradas de un blog o sitio web utilizamos una vez más la amplia oferta de códigos fuente que hace google para los desarrolladores. En este caso, nos ofrece la posibilidad de leer las últimas entradas de un feed que designemos.

1.php
Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>Google AJAX Feed API</title>
    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
    <script type="text/javascript" src="2.js"></script>
    <script type="text/javascript">

    google.load("feeds", "1");

    function executeSearch() {
      var url = document.getElementById("urltextbox");
      if (!url.value) {
        url.focus();
        return false;
      }
      var blog = new BlogPreview(document.getElementById("blog"));
      blog.show(url.value);
      return false;
    }

    function initialize() {
      var url = document.getElementById("urltextbox");
      url.value = "http://www.rincondelcodigo.com/rss.php";
      executeSearch();
    }
    google.setOnLoadCallback(initialize);

    </script>

    <style type="text/css">

    body {
      background-color: white;
      color: black;
      font-family: Arial, sans-serif;
      font-size: small;
    }

    .blog h2 a, .blog h2 a:visited {
      text-decoration: none;
      color: black;
    }

    .blog .entry {
      margin-bottom: 1.5em;
    }

    .blog .title {
      font-size: medium;
    }

    .blog .author {
      color: gray;
      margin-bottom: 0.5em;
    }

    </style>
  </head>
  <body>
    <form action="" onsubmit="return executeSearch()">
      <input id="urltextbox" type="text" name="url" size="70"/>
      <input type="submit" value="Leer ultimos posts"/>
    </form>
    <div id="blog"></div>

  </body>
</html>

2.js
Código:
function BlogPreview(container) {
  this.container_ = container;
}

BlogPreview.prototype.show = function(url, opt_noTitle) {
  var feed = new google.feeds.Feed(url);
  var preview = this;
  feed.load(function(result) {
    preview.render_(result, opt_noTitle);
  });
}

BlogPreview.prototype.render_ = function(result, opt_noTitle) {
  if (!result.feed || !result.feed.entries) return;
  while (this.container_.firstChild) {
    this.container_.removeChild(this.container_.firstChild);
  }

  var blog = this.createDiv_(this.container_, "blog");
  if (!opt_noTitle) {
    var header = this.createElement_("h2", blog, "");
    this.createLink_(header, result.feed.link, result.feed.title);
  }

  for (var i = 0; i < result.feed.entries.length; i++) {
    var entry = result.feed.entries[i];
    var div = this.createDiv_(blog, "entry");
    var linkDiv = this.createDiv_(div, "title");
    this.createLink_(linkDiv, entry.link, entry.title);
    if (entry.author) {
      this.createDiv_(div, "author", "Posted by " + entry.author);
    }
    this.createDiv_(div, "body", entry.contentSnippet);
  }
}

BlogPreview.prototype.createDiv_ = function(parent, className, opt_text) {
  return this.createElement_("div", parent, className, opt_text);
}

BlogPreview.prototype.createLink_ = function(parent, href, text) {
  var link = this.createElement_("a", parent, "", text);
  link.href = href;
  return link;
}

BlogPreview.prototype.createElement_ = function(tagName, parent, className,
                                                opt_text) {
  var div = document.createElement(tagName);
  div.className = className;
  parent.appendChild(div);
  if (opt_text) {
    div.appendChild(document.createTextNode(opt_text));
  }
  return div;
}
Volver arriba Ir abajo
Ver perfil de usuario http://tuhacker.superforo.net
 
Mostrar una lista de entradas recientes de un blog
Ver el tema anterior Ver el tema siguiente Volver arriba 
Página 1 de 1.
 Temas similares
-
» Portal: Mostrar Entradas Antiguas
» ¿Cómo hacer ver los mensajes más recientes?
» ¿Como puedo poner una lista de links en los widgets?
» Como poner lista de amigos?
» ¿Cómo poner la lista de los ultimos mensajes posteados en el indice del foro?

Permisos de este foro:No puedes responder a temas en este foro.
TuHacker :: Programación :: Desarrollo Web-
Cambiar a: