Opret en fuld side nyhed Ticker Display med CSS & RSS Widgets

Hvis du er nyhedsblogger, er vigtigheden af ​​at holde sig opdateret om at bryde nyheder kritisk. Lige siden jeg begyndte at dække flere nyhedsrelaterede begivenheder på min egen blog, indså jeg, hvor vigtigt det var at konstant overvåge real-time nyheder.

Hvis du er nyhedsblogger, er vigtigheden af ​​at holde sig opdateret om at bryde nyheder kritisk.  Lige siden jeg begyndte at dække flere nyhedsrelaterede begivenheder på min egen blog, indså jeg, hvor vigtigt det var at konstant overvåge real-time nyheder.
Reklame

nyheds ticker Når du er blogger, er det virkelig vigtigt at holde dig opdateret med de seneste nyheder inden for din særlige niche. Folk tager dig mere alvorligt, når du er en af ​​de første til at dække en vigtig begivenhed - endnu mere, hvis du dækker det, før de store mainstream medier selv fanger vinden af ​​det.

Hvis du er nyhedsblogger, er vigtigheden af ​​at holde sig opdateret om at bryde nyheder endnu mere kritisk. Lige siden jeg begyndte at dække flere nyhedsrelaterede begivenheder på min egen blog, indså jeg, hvor vigtigt det var at konstant overvåge real-time nyheder. Da jeg brugte to skærme med min bærbare computer, indså jeg, at jeg kunne konfigurere en skærm til udelukkende at streame indkommende nyhedstikker.

Det eneste problem er, at mens der er anstændige apps til streaming af enkeltlinier af nyheder, som Yahoo Widgets eller GlowDart, viser dem enten at dække kun en meget lille strøm af indgående tekst, eller de er vanskelige at tilpasse for at se præcis den måde, du vil have i en fuldskærm slags tilstand.

Oprettelse af din egen fuld side realtids nyhedsskærm

For at løse dette problem indså jeg, at jeg skulle bygge noget selv. Da jeg virkelig ikke ville tage tid til at skrive en hel ansøgning, besluttede jeg at oprette en webside med de indlejrede RSS-streams. Jeg kunne vise den side ved at åbne min browser i fuldskærmstilstand.

Værktøjerne, som jeg plejede at oprette denne side, og alt hvad du behøver for at lave din egen, er en gratis CSS-baseret websider skabelon (jeg valgte den gratis forretningsmand, der blev oprettet af SliceJack) og en Google-konto for adgang til Google Web Elements og Google Alerts.

Her er, hvad standardskabelonen ved SliceJack lignede, før jeg begyndte at hacke op baggrundskoden.

nyheds ticker

Dette er min foretrukne metode til at oprette websider, jeg indrømmer det - jeg hader at genfinde hjulet. Denne side har alle de elementer, som jeg vil integrere i min sidste nyhedsstrømmende webside.

De to elementer øverst - hovedartikelen og billedet - jeg vil slette. Hvad jeg virkelig vil bruge, er de tre kolonner i midten af ​​siden.

gratis nyheds ticker

Når du downloader skabelonen til din egen computer, finder du index.html filen i hovedmappen, men derefter .css-filer i en stylesheets-mappe. Hvis du ser filen index.html, er det normalt ret nemt at finde de sektioner, du vil ændre. I dette tilfælde redigerer jeg den øverste linje for at få vist " Mine nyheder " og ændrer menuforbindelserne til forskellige kategorier, som jeg skal oprette yderligere nyhedssider til.

gratis nyheds ticker

Du kan normalt finde sektionerne på siden ved at kigge efter tags. Parameteren "id =" fortæller dig, hvilket CSS-element der bruges til at definere formateringen. Men i dette tilfælde vil jeg bare slette hele sektionen defineret af ". Det er lige så nemt som bare at slette sektionen fra siden.

Den næste ting, jeg vil gøre med skabelonen, er at ændre den højre sidelinje kolonne til et streaming nyhedsfeed fra YouTube. Først skal du identificere det afsnit, du vil erstatte med tags igen. Jeg fandt den rette sidebjælke sektion i "sidebar" div tag.

gratis nyheds ticker

Jeg kan ikke lide farven på den sektion (den er grå og ville se dumt ud med en hvid video inde i den), så jeg skal ændre den til hvid. Find den største css-fil og søg efter id'et. Jeg fandt "sidebar" inde main.css, og baggrunden er sat til #FFF. For at skifte til hvid lavede jeg denne # 000.

desktop nyheder ticker

Indlejring af widgets til din brugerdefinerede side

Nu for den sjove del. Når du har formateringen rigtigt, kan du begynde at indlejre streaming feeds i din side. Det første, jeg vil gøre, er at integrere YouTube-elementet fra [NO LONGER WORKS] Google Web Elements.

desktop nyheder ticker

Du vælger bare den kilde til nyheder, du vil have, og så kopier og indsæt koden. Faktisk kan du bygge hele din streaming nyhedsside med bare Google Web Elements ved hjælp af Google Reader elementet. Jeg vil dog gerne vise, hvor mange kilder der er tilgængelige til opdateringer i realtid. Før du går videre, skal du sørge for at tage fat på Google News Element og kopiere og indsætte den pågældende kode på din side.

desktop nyheder ticker

En anden stor ressource at få nyhedsfeeds via RSS er FeedWind. Jeg kan godt lide det, fordi du bare indsætter i det feed, du vil have, tilpasse, og det giver dig en fin, ren widget, som du kan integrere direkte ind i din side.

Opret en fuld side nyhed Ticker Display med CSS & RSS Widgets newsticker9

Også, hvis du vil overvåge nyheden inden for en bestemt niche, kan du ikke glemme at overvåge Google-søgning inden for denne niche. Inden for Google Alerts skal du bare vælge "Feed" i feltet "Lever til".

Opret en fuld side Nyheder Ticker Display med CSS & RSS Widgets newsticker10

Derefter kan du bruge denne feed-URL i FeedWind til at oprette din Google Search-resultater-widget. Nu hvor alle disse forskellige nyhedskilder er indlejret på siden - er det i sidste ende færdig med at se i real-time streaming nyhedsskærm. Den øverste menu giver dig mulighed for at oprette flere sider som denne, med widgets, der bringer ind målrettede nyhedskilder.

nyheds ticker

Og det er nemt nu, at du har den første hovedside færdig. Som du kan se, bruger CSS-skabelonen en flot formateret side, hvor du bare kan indsætte dine forskellige nyhedsfeeds for en god fuldsidetid i realtid.

Dette er bedre end de fleste af de streaming news ticker apps, som du finder overalt gratis, og det giver dig også mulighed for at tilpasse det præcis til dine behov - det er skønheden ved at bruge en webside i stedet for en app.

Har du oprettet din egen side sammen med denne artikel? Har du hængt op overalt, eller opdager andre kule kilder til real-time streaming nyheder widgets? Del dine indsigter i kommentarfeltet nedenfor.

Billedkredit: ShutterStock

In this article