Créer un écran ticker de nouvelles pleine page avec des widgets css & flux rss

Lorsque vous êtes un blogueur, il est vraiment important de rester au courant des dernières nouvelles dans votre créneau particulier. Les gens vous prennent plus au sérieux lorsque vous êtes l`un des premiers à couvrir un événement important - encore plus si vous couvrez avant les grands médias traditionnels attire même vent.

Si vous êtes nouvelles blogueur, l`importance de rester à jour sur les dernières nouvelles est encore plus critique. Depuis que je couvre d`autres événements liés à l`actualité sur mon propre blog, j`ai réalisé combien il était important de surveiller en permanence les nouvelles en temps réel. Depuis que j`utilise deux écrans avec mon ordinateur portable, je me suis aperçu que je pourrais mettre en place un écran pour être exclusivement pour le streaming téléscripteurs de nouvelles entrants.

Le seul problème est que si il y a des applications décentes pour le streaming des lignes simples de nouvelles, comme Yahoo Widgets ou GlowDart, ces écrans soit juste un couvercle petit ruisseau de texte entrant, ou ils sont difficiles à personnaliser pour ressembler exactement comme vous le souhaitez dans une sorte plein écran du mode.

Créer votre propre Plein temps réel Nouvelles Affichage

Pour résoudre ce problème, je compris que je devais construire moi-même quelque chose. Depuis que je ne voulais vraiment pas prendre le temps d`écrire une application entière, j`ai décidé de créer une page web avec les flux RSS embarqués. Je pouvais afficher cette page en ouvrant mon navigateur en mode plein écran.

Les outils que j`utilisés pour créer cette page, et tout ce que vous devez créer votre propre, est un modèle de page Web à base de CSS gratuit (j`ai choisi le modèle d`affaires gratuit créé par SliceJack), et un compte Google pour accéder à Google Web Elements et Alertes Google.

Voici ce que le modèle d`affaires par défaut par SliceJack ressemblait avant que j`ai commencé avec le piratage le code d`arrière-plan.

Ceci est ma méthode préférée pour créer des pages web, je l`avoue - je déteste réinventer la roue. Cette page a tous les éléments que je veux intégrer dans ma dernière page web streaming nouvelles.

Les deux éléments en haut - l`article principal et l`image - je vais supprimer. Ce que je veux vraiment utiliser sont les trois colonnes dans le centre de la page.

Lorsque vous téléchargez le modèle à votre ordinateur, vous trouverez le fichier index.html dans le dossier principal, mais Css fichiers dans un dossier stylesheets`. Affichage du fichier index.html, il est généralement assez simple de trouver les sections que vous souhaitez modifier. Dans ce cas, je suis d`édition de la barre supérieure pour afficher «Mes nouvelles» Et en changeant les liens de menu à différentes catégories que je vais créer des pages supplémentaires de nouvelles pour.

Vous pouvez généralement trouver les sections de la page en recherchant la

La prochaine chose que je veux faire pour le modèle est de changer la colonne de droite de la barre latérale à un flux de nouvelles en streaming sur YouTube. Tout d`abord, identifier la section que vous souhaitez remplacer par la

Je n`aime pas la couleur de cette section (il est gris et aurait l`air ridicule avec une vidéo blanc à l`intérieur), donc je dois changer au blanc. Trouver le principal fichier css et recherchez l`ID. J`ai trouvé « encadré » à l`intérieur main.css, et l`arrière-plan mis à #FFF. Pour changer de blanc, je fait ce # 000.

Intégration Widgets dans votre page personnalisée

Maintenant, pour la partie amusante. Une fois que vous avez la mise en forme à droite, vous pouvez commencer à intégrer le streaming feeds dans votre page. La première chose que je veux faire est intégrer l`élément YouTube [Ne fonctionne plus] Google Web Elements.

Vous venez de sélectionner la source de nouvelles que vous voulez, puis copier et coller le code. En fait, vous pouvez construire votre page entière de nouvelles de streaming avec seulement Google Web Elements utilisant l`élément Google Reader. Cependant, je veux montrer combien de sources sont disponibles pour les mises à jour en temps réel. Avant de passer, assurez-vous de saisir certainement Google Nouvelles Element, et copier-coller ce code dans votre page ainsi.

Une autre grande ressource pour obtenir des nouvelles RSS via RSS est FeedWind. Je l`aime vraiment parce que vous suffit de coller dans le flux que vous souhaitez, personnaliser, et il vous donne un widget agréable, propre que vous pouvez intégrer directement dans votre page.

De plus, si vous allez surveillerons les nouvelles dans un certain créneau, vous ne pouvez pas oublier de surveiller Google recherche dans ce créneau. Au sein de Google Alertes, il suffit de sélectionner « Flux » dans le champ « envoi ».

Ensuite, vous pouvez utiliser cette URL d`alimentation en FeedWind pour créer votre widget Google Résultats de la recherche. Maintenant que toutes ces différentes sources d`information sont intégrées sur la page - la diffusion en temps réel l`affichage de nouvelles est enfin terminé. Le menu principal vous permet de créer plusieurs pages comme celui-ci, avec des widgets qui apportent dans les sources d`information ciblées.

Et ce faisant est facile maintenant que vous avez la première page principale fait. Comme vous pouvez le voir, en utilisant le modèle CSS offre une belle forme la page où vous pouvez simplement insérer vos différentes nouvelles RSS pour une belle pleine page en temps réel l`affichage des nouvelles.

Cela vaut mieux que la plupart des applications ticker de nouvelles de streaming que vous trouverez partout gratuitement, et il vous permet également de personnaliser exactement à vos besoins - c`est la beauté de l`utilisation d`une page Web plutôt que d`une application.

Avez-vous créé votre propre page avec cet article? Est-ce que vous vous attardez partout, ou découvrir toutes les autres sources cool pour diffusion en temps réel des widgets d`information? Partagez vos idées dans la section commentaires ci-dessous.