• Si tienes mas de un blog y quieres mostrar tus fedds en todos lo vas a poder hacer de la siguiente forma.

    Puedes verlo funcionando en el blog de Recursos Gratis

    Para alojar el gráfico y el archivo puedes usar Dropbox (Ver tutorial)

    Descargar: (Gráfico y archivo js)

    garrow.png picture by redblogs

    fed dinamico

    CODIGOS:

    <style>.gfg-root {
    width : 350px;
    height : auto;
    position : relative;
    overflow : hidden;
    text-align : center;
    font-family: “Arial”, sans-serif;
    font-size: 12px;
    border: 1px solid #9C1114;
    }
    .gfg-title {
    font-size: 14px;
    font-weight : bold;
    color : #ffffff;
    background-color: #9C1114;
    line-height : 1.4em;
    overflow : hidden;
    white-space : nowrap;
    }
    .gfg-title a {
    color : #ffffff;
    }
    .gfg-subtitle {
    font-size: 12px;
    font-weight : bold;
    color : #333333;
    background-color: #eae6e7;
    line-height : 1.4em;
    overflow : hidden;
    white-space : nowrap;
    margin-bottom : 5px;
    }
    .gfg-subtitle a {
    color : #333333;
    }
    .gfg-entry {
    background-color : white;
    width : 100%;
    height : 6.9em;
    position : relative;
    overflow : hidden;
    text-align : left;
    margin-top : 3px;
    }
    /* To allow correct behavior for overlay */
    .gfg-root .gfg-entry .gf-result {
    position : relative;
    background-color : white;
    width : auto;
    height : 100%;
    padding-left : 20px;
    padding-right : 5px;
    }
    .gfg-list {
    position : relative;
    overflow : hidden;
    text-align : left;
    margin-bottom : 5px;
    }
    .gfg-listentry {
    line-height : 1.5em;
    overflow : hidden;
    white-space : nowrap;
    text-overflow : ellipsis;
    -o-text-overflow : ellipsis;
    padding-left : 15px;
    padding-right : 5px;
    margin-left : 5px;
    margin-right : 5px;
    }
    .gfg-listentry-odd {
    background-color : #ffffff;
    }
    .gfg-listentry-even {
    }
    .gfg-listentry-highlight {
    background-image : url(‘http://i599.photobucket.com/albums/tt78/redblogs/banner/garrow.png’);
    background-repeat: no-repeat;
    background-position :  left center;
    }
    /*
    * FeedControl customizations.
    */
    .gfg-root .gfg-entry .gf-result .gf-title {
    font-size: 14px;
    line-height : 1.2em;
    overflow : hidden;
    white-space : nowrap;
    text-overflow : ellipsis;
    -o-text-overflow : ellipsis;
    margin-bottom : 2px;
    }
    .gfg-root .gfg-entry .gf-result .gf-snippet {
    height : 3.8em;
    color: #000000;
    margin-top : 3px;
    }
    /*
    * Easy way to get horizontal mode, applicable via js options to gadget.
    */
    .gfg-horizontal-container {
    position : relative;
    }
    .gfg-horizontal-root {
    height : 1.5em;
    _height : 100%;
    position : relative;
    white-space : nowrap;
    overflow : hidden;
    text-align : center;
    font-family: “Arial”, sans-serif;
    font-size: 13px;
    border: 1px solid #AAAAAA;
    padding : 5px;
    margin-right : 80px;
    }
    .gfg-horizontal-root .gfg-title {
    font-weight : bold;
    background-color: #FFFFFF;
    line-height : 1.5em;
    overflow : hidden;
    white-space : nowrap;
    float : left;
    padding-left : 10px;
    padding-right : 12px;
    border-right: 1px solid #AAAAAA;
    }
    .gfg-horizontal-root .gfg-title a {
    color : #444444;
    text-decoration : none;
    }
    .gfg-horizontal-root .gfg-entry {
    width : auto;
    height : 1.5em;
    position : relative;
    overflow : hidden;
    text-align : left;
    margin-top : 0px;
    margin-left : 0px;
    padding-left : 10px;
    }
    /* To allow correct behavior for overlay */
    .gfg-horizontal-root .gfg-entry .gf-result {
    position : relative;
    background-color : white;
    width : 100%;
    height : 100%;
    line-height : 1.5em;
    overflow : hidden;
    white-space : nowrap;
    }
    .gfg-horizontal-root .gfg-list {
    display : none;
    }
    /*
    * FeedControl customizations.
    */
    .gfg-horizontal-root .gfg-entry .gf-result .gf-snippet,
    .gfg-horizontal-root .gfg-entry .gf-result .gf-author {
    display : none;
    }
    .gfg-horizontal-root .gfg-entry  .gf-result .gf-title {
    color: #0000cc;
    margin-right : 3px;
    float : left;
    }
    .gfg-horizontal-root .gfg-entry .gf-result .gf-spacer {
    float : left;
    }
    .gfg-horizontal-root .gfg-entry .gf-result .gf-spacer,
    .gfg-horizontal-root .gfg-entry .gf-result .gf-relativePublishedDate {
    display : block;
    color: #AAAAAA;
    }
    .gfg-branding {
    white-space : nowrap;
    overflow : hidden;
    text-align : left;
    position : absolute;
    right : 0px;
    top : 0px;
    width : 80px;
    }
    .gfg-collapse-open, .gfg-collapse-closed {
    background-repeat : no-repeat;
    background-position : center;
    cursor : pointer;
    float : right;
    width : 17px;
    height : 20px;
    }
    .gfg-collapse-open {
    background-image : url(‘arrow_open.gif’);
    }
    .gfg-collapse-closed {
    background-image : url(‘arrow_close.gif’);
    }
    .gfg-collapse-href {
    float : left;
    }
    .clearFloat {
    clear : both;
    }</style>
    <!– ++Begin Dynamic Feed Wizard Generated Code++ –>
    <!–
    // Created with a Google AJAX Search and Feed Wizard
    // http://code.google.com/apis/ajaxsearch/wizards.html
    –>
    <!–
    // The Following div element will end up holding the actual feed control.
    // You can place this anywhere on your page.
    –>
    <div id=”feed-control”>
    <span style=”color:#676767;font-size:11px;margin:10px;padding:4px;”>Loading…</span>
    </div>
    <!– Google Ajax Api
    –>
    <script src=”http://www.google.com/jsapi?key=notsupplied-wizard”
    type=”text/javascript”></script>
    <!– Dynamic Feed Control and Stylesheet –>
    <script src=”http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.js”
    type=”text/javascript”></script>
    <script type=”text/javascript”>
    function LoadDynamicFeedControl() {
    var feeds = [ {title: 'Red Blogs', url: 'http://feeds.feedburner.com/RedDeBlogs-InternetYTecnologiaWeb' }, {title: 'Recursos Gratis', url: 'http://todorecursosgratis.blogspot.com/atom.xml' }, {title: 'Templates', url: 'http://xanarts.blogspot.com/atom.xml' }];
    var options = {
    stacked : true,
    horizontal : false,
    title : “News”
    }
    new GFdynamicFeedControl(feeds, ‘feed-control’, options);
    }
    // Load the feeds API and set the onload callback.
    google.load(‘feeds’, ‘1′);
    google.setOnLoadCallback(LoadDynamicFeedControl);
    </script>
    <!– ++End Dynamic Feed Control Wizard Generated Code++ –>

    <style>.gfg-root {

    width : 350px;

    height : auto;

    position : relative;

    overflow : hidden;

    text-align : center;

    font-family: “Arial”, sans-serif;

    font-size: 12px;

    border: 1px solid #9C1114;

    }

    .gfg-title {

    font-size: 14px;

    font-weight : bold;

    color : #ffffff;

    background-color: #9C1114;

    line-height : 1.4em;

    overflow : hidden;

    white-space : nowrap;

    }

    .gfg-title a {

    color : #ffffff;

    }

    .gfg-subtitle {

    font-size: 12px;

    font-weight : bold;

    color : #333333;

    background-color: #eae6e7;

    line-height : 1.4em;

    overflow : hidden;

    white-space : nowrap;

    margin-bottom : 5px;

    }

    .gfg-subtitle a {

    color : #333333;

    }

    .gfg-entry {

    background-color : white;

    width : 100%;

    height : 6.9em;

    position : relative;

    overflow : hidden;

    text-align : left;

    margin-top : 3px;

    }

    /* To allow correct behavior for overlay */

    .gfg-root .gfg-entry .gf-result {

    position : relative;

    background-color : white;

    width : auto;

    height : 100%;

    padding-left : 20px;

    padding-right : 5px;

    }

    .gfg-list {

    position : relative;

    overflow : hidden;

    text-align : left;

    margin-bottom : 5px;

    }

    .gfg-listentry {

    line-height : 1.5em;

    overflow : hidden;

    white-space : nowrap;

    text-overflow : ellipsis;

    -o-text-overflow : ellipsis;

    padding-left : 15px;

    padding-right : 5px;

    margin-left : 5px;

    margin-right : 5px;

    }

    .gfg-listentry-odd {

    background-color : #ffffff;

    }

    .gfg-listentry-even {

    }

    .gfg-listentry-highlight {

    background-image : url(‘URL/garrow.png‘);

    background-repeat: no-repeat;

    background-position : left center;

    }

    /*

    * FeedControl customizations.

    */

    .gfg-root .gfg-entry .gf-result .gf-title {

    font-size: 14px;

    line-height : 1.2em;

    overflow : hidden;

    white-space : nowrap;

    text-overflow : ellipsis;

    -o-text-overflow : ellipsis;

    margin-bottom : 2px;

    }

    .gfg-root .gfg-entry .gf-result .gf-snippet {

    height : 3.8em;

    color: #000000;

    margin-top : 3px;

    }

    /*

    * Easy way to get horizontal mode, applicable via js options to gadget.

    */

    .gfg-horizontal-container {

    position : relative;

    }

    .gfg-horizontal-root {

    height : 1.5em;

    _height : 100%;

    position : relative;

    white-space : nowrap;

    overflow : hidden;

    text-align : center;

    font-family: “Arial”, sans-serif;

    font-size: 13px;

    border: 1px solid #AAAAAA;

    padding : 5px;

    margin-right : 80px;

    }

    .gfg-horizontal-root .gfg-title {

    font-weight : bold;

    background-color: #FFFFFF;

    line-height : 1.5em;

    overflow : hidden;

    white-space : nowrap;

    float : left;

    padding-left : 10px;

    padding-right : 12px;

    border-right: 1px solid #AAAAAA;

    }

    .gfg-horizontal-root .gfg-title a {

    color : #444444;

    text-decoration : none;

    }

    .gfg-horizontal-root .gfg-entry {

    width : auto;

    height : 1.5em;

    position : relative;

    overflow : hidden;

    text-align : left;

    margin-top : 0px;

    margin-left : 0px;

    padding-left : 10px;

    }

    /* To allow correct behavior for overlay */

    .gfg-horizontal-root .gfg-entry .gf-result {

    position : relative;

    background-color : white;

    width : 100%;

    height : 100%;

    line-height : 1.5em;

    overflow : hidden;

    white-space : nowrap;

    }

    .gfg-horizontal-root .gfg-list {

    display : none;

    }

    /*

    * FeedControl customizations.

    */

    .gfg-horizontal-root .gfg-entry .gf-result .gf-snippet,

    .gfg-horizontal-root .gfg-entry .gf-result .gf-author {

    display : none;

    }

    .gfg-horizontal-root .gfg-entry .gf-result .gf-title {

    color: #0000cc;

    margin-right : 3px;

    float : left;

    }

    .gfg-horizontal-root .gfg-entry .gf-result .gf-spacer {

    float : left;

    }

    .gfg-horizontal-root .gfg-entry .gf-result .gf-spacer,

    .gfg-horizontal-root .gfg-entry .gf-result .gf-relativePublishedDate {

    display : block;

    color: #AAAAAA;

    }

    .gfg-branding {

    white-space : nowrap;

    overflow : hidden;

    text-align : left;

    position : absolute;

    right : 0px;

    top : 0px;

    width : 80px;

    }

    .gfg-collapse-open, .gfg-collapse-closed {

    background-repeat : no-repeat;

    background-position : center;

    cursor : pointer;

    float : right;

    width : 17px;

    height : 20px;

    }

    .gfg-collapse-open {

    background-image : url(‘arrow_open.gif’);

    }

    .gfg-collapse-closed {

    background-image : url(‘arrow_close.gif’);

    }

    .gfg-collapse-href {

    float : left;

    }

    .clearFloat {

    clear : both;

    }</style>

    <!– ++Begin Dynamic Feed Wizard Generated Code++ –>

    <!–

    // Created with a Google AJAX Search and Feed Wizard

    // http://code.google.com/apis/ajaxsearch/wizards.html

    –>

    <!–

    // The Following div element will end up holding the actual feed control.

    // You can place this anywhere on your page.

    –>

    <div id=”feed-control”>

    <span style=”color:#676767;font-size:11px;margin:10px;padding:4px;”>Loading…</span>

    </div>

    <!– Google Ajax Api

    –>

    <script src=”http://www.google.com/jsapi?key=notsupplied-wizard”

    type=”text/javascript”></script>

    <!– Dynamic Feed Control and Stylesheet –>

    <script src=”URL/gfdynamicfeedcontrol.js

    type=”text/javascript”></script>

    <script type=”text/javascript”>

    function LoadDynamicFeedControl() {

    var feeds = [ {title: 'Red Blogs', url: 'http://feeds.feedburner.com/RedDeBlogs-InternetYTecnologiaWeb' }, {title: 'Recursos Gratis', url: 'http://todorecursosgratis.blogspot.com/atom.xml' }, {title: 'Templates', url: 'http://xanarts.blogspot.com/atom.xml' }];

    var options = {

    stacked : true,

    horizontal : false,

    title : “News

    }

    new GFdynamicFeedControl(feeds, ‘feed-control’, options);

    }

    // Load the feeds API and set the onload callback.

    google.load(‘feeds’, ‘1′);

    google.setOnLoadCallback(LoadDynamicFeedControl);

    </script>

    <!– ++End Dynamic Feed Control Wizard Generated Code++ –>

    Modificas a tu gusto lo que marco en rojo de la CSS, el tamaño -width : 350px- los colores, La URL del gráfico -background-image : url(‘URL/garrow.png‘);-

    garrow.png picture by redblogs

    Y el titulo y URL de tus feeds:

    var feeds = [ {title: 'Red Blogs', url: 'http://feeds.feedburner.com/RedDeBlogs-InternetYTecnologiaWeb' }, {title: 'Recursos Gratis', url: 'http://todorecursosgratis.blogspot.com/atom.xml' }, {title: 'Templates', url: 'http://xanarts.blogspot.com/atom.xml' }];

    Ya con todos tus datos pegas los códigos en un gadget HTML

    Compartelo:
    • Digg
    • del.icio.us
    • Facebook
    • Google Bookmarks
    • email
    • Meneame
    • MySpace
    • Wikio
    • Bitacoras.com
    • Twitter
    • Live
    • RSS
    Etiquetas: , , , , , , , , , ,

    Entradas relacionadas

    This entry was posted on Lunes, Diciembre 14th, 2009 at 7:48 and is filed under Blogspot, Internet, Tecnología, Tips, Tutoriales y Tips, Utilidades. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.
  • 1 Comment

    Take a look at some of the responses we've had to this article.

    1. Posted on Diciembre 14th

      Información Bitacoras.com…

      Valora en Bitacoras.com: Si tienes mas de un blog y quieres mostrar tus fedds en todos lo vas a poder hacer de la siguiente forma. Puedes verlo funcionando en el blog de Recursos Gratis Para alojar el gráfico y el archivo puedes usar Dropbox (Ver tut…..

  • Post a Comment

    Let us know what you thought.

  • Name:

    Email (required):

    Website:

    Message:

    Comments links could be nofollow free.