isopod/the-hacker-news-rss
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
The Hacker News RSS Feed widget.
7 Commits 1 Branch 0 Tags 93 KiB
HTML 71.6%
CSS 16%
Python 7.8%
JavaScript 4.6%
Go to file
hornetfighter515 ca700f6243 remove oversized width
2021-07-23 21:25:26 -04:00
src remove oversized width 2021-07-23 21:25:26 -04:00
README.md Adjusted README.md 2021-07-23 20:34:55 -04:00

README.md

The Hacker News RSS Widget

With this widget, you can add a news feed from The Hacker News to any website based on a Linux server.

Setup

  1. Drag the src/ef/ folder into the same folder as the webpage on the target machine. The folder with your webpage will be represented by /path_to_webpage/.
  2. Add a cron job to run it once per hour. The easiest way to do this is to run this command:
crontab -e

and then add the following lines to your crontab:

0 * * * * cd /path_to_webpage/ef/ && python3 xml-download.py
  1. Copy the code in hack-news-widget.html to where you want your news widget on your webpage.

How it works

The xml-download.py file downloads the RSS feed from the provided endpoint. Theoretically this hardcoded endpoint, but this is specifically designed for Hacker News. The reason this isn't just placed in the webpage code is to prevent CORS errors and vulnerabilities.

The Python 3.8 code downloads the RSS feed into the src/ef/feed.xml file. It then takes that feed and translates it into a pretty HTML template. The template includes references to the following files:

  • news_scroll.js, which controls the scrolling animation.
  • news_scroll.css, which has a reference to the fancy terminal-based color scheme in palette.css, as well as styling to control the size of the entire widget.

UX Configuration

The best place to look for customizing this template to your liking is in news_scroll.css. Width, text decoration, and font sizes can be adjust from there. If fonts or colors are what you're looking to adjust, check the terminal theme in palette.css. It can be copied and pasted within the file, and then adjusted to your liking. In order to apply it to the widget, change the color_theme variable in news_scroll.js to the name of your theme. Alternatively, try some of the default themes, such as hornetfighter-red and hornetfighter-blue, based on the color palette from my website.

Samples

Dependencies

  • cron (or a similar job scheduler)
  • requests

NOTICE: Heavily modified from the Allwebco Design Corporation IFrame news scroller