Ayuda WordPress

Recursos, themes, plugins y tutoriales en español

Widget Entradas Recientes de WordPress integrado en páginas web estáticas HTML o PHP

Por Pedro Rodríguez Font el Oct 20, 2015 10:30 am

Hay veces que por necesidad, llamémoslo manía, por no desmontar nuestra antigua web estática, o sencillamente porque acostumbráis a tener páginas estáticas como páginas iniciales como es mi caso. Donde nuestra intención sería poder añadir un widget de entradas recientes de wordpress en un sidebar o footer de una página web estática realizada en php o html.

Integrar un Widget de Entradas Recientes de WordPress en Webs Estáticas mediante una conexión directa a la base datos de nuestro blog en wordpress sin utiizar los recursos que wordpress ofrece.

1.- Establecemos los estilos del widget por el cual podemos adaptarlo al mismo diseño web que ya tengamos mediante el archivo style-widget.css dentro de los tags <head></head> por el que podremos editar mediante un editor de texto gratuito como notepad++.

  <!-- Copia y pega este código dentro de los tags <head></head> -->  <!-- Fuente de iconos -->  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">  <!-- Hoja de estilos widget -->  <link rel="stylesheet" href="css/style-widget.css">

2.- Insertaremos el código de a contuniación dentro de los tags <body></body> y lugar donde querais mostrar el widget.

  <?php $blog_url = 'http://www.urldemiblog.com';   //INDICA URL DE TU BLOG $db_prefix = 'wp_';                         //PREFIJO WORDPRESS COMUN wp_ $db_name = 'nombre base de datos';          //NOMBRE DE LA BASE DE DATOS $db_user = 'nombre usuario base de datos'; //USUARIO BASE DE DATOS                             $db_host = 'localhost';                     //IP O LOCALHOST $db_pass = 'contraseña base de datos';      //CONTRASEÑA DE LA BASE DE DATOS $limite = 6;                                //LIMITE DE ENTRADAS A MOSTRAR EN EL WIDGET ?>      <h4 class="heading-primary">Entradas <span>Recientes</span></h4>      <ul class="simple-post-list">  <?php // WIDGET POST RECIENTES $conexion = mysql_connect($db_host, $db_user, $db_pass); if(! $conexion )     {         die('Error conexion base de datos: ' . mysql_error());     } mysql_select_db($db_name); mysql_query ("SET NAMES 'utf8'");             $query = "SELECT * FROM ".$db_prefix."posts WHERE (".$db_prefix."posts.post_status='publish' AND ".$db_prefix."posts.post_type='post') ORDER by id DESC LIMIT 0,".$limite."";                         $rs_result = mysql_query($query) or die(mysql_error());                         while ($row = mysql_fetch_assoc($rs_result))     {                                             $id=$row["ID"];                                             $query2 = "SELECT * FROM ".$db_prefix."posts WHERE (post_parent='$id' AND post_type='attachment') ";                                 $rs_result2 = mysql_query($query2) or die(mysql_error());                                 if ($row2 = mysql_fetch_assoc($rs_result2))         {             $imagen=$row2['guid'];                                                     } ?>    <li>    <div class="post-image">    <div class="img-thumbnail">                      <a href="<?=$blog_url?>/<? echo $row["post_name"]; ?>/">                          <img alt="<? echo $row["post_title"]; ?>" width="60" height="60" class="img-responsive" src="<?=$imagen?>">                      </a>                  </div>                </div>      <div class="post-info">                  <a href="<?=$blog_url?>/<? echo $row["post_name"]; ?>/"><? echo $row["post_title"]; ?></a>    <div class="post-meta">                      <?                     $fecha=$row["post_date"];                     $dia=substr($fecha,8,2);                         $mes=substr($fecha,5,2);                         $ano=substr($fecha,0,4);                     $fecha=$dia."/".$mes."/".$ano;                     ?>                      <i class="fa fa-calendar"></i> <? echo $fecha;?>                                        </div>                </div>            </li>                                                <div style="margin:20px;"></div>  <hr>            <?             }         mysql_close($conexion);         ?>                                      </ul>

Ver Demo

Descargar “Widget entradas recientes en HTML o PHP” widget-entradas-recientes.zip – Descargado 15 veces – 2 kB

Verlo en el navegador »